HTML: Grundgerüst erstellen – So gehts

Nicht deine Sprache?

Wenn du eine Webseite mit HTML erstellen möchtest dann hat auch HTML ein Grundgerüst nach dem du dich richten kannst.

Zuerst kommen immer die Doctype Informationen für den Browser, diese hab ich dir unten noch etwas näher erklärt.

  • Jedes HTML Dokument beginnt mit dem <html> Tag und endet mit dem </html> Tag.
  • Dann kommt das <head> Tag gefolgt von dem <body> Tag

HTML Grundgerüst

Nachfolgend findest du das HTML Grundgerüst und die einzelnen Abschnitte erklärt

<!DOCTYPE html>
<html lang="de">

<head>

<!-- Scripts, CSS, Metadaten -->

   <meta charset="UTF-8">
   <title>Titel deiner Webseite</title>
   <meta name="description" content="Kurzbeschreibung deiner Webseite">
   <link href="design.css" rel="stylesheet">

</head>
   
<body>

<!-- Inhalt deiner Webseite -->

</body>

</html>

Doctype

Die Doctype Informationen sagen dem Browser, welche Befehle jetzt auf ihn zu kommen und an welchen Standart man sich gehalten hat. Ebenfalls wird dem Browser mitgeteilt was alles zulässig ist und wo ein Fehler ausgegeben werden muss. Im oberen Beispiel ist es html

<!DOCTYPE html>

Html Tag

Im Tag wird die Sprache der Webseite definiert. Das Attribut für eine Deutsche Webseite währe wie in dem Beispiel.

<html lang="de">

Head Bereich

Der Head Bereich erhält wichtige Meta Informationen zu deiner Webseite. Zudem werden im Head Bereich zusätzliche Scripte, und deine CSS Dateien eingebunden. Zudem wird im Head Bereich der Titel deiner Webseite definiert. Dieser Titel erschein im Browserfenster und in den Google Suchergebnissen.

<head>

<!-- Scripts, CSS, Metadaten -->

   <meta charset="UTF-8">
   <title>Titel deiner Webseite</title>
   <meta name="description" content="Kurzbeschreibung deiner Webseite">
   <link href="design.css" rel="stylesheet">

</head>

Body Bereich

Jeder Code der in den Body Bereich geschrieben wird, wird vom Browser sichtbar gemacht. Nur in diesem Bereich des HTML Grundgerüsts wird die Seite angezeigt. Dieser Teil der Webseite wird also sichtbar.

<body>

<!-- Inhalt deiner Webseite -->

</body>

Jetzt HTML lernen

[the_ad_group id=“4427″]

Weitere Beiträge zu HTML

HTML: Text in Zwischenablage kopieren – So gehts
HTML: Grundgerüst – Webseite erstellen
HTML: Textarea erstellen – So gehts
PHP in HTML einfügen – So gehts!
HTML: Rahmen um Text – So gehts

HTML Datei öffnen – Kostenloser Editor 2021
HTML: Anker erstellen – So wirds gemacht!
HTML: 302 Redirect – So einfach gehts!
HTML: URL Parameter Erklärung
HTML: Bild einfügen – So gehts!

Jquery in HTML einbinden : So wirds gemacht!
HTML: Zurück Button & Link erstellen: So gehts!
HTML: Versteckter und Unsichtbarer Text : So gehs
HTML: Großbuchstaben schreiben: So gehts!
HTML: Icons einfügen: So gehts!

HTML: iFrame in Webseite einbinden – So gehts!
HTML: Liste erstellen – So gehts!
HTML: Erzwungenes Leerzeichen einfügen – So gehts!
CSS in HTML einbinden – So gehts!
HTML: Leerzeichen erstellen – So einfach gehts!

HTML: Auskommentieren – So gehts!
HTML: Bild zentrieren und mittig ausrichten
HTML: Fett schreiben – So einfach gehts!
HTML Text ausrichten: rechtsbündig & linksbündig
HTML: Zeilenabstand einstellen – So gehts!

HTML: Trennlinie einfügen – So gehts!
HTML: Absatz einfügen – So gehts!
HTML: Horizontale Linie – So gehts
HTML: Tabellen erstellen – So gehts!
HTML: Datum & Uhrzeit anzeigen – So gehts!


Über Mich



    html        html grundgerüst   

Generic selectors
Exact matches only
Search in title
Search in content
Post Type Selectors
smileys


OpenOffice: Textfeld einfügen und bearbeiten – So gehts

Textfelder sind in OpenOffice extrem hilfreich wenn du Dokumente erstellen möchtest. Ein Textfeld in OpenOffice...

OpenOffice: Sprache ändern und einstellen – So gehts

Oft ist OpenOffice nicht in der Sprache in der du arbeiten möchtest. Aber keine Sorge...

FritzBox: eigene Rufnummer anzeigen – So gehts

Oft hat man einen neuen Kabelanschluss oder ein neues Telefon, aber man weiß selbst garnicht...

FritzBox: Energiesparmodus aktivieren – So gehts

Wenn man an die Umwelt denkt, dann hat sich auch AVM darüber Gedanken gemacht. Denn...

FritzBox: Update & aktualisieren- So gehts

Es ist wichtig immer die Neusten Sicherheitsupdates für deine FritzBox zu installieren. Das ist nicht...

FritzBox: Einstellungen sichern und speichern

Oft ist es nicht schlecht ein Backup von den Einstellungen deiner FritzBox zu erstellen. Das...

FritzBox: Sprache ändern – So gehts

Wenn Deutsch nicht deine Muttersprache ist, dann kannst du die Sprache deiner FritzBox ändern und...

FritzBox: Sendeleistung erhöhen – So gehts

Hast du das Gefühl das deine Fritzbox nicht mit maximaler Power sendet? Du möchtest die...

FritzBox: Funkkanal ändern – So gehts

Wenn auf deinem jetzigen Funkkanal viele andere Router sind, dann solltest du ihn ändern um...

FritzBox: WLAN Name ändern – So gehts

In diesem Hilfebeitrag werde ich dir zeigen, wie du den Namen deiner FritzBox ändern kannst...

FritzBox: Zeitzone einstellen und ändern – So gehts

Normalerweise musst du die Uhrzeit von deiner Fritzbox nicht selber einstellen. Sie wird automatisch von...

FritzBox: Rufnummer sperren – So gehts

Na, bist du auch genervt von lästigen Anrufen? Keine Sorge, mit der Fritz!Box kannst du...

FritzBox: DNS Server ändern – So gehts

Natürlich kann ich Dir dabei helfen, den DNS Server in Deiner Fritzbox zu ändern. Mit...

FritzBox: Gastzugang einrichten – So gehts

Klar, ich helfe dir gerne dabei, einen Gastzugang auf deiner FritzBox einzurichten. Hier ist eine...

FritzBox: Kennwort ändern – So gehts

Wenn du das Kennwort deiner FritzBox ändern möchtest, kannst du dies ganz einfach über die...