Inhalt, Text und Bild.
Ein Plan, wie alles zusammenpasst.
Gute Bilder, klare Worte
Eigentlich braucht es wenig, aber das Richtige. Und dazu hilft der Blick von aussen, das Auge für das Wesentliche. Weg mit dem Ballast, so findet sich alles leichter. Wir schärfen Ihr Auge dafür und helfen Ihnen bei der Auswahl. Die Arbeit mit Textrastern als Strukturvorgabe dient der einfachen Erfassung von Titeln und Texten.
Die strukturierten Inhalte werden durch uns navigatorisch verlinkt und mit Metatags versehen. Kurze Klickwege führen rasch zum gesuchten Resultat. Zudem empfehlen wir, eine einfache, modale Suchfunktion einzurichten. Dabei werden Texte und die Kategorienstruktur durch das CMS indexiert und durch dynamische Stichwortsuche ansteuerbar gemacht.
Nun können wir uns mit der visuellen Gestaltung befassen.
Visuelles Design.
Bilder, Typografie,
Layout, Form und Farbe.
Schön – eine Frage der Perspektive.
Es gibt technische Schönheit:
Plattform- und Browserkompatibilität, saubere Codierung, suchmaschinenfreundliche URL's oder ladezeiten-optimierte Inhalte.
Und visuelle Schönheit: aussagekräftige, hochauflösende Bilder, packende Videos, passende Farb- und Formenwahl, ausgewählte Typografie und eine logische und intuitiv bedienbare Benutzeroberfläche.
Der Webdesigner muss die Divergenz zwischen visueller und technischer Umsetzung austarieren. Dafür werfen wir unsere Erfahrung aus über 200 Webprojekten in die Waagschale – für die beste Lösung.
Eine Frage des Formats
Webspezifische Dateiformate und Nomenklatur
Es gibt eine Vielzahl webspezifischer Dateiformate. Dazu gehören die bekanntesten JPEG und PNG für Bilder und Grafiken oder MPEG für Videos. Die Inhalte müssen mit geeigneten Werkzeugen korrekt konvertiert und gespeichert werden. Die verlustarme Kompression von Bildern trägt wesentlich zu kurzen Ladezeiten und nebenher zu besseren Suchmaschinenrankings bei. Die Anforderungen an die Bildqualität haben sich linear zur technischen Entwicklung von Bandbreiten und Bildschirmauflösungen erhöht. Moderne OLED-Displays erreichen heute weit über 5k Pixel. Um diese Pixeldichte bedienen zu können, müssen Fotos in entsprechender Mindestauflösung bereitgestellt werden. Damit die Zwickmühle «Ladezeit/Bildqualität» minimiert werden kann, benutzen wir Konzepte des «Responsive Designs».
Exotische Dateiformate und falsche Dateiendungen
Inhalte werden in Standard-Webbrowsern dargestellt, die definierte Dateiformate voraussetzen. Dateinamen bilden auch den letzten Teil eines Pfades, zum Beispiel «../images/portraitfotos/foto-01.jpg».
Weil Pfade aus exotischen Sonderzeichen und Leerschlägen fehleranfällig wären, ist eine spezifische Nomenklatur von Bedeutung.
Beispiele für korrekte Dateinamen:
A) Foto: portrait-sabrina-moser-heimleitung.jpg
B) Video: drohnenflug-winter-valbella.m4v
Responsive Design
Flexibilisierung ist Programm
Beim Responsive Design handelt es sich um eine gestalterische und technische Umsetzung des Webdesigns, wodurch die Eigenschaften des jeweils benutzten Endgeräts (Desktop/Mobile) abgefragt und adaptiert werden. Je nach Bildschirmgrösse wird die Anordnung und Darstellung einzelner Seitenlemente, beispielsweise einer gestengesteuerten Navigation auf Mobilgeräten, in einer gut bedienbaren Form dargestellt.
Mobile matters
In Europa wurden 2021 etwas mehr als die Hälfte aller Webseiten mit Mobilgeräten aufgerufen. In Afrika liegt dieser Wert bei fast 2/3 aller Seitenaufrufe. Der weltweite Durchschnitt liegt bei 55%. (Quelle: Statista)
Die Suchmaschinen bewerten heute die Mobiltauglichkeit von Webseiten zurecht als einen der gewichtigsten Faktoren. Wir bei screenwork tragen diesem Umstand durch die konsequente Umsetzung mobiler Gestaltungskriterien Rechnung.
