kulturbanause Blog

Responsive Design, WordPress, Konzeption, HTML, CSS, JS & UX/UI …


Was man als Web-Nutzer und -Entwickler gegen AMP tun kann

AMP ist ein Component Framework zur Gestaltung von Web-Inhalten und wird von Google in den Suchergebnissen bevorzugt. Gestartet als Lösung für schnellere mobile Websites steht AMP mittlerweile stark in der Kritik. Es wird als weiterer Versuch von Google gewertet, das Internet nach seinen eigenen Geschäftsinteressen zu gestalten.

Marko Saric liefert in seinem Artikel gute Gründe und Vorschläge, um gegen AMP vorzugehen. Diese basieren neben netzpolitischen Überlegungen vor allem auf dem Ermöglichen einer besseren User Experience.

Direkter Link zum Artikel

Global Design Survey 2019

An der globalen Designumfrage von Dribbble haben sich mehr als 17.000 Designfachleute beteiligt und Fragen zu Karrieretrends, Gehältern und den nächsten Schritten in ihrer Designdisziplin beantwortet. Das Ziel der Umfrage war, die Design-Community besser zu verstehen und zu verstehen, wie und wo sie wächst.

Die Teilnehmer aus aller Welt gaben bemerkenswerte Einblicke zu Demografie, Karriere und Karriereförderung, Einstellungstrends, Gehältern, Designfähigkeiten, Kompetenzaufbau, Remote-Arbeit und freiberuflicher Tätigkeit.

Hier findet ihr die Umfrageergebnisse von Dribbble.

Übersicht aller CSS-Eigenschaften nach Verbreitung

Der Browser Chrome sammelt bekanntermaßen Daten von Websites und erstellt daraus Statistiken. Eine solche Statistik wird im Chrome Plattform Status veröffentlicht und zeigt, welche CSS Eigenschaften wie häufig auf Websites im Einsatz sind. Ganz vorne mit dabei sind u.a. die Eigenschaften width, height und display mit über 90% Verbreitung. Auf den letzten Plätzen rangieren mit weniger als 0.1% Verbreitung eher unbekannte Features wie inset-block-startborder-inline oder syntax.

Chrome Plattform Status: CSS usage

Optimieren der Leistung von Google Fonts

Google Fonts sind einfach zu implementieren, können sich jedoch erheblich auf die Ladezeiten einer Seite auswirken. Google unternimmt bereits einige Anstrengungen, um die Bereitstellung der Schriftdateien zu optimieren. Dennoch können bei der Implementierung weitere Verbesserungen vorgenommen werden.

Das Smashing Magazine zeigt, was in Sachen Ladezeit empfehlenswert ist und wie Google Fonts optimal geladen werden können.

Direkter Link zum Artikel

Effizientes Laden von Third-Party-JavaScript

Das Verwenden von JavaScript von Drittanbietern, bspw. von einem CDN (Content Delivery Network), hat diverse Vorteile. Ein CDN ist im Normalfall schneller als der eigene Server, was die Ladezeiten verringert. Darüber hinaus wird der eigene Server entlastet, wenn Skripte von externen Quellen geladen werden.

Um das Laden von Third-Party-JavaScript effizienter zu gestalten, können die Attribute »async« und »defer« verwendet werden. Den Einsatz dieser Attribute beschreibt Milica Mihajlija in ihrem Leitfaden zum effektiven Laden von Drittanbieter-Skripten.

Direkter Link zum Artikel

UX-Probleme mit Dropdowns

Platzersparnis und erprobte Funktionalität, das sind in Formularen die vermeintlich größten Vorteile von Dropdowns oder Select-Elementen. Besonders im mobilen Kontext verursachen diese UI-Patterns häufig eine erschwerte Nutzung für den Benutzer.

Der ausführliche Artikel von Josh Wayne zeigt anschaulich, welche Grundüberlegungen der Wahl des Elements vorausgehen sollten und welche Lösungen wann am besten geeignet sind.

Direkter Link zur Seite

Ebenso lohnend ist der dort verlinkte Artikel »Responsive Design: Why and how we ditched the good old select element«. Hier führen die Beschränkungen des Select-Elements zu ganz neuen Ansätzen.

Die CSS-Eigenschaft »font-size-adjust«

Mit »font-size-adjust« wird bei Verwendung mehrerer Schriftarten die Höhe der Kleinbuchstaben angepasst, sodass diese gleich groß dargestellt werden. Das kann Lesbarkeit und visuelle Darstellung verbessern.

Wesentlich für die Nutzung von »font-size-adjust« ist der sogenannte Aspektwert. Wie man diesen ermittelt sowie alles Weitere zu »font-size-adjust« beschreibt der Artikel auf Sitepoint im Detail. Der Praxiswert bemisst sich wie so oft stark durch den Browser-Support.

Direkter Link zum Artikel