1. Der Einstieg

Was ist HTML?

Die Abkürzung HTML steht für "Hypertext Markup Language", dies heißt auf Deutsch so viel wie "Hypertext Auszeichnungssprache".
Dabei handelt es sich um eine "Auszeichnungssprache" für Webdokumente, welche die Struktur und Objekte definiert (bzw. beschreibt).
Es ist somit keine funktionale Programmiersprache wie beispielsweise PHP, womit Berechnungen, usw... durchgeführt werden können.
HTML beschreibt das Aussehen einer Website, beispielsweise die Positionen eines Linkes (ein Verweis auf eine andere Internetseite) oder die Farbe des Textes. HTML wird auf Englisch geschrieben.

Was kann ich mit HTML machen?

Wie schon erwähnt ist HTML eine reine "Auszeichnungssprache", d. h. dynamische Elemente wie Variablen, bewegte Links, und Ähnliches kann mit reinem HTML nicht realisiert werden.
Dazu sind dann z. B. JavaScript- oder PHP-Kentnisse erforderlich, welche jedoch wiederum HTML als Grundkentnisse vorraussetzen.

Welche Anschaffungen muss ich machen um HTML programmieren zu können?

Gar keine. Sie brauchen lediglich einen beliebigen Texteditor (wie z. B. Notepad), welcher bei jedem Betriebssystem schon mitgeliefert ist.
Denn HTML-Dateien bestehen aus ganz normalen Buchstaben, die jeder beliebige Texteditor lesen und auch bearbeiten kann. Es sind somit keine Anschaffungen zu tätigen.

1.Die Syntax

Die Grundsyntax

HTML stammt ursprünglich von einer Sprache namens SGML (Standard Generalized Markup Language) ab, welche die Vorgabe für andere Sprachen festlegt. Eine HTML-Datei besteht aus sogenannten Tags (bereits vorgegebene Namen, um Objekte darzustellen, z. B. Links oder Bilder), welche wiederum Attribute (Eigenschaften) enthalten.
Tags werden immer mit dem Kleiner-als-Zeichen ( < ) eingeleitet, anschließend folgt der Name des Tags und zum Schluss wird der Tag mit dem Größer-als-Zeichen ( > ) abgeschlossen.
Die Tags müssen, nachdem sie geöffnet wurden, wieder geschlossen werden. Dazu kommt, wo er geschlossen werden soll, vor den Namen des Tags ein Slash ( / ).
Tipp: Merken Sie sich zuerst einmal, dass alle Tags, die geöffnet werden, auch wieder geschlossen werden müssen, zu Ausnahmen kommen wir später noch.

<tag>
Text
</tag>
  > Listing 1.1: Beispiel für einen Tag

