CSS: Vertikale Fly-Out-Navi mit Artikelvorschau (für WordPress)
Die Navigation meines vorherigen WP-Themes beinhaltete eine interessante Lösung, um Kategorien als Menüpunkt zu nutzen und beim hovern die jeweils aktuellen Artikel anzuzeigen. Da ich dieses Theme nun ja nicht mehr nutze, möchte ich die Navigation hier einmal vorstellen. In diesem Artikel gibt es eine HTML/CSS-Datei sowie das PHP-Snippet für WordPress separat.
Unicode Characters als Listenpunkte? Thierry Koblentz zeigt wie es geht
Irgendwie habe ich darauf (zu) lange gewartet. Sollte mal ein anderes Zeichen als Listenpunkt verwendet werden als die übliche Palette zu bieten hat, musste ich immer auf eine Grafik zurück greifen. Neulich (um genau zu sein am 19. März 2011) rückte Thierry in einem Smashing Magazine Post mit einer Lösung raus. Ich habe es jetzt [...]
HTML5 und CSS3: Immer nur am Ball bleiben reicht nicht…
…man muss auch mal spielen.Der Ansturm hat begonnen. In den letzten Monaten wird man mit neuen Experimenten und Erkenntnissen in Sachen HTML5 und CSS3 bombadiert. Die Entwicklung ist rasant – unzählige neue Veröffentlichungen, Ansätze und Ideen werden von der Netzgemeinde kontrovers diskutiert. Dieser Beitrag beschreibt keine Techniken, ich zeige vielmehr ein paar Experimente mit CSS3 und [...]
Kurz notiert: Platz 16 beim CSS Off von CSS-Tricks
Als Chris Coyier am 10.02.2010 zum “The Great CSS Off” aufrief liess ich mich nicht lumpen. Immerhin konnte man zwei Fachbücher eigener Wahl sowie Ruhm und Ehre gewinnen. Obendrein diente das ganze noch einem guten Zweck, denn für jede Einsendung erklärte sich Chris bereit, 3$ an ein Haiti-Hilfsprogramm zu spenden. Die Aufgabe war es, aus [...]
CSS: F.I.M. (Fake Image Map) – eine CSS-Image-Map ohne Gif
Ein Kommentar zu meinem letzten Artikel über die F.I.M. hat mich dazu gebracht, den Aufbau noch einmal gründlich zu überdenken und das Resultat ausgiebig zu testen. Somit kann ich jetzt eine echt gute Alternative vorstellen…
CSS: Highlighting Boxes. Produkte hervorheben mit :hover
In den unendlichen Tiefen des World-Wide-Webs bin ich neulich auf einen Artikel über Product Highlighting mittels CSS und Prototype.js gestossen. Interessante Geschichte, dachte ich mir, aber geht das auch ohne Javascript?Also fing ich an zu experimentieren…
CSS: Ein vertikales und/oder horizontales Dropdown-Menü
Die Suche hat ein Ende! Hier gibt’s ein wirklich sehr leicht anzupassendes Dropdown-Menü ohne JavaScript. Es basiert auf einer herkömmlichen Liste mit Unterlistenpunkten und kann durch die Veränderung von nur zwei Attributen im Stylesheet in eine horizontale bzw. vertikale Navigation umgewandelt werden.
HTML: Was bedeutet eigentlich Semantik?
Die Trendwende hat bereits stattgefunden. Das W3C und andere Institutionen haben jahrelang daran gearbeitet ein altes Bewusstsein in die Köpfe der Webdesigner zurück zu bringen – und sie haben es geschafft. Die Semantik ist wieder da! Aber was bedeutet Semantik für das Webdesign und wie wichtig ist sie wirklich?
HTML: form action. Mehr über Formulare in Aktion
Formulare sind auf Internetseiten selbstverständlch. Wir benutzen sie fast täglich. Schauen wir uns doch mal so ein Formular genauer an. Wie wird es aufgebaut und wie sehen die einzelnen HTML-Komponenten aus? Hier gibt’s ein Demo.
CSS: F.I.M. – Fake Image Map. Eine Alternative zur echten Image Map
Alle, die sich schon einmal fragten, ob und wie man ein Background-Image verlinken kann ohne auf CSS3 warten zu müssen, sollten diesen Post einmal lesen. Die Antwort ist simpel, bulletproof und valide! Hier gibt’s einen Workaround…
HTML: Background vs. Image-Tag. Bilder im Zeitalter der Handhelds
Ein Layout ohne img-Tags ist wesentlich flexibler und die einzige Möglichkeit das Design (CSS) komplett vom Inhalt (HTML) zu trennen. Gerade in den Zeiten der Optimierung für neue internetfähige Ausgabegeräte ein wichtiger Aspekt. Sind die Tage des Image-Tags gezählt?
HTML: Die populärsten Web Fonts im Vergleich
Es gibt ein paar Tausend Fonts da draußen, doch nur wenige eignen sich für das Internet. Die Auswahlkriterien liegen auf der Hand: Verfügbarkeit, Darstellung, Lesbarkeit, Zweck. Einen Überblick gibt es hier.