Peter Kröner, der Webworker und HTML5-Guru, ist vielen bereits als Autor des erstes sinnvollen HTML5-Buches “HTML5. Webseiten innovativ und zukunftssicher” oder gar durch sein Blog bekannt. Nun ist im Galileo-Computing-Verlag sein zugehöriges Video-Training namens “HTML5 und CSS3″ erschienen. Hier eine erste Rezension der DVD. Vielen Dank an Peter für die Verfügungstellung.
Geübte Webdesigner schütteln ein-, zwei- oder gar dreispaltige CSS-Layouts oft noch aus dem Ärmel. Einfache “Fixed Width”-Layouts, also Layouts mit fester Breite, lassen sich für alle gängigen Browser relativ einfach umsetzen, wenn man die Tücken um die Browserbugs und typische Problemstellungen kennt. Der bekannte Box-Modell-Fehler des Internet Explorer gilt hier als Paradebeispiel. Weiterlesen »
Wenn Sie sich beim Umsetzen von Websites per CSS schon öfter gefragt haben, welche default-CSS-Angaben bestimmte Elemente eigentlich haben, dann finden Sie im Appendix D der W3C-Spezifiktion von CSS 2.1 Antwort.
Dies ist inbesondere dann interessant, wenn Sie Formatierungseigenschaften eines Elementes entfernen möchten. Denken wir an die Verwendung einer unsortierten Liste <ul> als Menüpunktaufzählung. Wenn Sie die einzelnen Punkte horizontal nebeneinander, ohne Aufzählungszeichen und ohne Außen- oder Innenabstand darstellen möchten, können Sie im genannten Anhang nachsehen, welche CSS-Eigenschaften Sie dazu überschreiben müssen.
Beachten Sie jedoch, dass nicht jeder Webbrowser sich an die Vorgaben der vom W3C veröffentlichten Recommendation hält. Dies können Sie insbesondere dann feststellen, wenn Sie das Stylesheet Ihrer Website einmal völlig ausschalten und die Darstellung des reinen Markups in den verschiedenen Browsern vergleichen.
Für Webdesigner ist diese Seite auf jeden Fall ein Bookmark wert.
Hyphenator ist ein Google Code Projekt, das per JavaScript eine Silbentrennung in die eigene Website bringt. Einfach API in die Seite einfügen und Silbentrennung starten:
<script src="http://hyphenator.googlecode.com/svn/trunk/Hyphenator.js" type="text/javascript"> </script> <script type="text/javascript"> Hyphenator.run(); </script>
Jetzt muss man nur noch den Elementen der Seite, auf die die Silbentrennung angewendet werden soll, die CSS-Klasse class="hyphenate" zuweisen. Explizit verhindern lässt sich die Trennung per class="donthyphenate".
Web 2.0 Verläufe im Text per CSS – ohne Flash oder eingebettes Bild unmöglich?
Nicht mit Hilfe dieses CSS-Tricks: Das Geheimnis ist in den Tag um den Text, z.B. <H1> am Anfang einen weiteren <span>-Tag einzufügen: Weiterlesen »
Die Website “CSS Trick” listet in einem interessanten Beitrag typische CSS-Bugs des Internet Explorers auf, mit denen man sich als Webdesigner leider ständig konfrontiert sieht. Für ein Nachschlagewerk wohl zu wenig ausführlich, aber um sich die Bugs einmalig anzusehen und diese zu verstehen lesenswert. Zumal CSS Tricks gleich Links zu den entsprechenden Lösungen mit anbietet.
Wenn einem diese leidigen Fehler des Internet Explorers bewusst sind, erspart man sich bei der Umsetzung von Designs in Markup und CSS viel Zeit: