{"id":618,"date":"2016-09-11T22:22:31","date_gmt":"2016-09-11T20:22:31","guid":{"rendered":"http:\/\/www.christoph-freyer.at\/blog\/?p=618"},"modified":"2016-12-26T02:11:34","modified_gmt":"2016-12-26T01:11:34","slug":"vergiss-die-grundlagen-nicht","status":"publish","type":"post","link":"https:\/\/christoph-freyer.at\/blog\/vergiss-die-grundlagen-nicht\/","title":{"rendered":"Vergiss die Grundlagen nicht!"},"content":{"rendered":"

\"illustrative<\/a><\/p>\n

CSS-Basics sind nicht nur f\u00fcr Anf\u00e4nger<\/h2>\n

Es ist sicher vielen Webdesignern so wie mir ergangen. Nach einigen Jahren dachte ich, ich k\u00f6nnte CSS. Ich war zwar realistisch genug um zu wissen, dass man vieles besser machen kann, aber in dem Moment als ich das erste Mal f\u00fcr eine gro\u00dfe Firma Code geschrieben habe, wurde ich eines Besseren belehrt. Ich bin in eine andere Welt eingetreten. Hier ist es nicht mehr eine mehr oder weniger einfache One-Man-Show, wo am Ende die Site f\u00fcr sich funktionieren muss. Pl\u00f6tzlich stehen viel mehr Faktoren im Rampenlicht und man erinnert sich an einige Spielregeln, die man gelernt hat, aber zum Teil aus \u00dcberheblichkeit doch wieder bleiben lie\u00df.<\/p>\n

Was sind jetzt diese Grundprinzipien?<\/h3>\n

Trennung von HTML und CSS. Die strikte Trennung von Ger\u00fcst und Formatierung sollte heutzutage jedem bewusst und ins Blut \u00fcbergegangen sein. Deswegen will ich hier auch gar nicht n\u00e4her darauf eingehen.<\/p>\n

Aber es gibt beim CSS zahlreiche Grundregeln, die leider oft nicht eingehalten werden.
\nDa w\u00e4re einmal die Form in der Code geschrieben wird. Eine saubere Codierung ist das Um und Auf unseres \u201eHandwerks\u201c. Es geht nicht nur darum, dass sich andere im Code zurechtfinden sollen. Auch selbst verliert man sonst leicht den \u00dcberblick \u2013 vor allem wenn es einmal l\u00e4ngere Projekte werden (ich spreche hier aus leidvoller Erfahrung).
\nJa, jetzt denkt jeder: \u201eAch was, ich wei\u00df doch was ich schreibe. Das ist alles nur Gerede\u201c. F\u00fcr den Moment mag das vielleicht gelten, nur ein oder zwei Jahre sp\u00e4ter hat man leider keine Ahnung mehr was man damals im Infight mit dem Code gemeint hat.
\nGenau aus diesem Grund schreiben alle \u2013 und nun auch ich \u2013 gebetsm\u00fchlenartig:<\/p>\n

Den Code immer so schreiben, dass sich auch ein Fremder darin zurechtfindet.<\/p><\/blockquote>\n

Notierung des Codes<\/h3>\n

Es gibt zahlreiche Varianten Code zu gliedern. F\u00fcr welche Variante man sich entscheidet ist Geschmackssache. Die Methode sollte aber einheitlich sein.<\/p>\n

Eine der Varianten, gut lesbaren Code zu notieren, ist folgende:<\/p>\n

    \n
  • jeder Selektor hat eine eigene Zeile<\/li>\n
  • jede Eigenschaft gefolgt vom Wert hat eine eigene Zeile<\/li>\n
  • nach dem trennenden Doppelpunkt folgt ein Leerzeichen<\/li>\n
  • auch nach dem letzten Wert folgt ein Strichpunkt (vermeidet bei einer \u00c4nderung eine vorprogrammierte Fehlerquelle)<\/li>\n
  • die schlie\u00dfende geschwungene Klammer } hat eine eigene Zeile und ist wieder ausger\u00fcckt<\/li>\n<\/ul>\n

    Das Schema einer Klasse oder ID bestehend aus
    \nSelektor { Eigenschaft: Wert; } sieht dann folgenderma\u00dfen aus:<\/p>\n