In connection with the development of a website for all device classes, the Mobile First approach is often referred to. What is it about the trend that the principle is being used more and more frequently for responsive web projects?
What is clear is that nowadays you have to build a website that works on all relevant devices. I deliberately do not write for all devices. This could be put on the gold scale and asked: “What about smart watches and huge UHD TVs?”
Not that you misunderstand me: If the web analysis shows that a relevant percentage of users access with an appropriate device, this would also require an adjustment. By the way, the point at which a share is classified as relevant depends on the key figures used to decide this. An important indicator is of course always the frequency of accesses, which could then be set in relation to the conversion rate.
excerpt: Definition of Mobile First
Mobile First is a concept that can be used to keep pace with the rapidly growing and very heterogeneous device market.
If you apply the concept, you try to overcome limitations such as small screen sizes and weak performance. This is done by first setting up your website for a small and weak device (Viewport meta tag don’t forget) and then successively enlarging it and enriching it with features supported by better devices.
Here, the context of use (i.e. the when and where of use) plays an important role in order to optimally adapt the website to the requirements of use and the context-dependent receptivity.
A large area at Mobile First also revolves around the optimisation of forms from a usability perspective. The goal is always to enable the user to solve his tasks efficiently. This also includes some basic rules for interactions, e.g. that buttons and input fields must be easy to use by touch.
The short summary of Mobile First already clearly shows that the approach is quite abstract and merely formulates general recommendations. One could also call it a mantra, which solves some of the challenges in modern web development. Nevertheless I would like to answer the question from the title of this article.
Once upon a time <div id=”wrapper”> …
Let us take a look at the opposite of Mobile First: Desktop First. This is basically the same procedure as it has always been used in the past. The website was designed and implemented in a fixed width for the screen resolution most commonly used at the time of creation. There was no adaptation for other (smaller) resolutions, as the need did not exist.
If you want to conjure a fluid or adaptive website from an existing fixed-width page, this is usually only moderately successful. The biggest problem is that the existing content (text, graphics, videos, etc.) is usually not suitable for display on small screens.
One also tends to fade out superfluous content that is not considered important for the mobile version. This does not correspond to what the consumer expects, namely to be able to access the same content of a website across all device boundaries.
Mobile First at every corner
The Mobile First approach can be understood as a mental model that must be dealt with in many areas that are part of the implementation process of a website.
-
- Design takes into account the requirements of touch input (also on the desktop version, namely for tablets) as well as the flexibility of the modular elements.
<Technically, the website is programmed according to the principle of progressive enhancement to support as many devices as possible.
Each of the partial aspects is therefore worked from small to large, resulting in reduced, focused and lightweight websites with a high usability. In order for the approach to be successfully applied, all participants must have the same understanding of Mobile First think and live.
Smartwatch und Co.
“So what happens if a relevant number of users surf my website via Smartwatch – do I act like ‘Smartwatch First’? In theory, yes. And actually, this would probably be possible without any major losses if you consider that an Apple Watch in the small version provides 272 pixels in width. This is only 48 pixels less than on the iPhone 5s.
In practice, this will probably not happen very often, because Apple does not provide the Smartwatch with a browser. Also other Smartwatches are only slowly making attempts with browsers like Opera Mini (for Tizen) or the Web Browser for Android Wear.
On the other hand, the TVs, it seems that the browsers of the Smart-TVs don’t support current CSS features very extensively and the operation with a conventional remote control is not much fun. Nevertheless, this could be taken into account, as this is similar to the exclusive use of a keyboard. But here, too, the manufacturers react and give users remote controls that can conjure up a kind of mouse pointer on the screen, as they did on Wii back then. Then even hover effects might work.
Conclusion
The “Mobile First” principle is a good tool to create websites with a high usability for all devices. Not for nothing it has become a quasi-standard for new responsive projects in the web development scene.
In my opinion one should work according to the “User First” approach, where user centricity is the absolute focus. For me, User First includes the “Mobile First” principle in its entirety.
Comments