Mobile Ready Design
Dropping business because your website looks horrible on your customer’s smart phone? Improve.
Minutes Fulfilling Promises
I know you’re still waking up mentally, so boom, pow, snap – an iPhone commercial (from 2007):
The Good Ol’ Days
The internet was made to be like the print you read every day. Just in a digital form. With this adoption came fixed widths. Remember tube monitors? Every time these monitors changed sizes, you had to get a web developer to redesign your website to be optimized for these screen sizes. 800×600, 1024×768, 1280×1040 etc.. Which of course cost you more money every couple of years.
If your business was an early adopter of the internet, you’ve probably paid a minimum of $50,000+ in the last 10 years for “mobile” web development.
So What’s Mobile Design?
The definition of mobile design is different almost every year in the late 1990s and mid-2000s. Let’s take a look a few years back and see how things have progressed.
1998 through the early 2000s
We still had antennas on our “mobile phones” and worried about Y2K! If you were looking at web pages on your mobile phone, (most people weren’t, and if they were, they cursed their screen because the pages took so long to load) it would have been mostly all text and a completely separate entity from its desktop companion. This meant big companies that had the money would pay web developers to build both a desktop website and a mobile website – which was very expensive.
- PROS – You could access content from big companies you knew on the go.
- CONS – The companies had to pay twice the amount for web development. It almost always costs less to maintain one website vs two. As a user, you could only access limited information.
2002 – Color display!
You might remember the Motorola Razr – the thinnest phone ever. Phone focus was still on texting really fast and taking stunning 1.3mb photos.
By now you could actually browse the web on your phone in a way similar to your desktop browser. The mobile browser would show a rendering of what you’d see on your desktop computer, just zoomed out. You’d use your keypad to zoom in, zoom out, and select links on the page.
- PROS: A visual experience you were already used to.
- CONS: Because your mobile phone was loading EVERYTHING on your super slow network, you’d experience unrealistically slow load times. With data/bandwidth plans being pretty expensive, most opted not to use their browser unless it was a real emergency. Plus zooming in and out with a keypad was a bit clunky.
This was a beautiful year. (The year I graduated from TC Roberson High School). Also, the year the first iPhone was released by Apple on AT&T’s monster network.
This changed everything. And it really did for mobile design. CSS made massive improvements which made what had been rocket science a few years ago, now basic algebra. Browsers were steadily becoming more predictable, which meant that web developers were able to develop web experiences across web browsers faster.
This brought web development prices down exponentially. And the touchscreen was an innovative new mobile design element.
Nobody can tell the Start Right story better than my customers. Send your friends $10 in Start Right credit and earn 5% of everything they purchase. Forever. - Learn more!
- PROS – Interactive browsing with your fingertips. Faster load times. Standards across browsers which meant faster web development/lower costs for businesses.
- CONS – Having to zoom into the screen to see the content. At the time, this wasn’t a huge deal. Who cared about zooming in, you were using a touchscreen! Also, iPhone didn’t support Flash which was big time in 2007. HTML5 was yet to be released and companies who relied on flash heavily had to come up with a solution fast…
The late 2000s
Mobile smartphones were booming. Everyone who was important had a “smartphone.” Apps were still making their way to the mainstream, and most everyone still trusted their handy-dandy web browser to get most things done. Phone companies were capitalizing on this growing trend and offered contracts that made their customers pay high premiums for data usage.
So early mobile developers came up with the next big thing: A separate mobile website companion for every website. It was genius! (At the time). Experts came up with the conclusion that mobile phone users only needed certain pieces of information from the “full website” in their mobile experience. This would cut down on load time exponentially because the mobile browser wouldn’t have to load as much data. “Saving users money, and giving them exactly what they need.” You may remember typing in something like this to access these wonderful mobile websites.
- PROS – Less load time which meant less money spent by the visitor. Which ultimately meant that visitors were more likely to use your website more often on their mobile phone.
- CONS – This is when web developers really understood they could make a fortune. Every website in the world now needed a mobile companion. Ca-ching!!!! Web development prices skyrocketed, Anyone and everyone claimed they were a mobile web developer. As for the people actually using the website, most were unhappy with the lack of an experience. They felt like they couldn’t do anything on the websites and so reverted to using the desktop version at home or clicking the awful “full website” link in the footer.
Smartphones continued to be released in every different size known to man. And with every new screen size, old web techniques were showing their true colors.
The Monstrous Cost of Mobile Design
In addition to paying thousands for every desktop screen change. Businesses were getting scammed even further paying different mobile sites for every mobile device. Why? because web developers were still using old print techniques for the web. The first iPhone was 320×480 in screen resolution. Web developers set a fixed width of 320 and forgot about the rest. What happened was you’d view m.cnn.com on your new mobile device with different screen dimensions and it would have a broken experience.
Customers complained. So businesses complained. And web developers charged more for a new mobile version of that website.
There were hundreds of different mobile screen sizes. Finally, smarter businesses and intelligent Web developers both had an epiphany. They saw the awful madness they were creating. The web wasn’t print. With this wake-up call, Responsive Web Design was born.
The web has vastly changed for the better. Many things that took months now only take days. Many tools have been build like beaver builder to help teams customize their website after the developer has built it without touching a line of code. With responsive design, your website is built using media queries that change at certain “breakpoints” to adjust the layout and style of your website depending on if you’re viewing it from an Apple iPhone, an iPad Pro or a laptop.
When I build a store, I take all of this into consideration to build you a store that flows no matter what device you’re using. Save money on website redesigns, make it easier for customers to buy and rank higher on Google with a mobile ready website that’s just right on every device.
Plus your store design is completely seamless with WooCommerce. You can modify and customize anything and everything. Because you have complete control, you can add unlimited products and users, and take unlimited orders.