Example of a Mobile First web page layout that delivers the same User Experience (UX) on different size screen devices

History Of How Technology Has Changed Website Design Over Time

The World Wide Web Timeline illustrates both the major milestones and small moments that have shaped the Web since 1989.

1st Generation Website Designs

1991 - First Website Goes Live

The first website was launched by Cern on August 6, 1991. It outlined how to create web pages and explained more about hypertext (HTML).

All 1st Generation websites were designed to be viewed on Desktop Monitors.

The Introduction Of The First Smartphone Devices Forces Developers To Change Website Designs!

2007, Apple First iPhone Smartphone Released

Apple unveiled the 1st Generation iPhone to the public on January 9, 2007, at the Macworld 2007 convention.

It was released to the public on June 29th, 2007.

2008, First Android Smartphone Released

The first Android Smartphone was the HTC Dream and it was released on September 2008.

The HTC Dream was praised for its solid and robust hardware design.

2010, First Windows Smartphone Released

Microsoft announced their first Smartphone device at the Mobile World Congress in Barcelona, Spain on February 15, 2010

It was released to the public on November 8, 2010.

There Were Issues After The Release Of The First Smartphone Devices

🚩 Although every 1st generation Smartphone had a web browser, the telecommunication infrastructure was very slow using second generation 2G cellular networks that delivered a theoretical speed of 50 kilobytes per second.

🚩 Because all the existing websites were designed to be viewed on Desktop monitors, the web pages WERE NOT READABLE on the small screens of these 1st generation Smartphone devices.

🚩 Mobile visitors had to use their fingers to "PINCH IN AND OUT" in order to view the content of existing websites and click on navigation links!

Smartphone Devices Need To Display The Content Of Existing Websites That Were Designed for DESKTOP ONLY Screens

2010 - Responsive Web Design (RWD)

Ethan Marcotte coined the term Responsive Web Design (RWD) in an article that was published on May 25, 2010, describing the theory and practices.

This design methodology allowed developers to use the "CSS3 Media Queries" feature to display the content of existing webpages on the smaller screen of Smartphone devices!

The Responsive Web Design (RWD) Objectives

✅ Website visitors will experience DIFFERENT web page layouts for Desktop and mobile devices.

✅ The Desktop and Mobile Navigation User Interface (UI) will be DIFFERENT!

🚩 Some of these website designs do not exploit all Mobile Accessibility Features.

A New Website Design That Is Focused On The Mobile User Experience (UX)

2010 - Mobile First Website Design

Mobile technology and cellular infrastructure has IMPROVED DRASTICALLY since the first Smartphone devices were introduced in 2007!

The Mobile First Website Design focuses on the Mobile User Experience (UX)!

Features And Benefits Of My Mobile First Website Design

👍 Takes advantage of ALL Mobile Accessibility Features such as:

✅ Back to Top.

✅ Click-to-Call.

✅ Add to Home Screen

✅ Digital Business Card.

✅ Email Form that: ✅ Linking a business address to Google's Voice Activated Driving Directions.

👍 It uses a Custom HTTP Error 404 Page that is able to Advertise my website content and services!

Learn how to use your HTTP Error 404 Page to advertise your website products and services

👍 The Ambidextrous Mobile Navigation Menu of this website is positioned at the Bottom of the Screen and provides OPTIMAL THUMB ZONE ACCESS to both the LEFT and RIGHT hand THUMB FINGERS.

An Ambidextrous Mobile Navigation Menu designed for OPTIMAL THUMB ZONE Access on ANY SIZE Smartphone screen
✅ Experience a Mobile Menu with 35 Categories and 291 Page links!

👍 It uses the SAME WEB PAGE LAYOUT AND MENU NAVIGATION that can scale from a small Smartphone screen to a Large Screen TV WITHOUT USING CSS3 Media Queries and is compatible with web browsers running BOTH CURRENT AND OLDER VERSIONS of Apple, Android an Windows operating systems. Example of a Mobile First web page layout that delivers the same User Experience (UX) on different size screen devicesThe Mobile First layout can scale from an IPhone 4 to a large screen Smart TV
👍 DELIVERS A SUPER FAST WEB PAGE THAT LOADS IN LESS THAN 1/2 SECOND and exploits Google's Major Change to it's Mobile Ranking Algorithm!

I encourage you to explore my Mobile First Tutorial so that you can understand the detail analysis that is needed to implement this type of website design. THE RESULTS ARE AMAZING!

Call to Action and Social Media

Picture of Raul Gonzalez, a Mobile First Website Developer in Dallas, Texas

Would love to hear your thoughts and comments so, feel free to call 📱, or send me an email 📧.

✅ Follow me on Twitter to keep up to date with my Mobile News 📰 Postings!

Back to 🔝 of Page

Share with FacebookShare with Google+Share with LinkedInShare with Twitter

Speed 📉 Profile
★ ★ ★ ★ ★