Mobile SEO Rules You Need to Remember When Designing an App

Mobile devices became an important part of people’s private lives, but the increasing usage of smartphones also forced companies to invest in this segment of the business. Mobile browsing already makes more than half of Internet usage globally, which is why 61% of marketers use responsive web design as part of their mobile SEO strategy.

If you want to build a sustainable and long-term business, you have to embrace the same concept and optimize a website for the mobile experience. In this post, we will show you the best mobile SEO rules you need to remember making an app design, for this using resources online such as Boston Bill SEO Agency could be really helpful for this.

Simple Design and Clear CTA

A mobile user interface is relatively small, so you need to create a simple design to avoid confusion. Make a small display adding relevant information only. This means you have to reduce and shorten menu items and also highlight CTA links or buttons. It’s the only way to ensure easy navigation through the user interface, allowing visitors to engage with your content.

Mind the Keywords

Regardless of the device, keywords represent an essence of SEO. Your content needs to fulfill basic keyword principles to be discovered by search engines:

  • Keyword rich text: Make sure to add enough keywords and theme-related phrases to the content. Online tools and services like aussiewritings.com can help you write content that satisfies state-of-the-art SEO standards.
  • Add keywords to titles: Each title must contain a primary keyword near the beginning to boost the SEO potential of your posts.
  • Images: Write keyword-based image descriptions to enable search engines to recognize the visual content.  

Design for Big Fingers

It may sound strange, but you have to pay attention to this detail as well. It would be perfect if everybody had thin and gentle fingers, but in reality you must design apps that work well for people with big and wide fingers, thumbs in particular. Doing so, you don’t chase away a large portion of visitors who don’t feel comfortable with app design.

Page Load Speed

Page load speed is paramount for mobile optimization. Traditional websites have been designed to fit the needs of laptops and desktop computers, so they underperform on mobile devices. Most users give up opening a website if they have to wait for more than 3 seconds, which means that you must dedicate extra attention to mobile performance. In order to avoid this issue, we suggest you test load speed on all devices before launching a site.

Create Landing Pages

As a serious business, you will probably run a lot of marketing campaigns to expand the base of customers. But you can’t keep adding new elements to the existing pages, so you should create a special landing page for each one of your campaigns. This helps you to keep all pages simple and minimalistic, but also appealing enough for the users to take action.

Eliminate Pop-Ups

Mobile pop-ups recently became one of the search engine’s biggest enemies. Bearing in mind the size of the user interface, Google realized that intrusive pop-ups make the situation even worse. That’s why they decided to knock down the ranking of all websites that use this kind of advertising. The only thing you are allowed to use is age check or similar forms.

Limited Forms and Inputs

Pop-ups are not the only problematic element in the mobile design. Although not forbidden, registration forms and similar inputs will burden your app in case you don’t position them properly. You should not add more than one form on any given page, but even then you should try to save space by limiting the size of those inputs.

Compress Multimedia Content

Multimedia features such as videos or audio content can drastically slow down website performance, especially its mobile version. For this reason, you should create shorter videos or podcasts and compress them to make the least impact possible. It’s even better if you can avoid this kind of content, but if not – make sure to optimize it for the mobile experience.

Test on All Devices

The user interface looks different on different devices. Display size varies from smartphone to smartphone, while data processing depends on the software version. It can distort content and make it useless, so you have to test performance on all devices. Once the analysis is over, you can officially publish your mobile app.

CONCLUSION

Mobile usage drastically increased in the last decade, opening a brand new marketing battlefield for modern companies. Today, it is impossible to build a successful business without a good smartphone app. In this post, we showed you the best mobile SEO rules you need to remember making an app design.

Did you already implement these tactics? Which one plays the most important role in your business?

How to Improve Your Drop-Down Menu

The Definitive Guide: What Your Dropdown Menu Is Lacking

How to Improve Your Drop-Down Menu

The navigation menu is central to the user experience on a website or mobile app. When we visit a website, we have a particular goal in mind. We want to get somewhere on the site as quickly as possible. Usually, the drop-down menu is the most efficient way to do that.

Optimizing your navigation menu should be a top priority. Here are some things you should do to optimize it, plus some you shouldn’t.

Do Kill the Clutter

Keep your navigation simple. You may have tons of sub-pages and a variety of product categories, but you don’t have to include them all in your main navigation. There are other ways to set this up. Alternatively, you could create a top-seated breadcrumb-style menu to offer easier navigation through lesser sub-pages, while keeping all the juicy stuff in the main nav.

When you open a nav menu, you don’t want it to take up the entire screen. Many retailers and e-commerce sites do this, and it’s poor design. You want navigation to be quick and easy, but that also means keeping a lid on the box. If you add too many options, things get cluttered and confusing. This is especially true on mobile, where the screen is much smaller.

