Star-Rating mit CSS

Überall dort, wo Beiträge, Dateien oder Videos bewertet werden können, hat man meist die Möglichkeit, in mehreren Stufen zu bewerten (beispielsweise fünf). Nicht selten werden diese grafisch als Sterne dargestellt – je mehr dieser Sterne farbig sind, desto höher die Bewertung. Beispielhaft sei hier das Rating der Videos auf Youtube genannt, das sich direkt unter den Videos befindet. Ein solches Star-Rating (mit Kreisen statt Sternen) werden wir in diesem kleinen Tutorial erschaffen, allerdings komplett ohne JavaScript, nur mit ein bisschen HTML und CSS. Allerdings sparen wir uns die eigentliche Funktionalität dahinter und konzentrieren uns nur auf die Darstellung, die in der Demo des Endergebnisses zu sehen ist. Lies den Rest des Artikels »

CSS vs. Tabellen

Als ich vor rund zehn Jahren anfing, mich erstmals mit HTML auseinanderzusetzen, sah die Welt des Webdesigns noch völlig anders aus. Und eigentlich meine ich nicht das Aussehen, sondern vielmehr den zumeist unsichtbaren Aufbau dahinter, denn CSS steckte noch in den Windeln und wer etwas auf sich hielt, nutzte sogenannte blinde Tabellen, um komplexere und mehrspaltige Layouts umzusetzen. Damals war der Internet Explorer noch der beliebtere Browser, während Netscape 4 mit Darstellungsproblemen zu kämpfen hatte, insbesondere was Tabellen mit Hintergrundbildern betraf.

Doch das änderte sich mit der Zeit. CSS wurde wichtiger und ersetzte erst nur einige font-Tags und avancierte immer mehr zum Spiel- und Werkzeug der Webdesigner; mit der Zeit wurden Tabellenlayouts verdrängt. Heute sind sie zumeist sogar verpöhnt, weil (X)HTML als semantische Auszeichnungssprache auch semantisch korrekt benutzt werden will. So oder ähnlich wird zumindest argumentiert. Doch nicht zuletzt ist es nun der Internet Explorer, der vielen Entwicklern beim Umsetzen von CSS-Layouts Kopfschmerzen bereitet – insbesondere dann, wenn man erstmalig damit konfrontiert wird. Wären Tabellen nicht einfacher? Lies den Rest des Artikels »

Buch: Fortgeschrittene CSS-Techniken

Gestern stolperte ich beim Surfen durchs Internet zufällig über ein Gewinnspiel vom Webstandard-Blog, bei dem das Buch Fortgeschrittene CSS-Techniken verlost wird. Teilnehmen kann dabei jeder, der einen eigenen Blog oder dergleichen hat und einen Eintrag über dieses Gewinnspiel bis zum 19.09. schreibt. Ja richtig, hiermit nehme auch ich daran teil, aber erst, nachdem ich einen Eindruck vom Buch gewonnen hatte. Lies den Rest des Artikels »

CSS-Bugs des Internet Explorers

Wer schonmal ein komplexeres Layout mit Cascading Stylesheets umsetzen musste, dem wird vielleicht aufgefallen sein, dass der Internet Explorer an manchen Stellen ein seltsames Verhalten zeigt, das Layout zerlegt oder anderweitig Fehler in der Darstellung hat. Vor knappen zwei Jahren kam ich erstmals damit in Berührung und ich fand Möglichkeiten, die Probleme zu beseitigen. Anhand eines Beispiels möchte ich einige Details erläutern. Lies den Rest des Artikels »

Ein flexibles, SEO-gerechtes Layout

Nachdem ich kürzlich darüber schrieb, ob ein flexibles oder statisches Layout besser wäre, will ich jetzt mit etwas praktischerem fortfahren und die Umsetzung des Grundgerüsts einer dynamischen Seite mittels CSS erläutern. Dass ich keine Tabellen zur Erstellung des Layouts einsetzen will, muss ich hoffentlich nicht erklären. Lies den Rest des Artikels »