Image and More - kostenloses für Webmaster

image and more - kostenloses für webmaster

HTML Tutorials

Die Grundstruktur eines HTML-Dokuments

HTML ist logisch aufgebaut.

Die Befehle ( Tags genannt) werden immer in spitze Klammern geschrieben (<>) und gelten genau für den Bereich zwischen öffnen und schließen desselben.

<html> sagt dem Browser, daß es sich um eine HTML Datei handelt.

<head> ist der Bereich der Zusatzinformation. Hier können Informationen über Autor, Entstehungsdatum oder Suchmaschineninfos stehen die für den User aber nicht sichtbar sind.

<title> dies ist der Titel der Seite (hier Image and More kostenloses Webdesign).
Der Titel wird in der obersten Zeile des Browsers angezeigt

Mit <body> beginnt der eigentlich sichtbare Teil, der Inhalt der Seite.
Alles was unterhalb von <body> steht ist sichtbar! Was zusätzlich im Bodytag steht nennt man Attribute (z.B. bgcolor, ...) also Zusatzinformation zu einem Befehl. Sie sind optional.
Je mehr Attribute verwendet werden, desto genauer weiß der Browser, wie er die Seite darzustellen hat.

Grundstruktur eines HTML Dokumentes

<HTML>
<HEAD>
<TITLE> Hier muss der Titel stehen</TITLE>
</HEAD>
<BODY bgcolor="#fffff" text="#ffffff" link="#ffffff" vlink="#ffffff">

Hier stehen dann die jeweiligen HTML-Befehle

</BODY>
</HTML>

-->top<--

Attribute des Bodytags

bgcolor: steht für backgroundcolor - die Hintergrundfarbe. (z.B.#ffffff)

background: Falls ihr statt einer Hintergrundfarbe eine Hintergrundgrafik (.gif oder.jpg) benutzen wollt, dann müßt ihr das "background" Attribut einsetzen. (z.B. background="grafix/dot.gif")

text: Definiert die Textfarbe. Gleiches System wie Hintergrundfarbe. (z.B.#000000)

link: steht für die Farbe der Verknüpfungen bevor sie angelickt wurden, vlink (visited links) für schon besuchte Links.

vlink: steht für die Farbe der schon besuchten (angeklickten) Links.

Befehle zwischen <body> und </body>

Zeilenumbruch: <br> (braucht kein schliessendes tag also kein </br>

Steht für Break, also einen Zeilenumbruch. Wenn ihr im Editor einen Text hineintippt und 'Enter' drückt, springt der Cursor in die nächste Zeile. Nicht aber beim Browser. Der Browser schreibt so lange in die gleiche Zeile, bis entweder die Zeile zu ende ist, oder er ein <br> findet.

Überschriften: <h3></h3>

z.B. Überschrift

Der Befehl für Überschriften. Je nach gewünschter Größe ist ein Bereich von< h1> bis <h6> Dieser Befehl muß geschlossen werden, sonst wird die ganze Seite in der entsprechenden Größe angezeigt. Überschriftenbefehle setzen bei Beendigung (z.B. </h1>) automatisch einen Zeilenumbruch.

Grafiken: <img src="bild.gif"> oder <img src="bild.jpg">

Dies ist der Befehl, um eine Grafik einzubinden. Zulässige Dateiformate für Internetgrafiken sind .gif und .jpg. Diese Formate sind nämlich komprimiert und brauchen daher relativ wenig Speicher. Zu Erklärung: img steht für image, src für source (Quelle).

Wenn ihr ein eigenes Bilderverzeichnis mit dem Namen 'grafix' anlegt, wäre der Pfad "grafix/bild.gif". Muß nicht geschlossen werden!

-->top<--

Links: <a href="link.htm">Linktitel</a> (Beispiel für lokale Datei) Links werden in Seiten eingebunden, um Verknüpfungen zu anderen .htm oder.html Dateien herzustellen.

Um eine Fremddatei/eine fremde Seite anzulinken, müßt ihr die komplette Adresse (URL) angeben. Das kann zum Beispiel so aussehen: <a href="http://www.deineseite.de">Link zu deiner Seite</a>
Achtung: Der Befehl muß mit </a> geschlossen werden! Sonst weiß der Browser nicht, bis wohin der Link gehen soll.

Mails: <a href="mailto:webmaster@chris-thomsen.de">Schick mir eine Mail</a> Das Prinzip ist das gleiche, wie bei einem Link. Nur, daß man statt des Dateinamens "mailto:deine@email" eingibt.

Anker: <a href="datei.htm#anker1">Anker 1</a> und
<a name="anker1"></a>

Ein Anker ist ein Sprungpunkt innerhalb einer Seite. Steht die gewünschte Info also auf einer längeren HTML - Seite in der Mitte, so setzt man vor Beginn dieser Info (also z.B. der Überschrift) den Befehl <a name="anker1"></a>. Dieser definiert den Anker.

<b>Text</b> stellt den Text fett dar

Zentriert den Text oder den Absatz

<SMALL> Text </SMALL> Stellt den Text klein dar

<BIG>Text</BIG> stellt den Text gross dar

<font face="Schriftart"> Legt eine bestimmte Schriftart fest.

Legt eine bestimmte Schriftart fest.

Legt eine bestimmte Schriftart fest.

<font color="#ffffff">
(Farbtabelle) Bestimmt dieTextfarbe

<font size="1"> Bestimmt die Textgröße von
"1" klein bis
"7" gross

<HR> erzeugt eine horizontale Linie :