Mobile-First Web Design Explained

Mobile-First Web Design Explained

Smartphone Users Now Dominate

Google’s latest algorithm update reflects a changing digital world, a world that has quickly become dominated by smartphone use. Take a look at this graphic as an example of how quickly the landscape is shifting from desktop/laptop use to smartphone & tablets:

chavan-whitehouse-2015-04-007

What this means for your business is that if your website doesn’t provide an excellent user experience (UX) on a smartphone sized touchscreen, you are losing business to a competitor that does have a such a website.

Fortunately, the solution has been in development for a while now and it’s called “Mobile-First Design”.

Mobile-first design is the complete opposite approach from the way web design was practiced when I started back in 1998. Back then the goal was a rich user experience, with maximum bells and whistles, with lots of Flash animation and wow-factor. The trend in those days was larger and larger screens, with visually impressive graphics intended to make good use of all those pixels.

Those days are long gone.

How Does Mobile-First Web Design Work?

Mobile-first design starts with a minimal version of your site’s calls to actions and content, allowing for an easy and engaging user experience on a small mobile screen. Graphics are minimal, images shrink down. Menus are abbreviated and text should appear at a size that is easy to read and uncluttered. Adobe Flash has become obsolete, but thanks to HTML5 and CSS3 animation can still be used.

From here, through something in the code called ‘media queries’, multiple versions of your website are all present in this type of design, one for mobile, one for tablets, one for laptops and lastly one for huge screens. This concept is referred to as ‘responsive design’ and should be clearly mentioned in any design you consider when updating. Though it’s true that you can add back in those bells and whistles in the versions designed for larger screen sizes, you can see from the above traffic trends that your ROI for that effort is diminishing, since most of your visits now will come from smaller screen sizes.

Here’s a graphic showing how a ‘responsive’ layout’s code re-arranges a web design to display differently based on screen size:

m-d

As you can see the text and image elements change size and position, in order to best populate various screen sizes. These adjustments tailor the UX for each screen size automatically, once the website code detects what platform a user is viewing the site from. You can use seattletechsolutions.com as a good example of this effect: try viewing this article on your smartphone, then compare it with the version that appears on your laptop or desktop computer.

How Does Your Website Rate?

You can start by checking your website with Google’s own tool designed to tell you whether your site measures up or not. If it doesn’t, you need a new site design. Though you can spend money on converting what you have to be compliant with this new standard, this paradigm shift is so massive that it’s likely a new design from the ground up designed for a mobile-first world is a better choice in the long run. You can still use your previous content in the new design, after whittling your page’s functionality down to the bare minimum essentials.

We Can Help

At Seattle Tech Solutions, we take a big picture approach to our clients’ operations with the goal of getting their sales to the next level, including mobile-first redesigns. If you’d like help getting your website converted to the new mobile-first standard, give us a call or shoot us an email today for an initial consultation and estimate.

Search Indexing Can Slow Down Your PC

Upon a recent visit to a client of ours, they reported that their Windows 7 computer seemed to be running slow. Sure enough, when we sat down and looked at their Dell desktop computer, the HDD was running almost constantly even after restarting. In this condition, their high speed internet connection was going to waste. The PC itself was so bogged down with local activity it was limiting the connection speed to a crawl.

Upon looking at the client’s active processes with the Task Manager, we noticed a common problem: their Search Index was churning away constantly. A few settings later, the problem was solved. Their HDD activity returned to normal and speed was once again what they expected.

Search Index is a Windows 7 process by which Windows goes through every single file on your computer, enabling those files to appear in search results when you use the Start Menu Search Field. Limiting the locations that this process checks can significantly reduce the processing load required by Search Indexing, processing that’s needed for browsing the web, running games, or using Microsoft Office to name a few examples.

We recommend using Google Drive as an easy, affordable & automatic way to back up files on your PC, though leaving your Google Drive folder checked in your Search Index locations can mean more than optimum activity when indexing.

Here’s a look at the process in more detail in an article on Tech Republic. If your PC seems to be constantly busy even though you have no apps open, you might take a look at these settings or as always, feel free to give us a call to make a troubleshooting appointment. Normally we can bring your PC back up to speed in less than an hour! In the process we’ll also make sure there’s not unwanted junk, malware or any other problematic processes leaching your computers vital CPU power.