The Evolution of Websites: Shaped by Screen Size

Origins: The Website
If you had a website for your business a couple of decades ago it likely would have been 800 x 600 or 1024 x 768 pixels in size, the size of computer monitors at the time. It could have been a single page. This was long before any tablet or smartphone. Laptops were clumsy and weighed a ton. One website was all you needed because all the screens were standard sizes.

Mobile first design presentation The Split: Desktop Sites and Mobile Sites
A few years later, as mobile devices were invented and grew in usage (feature phones, smartphones, netbooks, tablets, smaller laptops, etc.), you'd have a "desktop" website plus a "mobile" website, a second version designed just for smaller screens. There were two sets of code to worry about, and search engines might or might not figure out what was happening.

The Reboot: Mobile Friendly Websites
Web design technologies finally grew to deal with all the devices being used, and around 2010 the idea of seperate desktop sites and mobile sites began disappearing, thanks to responsive design, adaptive design, fluid design, and other means of making your website work on any size or shape of screen. Back to one set of code that allows any device to display your content however the device and user prefer. This was a major step forward in web design.

The Tweak: Mobile First Websites
The latest evolution we have is in 2016 with Google stating bluntly that mobile first design is their new expectation. It doesn't matter what your statistics show, or what country your customers are in, or what industry, or age group, or anything else. The traffic coming to your website could be 98% desktop users and they wouldn't care.

"Your website is three inches wide. That means you need to rethink your message, content, and look."

Mobile first design is a backend approach to planning and coding, and is basically equivalent to good mobile friendly design. It can do things like save bandwidth and make pages load faster for users, but I see it primarily as a way to rethink your content and your marketing. It requires you to immediately serve up the most important stuff your visitors want to see, then add more stuff as screens get bigger. This is opposite the old approach of stripping things from your desktop site so it would fit on a small screen.

Your website is three inches wide. That means you need to rethink your message, content, and look. Yes, users on bigger screens might see additional content, but the heart and soul of your business and everything important to your customers must be there in that small space. Progressive enhancement is the term.

Make sure you and your webmaster are on the same page regarding this mobile first design philosophy.

©2017 Second Glance Digital Media  •  (705) 755-0826  •Site Map•  Peterborough, Ontario, Canada