The meaning of ‘mobile friendly design’ and ‘mobile responsive design’ are often thrown together like they are the same thing.
You can find that the definitions are sometimes blurred and interchanged when reading web design related blog posts or on forums.
The two, however, are in fact quite different.
Although trying to achieve the same goal, mobile responsive design has the upper hand. Let us elaborate.
Mobile friendly design
Mobile friendly design came about as more and more mobile phones began to have the ability to browse the internet; all those long 13 or so years ago.
It was almost bolted on to websites as an after thought – those that could afford it had a separate mobile website built altogether!
But, to be fair, the use of the internet on mobile phones was very new at the time.
Mobile friendly design is how a whole website resizes accordingly to the device/screen width.
Now, bear in mind, it resizes the whole site and therefore the text & images shrink and become unreadable. Menus and buttons become small to use and you have this ‘zoom in/zoom out’ syndrome when accessing and reading the site.
Think of it as static shrinking.
Mobile responsive design
Modern, trendy, and most websites built today are built mobile first – that is with the mobile design at the front of the mind.
Mobile responsive design is how a website’s elements break, usually from 4-6-columned rows on PCs & Laptops into 1-3 columned rows on mobiles & Tablets.
This then means the text is readable, images are distinguishable and you don’t have to zoom in and zoom out all the time.
This is dynamic shrinking.
A good example is below where you can see how mobile friendly design differs from mobile responsive.
In Summary
Use mobile responsive; it provides better user experience and, oppose to mobile friendly design, it was purposefully built to provide great mobile browsing.
MYTH = BUSTED
