Css | Sebastian Bauer

5Feb/080

CSS Sprite Generator

Bei der Performance Optimierung einer Webseite können Image / CSS Sprites sehr hilfreich sein. Das manuelle Erzeugen ist aufwändig, so dass man am besten zu einem entsprechenden Tool greift. Hier lohnt ein Blick auf den CSS Sprite Generator von Edward Eliot und Stuart Colville.

Die einzelnen Grafiken müssen in einem ZIP-Archiv gepackt vorliegen. Neben der Größe der Roh-Bilder, dem Abstand der Bilder im Sprite und dem gewünschten Bildtyp (PNG, GIF, JPG) können auch noch Angaben zum dazugehörigen CSS gemacht werden.

Der Quellcode ist bei launchpad veröffentlicht.

veröffentlicht unter: Tipps & Lösungen keine Kommentare

30Jul/070

Webentwicklung: Performance Optimierung durch Image Sprites

Auch wenn die Internetanbindungen immer breitbandiger werden ist die Performance stets ein wichtiges Thema bei der Entwicklung von Webanwendungen. Eine relativ einfache Möglichkeit für mehr Geschwindigkeit zu sorgen ist die Reduzierung der Zugriffe auf den Web-Server. Das könnte bedeuten, dass man möglichst wenige CSS- oder JavaScript-Dateien in seine Seiten einbindet. Aber auch der Einsatz vieler Grafiken kann das Laden stark verlangsamen. Abhilfe schaffen hier Image Sprites .

veröffentlicht unter: Tipps & Lösungen weiterlesen

3Nov/060

Webdesign: Internet Explorer 6 zeigt Inhalte nicht an

Noch immer arbeite ich am Layout meiner Seiten welches ich intensiv mit der Hilfe von CSS realisiere. Hierbei stoße ich immer wieder auf interessante Effekte bei der Darstellung in verschiedenen Browsern. Getest wird im FF 1.5, Opera 9, IE6 und IE7.

Empfehlenswert ist es, das Design zunächst im FF und Opera zu testen und später die Probleme des IE auszubügeln. Hierbei hat mich heute der IE6 stark erstaunt. Einige Inhalte (Text) wurden einfach nicht angezeigt. Mit der Maus konnte ich die Buchstaben markieren - es war nur nichts sichtbar. Im Xhtmlforum wurde mir schnell geholfen.

Elemente ohne Layout werden vom IE wohl sehr eigenwillig dargestellt. Ein einfaches

position: relative

bei den entsprechenden Elementen schaffte sofort Abhilfe.

veröffentlicht unter: Tipps & Lösungen keine Kommentare

29Okt/060

Layouts mit CSS

Bisher habe ich Seitenlayouts immer mit Tabellen gebaut. Dabei hab ich auch immer das gewünschte Ziel erreicht. Jetzt möchte ich aber auch in diesem Bereich mit der Zeit gehen und stelle alles auf CSS-Layouts um. Ich muss sagen, dass der Code für das rohe Gerüst sehr viel übersichtlicher geworden ist.

Allerdings ist es zu Beginn eine wirkliche Herausforderung, da man schließlich auch die gängigsten Browser unterstützen möchte. Dieser Blog ist bereits mit dem neuen Layout ausgestattet. Fertig ist es jedoch noch nicht. Jetzt geht es an die Feinheiten.

Gute Foren zu dem Thema habe ich auch schon entdeckt: Xhtmlforum, CSSCreator

Weitere Links: Vorsprung durch Webstandards, CSSplay, HTML Dog, Open Source Web Design, CSS-Technik, Layouts, CSS Layout Technique (Glish), CSS Web Layouts, strictly CSS, Dr. Web Weblog, CSS Library