UID:
kobvindex_ERBEBC6382506
Umfang:
1 online resource (513 pages)
Ausgabe:
2
ISBN:
9783836261029
Anmerkung:
Intro -- Vorwort -- 1 Die richtige Ausrüstung -- 1.1 Was Sie für diesen Kurs brauchen -- Stift und Papier -- Software und Tools zum Visualisieren und Entwickeln -- Browser zum Testen -- FTP-Software -- Für Fortgeschrittene: Arbeitsschritte automatisieren -- 1.2 Denken Sie wie ein Webdesigner! -- Webdesigner sind kreativ -- Webdesigner kennen das Web -- 1.3 Die wichtigsten Technologien -- Inhalte mit HTML -- Gestaltung mit CSS -- Verhalten mit JavaScript -- Dynamische Inhalte mit PHP und anderen Sprachen -- 1.4 Zusammenfassung -- 2 Grundlagen von gutem Webdesign -- 2.1 Usability und User Experience -- Konventionen und Faustregeln für gute Usability -- Usability und Inhalte -- Mehr als Usability: User Experience -- 2.2 Accessibility - Zugänglichkeit und Barrierefreiheit -- Warum Accessibility wichtig ist - immer -- Hilfsmittel für behinderte Menschen -- Barrierefreiheit per Gesetz -- Initiativen für Barrierefreiheit -- Accessibility und Webstandards -- ARIA Roles -- Accessibility und Inhalte -- 2.3 Responsive Webdesign -- Möglichkeiten für mobile Websites -- Mobile First und Desktop First -- Technische Grundlagen von Responsive Webdesign -- Meta-Viewport-Element -- Media Queries -- 2.4 Die Entstehung einer Website -- Das Was: Websites als lebendige Design-Systeme -- Das Wie: neue Workflows für Websites -- 2.5 Grundlagen für modernes Webdesign -- 3 Konzeption & -- Design -- 3.1 Phasen von Konzeption und Kreation -- 3.2 Zielgruppe definieren und Nutzer kennenlernen -- Nutzer kennenlernen -- Personas -- 3.3 Das Konzept entwickeln: Analysephase -- Recherche -- Richtung der Gestaltung festlegen -- Marktanalyse -- Design-Sprachen und -Stile recherchieren -- Zielformulierung -- 3.4 Der Weg zur richtigen Idee - Kreativitätstechniken -- Brainstorming -- Morphologische Matrix -- The Four R's -- Gegensatzpaare -- Kreativität und Druck
,
3.5 Content-Strategie -- Inhalte sammeln und bewerten -- Informationsarchitektur festlegen -- Struktur von Inhalten festlegen -- Seitentypen festlegen -- Content-Prototypen -- 3.6 Ideen ausarbeiten und visualisieren -- Scribbles: schnelle Skizzen -- Papier-Prototypen: Mehr Low-Budget geht nicht -- Moodboards -- Style Tiles -- Element Collages -- 3.7 Ideen bewerten -- Wireframes: strukturelle Skizzen -- Prototypen: Interaktionen testen -- Pattern Library & -- Styleguides -- Konzeption mit einer Projektmatrix auf den Punkt bringen -- Ideen bewerten -- 3.8 Umsetzung und Ausarbeitung -- Design-Entwürfe oder Mockups -- HiFi-Prototypen: im Browser entscheiden -- 4 Layout und Komposition -- 4.1 Die Grundlagen moderner Gestaltung -- Wahrnehmungsgesetze -- Formen -- 4.2 Gestaltungsregeln für das Web -- Klassische Gestaltungsregeln -- Erkenntnisse aus der Nutzerforschung -- Psychologische Effekte -- 4.3 Das Box Model in CSS -- Maßeinheiten in CSS -- Breite und Höhe -- Innenabstand -- Rahmen -- Außenabstand -- Das Box Model steuern -- Box Model bei Inline-Elementen -- Umgang mit zu viel Inhalt -- 4.4 Layouts mit CSS -- Elemente per float links und rechts fließen lassen -- Elemente frei mit »position« anordnen -- Anzeige mit »display« steuern -- 4.5 Raster - Inhalte im Layout anordnen -- Pro und Kontra von Rastern -- Inhalte im Raster verteilen -- Aus Rastern ausbrechen -- Exkurs: Grundlinienraster -- 4.6 Layout im Responsive Web -- Typen von Layouts -- Der Breakpoint, das (noch) unbekannte Wesen -- Breite ist nicht alles -- Strategien für responsive Darstellungen -- 4.7 Raster in CSS3 -- Statische Raster in CSS -- Einfaches responsives Raster in CSS -- Frontend-Frameworks und fertige Grids -- Flexbox -- Grid Layouts -- 5 Typografie im Web -- 5.1 Was ist Typografie? -- Anatomie einer Schrift -- 5.2 Kategorien von Schriften
,
Antiqua-Schriften oder Serifen-Schriften -- Grotesk oder serifenlose Linear-Antiqua -- Schreibschriften -- Schriften für Lifestyle und Postmoderne -- Computerlesbare Schriften -- Hybridschriften oder moderne Klassiker -- 5.3 Websichere Schriften -- 5.4 Webfonts -- Kleine Geschichte der Webfonts -- Aktuelle Lizenzmodelle für Webfonts -- Webfonts einbinden -- Angriff des FO(U/I)T -- 5.5 Die richtige Schrift auswählen -- Die Funktionen von Schrift -- Auf die richtigen Assoziationen achten -- Recherche zur gewählten Schrift -- Schriftfamilien -- Performance -- Visuelle Effekte -- 5.6 Texte in HTML und CSS gestalten -- Typografische Auszeichnungen -- Schriftgröße -- Laufweite -- Zeilenlänge -- Textschatten -- Textspalten -- Textausrichtung -- Zeilenabstand -- Mikro-Weißraum -- 5.7 Detailtypografie -- Sonderzeichen in HTML -- Sonderzeichen in deutscher Sprache -- Sonderzeichen auf der Tastatur -- Typografische Anführungszeichen -- Gedankenstrich, Apostroph und Ellipse -- Silbentrennung und geschützte Leerzeichen -- Gliedern von Zahlen -- Fortgeschrittene Detailtypografie -- 6 Navigationen& -- Interaktionen -- 6.1 Grundlagen nutzerfreundlicher Interaktionen -- Usability und Interaktionen -- Accessibility und Interaktionen -- 6.2 Links -- Usability- und Accessibility-Konventionen von Links -- 6.3 Buttons -- Usability und Accessibility gewährleisten -- Buttons gestalten -- 6.4 Navigationen -- Visuelle Gestaltung und Positionierung von Navigationen -- Interaktionen -- 6.5 Responsive Navigationen -- Grundregeln responsiver Navigationen -- Responsive Navigation mit stets sichtbaren Menüs -- Responsive Navigation mit versteckten Menüs -- Lösungsstrategien responsiver Navigationen mit versteckten Menüs -- Responsive Navigationen, die sich anpassen -- 6.6 Formulare -- Formulare in HTML5 -- Formulare, die man gerne ausfüllt -- 6.7 Animationen
,
Bessere User Experience durch Animationen -- Gestaltungstipps für Animationen der Benutzeroberfläche -- Animationen als inhaltliches Gestaltungsmittel -- Umsetzung in CSS -- Zugängliche Animationen -- 7 Farbe im Web -- 7.1 Kleine Farblehre -- Grundbegriffe: Farbton, Helligkeit, Sättigung -- Farbtemperatur -- Primär-, Sekundär- und Tertiärfarben -- 7.2 Farbkontraste -- Simultankontrast -- Komplementärkontrast -- Hell-Dunkel-Kontrast -- Grey-Box-Methode -- Bunt-Unbunt-Kontrast -- Quantitätskontrast -- Warm-Kalt-Kontrast -- 7.3 Farbassoziationen -- Die Farben im Detail -- 7.4 Farbharmonien -- Nur eine Farbe -- Mehrere Farben kombinieren -- 7.5 Farben und Farbschemata für Webseiten -- Erste Schritte zu einem Farbschema -- Der Winkelkontrast - Farben im Farbkreis -- Die Methode der maximalen Kontraste -- Stile und Vorbilder nutzen -- Mit Assoziationen zu einem Farbschema -- 7.6 Farben am Monitor und im Web -- Additive und subtraktive Farbmischung -- Farben in CSS angeben -- Verläufe in CSS3 angeben -- Barrierefreiheit und Usability - auch bei der Farbwahl -- 8 Grafiken, Bilder und Multimedia -- 8.1 Tipps für Bildwahl und Bildgestaltung -- Fotografie oder Illustration? -- Mit Bildern informieren -- Bilder mit Texten kombinieren -- Aufmerksamkeit mit Bildern steuern -- Emotionalität über Bilder herstellen -- Hero-Images -- Bildwirkung -- Perspektiven -- Fotografische Ästhetik -- 8.2 Freie Grafiken und Bilder verwenden -- Bilder als Zitate verwenden -- Portale mit freien Bildern -- Gemeinfreiheit und Public Domain -- Creative-Commons-Inhalte verwenden -- 8.3 Grafiken und Bilder einkaufen -- 8.4 Bilder für das Web optimieren -- Export-Dialoge fürs Web -- Das GIF-Format -- Das JPG-Format -- Das PNG-Format -- Bilder optimieren -- Das SVG-Format -- sRGB: den richtigen Farbraum einstellen -- 8.5 Bilder in Websites einbauen -- Inhaltliche Bilder per HTML einfügen
,
Schmückende Bilder per CSS einfügen -- 8.6 Ein Pixel ist ein Pixel … Oder? -- Geräte- und CSS-Pixel -- Hochauflösende Retina-Monitore und Pixeldichte -- Pixeldichte bei Bildern -- 8.7 Lösungen für responsive Bilder in der Praxis -- Downsampling von inhaltlichen Bildern -- Bilder flexibel machen -- Bilder mit »img« und »srcset« responsiv machen -- 8.8 Icons einsetzen und gestalten -- Wichtiges über Symbole -- Wichtiges über Metaphern -- Icons und Usability -- Stile von Zeichen -- Fertige Icons -- Grundregeln für die Gestaltung von Icons -- Favicons und Touch-Icons -- Icon-Fonts -- Icons als SVGs einbinden -- 8.9 Grafik-Vermeidungsstrategien -- Schatten mit CSS3 -- Runde Ecken erzeugen -- 8.10 Video und Audio -- Webdesign mit bewegten Bildern -- Video und Audio in HTML einbinden -- Zugänglichkeit von Video- und Audio-Inhalten -- 9 Testen und optimieren -- 9.1 Funktionalitäten sicherstellen -- Browser-Statistiken abfragen -- Testumgebung vorbereiten -- Feature-Unterstützung prüfen und reagieren -- 9.2 Usability und Accessibility testen -- Accessibility mit Tools testen -- Websites ohne CSS und Bilder analysieren -- Analytics -- Usability überprüfen -- HTML und CSS validieren -- 9.3 Performance: Ladezeiten im Griff -- Performance als Design-Entscheidung -- Eine Frage des Protokolls -- Speed-Tests nutzen -- Ungenutzten Code entfernen -- Requests reduzieren -- Dateigröße optimieren -- Webseiten so schnell wie möglich rendern -- 10 Beispielprojekt -- 10.1 Konzeption -- Analyse -- Schwerpunkte und Ansätze für die Gestaltung -- Zielformulierung -- Ideensuche -- Content-Strategie -- 10.2 Layout -- 10.3 Stimmige Helligkeiten und Makro-Weißraum mit der Grey-Box-Methode -- 10.4 Typografie -- Auswahl der Schriften -- Webfonts in Content-Prototyp einbinden -- Schriften einbetten und beurteilen -- Typografie in CSS -- Styleguide -- 10.5 Farben -- 10.6 Bilder
,
Logo und Header-Gestaltung
Weitere Ausg.:
Print version: Rohles, Björn Grundkurs gutes Webdesign Bonn : Rheinwerk Verlag,c2017 ISBN 9783836244046
Schlagwort(e):
Electronic books.
URL:
https://ebookcentral.proquest.com/lib/th-brandenburg/detail.action?docID=6382506
Bookmarklink
