Did you know, that in 2023, MOBILE surpassed desktop in online user engagements?

According to Forbes, 40% of users won’t return to a site with a poor mobile experience and mobile phones account for roughly 55% of the world’s global website traffic.

Mobile search is increasingly used in place of desktop. As of January 2017, Google indexes sites on mobile first, instead of desktop.  How well does your website fare today in 2024?

Have you ever experienced a mobile search where the website does not shrink to fit the screen or permit you to expand it to read the content?  Are the contact details missing or cut of due to no responsive (mobile-friendly) design?  Mobile is about immediacy.  The need for specific information, within a short period.  Place yourself in your user’s shoes.  What do they want or need to see front and center that makes their search quick and simple?

If your organization is considering a new website, ensure it has a responsive design and is usable on all devices (mobile, tablet and desktop).  But first, what type of responsive design is best for your organization?

Unfortunately, not all responsive design is the same.

There are three major ways that responsive design can be implemented, with vastly different impacts on the organization – and the user.  Which one is used is a function of your budget… and the developer’s experience.

1) Plug-in approach.  There are plug-ins for many web content management systems that can “automatically convert” the site into a responsive site.  Usually, this means that the menu would no longer appear at the top of the screen, but instead be collapsed into a mobile-style hamburger menu in the top left corner.  All of the remaining content would be stacked, accessible by scrolling through a very long page, or by clicking to unhide certain content.  Most of these plug-ins will also solve the font size problem.  This approach is almost costless – but has some critical flaws.  Read on.

2) Desktop recast approach:  This approach takes the standard design and creates special-for mobile layouts and CSS files during the development process.  If the top of the home page has a rotating graphic, with five buttons underneath, this approach would reduce the size of the rotating graphic, and perhaps move the five buttons to the right (on a tablet), or stacked below (on a mobile phone).  The idea is to code the page so that the design easily flows from one layout to the other, based on the window size of the device. While the design is custom, this approach evolves that design from the desktop.  It also has a critical flaw.  Read on.

3) Use-case approach: This approach is embedded within the strategy and design process, and starts with one question: what would the user want to do when using the mobile site?  Likely, it is to find the organization’s street address or phone number.  Or perhaps it would be to register their product, or access customer-support how-to videos.  If this is true, then fancy rotating graphics (which take a long time to download) and “welcome to company ABC” text make no sense on a mobile home page.  In a Use-case approach, most of the content will still be accessible to mobile users, but the design and prioritization of the content may be very different indeed.

This week’s action plan:  Explore some websites of your competitors.  Are they responsive and user-friendly?  What can they do better?  When you go to your site, is it responsive?  This week, put yourself in the shoes of your organization’s key stakeholders, but use your smartphone. Is what you (they) need front and center on your website?  If not, it’s time to re-design your website with a mobile-first strategy.