DEV Community

Alessandro Lepri
Alessandro Lepri

Posted on

The importance of 'mobile-first' approach

Mobile users cannot be ignored!

Based on Google research, 68 million searches are carried out from mobile devices every hour around the World giving us a total of 69% of people starting their research from a mobile device.

That is why mobile-first play an important role when start planning a product design. It has more restriction but at the same time, it gets more versatile when needs to be expanded to tablet or desktop by adding and creating extra features.

By following this approach, the product design could lead us from the beginning to identify which are the primary, secondary, tertiary information important for the users that means that they are not to be deleted bu simple hidden based on which device you are using by the time. It helps to sort all those information in a way that in a smaller screen where less content could be fitted the users gets whatever needed immediately by removing any distraction, any unnecessary user interface decoration will turn up immediately in a better User Experience.

One important thing to understand the “mobile-first” concept is not to think about that as “responsive”.

Responsive Website Design is the formatting of a website that it can be optimally viewed from any type of device: PC, tablet, and smartphones. This might sound very familiar to the mobile-first approach because responsive web design is a feature of mobile-first design. However, responsive is different in that it starts with designing for desktop and working down in formatting for tablet and mobile.

From a design standpoint, responsive web design is a combination of moveable grids, layouts, and images that function from CSS media queries. So when the user is looking at a website on their phone and then moves to a desktop, they have a similar experience due to the flexibility of the layout. Pictures and content may be arranged, but the user can do and see everything on mobile and desktop.

Responsive came onto the scene before mobile-first, that is sometimes why there is confusion between the two approaches. Another example of a responsive website would be if you were to grab the corner of your browser and readjust the size. Make it smaller and you will see the content rearrange itself so that it is not cut off. Believe it or not, it was once common for webpages to just end where the browser did so that users had to scroll around to find content. It is best to follow the trends of the time and utilize a mobile-first approach. Responsive design does not take into mind limiting content. Users will get more out of their experience if they only see the essential information on their mobile devices. By only resizing the webpages, they still may not receive the functionality they need to have a positive user experience.

Discussion (0)