Mobile First
The term “mobile first” is a concept used in web design and the conception of websites. Based on this concept, an optimized version for mobile devices is created first and then expanded. Thus the “mobile first” strategy follows the trend that more and more users are surfing the Internet with their smartphone or tablet, and not with the desktop.
Background
Web development and web design have focused from the outset solely on designing sites for stationary desktops. First, such designs were relatively simple because of the smaller downstream bandwidth, since the connection to the Internet in the 1990s was still done via dial-up modem with a maximum speed of up to 54 kbit/s. Consequently, design and functionality had to be matched to the surfing speed. Eventually websites were able to offer more and more features, because downloading became faster thanks to DSL. With high-speed Internet via VDSL, speeds in excess of 100 Mbit/s could be achieved depending on the region. The loading speeds of modern websites could not be realized today with a conventional dial-up modem.
But while the Internet access at home quickly evolved, the mobile Internet developed parallel to it, which was operable from the beginning with the GSM standard and underwent a first specialization with WAP. After mobile data connections became successively faster and now at its current peak (as of May 2014) with the fourth generation mobile LTE, mobile Internet has become increasingly popular. In Germany, for example, more than 70 percent of Internet users surf the Internet on their smartphone as of 2013.
In the course of this parallel development, web designers, webmasters, and SEOs must ask themselves more often how content can be optimized for mobile devices. Mobile optimization is a consequence of the above considerations.
This is based on the approach of orienting the design of the presentation and usability of a website initially on mobile usability. Mobile first therefore replaced the previous solution approach of responsive designs.
The “mobile first” strategy has a different approach, specifically at the beginning of all considerations. Trends like responsive design pick up on these ideas.
Google has once again increase the meaning of mobile first since making the Mobile Friendliness 2016 a ranking factor, and then later making the mobile index to the primary index.
The principle
Websites are usually designed for desktops. Web designers and programmers develop extensive functionality and graphics, which are designed for both large screens as well as fast data connections. A mobile version of an online shops or a website was planned only as the second step and was usually only some kind of “appendage” to the main website. For the purposes of mobile first, the priorities are reversed.
When mobile subpages were initially created, they could be identified by a m. in front of the domain name (example: m.ryte.com). Users accessed these pages exclusively via their smartphone. Problems soon arose with these mobile URLs, however, first and foremost in design. Often, the design of the mobile pages deviated strongly from the homepage, so there was no clear recognition between the two page variants. Another problem was the amount of different display sizes on smartphones.
Because a uniform presentation of mobile websites was not possible, in 2010, a dynamic design was developed that marked the standard for mobile-friendly designs: responsive design. Individual design elements in the CSS are controlled by Media Queries in such a way that the website display adapts to the browser size by scaling. This prevents the user from having to zoom in on the smartphone display when viewing, and it prevents elements of the page from being unintentionally cut off in the mobile display.
One drawback of the responsive design was that some pages on the smartphone were displayed in "endless mode", meaning that the user had to scroll endlessly to get to the bottom of a page. The solution was then often to shorten texts, and to remove pictures and graphics from the mobile design. However, this of course worsened the usability, whereas the intention of responsive was to improve usability on mobile devices.
The principle of mobile first arose out of this problem. With mobile first, the priorities are reversed: the design or structure of a website is based on the presentation on mobile devices, especially smartphones. This approach is based on the following considerations, which form the basis of the future website design:
- What is the central aspect of my website?
- What elements of my website are absolutely necessary for the website design?
- Which areas must work on desktops and mobile devices?
- For which screen size is my content made?
The concept of a website is thus limited to the rudimentary and essential. Only that which is actually necessary is programmed and set up to maximize functionality on all devices. Sketches of websites are designed directly for smartphone screens. This leaves no room for large images or functions. These elements, optimized for the smartphone, are then arranged more comprehensively on the homepage.
The source code is also reduced. Certain functions such as JavaScript are not always taken into account in mobile first. The site itself can be immediately programmed in HTML5.
The advantages
If you follow the mobile first strategy, you will benefit from many advantages. Firstly, Mobile First follows the current trend of the increase in mobile usage, as the mobile optimization happens at the beginning of the website design. The desktop version of a website can also benefit from mobile first, as it is not just a design approach - it is also a content-based approach, as only the most essential content is used. It is still possible to expand the site later without any problems. Moreover, a webpage that is optimized for mobile devices can be more easily adapted to new developments, since its structure is much leaner than a conventionally programmed website.
Criticism of mobile first
Critics believe that the concept of a website is very limited by the mobile-first-principle. Although many pages are now optimized for mobile user-friendliness, the user experience on desktop would also suffer because the usability would be unnecessarily uncomplicated. For example, one would have to search for individual control panels in hidden navigation bars. [1]. A further criticism is that pages created for mobile devices may appear to minimalistic in the desktop version.
Alternative approaches such as user first design [2] or journey-driven design [3] put user behavior in the foreground of website design. The fact that users consume different content on their smartphones or tablet than on desktop is also taken into account.
Mobile First, Google and SEO
Google has further increased the importance of Mobile First since the search engine group made Mobile Friendliness its ranking factor in 2016 and later the mobile index its primary index. Since then, the mobile website version is crawled instead of the desktop version.
Mobile First also has an impact on search engine optimization. Elements such as voice search, voice search and Page Speed are becoming increasingly important. Mobile First pages should give special priority to optimizing this.
References
- ↑ Mobile First Not Mobile Only, Studie der Nielsen Norman Group nngroup.com. Accessed on November 2, 2018
- ↑ User First Design uxbooth.com. Accessed on November 2, 2018
- ↑ Journey Driven Design pegasusone.com. Accessed on November 2, 2018