20. Oktober 2008

Webseiten Layout wählen

Die Webseiten Relaunch Serie geht weiter. Da wir nun all unsere Ideen gesammelt und strukturiert haben, stellt sich jetzt die Frage: Wie und wo platziere ich meine einzelnen Elemente? Hier ist die Auswahl des richtigen Layouts ganz wichtig, denn dieses muss übersichtlich, ansprechend sein und ihren Zweck erfüllen.

Welches Layout soll ich wählen ?

Layout: Blog


Vorher sollte man wissen, was die Seite präsentieren soll. Wird das Layout für einen Blog genutzt, sollte die Inhaltsbox das auffälligste sein, denn die Artikel sind das Herzstück. Die Navigation spielt eine nebensächliche Rolle, weil oftmals werden nur die neueren Artikel auf der Startseite gelesen. Daher werden für Blogs so gut wie immer 2 spaltige Layouts oder ein 1-spaltiges Layout verwendet.

Layout: Firma, Verein, Produkt, Service

webseiten layout Das 3-spaltige Layout wird sehr gerne bei größeren Webpräsenzen von Firmen, Vereinen oder einzelnen Webseiten, die ein Produkt anbieten und verkaufen wollen, genutzt. Die häufigeVerwendung des 3-spaltigen Layouts ist daran zu begründen, dass dieses den meisten Internet Nutzern sehr vertraut ist. Oben im Header das Logo, Links (oder auch unter dem Header) die Navigation, rechts in der Spalte Zusatz Infos oder sonstige Ankündigungen und in der Mitte der eigentliche Inhalt.

Fertige Layouts - Layoutgerüst

Wieso immer alles komplett alleine machen, wenn es bereits einige fertige Layout zum freien Download gibt? Wer zudem ein besonderes Layout haben will, dass besonders flexibel ist, findet ebenso gute Layouts im Internet. Intensivstation bietet verschiedene Layout Gerüste zum freien Download an. Ebenso gibt es für jedes Layout eine Demo, so dass ihr die Vorteile des Gerüsts sofort erkennt.

Bei Code Sucks gibt es aktuell 95 verschiedene CSS Layouts! Ich glaube spätestens dort, sollte man fündig werden. Die Website Gerüste
sind (sollten) ebenso komplett CSS valide sein, so dass ihr immer eine konforme Vorlage für euren Relaunch habt.

Layout selber machen

Oftmals gibt es doch Gründe ein Layout komplett von neu an selber zu machen. Zum einen weiß man selber wie etwas funktioniert und wie etwas strukturiert ist und zum Anderen kann man selber behaupten: Ich habe das selber gemacht.
Wer sich selber ans Werk macht, sollte immer wieder das Gerüst im Internet Explorer und im Firefox testen. Bekanntlich funktionieren nicht alle CSS Eigenschaften in allen Browsern. Eine Kompatibilitäts-Liste ist auch sehr nützlich, um böse Überraschungen zu vermeiden.

Wer noch Hilfe beim Erstellen des Web-Layouts benötigt, kann sich von Andreas Kalt helfen lassen. Er erklärt in 13 Abschnitten, wie man zu einem eigenen Theme kommt. Hier ein Ausschnitt aus der Übersicht:

  • Einführung
  • Festlegen, welche Browser unterstützt werden sollen
  • Mögliche Container im Design erkennen
  • Die Container benennenn
  • Das Markup für die Container erstellen
  • Eine Positionierungsmethode für die Container auswählen
  • Farbige Kästen
  • Den Inhalt einfügen
  • Gestaltung innerhalb der Container
  • Die CSS-Regeln in eine separate Datei auslagern
  • Bestimmte Regeln vor älteren Browsern verstecken
  • Ein Stylesheet für Ausdrucke erstellen
  • Fertig!

Nehmt ihr auch ab und zu fertige Layout Gerüste oder beginnt ihr immer von Grund auf neu an? Welches Spalten-Layout ist euer Favorit? Hinterlasst mir einen Kommentar!

3 Reaktionen zu: Webseiten Layout wählen
  • Tobias - 20. Oktober 2008, 13:02 Uhr

    Bis jetzt habe ich alle Grundgerüste selbst gemacht. Dann kann ich das Layout genau so gestalten wie ich will. Ich denke bei vorgefertigten Grundgerüsten werden immer Elemente dabei sein die ich nicht benötige und somit überflüssig sind oder es werden welche fehlen. Bis ich das ausgeglichen habe, kann ich gleich von Null anfangen.
    Wenn man dann noch dazuzählt, dass man 95 Grundgerüste dursuchen muss, bis man das passende gefunden hat, ist es mit Sicherheit schneller ein eigenes Grundgerüst zu erstelllen.

    Bevor man eine Website erstellt sollte man sich immer umschauen, wie die anderen Websites aufgebaut sind. Denn die Benutzer gewöhnen sich an gewisse Strukturen. Ein Weblog, dass seine Seitenleist auf der linken Seite hat wird von dem Benutzer wahrscheinlich nicht als solches erkannt. Der Benutzer wird die Themen/Tags nicht finden, wüsste nicht wo sie einen RSS-Feed abonnieren können. Deshalb ist es wichtig, immer gewisse Strukturen zu behalten.

  • Damian - 20. Oktober 2008, 14:03 Uhr

    Wenn man etwas Ahnung von CSS + XHTML hat, dann ist das Selbermachen auch die deutlich schnellere und bessere Lösung.

    Die bekannten Elemente findet man sehr schnell, indem man mehrere Blogs miteinander vergleicht.

  • Markus - 20. Oktober 2008, 20:08 Uhr

    @damian
    muss dir recht geben. so ein dreispaltiges layout zu entwickeln dauert maximal 15 min. das grafische ist eher das problem ;)

    gruss

    Markuss letzter Artikel: Excellent AJAX Tutorials

Einen Kommentar schreiben