Anstandsregeln für PDFs in Webseiten

Eingebettete PDFs sind beliebte Downloads in Webseiten – in erster Linie beliebt in Marketing und Kommunikationsabteilungen und den Kollegen, die für die Redaktion des Internetauftritts zuständig sind. Meine Kunden hingegen flehe ich auf Knien an: Lasset ab vom PDF auf der Homepage oder behandelt es besser. Aber wie bindet man ein PDF richtig ein und was muss ein PDF mitbringen?

Sieben Wege, SVG in HTML-Seiten zu setzen

SVG als Standalone ist klasse. Der Clou von SVG ist, dass es sich als Komponente in die wohlbekannten Techniken des Webdesigns integrieren läßt.

Formular – Eingabefelder : Datum, Email, Suche

Wenn Formulare auf mobilen Geräten landen, sind die wiederspenstigen Eingabefelder eine Bremse:

Immer wieder umschalten zur numerischen Tastatur, weil Ziffern, Sonderzeichen oder Emailadressen eingegeben werden. Mit neuen Input Types bringt HTML5 Komfort in HTML-Formulare.

@font-face – Fonts in Webseiten einbetten

Seitdem die modernen Browser @font-face in wunderbarer Harmonie unterstützen, können ladbare Fonts mit ausreichender Sicherheit in Webseiten eingebettet werden.

MathML: Formeln in HTML

MathML ist die Markup-Spache für mathematische Formeln und Ausdrücke. MathML gibt es seit 1997, aber für die nächsten 15 Jahre unterstützte kein Browser das Markup für Formeln. So verkümmerten das Formel-Markup im besucherfreien N-Raum.

Positionieren mit float oder display:inline-block?

Positionieren mit float ist der Standard im Webdesign. float ist aber auch die häufigste Ursache für Kopfschmerzen und Schwindelgefühl.

Gleich mittenrein

Directors Cut: 10 Tipps für Email-Newsletter 2018

Natürlich wäre es schön, wenn der Newsletter genauso elegant wirkt wie die Webseite. Aber ein Emailprogramm ist kein Browser und Email ist keine Webseite.

CSS mask-image: Bilder maskieren

CSS mask image bringt Masken und Freistellpfade für alle Bitmap-Formate für HTML-Elemente.

HTML table mit border-radius und border-collapse

Wenn die HTML-Tabelle bei border-radius partout keinen abgerundeten Rahmen zeigen will, ist wahrscheinlich border-collapse: collapse schuld.

CSS hyphens – Silbentrennung – Strichlein Strichlein ganz an Rand

Mit CSS3 hyphens ist die Silbentrennung in HTML-Seiten auf leisen Sohlen eingeschlichen: Endlich trennen Firefox und Safari, Chrome (nur unter Mac OS), IE11 und Edge Silben schmerzlos.

Google Fonts

Google hat Schriften für Webseiten schon 2010 aufgegriffen: die Google Fonts. Ihr direkter Einsatz ist nicht datenschutzkonform, aber der Google Webfont Helper springt ein.

Ecken und Kreise mit border-radius, box-shadow und gradient

Zum schlichten CSS border gesellt sich zur Freude vieler Webdesigner border-radius und beschreibt die Rundung der Ecken. border-radius rendert nicht nur abgerundete Ecken, sondern auch Kreise und Ellipsen.