Ideal zum Lernen:
Kurs als Videos
Video-Kurs HTML5, CSS
& Webdesign
HTML-Kurs, CSS u. Webdesign lernen & die eigene Website erstellen
Videos eBook Forum Kontakt

Projekt: Grunddesign

Die Aufteilung der einzelnen Elemente, wie beispielsweise Steuerleiste, Inhalt, Adresse, Logo wird im Grunddesign festgelegt. Dabei gilt es die Zielgruppe zu beachten. Je weniger Webproof (Internetunerfahren) die meisten Besucher sein werden, desto "gewohnter" sollte der Aufbau sein. Mit dem folgenden Aufbau liegen Sie normalerweise nie falsch.

Das Logo kann links oben platziert werden. Darunter die Anschrift und Telefon. Auf der linken Seite die Steuerung und rechts der Inhalt.

Wenn Sie sich für ein Design entschieden haben, sollten Sie dieses auf allen Seiten Ihrer Website verwenden. Haben Sie auf jeder Seite ein anderes Design, führt das nur zur Verunsicherung des Besuchers - wenn Sie das möchten, müssen Sie das machen.

Für diesen Aufbau benötigen wir eine Tabelle. Die linke Spalte für das Logo/Anschrift/Steuerung. Die rechte Spalte für den Inhalt.

 <table height="100%" cellpadding="10" border="1" >

   <tr>

     <td width="175" bgcolor="yellow" >

       Logo <br>
       Adresse <br>
       <br>
       Steuerung
     </td>

     <td width="*" >

       Inhalte
     </td>

   </tr>

 </table>

Die Ausgabe im Browser sieht wie folgt aus: Ansicht im Browser

Die einzelnen Elemente des table-TAGs

<table bgcolor="yellow" height="100%" width="175"
cellpadding="10" border="1" >

Dabei haben die einzelnen Attribute bei der Tabelle folgende Funktion:

bgcolor="yellow"
Die Hintergrundfarbe der Tabelle - je nach Geschmack, aber immer mit der Prämisse der bestmöglichen Lesbarkeit!
height="100%"
Die Höhe der Tabelle - also den gesamten Bildschirm = 100%
width="175"
Die Breite dieser Tabelle - für das Logo und die Steuerung reichen im Normalfall 150 Punkte aus - es soll ja auch noch Platz für den eigentlichen Inhalt übrig bleiben
border="1"
Der Rand der Tabelle wird während der Entwicklungsphase der Website eingeschaltet, damit exakt ersichtlich ist, wo was anfängt und aufhört. Ist das Design dann entsprechend fertig, werden die Ränder normalerweise mit border="0" ausgeschaltet
cellpadding="10"
Um ein wenig Rand zwischen Tabelle und Tabellen-Inhalt zu schaffen, gibt es diesen Befehl

Damit die Tabelle bündig an die Seitenränder anschließt, finden Sie den entsprechenden Tipp unter Tipps und Tricks.

Weiter geht es zum Erstellen der Steuerung.

Weiterempfehlen - Social Bookmarks - Vielen Dank

Wenn Sie einen Fehler finden, bitte mitteilen (egal ob Schreibfehler oder inhaltlicher Fehler).

Mit Maus fehlerhafte Stelle markieren und übernehmen mit folgendem Button:



(kann angegeben werden)

Nach Absenden kommt hier Feedback! Bitte nicht doppelt absenden. Danke.

Bitte unterstützen Sie dieses Projekt

Sie können dieses Projekt in verschiedenen Formen unterstützen - wir würden uns freuen und es würde uns für weitere Inhalte motivieren :).

unsere Videos bestellen

Unsere Videos und eBooks bestellen.

Spenden

Sie können uns eine Spende über PayPal zukommen lassen.

Weiterempfehlungen

Empfehlen Sie es weiter - wir freuen uns immer über Links und Facebook-Empfehlungen.

Bücher über Amazon

Bestellen Sie Bücher über folgende Links bei Amazon:

Fehler melden

Vielen Dank für Ihre Hilfe