Nachschlagewerk für HTML-Codierung
^ nach Oben ^
<   Zurück   <
HTML + Syntax + ProgrammierungGestaltung + Layout + Design + Visualisierung + Suchmaschinen
 

HTML-Bibliothek




Homepage von
Michael Knödel,
Mediengestalter
Print und Online
 
ASCII Code
Farbnamen
HTML Bibliothek >
JS Bibliothek
allg. Lexikon
Abkürzungen
Zitate
MusikLexikon

HTML - die Sprache im Internet

  Hier ist eine kleine Sammlung von verwendeter HTML-Syntax.

  Ausführliche Erklärungen finden Sie auf http://selfhtml.teamone.de/Self-HTML von Stefan Münz, ein sehr gutes Entwicklungswerkzeug bei der Site-Erstellung.

  Bitte beachten Sie, das es zu gutem HTML-Stil gehört, Attribute per CSS (CascadingStyleSheed) zu formatieren (style="Attribut"). Diese Stile können auch in eine externe Datei ausgelagert werden und gelten dann für jede Datei innerhalb des Verzeichnises, sofern diese sie anreferenziert.
  In dieser Bibliothek werden CSS-Elemente allerdings wie ein Bestandteil von HTML behandelt.


Generelles:

  • Ein- und mehrzeilige Komentare werden mit "<!--" ein- und mit
      "-->" ausgeleitet und werden vom Browser nicht interpretert.


  • <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    Diese Zeile ist eine von vielen möglichen. Sie wird vor dem einleitenden HTML-Tag gesetzt und beschreibt, in welcher "Sprache" die Seite erstellt wurde. Die Angabe ist nicht zwingend nötig, gehört aber zum guten Stil. Immerhin drückt sie aus, welchen Übereinkünften die Machart der Seite unterliegt.


  • Angaben zur Attributvergabe werden nach Übereinkunft nur noch als CSS-Style geschrieben:
    style="font-size:10; font-weight:bold; color:#000000; text-align:center; vertical-align:top; background-image:url(Pfad/Bildname); background-color:#123456;"


  • Zur genauen Positionierung von Text und Grafik, vor allem im Head-Bereich, bilde ich gerne einen zweiseitigen Rahmen zur Distanzierung aus einer transparenten 1 x 1 Pixel-Grafik.


  • Beachten Sie, dass die angegebene Tabellenbreite 770 Pixel beträgt. Dieser Wert kommt dadurch Zustande, da viele User einen 800 x 640 Pixel großen Monitor benutzen. Abzüglich des Browser-Fensterrahmens und eines Scrollbalkens bleiben gerade diese 770 Pixel noch übrig.



HTML-Grundgerüst

<!DOCTYPE ... >
    <!--Beschreibung für den Client-Rechner, was jetzt kommt, damit er
    die Steuerzeichen richtig deutet (s.o.)-->

<HTML> <!--Beginn des HTML-Dokuments-->

<HEAD> <!--Einleitung des Kopf-Teils. Hier werden spezifische
    Formatierungen für die Site festgelegt.-->

 <TITLE>Titel des Dokuments (= das, was oben in der Titelleiste steht)</TITLE>
<!--Hier kommen dann die Angaben über das Thema der Seite als Hilfe für Suchmaschinen und Anforderungen für externe Dateiinhalte hin-->

</HEAD> <!--Ende des Kopf-Teils-->

<BODY> <!--Einleitung des Body-Teils. Innerhalb werden die Inhalte
    der Site gesetzt-->

EINSEHBARER INHALT DER SEITE

</BODY> <!--Ende des Body-Teils-->

</HTML> <!--Ende des HTML-Dokuments-->



Tabellen-Grundgerüst für 100% Seitenhöhe

<body style="padding:0;">

<div align="center">

<!---------Gesamtfenster------------>
<table width="770" style="height:100%;padding:0;border-width:0;" border="0">
<tr>
  <td align="center">

<!---------Kopf-Fuß-Inhalt----------->
<table width="770" style="height:100%;padding:0;border-width:0;" border="0">
<tr>
  <td colspan="2">

<!---------------Head----------------->
<table width="770" style="height:100%;padding:0;border-width:0;" border="0">
<tr>
  <td>Head</td>
</tr>
</table>
<!-------------Head-Ende------------>

  </td>
</tr>
<tr>
  <td style="height:100%;">

<!----------------Menue--------------->
<table width="180" style="height:100%;padding:0;border-width:0;" border="0">
<tr>
  <td>Menue</td>
</tr>
</table>
<!------------Menue-Ende------------>

  </td>
  <td>

<!--------------Contend--------------->
<table width="590" style="height:100%;padding:0;border-width:0;" border="0">
<tr>
  <td>Contend</td>
</tr>
</table>
<!---------Contend-Ende------------->

  </td>
</tr>
</table>
<!---------Kopf-Inhalt-Ende---------->

  </td>
</tr>
<tr>
  <td valign="bottom">

<!-----------------Fuss------------------->
<table width="770" style="padding:0;border-width:0;" border="0">
<tr>
  <td>Fuss</td>
</tr>
</table>
<!-----------Kopf-Fuß-Inhalt------------>

  </td>
</tr>
</table>
<!---------Gesamtfenster-Ende-------->

</div>

</body>



Eine Seite für Steudle Elektro-Verbindungen
symdata edv gmbh/mk

www.steudle-kontakte.de




Eine Site für einen führenden Malz-Produzenten.
symdata edv gmbh/mk

www.bestmalz.de


zur Website der Yogaschule Ingrid Kuhn, Neckartailfingen
Website des Yogastudios
Ingrid Kuhn, Neckartailfingen


Stand: 1. April 2010
Haftungsausschluß Mediengestalter- und Musiker-Site © Michael Knödel