"Mobile First" web design philosophy

Internet traffic continues to shift from desktop to mobile devices, at an even faster speed since the rise of the "Mobile-Only User" in 2013. it is essential for websites to provide a flawless User Experience (UX) on mobile devices. Even Twitter Bootstrap, the most popular HTML/CSS/JS framework for responsive websites, embraces its "mobile first" approach. 


"Mobile First" means Prioritisation

The minimum size of 44x44 pixels for buttons on mobile devices implies a harsh set of constraints. It forces your website's design to be concise and relevant at every touch. In order to achieve this, the concept for your website must be set before touching the digital canvas. The hierarchisation of information and call-for-actions being decided in advance, your creative work will be better informed and conceived. The paradox of needing constraints for more creative output is perfectly applied in the Mobile First web design philosophy. 


"Mobile First" means Context

Typographic, layout, colour and graphical adjustments are necessary when designing for mobile. On a smaller display, the quantity of options is overuled by the ease of choosing. This requires a clear understanding of 'how' your website will be perceived and used in a mobile context. Graphic design is a desktop activity (even though: iPad Pro + Apple Pencil) even though your work will be consumed on mobile. Resizing your software's window to a thin vertical line does not count: you must export your work on a mobile device and 'fool around' with the real thing. Just like great cooks do: taste as you go along. 


"Mobile First" means Being Ready

The "Mobile First" philosophy is not a trend, and responsive design is no longer a "nice-to-have" feature. We will continue to build welcoming, enjoyable and productive digital spaces - and keep an eye on new devices. True, the name "Mobile First" locks away any other type of device (television, watch, etc...). What really matters is the core of its philosophy. "Mobile First" is an iterative and user-centered approach to creative challenges, no matter the shape and size of the screens of The Future. Be ready.



Credits photography: Jordan McQueen


Mobile First

Mehr Artikel

Search engine optimisation: basic metatags that every website should use
Natznerhof Website

Our products + services


Icon Websites

We discover people, brands and companies on a growing number of devices and new technologies. Our expertise for websites includes responsive design, lean development, copy-writing with translation and search engine optimisation.


Online Marketing

Icon Online Marketing

Extend the promotion and advertisement of your products, services or brand to the World Wide Web. Our expertise for online marketing includes Google AdWords, Facebook / Instagram advertisements and Email marketing.


Design + Branding

Icon Design Services

From the print to the digital world, design is everywhere. Its purpose is not purely aesthetic, as it brings your product, service or brand together in one harmony. Our expertise for design services include corporate graphic & print design and UI/UX design.


Technical Services

Icon Technical Services

The doubling of computer processing speed every 18 months is just one manifestation of the greater trend that all technological change occurs at an exponential rate. We offer tailored services in the areas of consulting, planning and execution of digital solutions. With us as your reliable partner you can face the challenges of digitalisation!


Apps and Innovative Products

Icon App Development

The trend towards web and mobile applications impacts our everyday life. We offer tailored software solutions for both desktop or mobile users. They are an innovative approach to business/customer relationships. Our expertise in app development include iOS and web apps.