The restaurant Denny’s did this with their newer design. The menu displays the most important categories first. When you select one, it opens to reveal sub-categories or additional options.

Do Use Borders or Shadows

Adding a subtle border or drop shadow to your menu helps it stand out from the rest of the page especially if you’re using a lighter background. This isn’t so important when you have plenty of negative space below your menu foldout. However, if you have images or text content, sometimes these elements can make the menu harder to differentiate.

Do Consider Applications

When browsing on desktop, it makes sense to have the drop-down menu or main nav take up the width of the page. On mobile, however, where there’s much less space to work, a collapsible menu is the better choice. Consider the applications for your menu, such as how and where they will be used. This makes a huge difference when it comes to the function, style and even layout of your design.

Do Include Images or Icons

Most menus are text-based, which is a shame because many devices can display high-quality HD content. Why not spruce things up and make your menu more engaging? It’s okay to add images, icons or even visual indicators to your menu alongside text labels.

An auto seller or manufacturer, for example, might consider putting images of the vehicle next to the model name. As a bonus, this can also help when people know visually what they’re looking for, but don’t know the model.

Formula Boats gets this right with their visually appealing dropdown menu. Open it up, and you can see all their boat models, making it easier to choose between them.

Do Use a Column or Grid-Based Design

Column or grid-based navigation menus are better organized, simple to understand and easy to create. Keep your dropdown menu structured appropriately, especially since consumers and internet users are so used to this design technique.

Don’t Have a Disappearing Menu

Ever notice when a site uses a dropdown menu, it remains visible and follows you down the page? This is good web design, especially on mobile. The main navigation menu is always only a tap away, no matter how far down you scroll. This is important for infinite or lengthy scrolling sites.

Amazon has one of the best examples of this anywhere. While their menu doesn’t collapse, it is a mega menu with a dropdown design. It’s visible no matter where you are on the site, on both desktop and mobile versions. Customers retain quick access, to any section of the site.

Don’t Use Unclear Headings

With a dropdown menu, you’re going to have quite a few menu items in view. That’s alright, so long as you have clear headers to differentiate the varying categories and pages.

For example, an electronics retailer might have categories for home theater, laptops and PCs and printers. The correct way to structure this is to bold the headers of each category so they stand out. The improper way to do this is to list all the options in the same font, color and weight. Then you end up with one list of items, and that’s confusing.

Take a look at the official Columbia site. Pay attention to their mega dropdown menu and how it’s structured. Notice how the header for each category stands out from the rest? Now imagine if all those fonts were the same. Even with the columns separate, things would get confusing.

Don’t Forget to Test

You may prefer Chrome over Microsoft Explorer, or maybe you use Safari. Whatever the case, the worst thing you can do is assume everyone has the same preferences as you. One of the biggest mistakes you can make with web design is not testing your setup on multiple platforms.

Before you roll out the final design for your drop-down menu, check it out on multiple devices, browser types and resolutions. The content may scale differently on certain platforms, which could ruin your perfectly crafted menu.

Look no further than IWC Schaffhausen. Open their site on desktop, and you see a drop-down menu with high-quality images of their watches. This makes sense considering you want to choose a watch that looks good. But on mobile, the menu acts differently. Instead of a full menu that takes up the entire screen, you only see a few of the watches, and you must scroll left or right to see the rest.

Don’t Neglect a “Best Sellers” Section

One of the beneficial aspects of a drop-down menu is when you structure it appropriately, you will have some wiggle room — some space to be innovative. Instead of doing something wild, include your popular or best sellers here. Your customers can jump to your most popular product or service right from the get-go.

Don’t Make It Sluggish

You want your site to look beautiful, and that means including animations, visuals and effects. But you don’t want to hinder the experience by creating something that takes too long to load. It is possible to bog down a drop-down menu, making it sluggish in the process. More importantly, you have control over open and close times, where it appears on the page and how hover elements work. Keep this in mind when designing your menu.

The same is true in the opposite direction, too. If a user is moving their mouse over a menu, you don’t want it to pop open and block another element they’re trying to interact with. Find the sweet spot — usually a half a second — before that menu shows up.

Time to Overhaul Your Menu

If you noticed one or two things on this list that conflict with your drop-down menu, you may want to head back to the drawing board. You see, the navigation menu — dropdown or not — is central to your customers’ experience on your site.

Think of it in terms of a brick-and-mortar storefront. When you go into a grocery store, the building is laid out and organized. Each aisle has a purpose and is properly labeled. If you want something specific, you can usually find the aisle quickly. Now imagine if all those signs were gone. It would be utter chaos.

Your nav menu is the equivalent of those signs in digital form. Not only do you need them to direct traffic, but your customers need them to understand your design.

Lexie Lu is a freelance UX designer and blogger. She enjoys researching the latest design trends and always has a cup of coffee nearby. She manages Design Roast and can be followed on Twitter @lexieludesigner.