Ich hab ja schon eine Menge Hässlichkeiten im HTML-Code einer Seite gesehen, aber womit ich es letztlich zu tun hatte, hat den Vogel abgeschossen. Ich musste ein
"Layout
" einer Seite weiterbearbeiten, die von einer erfahrenen Agentur fabriziert wurde.
In diesem Layout wurde erst mal alles absolut positioniert. Wozu floaten und skalieren?
position: absolute-Attribute in Verbindung mit
top und
left sind deine Freunde.
Noch interessanter war das Abstands-Management. Margins und Paddings waren wohl zu gewöhnlich. Die beste Art des Abstand-Haltens geht über die Rahmenstärke. Willst du, dass das Bild einen Abstand von 20 pixel zum nebenstehenden Bild hat? Hau rein dat
border-right: 20px solid white; (bei weißem Hintergrund). Das ist wahre Code-Schönheit.
Achja ... und wer braucht schon einen Validator. Sind ja eh nur 14 Fehler in einer Seite (von denen 10 sehr leicht behoben werden könnten, würde man den Validator einmal anschmeißen).
Aber sie haben wenigstens schonmal divs benutzt und Tabellen nur noch, um Formularelemente zu positionieren. Das ist ein Fortschritt in der Welt der Agenturen. In 10 Jahren hören sie vielleicht auch mal was von Semantik und leicht wartbarem Code.
1
YellowLed: Ich kann mir nicht helfen, aber bei position: absolute; muss ich immer an gephotoshoppte Zusammenklick-Sites denken, bei denen dann die einzelnen Elemente »festgezurrt« werden ... der weiße Rahmen hingegen erinnert mich an diese auch leicht werkmürdige Technik, faux columns über einen dicken, farbigen Rahmen zu simulieren. Damit allerdings margin/padding zu ersetzen, grenzt an eine Abenteuerlichkeit, von der Frontpagenutzer nur träumen können g
1.1
alp: Genau so war's auch, Design nach einer Photoshop-Vorlage. So nach folgendem Produktionsablauf: Grafiker macht ein Mockup und schmeisst die PSD-Datei rüber zum oben beschriebenen Super-Coder, der u.a. auch wichtige Formulare baut, die nur über JavaScript zu erreichen sind
1.1.1
YellowLed: Das ist dann ja noch ein Vorteil eines Linux-Systems: Man hat kein Photoshop. Und mit Gimp würde man nie auf die Idee kommen, Webseiten zusammenzuklicken
2
Boris: Das mit dem "border-right: 20px solid white;" ist der Freudebringer der Woche!
Da sprechen die wahren Webdesigner.
Aber ansonsten hättest du den Artikel nach dem ersten Absatz eigentlich beenden können (...fabriziert wurde.). Alles weitere wäre dann irgendwie bekannt gewesen...