In der heutigen Zeit surft man nicht mehr nur Zuhause oder im Büro am Desktop Computer im Internet, sondern auch auf dem Weg zur Arbeit, beim Essen oder gemütlich auf dem Sofa. Die mobilen Geräte wie das Smartphone und das Tablet sowie das Mobile Internetnetz haben das möglich gemacht.
Über 80% aller Website-Zugriffe mit Handy oder Tablet
Nur noch etwa 20% der Zugriffe finden mit dem Computer statt. Das hat die Anforderungen an eine Website erheblich erweitert. Eine Website muss also nicht mehr nur auf dem Computer übersichtlich gestaltet und bequem navigierbar sein, sondern auch auf dem Handy und dem Tablet funktionieren. Das Problem dabei stellen die unterschiedlichen Bildschirmgrössen dar. Bereits bei den Computern und Laptops gibt es mittlerweile unterschiedliche Grössen, dazu kommen verschiedene Tablet-Grössen, wie auch immer wieder neue Smartphone-Grössen.
Was bedeutet mobile responsive?
Responsive kommt aus dem Englischen und bedeutet „reagierend“. Das meint, dass sich die Website automatisch der Grösse des jeweiligen Bildschirmes anpasst. Folglich wird einer bestimmten Grösse nicht mehr die ganze Navigation oben angezeigt wird – weil diese schlichtweg keinen Platz hätte, sondern ein Menü-Icon (in der Regel drei waagerechte Striche übereinander) erscheint und wenn man darauf drückt, die Seitenstruktur der ursprünglichen Navigation erscheint. Auch Inhaltselemente wie Text und Bild nebeneinander, werden auf kleineren Bildschirmen automatisch übereinander angezeigt. So bleibt der Text gut lesbar und das Bild gut sichtbar.
Normale Ansicht bei genügend grosser Bildschirmauflösung:
Ansicht auf dem Smartphone mit angezeigter Navigation:
Links oben das Navigation-Icon 
Navigation nach Drücken des Icons