Der schnelle weg zu einer homepage: html crashkurs
1. Was ist HTML ?2. Für was kann man das verwenden?
3. Crashkurs für Anfangs-Homepage3.1. TAGS - die wichtigsten3.
2. ATTRIBUTE - die Grundattribute3.3. "sauberes HTML" mit Quelltext und Erklärung3.4. Eine Tabelle - Erklärung und Quelltext
4.
Ausbau nud Vervollständigung einer HP5. Fazit1. Was ist HTML ?HTML ist eine "Beschreibungssprache" für das uns sehr hilfreiche Internet. Doch für was steht HTML ?HTML steht für "Hypertext Markup Language...
2. Für was kann man das verwenden ?Man gebraucht HTML für Homepagedesign, oder auch für Dienste auf einer Homepage (z.B. Gästebücher, Foren etc.). Wie kann man es anwenden? Um eine Homepage zu erstellen, braucht man eigentlich nichts, nur ein Notepad/Textpad.
.. ein ganz normales Schreibprogramm, was jeder besitzt, der auch einen Computer besitzt. Wenn man auf dem Desktop ist (das Ding wo das Hintergrundbild ist und die ganzen Teile wie "Arbeitsplatz" und so was drauf ist) mit der rechten Maustaste klickt, steht da "Neu" mit einem Pfeil nach rechts. Nun folgt man dem Pfeil und dann steht da "Textdokument". Das anklicken und schon kann man fleißig im HTML rumtippeln.
Wie kann man noch HP's erstellen? Eine bedeutend einfachere, aber auch langweiligere Art wie man HP's designen kann, ist das Programm "Frontpage" von Microsoft Office... Dort braucht man keinerlei HTML-Kenntnisse und kann einfach ausprobieren, da das Programm einem jeden Wunsch erfüllt/erfüllen kann.3. Crashkurs für Anfangs-HomepageWenn man sich dann doch entschlossen hat, via HTML zu schreiben, dann sieht es folgender Maßen aus:Eine komplette Homepage unterteilt sich in den "Head" und in den "Body".
Hilfreich ist es, wenn man Englisch kann. Head = Kopf, Body = Körper.Wenn man ein HTML-Dokument erstellen will, muss man zuerst mit <html> anfangen. Dieses Tag kündigt also dem Browser (Das Teil, mit dem ihr surft) an, dass ein "ProgrammierCode" folgt. Er interpretiert also das ganze HTML in Binärcodes, so dass der Browser (wie z.B.
Internet Explorer) daraus schlau wird.Es gibt TAGS und ATTRIBUTE.TAGS sind die Grundbefehle für HTML. Sie teilen eine Homepage auf.Attribute sind "Hilfen", bzw. die Eigenschaften eines Tags, die bei den Grundbefehlen Feinheiten machen, z.
B. stellt man damit die Farbe ein, die Textfarbe, Textgröße etc.Man öffnet jedes HTML mit <> und schließt es mit </>...Nehmen wir als Beispiel das TAG für das HTML, der würde dann so aussehen:<html> - geöffnet</html> - geschlossen .
.. Wichtig ist, das man jedes Tag/Attribut auch wieder schließt, da sonst Fehler aufkommen. Wenn ihr mit einem HTML-Editor arbeitet und ein TAG öffnet, schließt der Editor es automatisch - zumindest meistens. Falls dies nicht der Fall sein sollte, mein Tipp an Euch: Schließt gleich ein TAG, wenn ihr es öffnet.
1.
Schritt: <html></html>
2. Schritt: Eine Leerzeile dazwischen einfügen, damit ihr weiter schreiben könnt. Einfach per RETURN
<html>
</html>
3. Schritt: Weiter programmieren ;-) 3.1. TAGS - die wichtigsten <html></html> .
.. öffnet ein HTML-Dokument<head></head> ... öffnet den Kopf einer Seite<title></title> .
.. gibt den Namen der Homepage an. Der TITLE-TAG wird im HEAD-TAG geschrieben. (Beispiel für ein TITEL, wenn ihr auf einer beliebigen Seite seid, steht links oben im Browser der Name der Website)<body></body> ..
. den Rumpf/Körper eine Seite, in dem alles geschrieben wird.<font></font> ... ist der TAG für die Schrift.
.. hier kann man noch Attribute einsetzen, um Farbe/Größe/Dicke und dergleichen einzustellen.<p></p> ...
fügt einen Absatz ein<br> (wichtig: braucht man nicht schließen), unmittelbar die nächste Zeile wird angefangen<b></b> macht eine Schrift fett<i></i> macht eine Schrift kursiv3.2. ATTRIBUTE - die Grundattribute<bg bodycolor="#xxxxxx"> ändert die Hintergrundfarbe<font color="#xxxxxx"> stellt die Schriftfarbe ein<img src="....
.jpg/gif"> dient dazu, ein Bild einzufügen ...<a href="https://www..
.....de"></a> fügt einen Link zu eienr Seite ein
<a href="..
date.jpg> sorgt dafür, dass man eine Datei downloaden kann (die Datei muss auf einem Server liegen, also online gestellt sein)<align="xxxx"> (left, right oder center) ... legt fest, wo der Text horizontal steht<valign="xxx"> (top, middle oder bottom) legt fest, wo der Text vertikal steht3.3.
"sauberes HTML" mit Quelltext und Erklärung<html><head><title>Der TitleTag steht im Head-TAG</title></head><body><body bgcolor="#ffffff"><font color="#ff0000"><p align="center">Hier sind nur einige Beispiele dafür, wie das dann aussehen soll</p><p align="left">Den Text wollte ich links haben durch das align-Attribut</p><b><p align="right">Das hier soll Fett sein durch das B-TAG und rechts stehen</p></b><i>Der Test ist kursiv geschrieben durch das I-TAG und hier<br>wird durch br-TAG in der neuen Zeile angefangen</i><b><p align="center">Der Text ist Fett und steht mittig</p></b><i><b><p align="left">bevor ich es vergesse, man kann auch kombinieren</p></b></i></font></body></html>3.4. Eine Tabelle - Erklärung und Quelltext
TAGS****<table></table> öffnet eine Tabelle, schließt eine Tabelle<tr></tr> fügt eine Zeile ein<td>...</td> fügt eine Spalte einATTRIBUTE*********<table border> zeigt die einzelnen Kästchen an<table height="100%"> die Größe der Tabelle<table width="100%"> die Breite der Tabelle<td colspan=X></td> X ist die Anzahl der Spalten, die als Breite der Spalte dienen<td rowspan=X></td> X ist die Anzahl der Zeilen, die als "Höhe" der Spalte dienen<td valign="X"></td> (X= middle, top oder bottom) stellt ein, wo der Text eines Zellblocks steht<tr bgcolor="#xxxxxx"></tr> gibt die Farbe einer Zeile anQuelltext einer Tabelle***********************<html><head><title>Eine Tabelle</title></head><body><b><i><p align="center">Hier ist die Tabelle</p></i></b><table border height="50%" width="50%" align="center"><tr><td>eine Spalte</td><td>noch eine Spalte</td><td>und die letzte Spalte</td></tr><tr><td valign="middle" align="center">hier steht der Text mittig</td><td valign="middle" align="right">hier mal rechts</td><td valign="middle" align="left">hier mal links</td></tr><tr bgcolor="#ff0000"><td valign="bottom" align="center">hier mal unten mit Hintergrund</td><td align="center" valign="middle">hier einfach so mit Hintergrund</td><td valign="bottom" align="right">jetzt unten rechts mit Farbe</td></tr><tr><td colspan=2 align="center">hier mal eins mit zwei Spalten</td><td rowspan=2 align="center" valign="middle">hier mal eins mit zwei Zeilen</td></tr><tr><td>aber eine geht noch</td><td>eine ganz normale</td></tr></table></body></html>Wenn er sehen wollt wie das alles aussieht, schreibt mir einen Kommentar oder kopiert euch das komplette HTML in ein Textdokument und öffnet es im Browser !4.
Ausbau und Vervollständigung einer HP
Nun durch HTML selbst kann man eine Page mit Tabellen, Listen, Bildern und Links erstellen. Aber was kann man noch machen ? Da gibt es sowas wie JAVA,PHP und Flash ... um einer Homepage den richtigen "Flair" zu geben. Diese Dinge dienen eigentlich nur dazu, einer Homepage eine Menüführung zu geben, spezielle "Funktionen" zu aktivieren, z.
B. eine Uhranzeige in der Statusleiste zu erstellen.5. Fazit
Ich finde das HTML ausreichend ist, um eine anschauliche und funktionsfähige Homepage zu designen. Meine Page (https://www.schwarzes-ciao.
de.vu) habe ich auch via HTML erstellt.Wie schaut es aus, mit dem Lernen von HTML ? Am Anfang viel es mir sehr schwer, das HTML zu lernen, da man nur wirres Zeug sieht an Befehlen, Klammern und dergleichen. Doch wenn man sich intensiv damit beschäftigt, fällt es einem auch leichter. Es gibt zudem viele Onlinehilfen, die einem das Lernen erleichtern, so dass eigentlich jeder, der sich damit befasst, auch zu guten Ergebnissen kommen wird.
| Anmerkungen: |
| impressum | datenschutz
© Copyright Artikelpedia.com
