Programmieren mit Pfiff

Für eine individuelle Internetpräsenz ist es vorteilhaft, die Grundlagen der Webseiten-Gestaltung zu beherrschen. Nur so kann auf professionelle Hilfe verzichtet werden. Bei den Grundlagen wird zwischen der Auszeichnungssprache HTML und der gängigen Formatierungssprache CSS unterschieden. HTML ist keine Programmiersprache, wie z.B. PHP (Scriptsprache). Zum Definieren von Stylesheets gibt es mehrere Sprachen. CSS ist eine davon und wurde speziell für HTML optimiert und weiter entwickelt. Seiteninhalte, Überschriften, Textpassagen, Fotos und Grafiken werden durch HTML für das WWW aufbereitet.

Diese Auszeichnungssprache baut den Informationsgehalt für Webbrowser und Seitenbesucher auf. Ein guter Inhalt wird durch ein ansprechendes Layout aufgewertet. Cascading Style Sheets bzw. CSS formatiert den Seiteninhalt. Die optische Gestaltung einer Internetpräsenz ist besonders verantwortungsvoll.

Für HTML und CSS gibt es bestimmte Regeln. World Wide Web Consortium bzw. W3C will mit den Vorgaben Barriere freies Webdesign ermöglichen, das von allen Webbrowsern fehlerfrei wiedergegeben wird. Jedoch gibt es noch immer Webbrowser, die W3C-Richtlinien nicht vollständig und fehlerfrei umsetzen. Da hilft nur das Testen der eigenen Internetseiten in mehreren Webbrowsern, um selber Fehler zu beheben. Mitunter ist es erforderlich, für die unterschiedlichen Seiteninterpretationen verschiedene CSS-Dateien zu schreiben und nach Bedarf einzulesen.

Stylesheets unterstützen ein professionelles Webdesign und sind die unmittelbare Ergänzung zu HTML. Für einzelne HTML-Elemente werden Formatierungen definiert, die über die Möglichkeiten von reinem HTML hinaus gehen. So besteht durch CSS die Chance, Textblöcke, Listen und Formulare mit eigenen Hintergrundfarben oder Hintergrundbildern (Wallpaper) zu definieren. Jedoch gilt immer wieder die Regel; weniger ist oft mehr. Seriosität zeichnet sich durch schlichte Eleganz aus. Punktgenau werden Blockelemente durch eine Koordinaten-Festlegung auf der Webseite platziert. Für Print-Layouts gibt es Möglichkeiten, das Seiten-Layout und den Textfluss zu definieren. CSS-Scripte steuern die künstliche Sprachausgabe. Andere Eigenschaften beeinflussen das Anzeigefenster des Browsers und das Aussehen des Cursors.
Es gibt verschiedene Wege, CSS-Formate zu definieren. Diese können in einer externen Datei, in einem zentralen Style-Bereich oder direkt im einleitenden Tag eines HTML-Elements geschrieben werden. Eine externe Datei hat den Vorteil, dass die Befehle (Syntax) für eine Vielzahl von HTML-Seiten genutzt werden können. Schriftformatierungen, Überschriftendefinierungen, Linkbetonungen, body, content, Navigationsleiste und vieles mehr können individuell gestaltet werden. Die CSS-Formate bzw. Selektoren bestehen aus einer oder mehreren Eigenschaften und dazu gehörenden Wertzuweisungen. Daraus ergibt sich Selektor { Eigenschaft:Wert;}. Entsprechende Editoren erleichtern die korrekte Schreibweise und signalisieren sofort Fehler.

Jede Formatierung sollte weniger die eigene „Genialität“ präsentieren, sondern eher die Wiedergabe bei leistungsschwacher Hardware, unterschiedlichen Anzeigegeräten und veralteten Browsern im Auge behalten. Ebenso bestehen bei den Seitenbesuchern unterschiedliche Vorstellungen von einem gelungenen Seiten-Design. Ein intensives Einarbeiten ungewöhnliche Stylesheet-Effekten kann auf Kosten der Benutzbarkeit (Usability) gehen. Raffinierte Schriftgestaltungen und kleine Schriftgrößen können schnell als unleserlich empfunden werden. Grelle Farben und krasse Farbkontraste strapazieren die Augen des Seitenbesuchers. Animierte Schriftzüge wirken schnell nervig und lenken vom Wesentlichen ab. Ein gutes Seiten-Layout rückt den Inhalt mit einer „netten Verpackung“ in den Mittelpunkt. Jeder Seitenbesucher möchte sich an überschaubaren Navigationsmöglichkeiten erfreuen. Wenn er sich dann noch bewundernd fragt, wie dieses optische Highlight gelungen ist, dann hat der Programmierer sein Ziel erreicht. Ratgeber-Seiten im Internet helfen sicher beim optimalen Seitenaufbau.

Comments are closed.