Bitte um Code Review

[Xeno]

Hallo zusammen

Ich habe eine private Homepage ( Michael Ritter ) erstellt und wäre für eine kritische Durchsicht (primär) des CSS-Codes dankbar. Es geht vor allem um Punkte wie Erweiterbarkeit, Vermeidung von Redundanzen und so (validiert ist der Code, und es passiert im Moment das, was ich will).

Es geht vorerst nur in zweiter Linie um allgemeine Verbesserungsmöglichkeiten der Seite (aber natürlich sind alle Ratschläge willkommen).

Weiter geht es mir nicht darum mir von anderen gratis eine super Homepage machen zu lassen, ich will vielmehr alles selber nach und nach machen und möchte nur Feedback . Das sollte aufgrund meiner früheren Freds aber klar sein, dass ich nicht andere für mich arbeiten lassen will!

Der CSS-Code:

* { margin:0; padding:0; }
p, ul { margin:0 0 20px 20px; }
h1, h2, h3 { margin:0 0 10px 20px; }
body { background-color:#B4DC00; font-family:Verdana, sans-serif; }
a { text-decoration:none; }
a:link { color:#2F54FF; }
a:visited { color:#FF4B4B; }
a:hover { color:#FEFF49; }
span { color:#2F54FF; }
.linkliste li { margin: 0 0 0 20px; }
#navigationsleiste { overflow:auto;  width:100%; height:30px;  background-color:#FFFFFF; margin-top:5px; }
#navigationsleiste li { float:left; list-style-type:none; padding:5px 0 5px 0; }
#navigationsleiste a, span { padding:10px; }
#navigationsleiste a:link { background-color:#FFFFFF; }
#navigationsleiste a:hover { color:#FF40CF; }
#navigationsleiste #aktiv span { background-color:#D2A5FF }

Herzlichen Dank für alle Tipps, Kritik usw.!

Xeno

 

[prm]

HTML und CSS sind aus meiner Sicht in Ordnung.
Eine penible Kleinigkeit, die ich aber selbst ebenfalls vernachlässige, sind deine Überschriften:
Diese sind von h1 bis h6 ja hierarchisch gegliedert, siehe SELFHTML: HTML/XHTML / Elemente zur Textstrukturierung / berschriften.
Wenn du auf deiner Seite nur h2 benutzt, dann fehlt eigentlich h1 als übergeordnete Ebene. Somit wäre es von dieser Systematik her sinnvoll, wenn du lediglich h1 benutzt. Mit der Schriftgröße hat das nichts zu tun, denn die kannst du ja individuell h1 bis h6 zuweisen, bzw. per Klassen definieren.

Wie gesagt: Aus meiner Sicht grenzt das schon an Erbsenzählerei, aber manche HTML-Puristen legen auch darauf Wert.

 

[Tronjer]

Dem kann ich mich anschließen. Mit Ausnahme des <h2> gibt es am Code nichts auszusetzen, und das wäre dann wirklich Erbsenzählerei.

CSS ist immer ein Abwägen zwischen Wartbarkeit und Performance. Prinzipiell sollten Selektoren mit gleichen Attributen kommasepariert zusammengefasst werden. Bei langen Dateien, mit vielen Abschnitten und hunderten von Zeilen, kann das im Hinblick auf spätere Änderungen allerdings schnell unübersichtlich werden. Ich tendiere in diesen Fällen dazu, den Code in der selben Reihenfolge wie das HTML zu schreiben und mit Kommentaren zu versehen. Auch wenn dann vielleicht 1 Kilobyte mehr geladen werden muss.

 

[Xeno]

Ich möchte Euch beiden für diese fundierte Antworten herzlich danken.

Die korrekte Hierarchisierung der <h1>, <h2>, usw. Elemente habe ich soeben umgesetzt. Wie Ihr richtig vermutet, habe ich mancherorts <h1> gar nicht benutzt, weil mir dann die Überschrift zu gross wurde - diese Überlegung ist aber nicht zeitgemäss und kommt natürlich noch aus der Vor-CSS-Zeit. In einem nächsten Schritt werde ich diesen Elementen im CSS (zusätzlich) Schriftgrössen zuweisen. Weil das mit den Grössenangaben gemäss Literatur nicht so trivial ist, will ich mich da aber zuerst kurz einlesen.

Den Aufbau des CSS lasse ich im Moment; mir ist aber klar, dass bei erheblichem Ausbau die Systematik auf jeden Fall durchdacht werden muss, vor allem auch in Bezug auf Wartbarkeit und Übersichtlichkeit des Codes.

Ich schlage vor den Fred zu schliessen. Ich melde mich dann ggf. wieder beim Vorliegen von Schwierigkeiten (die sicher kommen werden.

Lg Xeno