Guru 2.0 › 3.0

CSS ist eine einfache aber mächtige Möglichkeit webSites zu formatieren und zu designen. Aber gerade weil es so einfach ist, denken wir beim Arbeiten oft nicht nach und machen immer wieder diese gemeinen kleinen Fehler. CSS kann dich aber auch an den Rand des Selbstmords treiben: Jeder Browser interpretiert dein perfekts CSS ein wenig anders (Ich denke da an ein kleines blaues e?). Daher 10 übliche Fehler und was man dagegen tun kann.

1. Ignorierst du die Browserkompatibilität?
   Viele Webdesigner erstellen eine webSite in ihrem Lieblingsbrowser- so wie ich im Firefox – und testen sie wenn überhaupt erst nach Fertigstellung in anderen Browsern. Ein guter Test zwischendurch ist mit BrowserShots möglich und auch notwendig.
2. Jeder hat mindestens deine Bildschirmauflösung?
   Die meisten Desginer haben riesige Bildschirm, und sind stolz darauf, warum auch nicht? Aber der Großteil der Benutzer kann da nicht mithalten und muss sich mit einer niedrigeren Bildschirmauflösung begnügen. Leider geht oft das hart erarbeitet Layout bei kleinen Bildschirmen flöten. Um zu sehen welche Monitor-Auflösung die Benutzer einer Seite haben ist GoogleAnalytics eine wundervolle Sache.
3. Ich kann alles und brauche keine Hilfe!
   Die Existenz von css-Frameworks wird oft ignoriert. Natürlich entwickeln wir gerne von Null weg. Aber ist das sinnvoll? Es gibt doch wirklich gut ausgetestete Frameworks wie: Blueprint oder 960 CSS. Gerade der Einsatz von fertigen Lösungen spart viel Arbeit und erhöht die Produktivität.
4. Benutze nie generische Klassen!
   Es ist doch klar: Jeder Stil wird auf eine ID oder einen Tag gelegt. Aber derEinsatz von generischen Klassen wie .right { text-align: right;} oder .bold {font-weight: bold;} würde einiges an css-Klassen und auch Arbeit sparen.
5. HTML wird nicht überprüft!
   Eigentlich ist es so: Wir können css-Fehler nicht finden oder das css überprüfen, solange unser HTML-Code nicht korrekt ist. Oft sind es die kleinen Fehler: Ein nicht geschlossener Tag oder ein Tippfehler im class-Attribut und schon geht alles schief. Zuerst muss der HTML-Code komplett fehlerfrei sein, bevor wird fortfahren. Ein guter Ansatz ist der W3C Markup Validation Service dafür.
6. CSS wird nicht überprüft!
   Klar, warum sollten wir etwas überprüfen,das wir perfekt können. Die paar Attribut, Klassen und Werte haben wir ja allemal im Kopf. Aber solange das css nicht fehlerfrei ist, brauchen wir uns über Designs keine Gedanken machen. Aber ein valides css ist oft schon sehr browserkompatibel und ist auch seltener defekt. Schaut mal bei W3C Css-Validator nach.
7. Damit das Design stimmt brauche ich einen Super-Hintergrund!
   Gerade die immer größer werdenden Auflösung brauchen riesige Hintergrunddateien, so 5.000 x 3.000 Pixel sollten es schon sein. Klar der Benutzer hat ja Zeit und auch die notwendige Bandbreite, das herunterzuladen. Besser ist es jedoch eine paar Byte große Grafik zu erstellen und diese mit css endlos zu wiederholen.
8. Es gibt nur css!
   Sobald man eine neue Technologie (kennen)lern, will man sie natürlich einsetzen. CSS wird dann für jeden und alles eingesetzt, egal ob Liquid oder Fixed-Layout und auch gleichgültig ob es sinnvoll ist. Denkt daran: CSS soll die Entwicklungsarbeit beschleunigen. Sobald es uns behindern anfängt, sollte man eine andere Technologie einsetzen.
9. Inline-CSS ist super!
   Aber nur wenn man schnell etwas ausprobieren will. Websites mit Inline-CSS zu designen ist eine Todsünde. Es ist nicht wartbar und auch nicht mehr beherrschbar. Natürlich kann man schnell mal was ausprobieren, aber wenn alles paßt fliegt das “Inline” raus und wird in ein externes-CSS eingebaut. Klar gibt es Ausnahmen, z. B. wenn man Effekt von Scriptaculous einsetzen will.
10. Teile die Stile in soviel Dateien wie möglich auf.
    Es ist nicht sehr praktisch wenn man mehrere css-Dateien öffnen muss, um eine kleine, seitenweite Änderung durchzuführen. Außerdem ist der Browser mit dem interpretieren von vielen kleinen Dateien mehr beschäftigt, als mit wenigen Großen. Daher 2 bis 3 Dateien pro Thema muss reichen.

ähnliche Posts:

• Hallo große, weite Welt!
• Mensch 2.0
• web 2.0 defined?
• Wie ist man kreativ?
• color 2.0

Dieser Eintrag wurde

• am Montag, 15. Dezember 2008 um 11:11 erstellt und wurde unter CSS, Design, Tutorials zum mehr Wissen abgelegt.
• Der Post besitzt diese Tags: CSS, Design, Fehler, Frameworks, Tutorial, webdesign
• Du kannst alle Antworten darauf mit dem RSS 2.0 Feed verfolgen.
• Du kannst eine Antwort schreiben.
• Du kannst einen TrackBack von Deinem eigenen Blog setzen.
•  drucken

Der Artikel hat Dir geholfen?

Warum spendierst Du mir nicht einen Kaffee?