U.S. flag

An official website of the United States government

Dot gov

The .gov means it’s official.
Federal government websites often end in .gov or .mil. Before sharing sensitive information, make sure you're on a federal government site.

Https

The site is secure.
The https:// ensures that you are connecting to the official website and that any information you provide is encrypted and transmitted securely.

Skip to page content

Mobile First

Mobile First is the idea that web sites should first be designed for mobile devices, including only those tasks/items that website visitors use most. Then as screen real estate increases, add in tasks/features as needed based on user priority.

This means the site will work (to some degree) on that shiny new web-enabled gizmo sitting under your neighbor’s Christmas tree 4 years from now.

  • Allows websites to reach more people (77% of the world’s population has a mobile device, 85% of phones sold in 2011 equipped with browser)
  • Forces designers to focus on core content and functionality (What do you do when you lose 80% of your screen real estate?)
  • Lets designers innovate and take advantage of new technologies (geolocation, touch events and more)

By first creating an experience that prioritizes a worst-case mobile scenario, you ensure that your users will be able to accomplish their goals despite a lot of factors working against them. In short, if you can support the mobile web, you can support anything.

[youtube=http://www.youtube.com/watch?v=lTYZTwWKaNI&w=600]

According to Luke Wroblewski, a leading proponent of mobile first design, going mobile first:

  • prepares you for the explosive growth and new opportunities emerging on mobile today,
  • forces you to focus and prioritize your products by embracing the constraints inherent in mobile design, and
  • allows you to deliver innovative experiences by building on new capabilities native to mobile devices and modes of use.

Mobile first is closely related to the concept of responsive web design which uses W3C CSS3 media queries.

Tags: , , ,

GitHub LogoEdit
Top