Einfache Dinge beachten und Fehler vermeiden – modernes Webdesign richtig machen
In den letzten Jahren hat sich das Design von Webseiten stetig weiterentwickelt, vor allem durch das mobile Internet. Vieles, was vor wenigen Jahren aktuell war, gilt heute als veraltet. In diesem Blog-Post erklären wir, worauf Sie bei der Gestaltung und Entwicklung moderner Websites achten sollten.
Responsive Design nutzen
Websites nur für eine Ansicht zu entwickeln, gehört der Vergangenheit an. Heutzutage sollte das Layout flexibel sein und sich an alle Endgeräte anpassen. Tablets und Smartphones gibt es in vielen Größen, und die Website muss auf allen Geräten optimal dargestellt werden. Große Monitore sollten keine unnötig großen Ränder zeigen, und Tablets sollten nicht die mobile Ansicht laden, wenn die Desktopansicht besser geeignet ist.
Eigene Mobilversionen sind nicht mehr zeitgemäß
Früher war es üblich, separate mobile Versionen von Websites zu entwickeln, was heute unnötig ist. Diese Praxis führt zu Mehraufwand und Problemen bei der richtigen Darstellung. Moderne responsive Designs passen sich automatisch an alle Geräte an.
Fenster oder Videos nicht ungefragt über den Inhalt legen
Modal Boxes oder Pop-ups, die sich ungefragt über den Inhalt legen, stören die Nutzererfahrung. Viele Besucher möchten nur kurz Informationen nachschlagen und werden durch solche Unterbrechungen verärgert. Gleiches gilt für automatisch abspielende Videos, die den Inhalt verdecken.
Niemals Inhalte verstecken
Inhalte auf mobilen Versionen zu verstecken, ist nicht empfehlenswert. Websites werden oft auf Smartphones aufgerufen, daher sollten alle wichtigen Informationen zugänglich sein. Smarte Lösungen wie ausklappbare Sidebars oder Slider helfen, Inhalte platzsparend darzustellen, ohne sie zu verstecken.
Falsche Bildformate meiden
Mit immer höher auflösenden Displays wird die Wahl des richtigen Bildformats wichtiger. Verwenden Sie:
- JPEGs für Bilder
- PNGs für Grafiken
- SVGs für Vektorzeichnungen
Zudem können CSS3 und HTML5 Bilder in verschiedenen Auflösungen bereitstellen, um für jedes Gerät die optimale Qualität zu gewährleisten.
Die richtige Schriftart und -größe wählen
Dank moderner Webschriften müssen Sie nicht mehr auf Systemschriften zurückgreifen. Wählen Sie eine Schrift, die zum Projekt passt, und nutzen Sie das WOFF2-Format, das besser komprimiert und Ladezeiten verkürzt. Achten Sie auf einheitliche Schriftgrößen, besonders bei Überschriften, um Konsistenz zu wahren.
Lange Ladezeiten vermeiden
Schnelle Ladezeiten sind entscheidend. Verwenden Sie nur die nötigsten Plug-ins und optimieren Sie Bilder, z. B. mit dem <picture>-Element, um unterschiedliche Bildgrößen je nach Gerät auszuliefern. Achten Sie darauf, dass extern eingebundene Dateien und JavaScript die Ladezeit nicht negativ beeinflussen.
Fazit:
Wenn Sie diese Punkte beachten, steht einer modernen und erfolgreichen Website nichts im Wege – außer vielleicht einer schlechten Farbauswahl.