Zwischen der Öffnung und der Schließung des Tags kommt dann der Inhalt des Tags.
Attribute kommen nach den einleitenden Anfang des Tags und werden durch ein Leerzeichen voneinander getrennt.
Man weist ihnen durch den Gleichheits-Operator ( = ) einen Wert, der in Anführungszeichen ( " ) gesetzt wird, zu.
Die Reihenfolge der Attribute in einem Tag kann beliebig sein. Es können im Code beliebig viele Zeilenumbrüche gemacht bzw. weggelassen werden.

<tag attribut="wert">
Text
</tag>
  > Listing 1.2: Beispiel für einen Tag mit Attribut

Die HTML-Grundstruktur

Die HTML-Grundstruktur ist eine Vorraussetzung bei allen HTML-Dokumenten und sollte immer zuerst geschrieben werden.
Sie fängt mit dem Tag <html> an, der zuerst die HTML-Seite einleitet. Anschließend kommt zwischen den <html>-Tag der <head>-Tag, welcher den Kopf einleitet.
In den <head>-Tag kommt alles Unsichtbare (wie die Gedanken), z. B. Informationen für Suchmaschinen.
In den <html>-Tag kommt außerdem auch noch der <body>-Tag, er ist sozusagen der Körper und hierein kommt alles Sichtbare, alles was der Benutzer sehen soll. Merken Sie sich die HTML-Grundstruktur sehr gut!

<html>
<head>
</head>
<body>
</body>
</html>
  > Listing 1.3: HTML-Grundstruktur

Der Dokumenttyp

Da es im Internet neben HTML noch weitere "Auszeichnungssprachen", teilweise auch in verschiedenen Versionen gibt, ist es empfehlenswert, dass Sie einen Dokumenttyp einbinden. Der Dokumenttyp wird noch vor dem "<html>"-Einleitungstag eingebunden, sodass der Browser erkennen kann, wie er mit den folgenden Informationen in der Datei umgehen muss. Verwenden Sie vorläufig den folgenden Dokumenttyp, die genaueren Einzelheiten hierzu werden Ihnen später noch vermittelt.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
</head>
<body>
</body>
</html>
  > Listing 1.4: HTML-Grundstruktur mit Dokumenttyp

Weiter zu Teil 2 (Textformatierung) >

(as)
Weitere Funktionen
Zur Artikel-Übersicht
Diesen Artikel ausdrucken
Haben Sie noch Fragen? Fragen Sie auf computer-portal.net.
Bewertung
Dieser Tipp wurde für sehr brauchbar mit 8 von 10 Punkten [ 105 Stimme(n) ] befunden.

Bewertung in Punkten [10 = genial, 1 = sehr schlecht]:      
Kommentare
Bisherige Kommentare ansehen:
 
flowgut erklärt

 
AldarisWirklich gut erklärt! Werden noch weitere Teile dazu gemacht?

 
andreas_schrothja, ich arbeite gerade an der Fortsetzung...

 
thebasket

 
thebasket ist echt sehr gut erklärt und ich werde bald auch mal eigene versuche starten dank euch

 
starke2005gut erklärt ischs ja aber ob ichs versteh ...

 
Tornadochrisnicht schlecht!

 
Sexychef´sWirklich gut erklärt! Werden noch weitere Teile dazu gemacht?


 
Bonttoll

 
vonktotal scheisse eigentlich aber man kann es ja noch besser machen!!!:

Inchen G.h

 
vonkne war net so gemeint hab mehr gesehen und meine Meinung geändert sie ist toatl genial

 
Bickecht super ich mache das gerade in der schule von daher ist das echt praktisch

 
MC.GudeWas wollt ihr von uns???????????????????????????????????????????????????????????

 
putzAffengeil

 
KiLLkans

 
heusiGut gemacht andy kann man hier auch nen HTML-Grundkurs machen ??
echt sau gut

 
gamer1991hi gibts den ganzen artikel auch zu downloaden wenn ja werhre nett wenn mir einer helfen könnte danielnebeling@gmx.de

 
sivarupangood job

 
russia2006gut erklärt muss ich schon sagen ich hab gleich aller verstanden.

 
russia2006gut erklärt muss ich schon sagen ich hab gleich aller verstanden.

 
k-star_crewcool

 
schm>:o

 
TheFabihttp://www.computer-tipps.net/forum/images/smilies/2.gif
http://www.computer-tipps.net/forum/images/smilies/2.gif

 
cheater14hi leute


 
spinnno durchblick!!!

 
stadmoiiin jungs alles klar bei euch? korrekte seite ihr gängsta GESAMTSCHULE SOLINGEN!!!!!!!!!!

 
demihi

 
stadmoiiin jungs alles klar bei euch? korrekte seite ihr gängsta GESAMTSCHULE SOLINGEN!!!!!!!!!!

 
stadmoiiin jungs alles klar bei euch? korrekte seite ihr gängsta GESAMTSCHULE SOLINGEN!!!!!!!!!!

 
stadmoiiin jungs alles klar bei euch? korrekte seite ihr gängsta GESAMTSCHULE SOLINGEN!!!!!!!!!!

 
demihi


Einen eigenen Kommentar verfassen:
Sie müssen sich erst registrieren um einen Kommentar verfassen zu können.

Bestellen
Abbestellen
    
    
    Weitere Informationen
  Welchen Browser nutzen Sie?
Internet Explorer
Mozilla
Mozilla Firefox
Netscape
Opera
Safari
Sonstige
    Ergebnis ansehen
    

News aus der Branche