Struktur und Design responsiver Webseiten auf Smartphones: Wie Sie das mobile Internet userfreundlich gestalten
Von Annika Brinkmann
()
Über dieses E-Book
Annika Brinkmann zeigt in diesem essential, wie mit wenigen Kniffen aus schlechten Beispielen gute mobile Webseiten entstehen können. Die Autorin erläutert, was getan werden muss, um Inhalte nicht zu klein oder zu groß für den verfügbaren Platz darzustellen, Navigationen sinnvoll zu strukturieren und von der richtigen Seite her einzublenden. Kurzum: Sie zeigt, wie man mobile Websites übersichtlich gestaltet, damit diese keinen User-Frust auslösen. Das mobile Internet hat die Nutzung von Webseiten auf Desktop-Computern längst hinter sich gelassen. „Mobile first“ ist angesagt, die Zeichen stehen oftmals sogar auf „Mobile only“-Nutzung des Internets – zumindest im Privatgebrauch.
Ähnlich wie Struktur und Design responsiver Webseiten auf Smartphones
Ähnliche E-Books
UX Design für Tablets: Eine Anleitung für User Experience, Design und Webentwicklung Bewertung: 0 von 5 Sternen0 BewertungenDas Praxisbuch Xiaomi Poco X3 Pro - Anleitung für Einsteiger Bewertung: 0 von 5 Sternen0 BewertungenUX Design für Tablet-Websites: Ein Überblick Bewertung: 0 von 5 Sternen0 BewertungenDas Praxisbuch Xiaomi Mi 11i - Anleitung für Einsteiger Bewertung: 0 von 5 Sternen0 BewertungenDas Praxisbuch Xiaomi Poco M4 Pro 5G - Anleitung für Einsteiger Bewertung: 0 von 5 Sternen0 BewertungenDas Praxisbuch Xiaomi Mi 11 Lite & Mi 11 Lite 5G - Anleitung für Einsteiger Bewertung: 0 von 5 Sternen0 BewertungenAdobe Digital Publishing Suite: Apps entwickeln mit InDesign und HTML5 - inklusive Prozessoptimierung und Profi-Tipps aus der Praxis Bewertung: 0 von 5 Sternen0 BewertungenDas Praxisbuch Xiaomi 11T & 11T Pro - Anleitung für Einsteiger Bewertung: 0 von 5 Sternen0 BewertungenVirtuelle Teams und Homeoffice: Empfehlungen zu Technologien, Arbeitsmethoden und Führung Bewertung: 0 von 5 Sternen0 BewertungenDas Praxisbuch Xiaomi 12T & 12T Pro - Anleitung für Einsteiger Bewertung: 0 von 5 Sternen0 BewertungenDas Praxisbuch Xiaomi Poco M5 - Anleitung für Einsteiger Bewertung: 0 von 5 Sternen0 BewertungenDas Praxisbuch Xiaomi Poco X4 Pro 5G - Anleitung für Einsteiger Bewertung: 0 von 5 Sternen0 BewertungenVirtual Reality im Tourismus: Wie VR das Destinationsmarketing verändern wird Bewertung: 0 von 5 Sternen0 BewertungenModerne Webentwicklung: Geräteunabhängige Entwicklung -- Techniken und Trends in HTML5, CSS3 und JavaScript Bewertung: 0 von 5 Sternen0 BewertungenDas Praxisbuch Xiaomi Poco F3 - Anleitung für Einsteiger Bewertung: 0 von 5 Sternen0 BewertungenDas Praxisbuch Xiaomi 13 Lite - Anleitung für Einsteiger Bewertung: 0 von 5 Sternen0 BewertungenDas Praxisbuch Xiaomi Redmi Note 10S - Anleitung für Einsteiger Bewertung: 0 von 5 Sternen0 BewertungenJournalistische Praxis: Chatbots: Automatisierte Kommunikation im Journalismus und in der Public Relation Bewertung: 0 von 5 Sternen0 BewertungenDas Praxisbuch Xiaomi Poco F4 - Anleitung für Einsteiger Bewertung: 0 von 5 Sternen0 BewertungenDas Praxisbuch Xiaomi Poco X4 GT - Anleitung für Einsteiger Bewertung: 0 von 5 Sternen0 BewertungenDas Praxisbuch Google Pixel 3a & Pixel 3a XL - Anleitung für Einsteiger Bewertung: 0 von 5 Sternen0 BewertungenDas Praxisbuch Google Pixel 8 & Pixel 8 Pro - Anleitung für Einsteiger Bewertung: 0 von 5 Sternen0 BewertungenDas Praxisbuch Samsung Galaxy M12 - Anleitung für Einsteiger Bewertung: 0 von 5 Sternen0 BewertungenDas Praxisbuch Xiaomi Poco M3 - Anleitung für Einsteiger Bewertung: 0 von 5 Sternen0 BewertungenTitel Das Praxisbuch Xiaomi Redmi 10 - Anleitung für Einsteiger Bewertung: 0 von 5 Sternen0 BewertungenBildbearbeitung & Design für Social Media: Visuelle Inhalte erstellen und optimieren Bewertung: 0 von 5 Sternen0 BewertungenDas Praxisbuch Xiaomi 12 / 12X / 12 Pro - Anleitung für Einsteiger Bewertung: 0 von 5 Sternen0 BewertungenWebsite-Konzeption: Erfolgreiche und nutzerfreundliche Websites planen, umsetzen und betreiben Bewertung: 0 von 5 Sternen0 BewertungenProdukte digital-first denken: Wie Unternehmen software-basierte Produktinnovation erfolgreich gestalten Bewertung: 0 von 5 Sternen0 BewertungenAndroid Tablets & Smartphones: Der Ratgeber für Einsteiger & Senioren Bewertung: 0 von 5 Sternen0 Bewertungen
E-Commerce für Sie
Das kleine Hypnose Einmaleins - Alles was Sie schon immer über die Hypnose wissen wollten von Ewald Pipper vom Hypnoseinstitut Bewertung: 0 von 5 Sternen0 BewertungenGoogle Platz 1: Lernen Sie von einem der führenden Suchmaschinenoptimierer Deutschlands Bewertung: 0 von 5 Sternen0 BewertungenGrundlagen des Online Marketing: Digital Marketing, SEO, Storytelling, Inbound-Marketing, Funnel Bewertung: 0 von 5 Sternen0 BewertungenGrundlagen des Marketing: Einführung, Konzeption, Print, Online, Werbung, Branding, Media, PR, Marketingmix Bewertung: 0 von 5 Sternen0 BewertungenIdeen Für Passive Einkommen: Financial Investments Bewertung: 0 von 5 Sternen0 BewertungeneCommerce Grundlagen: Der Leitfaden für den erfolgreichen Einstieg in den Online-Handel Bewertung: 0 von 5 Sternen0 BewertungenAmazon FBA Meisterung: Online Trading Bewertung: 0 von 5 Sternen0 BewertungenPassives Einkommen Online Bewertung: 0 von 5 Sternen0 BewertungenCopywriting: Überzeugende Worte, die verkaufen Bewertung: 0 von 5 Sternen0 BewertungenIn 7 Schritten Zur Gründung Eines Online-Unternehmens: Financial Investments, #1 Bewertung: 0 von 5 Sternen0 Bewertungen30 Minuten Suchmaschinenmarketing Bewertung: 0 von 5 Sternen0 BewertungenManipulative Werbetexte: Ein praktischer Ratgeber zur Erkennung und Benennung von beeinflussenden Methoden Bewertung: 0 von 5 Sternen0 BewertungenOnline-Marketing Konzept: Digital Marketing erfolgreich planen, umsetzen & optimieren Bewertung: 0 von 5 Sternen0 BewertungenGoogle Ads: Von Google Analytics über Google Shopping bis zu Google Adwords - in diesem Ratgeber findest du alles, was du über Google wissen musst. Bewertung: 0 von 5 Sternen0 BewertungenBloggen – der moderne Weg zum Reichtum Bewertung: 0 von 5 Sternen0 BewertungenONLINE KURS Erfolgsgeschichten Bewertung: 0 von 5 Sternen0 BewertungenLinkedin Marketing Business: Wie Sie mit der "DASKY Methode" Ihre Content Marketing & Social Selling Strategie erstellen und Neukunden gewinnen Bewertung: 0 von 5 Sternen0 Bewertungen30 Minuten Online-Marketing Bewertung: 0 von 5 Sternen0 BewertungenBrand management in 4 schritten: Wie Sie das Marketing Ihrer Marke am besten steuern, ihr Potenzial und ihre Wirksamkeit verbessern Bewertung: 0 von 5 Sternen0 BewertungenOnline-Marketing: 10 Schritte zur finanziellen Freiheit Bewertung: 0 von 5 Sternen0 BewertungenVerbraucherrechte beim Onlineshopping: Juristische Fallstricke erkennen und vermeiden Bewertung: 0 von 5 Sternen0 BewertungenKryptowährungen: Insiderwissen Für Den Handel, Das Investment Und Mining Bewertung: 0 von 5 Sternen0 BewertungenDropshipping: Online-Business leicht gemacht Bewertung: 0 von 5 Sternen0 BewertungenRaus aus dem Stundenlohn: Nie wieder für andere arbeiten und Lebenszeit verkaufen Bewertung: 0 von 5 Sternen0 BewertungenMonatlich über 1000 Euro nebenbei: Wie Sie mit Angeboten auf Fiverr.com ein attraktives Nebeneinkommen oder eine neue Selbstständigkeit aufbauen Bewertung: 0 von 5 Sternen0 BewertungenAmazon KDP und Amazon Marketing: Passives Einkommen mit Self-Publishing auf Amazon — Die Schritt-für-Schritt-Anleitung, um Geld im Internet zu verdienen Bewertung: 0 von 5 Sternen0 Bewertungen
Rezensionen für Struktur und Design responsiver Webseiten auf Smartphones
0 Bewertungen0 Rezensionen
Buchvorschau
Struktur und Design responsiver Webseiten auf Smartphones - Annika Brinkmann
© Springer Fachmedien Wiesbaden GmbH, ein Teil von Springer Nature 2019
Annika BrinkmannStruktur und Design responsiver Webseiten auf Smartphonesessentialshttps://doi.org/10.1007/978-3-658-25422-3_1
1. Versuch einer Problembeschreibung
Annika Brinkmann¹
(1)
Berlin, Deutschland
Annika Brinkmann
Email: wissen@mobile-knowledge.de
1.1 Status quo 2018
Das mobile Internet hat die Nutzung von Webseiten auf Desktop-Computern längst hinter sich gelassen. „Mobile first ist angesagt, denn die Zeichen stehen oftmals sogar auf „Mobile only
-Nutzung des Internets – zumindest im Privatgebrauch.
Google Glasses sind längst wieder out, der Hype um Smart Watches dümpelt vor sich hin. Virtual Reality steht in den Startlöchern, VUI – Voice User Interface – ist (angeblich) das nächste große Ding. In keinem anderen Bereich klafft die Schere zwischen den technischen Möglichkeiten und wie (gut) sie genutzt werden ähnlich weit auseinander wie in der Webentwicklung.
Vor meiner Arbeit an diesem Buch wollte ich mein Smartphone oft auf den Tisch hauen, wenn ich eine schlechte mobile Seite entdeckt habe. Seither bricht bei mir Begeisterung aus, wenn ich ein Beispiel entdecke, an dem ich mehrere Probleme aufzeigen kann.
„Mobiles Webdesign? Brauchen wir nicht! Es gibt doch jetzt responsives Webdesign." Sagte 2012 ein Agentur-Chef, dem ich von meinem Workshop-Angebot erzählt habe. Wir werden sehen, dachte ich mir. Geben wir dem Ganzen etwas Zeit.
Zu der Zeit hat mich auch ein Kollege aus der BVDW-Gruppe „Mobile gefragt, ob ich an dieses „Responsive Web
als Lösung für mobile Geräte glaube. Ja, tat ich! Und das tue ich immer noch. Vielleicht nicht für Webseiten die 100 % die Vorteile einer Gerätegruppe ausloten wollen, für die, die zu 99,9 % Informationen darstellen und Dinge verkaufen wollen ist responsives Webdesign eine geniale Lösung.
Ich wünschte ich hätte schon damals mehr darüber geschrieben, als ich meine erste, noch sehr unbeholfen umgesetzte, responsive Seite – zu sehen in Abb. 1.1 – am 22. Juni 2010 online stellte und nicht wusste, dass es für meinen Ansatz schon einen Namen gab. Der namensgebende Text von Ethan Marcottes „Responsive Web Design¹ auf „a list apart
war zu dem Zeitpunkt noch keinen Monat alt und mir nicht bekannt.
Abb. 1.1
Schematische Darstellung meiner ersten responsiven Website in der Version vom 22. Juni 2010
Zeit ist seitdem viel ins Land geflossen. So viel, dass mein damals geplanter Nachwuchs nun schon vier Jahre alt ist. Meine Befürchtungen, in meinem Jahr Babypause würde sich alles rasant weiterentwickeln, haben sich nicht bewahrheitet. Lediglich die CSS-Technik „Frameset" hat sich 2014/2015 zu einer ernst zu nehmenden Layout-Technik entwickelt, die jedoch, ebenso wie viele andere CSS-Techniken, die es inzwischen gibt, zu dem Zeitpunkt, zu dem sie einsatzbereit war, kaum mehr gebraucht wurde, weil sich Web-Konzepter und Designer damit abgefunden haben, was geht und was nicht. Es lässt sich immer wieder beobachten, dass Techniken zunächst herbeigesehnt werden, jedoch nicht genutzt werden, wenn sie möglich wären, weil das Ziel, das mit ihnen erreicht werden sollte in der Zwischenzeit aus der Mode gekommen