Viele Formular-Elemente widersetzen sich hartnäckig allen Annäherungen seitens CSS – sehen wir mal von border-radius und font-size für Eingabefelder vom vom Typ Text ab.

SVG-Grafiken aus Inkscape und Adobe Illustrator sind vollgepackt mit Attributen, die für die Anzeige in Webseiten nicht gebraucht werden und die Ladezeit verlängern. Wie läßt sich SVG optimieren?

Pseudo-Elemente wie ::before und ::after ersparen zusätzliche HTML-Elemente, aber früher galt, dass Javascript nicht auf Pseudo-Elemente wie ::before und ::after zugreifen kann, weil sie nicht im DOM liegen. Javascript querySelector und getComputedStyle bilden zusammen eine Lösung.

Webfonts lassen sich auf die Zeichen reduzieren, die tatsächlich benötigt werden, und dann wie Bilder als Base64 codieren. Dabei entsteht eine Zeichenkette, die direkt in die @font-face-Regel eingesetzt wird.

Ein Verlauf oder Gradient wird durch CSS background-image erzeugt, aber für Text hat CSS nur color zu bieten. CSS color hingegen weist einem Text Farbe zu, aber keinen Verlauf, denn gradient ist ein Wert für die Eigenschaft background-image

Brackets ist ein Code-Editor, programmiert in HTML und Javascript. Dennoch ist Brackets eine Desktop-Anwendung. Adobe hat das Projekt ins Leben gerufen, heute wird es von seiner eigenen Community auf Github weitergeführt.

Das SVG image-Element bettet Bilder in ähnlicher Weise wie das HTML-img-Tag in eine SVG-Grafik ein. Das Bild kann eine Bitmap (jpg, png, gif) oder eine weitere SVG-Grafik sein.
Genauso wie beim Einbetten von Bildern in HTML bleibt beim Einbetten von PNG und GIF die Transparenz im Bild erhalten.

Gleich mittenrein

CSS-Dateien entwickeln sich schnell zu einem brodelnden Hexenkessel. Sie wachsen, werden unüberschaubar und versanden in Redundanz. Wie behalten wir die Übersicht und wie finden wir das CSS above the fold?

Gibt es ein Gegenteil von Suchmaschinen-Optimierung? Bad Bots und Spider machen auf vielen Webseiten mehr als die Hälfte des Traffics aus und belasten einen Server in Stoßzeiten zusätzlich.

Vor gut sieben Jahren habe ich mich gefreut, dass MathMl so schön integriert war und ich mir Bitmaps für Formeln sparen konnte. Aber Google meinte „Formeln kannste googeln“ und zog MathML wieder ab. Jetzt feiert MathML in Chrome die Wiederauferstehung.

In XHTML gehörte das iframe-Tag zu den eher unerwünschten Elementen und wurde in einen eigenen Dokumententyp verbannt. Statt dessen bevorzugte XHTML das object-Tag. Mit HTML5 hat sich das Blatt zugunsten des iframe-Tags gewendet.

Formulare machen dem Benutzer mit mobilen Geräten das Ausfüllen schwer. Ohne besondere Auszeichnung durch angepasstes CSS sind die Eingabefelder mikroskopisch klein.

placeholder und label sind die wichtigsten Elemente bei der Gestaltung von Formularen, die dem Benutzer auf mobilen Geräten entgegenkommen.

Sonderzeichen werden heute dank der Webfonts zuverlässig angezeigt, selbst exotische Symbole wie Yin Yang und ein Schneemann kommen mit so umfangreichen Fonts wie Droid (sehen wir einmal von IE8 ab) auf den Monitor.