Struktur und Design responsiver Webseiten auf Smartphones: Wie Sie das mobile Internet userfreundlich gestalten
()
About this ebook
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.
Related to Struktur und Design responsiver Webseiten auf Smartphones
Related ebooks
UX Design für Tablets: Eine Anleitung für User Experience, Design und Webentwicklung Rating: 0 out of 5 stars0 ratingsDas Praxisbuch Xiaomi Poco X3 Pro - Anleitung für Einsteiger Rating: 0 out of 5 stars0 ratingsUX Design für Tablet-Websites: Ein Überblick Rating: 0 out of 5 stars0 ratingsDas Praxisbuch Xiaomi Mi 11i - Anleitung für Einsteiger Rating: 0 out of 5 stars0 ratingsDas Praxisbuch Xiaomi Poco M4 Pro 5G - Anleitung für Einsteiger Rating: 0 out of 5 stars0 ratingsDas Praxisbuch Xiaomi Mi 11 Lite & Mi 11 Lite 5G - Anleitung für Einsteiger Rating: 0 out of 5 stars0 ratingsDas Praxisbuch Xiaomi 11T & 11T Pro - Anleitung für Einsteiger Rating: 0 out of 5 stars0 ratingsVirtuelle Teams und Homeoffice: Empfehlungen zu Technologien, Arbeitsmethoden und Führung Rating: 0 out of 5 stars0 ratingsDas Praxisbuch Xiaomi 12T & 12T Pro - Anleitung für Einsteiger Rating: 0 out of 5 stars0 ratingsDas Praxisbuch Xiaomi Poco M5 - Anleitung für Einsteiger Rating: 0 out of 5 stars0 ratingsDas Praxisbuch Xiaomi Poco X4 Pro 5G - Anleitung für Einsteiger Rating: 0 out of 5 stars0 ratingsVirtual Reality im Tourismus: Wie VR das Destinationsmarketing verändern wird Rating: 0 out of 5 stars0 ratingsDas Praxisbuch Xiaomi Poco F3 - Anleitung für Einsteiger Rating: 0 out of 5 stars0 ratingsDas Praxisbuch Xiaomi 13 Lite - Anleitung für Einsteiger Rating: 0 out of 5 stars0 ratingsDas Praxisbuch Xiaomi Redmi Note 10S - Anleitung für Einsteiger Rating: 0 out of 5 stars0 ratingsJournalistische Praxis: Chatbots: Automatisierte Kommunikation im Journalismus und in der Public Relation Rating: 0 out of 5 stars0 ratingsDas Praxisbuch Xiaomi Poco F4 - Anleitung für Einsteiger Rating: 0 out of 5 stars0 ratingsDas Praxisbuch Xiaomi Poco X4 GT - Anleitung für Einsteiger Rating: 0 out of 5 stars0 ratingsDas Praxisbuch Google Pixel 3a & Pixel 3a XL - Anleitung für Einsteiger Rating: 0 out of 5 stars0 ratingsDas Praxisbuch Google Pixel 8 & Pixel 8 Pro - Anleitung für Einsteiger Rating: 0 out of 5 stars0 ratingsDas Praxisbuch Samsung Galaxy M12 - Anleitung für Einsteiger Rating: 0 out of 5 stars0 ratingsDas Praxisbuch Xiaomi Poco M3 - Anleitung für Einsteiger Rating: 0 out of 5 stars0 ratingsTitel Das Praxisbuch Xiaomi Redmi 10 - Anleitung für Einsteiger Rating: 0 out of 5 stars0 ratingsBildbearbeitung & Design für Social Media: Visuelle Inhalte erstellen und optimieren Rating: 0 out of 5 stars0 ratingsDas Praxisbuch Xiaomi 12 / 12X / 12 Pro - Anleitung für Einsteiger Rating: 0 out of 5 stars0 ratingsProdukte digital-first denken: Wie Unternehmen software-basierte Produktinnovation erfolgreich gestalten Rating: 0 out of 5 stars0 ratingsAndroid Tablets & Smartphones: Der Ratgeber für Einsteiger & Senioren Rating: 0 out of 5 stars0 ratingsSchnelleinstieg App Usability: Plattformübergreifendes Design: Android, Apple iOS und Windows Phone Rating: 0 out of 5 stars0 ratingsOnline-Aufstellungen: So funktionieren systemische Aufstellungen am Bildschirm Rating: 0 out of 5 stars0 ratingsDas Praxisbuch Xiaomi Poco F4 GT - Anleitung für Einsteiger Rating: 0 out of 5 stars0 ratings
E-Commerce For You
Grundlagen des Online Marketing: Digital Marketing, SEO, Storytelling, Inbound-Marketing, Funnel Rating: 0 out of 5 stars0 ratingsSeo Guru: Suchmaschinenoptimierung für Anfänger, Fortgeschrittene und Profis Rating: 0 out of 5 stars0 ratingsDas kleine Hypnose Einmaleins - Alles was Sie schon immer über die Hypnose wissen wollten von Ewald Pipper vom Hypnoseinstitut Rating: 0 out of 5 stars0 ratingsBusiness Science: Die besten Praxis-Tipps aus den renommiertesten 132 Büchern seit 2.500 Jahren Rating: 0 out of 5 stars0 ratingsGrundlagen des Marketing: Einführung, Konzeption, Print, Online, Werbung, Branding, Media, PR, Marketingmix Rating: 0 out of 5 stars0 ratingsBusiness-Englisch beherrschen.: Business-Englisch beherrschen, #1 Rating: 0 out of 5 stars0 ratingsPsychologie im Online-Marketing: Sozialwissenschaftliche Erkenntnisse und ihre Bedeutung für Marketing und Werbung im Web Rating: 0 out of 5 stars0 ratingsIdeen Für Passive Einkommen: Financial Investments Rating: 0 out of 5 stars0 ratings30 Minuten Suchmaschinenmarketing Rating: 0 out of 5 stars0 ratingsWie starte ich mit 500 Euro ein Trading-Business? Rating: 0 out of 5 stars0 ratingsCopywriting: Überzeugende Worte, die verkaufen Rating: 0 out of 5 stars0 ratingsOnline-Marketing Konzept: Digital Marketing erfolgreich planen, umsetzen & optimieren Rating: 0 out of 5 stars0 ratingsDas E-Commerce Buch: Marktanalysen - Geschäftsmodelle - Strategien Rating: 5 out of 5 stars5/5Digital Marketing Leitfaden: Strategien für Wachstum Rating: 5 out of 5 stars5/5Bildbearbeitung & Design für Social Media: Visuelle Inhalte erstellen und optimieren Rating: 0 out of 5 stars0 ratingseCommerce Grundlagen: Der Leitfaden für den erfolgreichen Einstieg in den Online-Handel Rating: 0 out of 5 stars0 ratings30 Minuten Online-Marketing Rating: 0 out of 5 stars0 ratingsAmazon FBA Meisterung: Online Trading Rating: 0 out of 5 stars0 ratingsLinkedIn Marketing Guide 2020: Erfolgreiche Kundenakquise über Social Media — Das digitale Praxisbuch Rating: 0 out of 5 stars0 ratingsBrand management in 4 schritten: Wie Sie das Marketing Ihrer Marke am besten steuern, ihr Potenzial und ihre Wirksamkeit verbessern Rating: 0 out of 5 stars0 ratingsVerbraucherrechte beim Onlineshopping: Juristische Fallstricke erkennen und vermeiden Rating: 0 out of 5 stars0 ratingsFacebook-Marketing-Tipps: Schon nach 30 Tagen erste Ergebnisse sichtbar Rating: 0 out of 5 stars0 ratingsDropshipping: Online-Business leicht gemacht Rating: 0 out of 5 stars0 ratings
Reviews for Struktur und Design responsiver Webseiten auf Smartphones
0 ratings0 reviews
Book preview
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