So erstellen Sie eine Webseite mit HTML-Codes
HTML ist die Sprache des Webs. HTML besteht aus Tags in eckigen Klammern, die Text und Grafiken umgeben und einem Webbrowser mitteilen, wie er damit umgehen soll. Die HTML-Codebibliothek enthält Tags, die Schriftart, Stil und Einrückung steuern, sowie spezielle Anzeigeformate wie Tabellen, Aufzählungslisten und Textumbruch. Die meisten HTLM-Tags werden paarweise geliefert, um den Browser darauf aufmerksam zu machen, wann eine bestimmte Funktion gestartet und wann gestoppt werden muss. Bestimmte Attribute, die Sie in die Tag-Klammern einfügen, legen die Funktion dieses Tags genauer fest.
Schreiben Sie den HTML-Code
1.Öffnen Sie den Editor im Menü „Start“ im Ordner „Zubehör“.
2.Geben Sie das Tag „<! DOCTYPE HTML>“ ein und lassen Sie die Anführungszeichen außerhalb der Klammern hier und überall oben auf Ihrer Seite weg. Fügen Sie in der nächsten Zeile das Tag „“ hinzu. Diese Kombination von Tags weist den Browser an, zu erwarten, dass HTML-Code folgt.
3.Drücken Sie einige Zeilenumbrüche und geben Sie „“ am unteren Rand Ihres Dokuments ein. Wenn Sie dies jetzt tun, können Sie nicht vergessen, das Eröffnungs-Tag später zu schließen.
4.Klicken Sie in eine leere Zeile zwischen dem öffnenden und schließenden Tag. Sorgen Sie sich nicht um zusätzliche Zeilen zwischen Ihrem Code. Der Browser ignoriert alle Leerzeilen in einem HTML-Dokument.
5.Geben Sie die Zeichenfolge “ .“ Zwischen dem Öffnen und Schließen .
6.Geben Sie das „“ Tag in die nächste Zeile ein, fügen Sie ein paar weitere Leerzeilen hinzu und geben Sie das abschließende „“ Tag ein. Der Inhalt Ihrer gesamten Webseite befindet sich zwischen diesen Tags.
7.Klicken Sie auf eine leere Zeile über dem schließenden Tag und geben Sie die “
„tag, um einen neuen Textabsatz zu beginnen. Klicken Sie zwischen Öffnen und SchließenTags, um Ihren Text hinzuzufügen. Jeder neue Absatz muss mit einem beginnen
Tag oder der Browser kann den Text nicht in eine neue Zeile verschieben.
8.Ändern Sie den Schriftstil Ihres Absatzes mit den Tag-Attributen „style“ und „font-family“ im
Tag mit dem Format
Dabei steht „name_of_font“ für die Schriftart, in der der Text in diesem Absatz angezeigt werden soll. Wenn Joe Smith beispielsweise seine Absatzschriftart in Verdana ändern möchte, sieht der Code folgendermaßen aus
9.Platzieren Sie den Text zwischen und Tags, wenn Sie fett oder kursiv schreiben möchten.
10.Fügen Sie Ihrer Seite ein Bild mit dem Tag hinzu . Dies ist eines der wenigen HTML-Tags, für das kein schließendes Tag erforderlich ist.
Verwenden Sie innerhalb des Tags das Attribut „src“, um den Speicherort der Bilddatei anzugeben. Wenn Joe Smith beispielsweise ein Bild von sich auf seiner Webseite einfügen möchte, würde er den Code verwenden . Das Attribut „alt“ beschreibt das Bild für Personen mit Sehbehinderungen, die Screenreader zum Surfen im Web verwenden, oder für den Fall, dass das Bild nicht in das Browserfenster geladen werden kann.
11.Fügen Sie Ihrer Seite einen Hyperlink mit dem hinzu Etikett. Geben Sie zwischen den Tags den Text ein, auf den der Besucher klickt, um zu dieser Seite zu gelangen. Verwenden Sie im Eröffnungs-Tag das Attribut „href“, um die URL anzugeben, zu der der Link führt, wenn Sie darauf klicken. Wenn Joe Smith beispielsweise auf seiner Webseite einen Link zu der Webseite seiner Schwester Sally Smith platzieren möchte, würde er den Code verwenden. Klicken Sie hier, um die Seite meiner Schwester Sally zu besuchen.
Speichern Sie die Datei im HTML-Format
1.Klicken Sie im Editor auf das Menü „Datei“ und wählen Sie den Befehl „Speichern unter“. Wählen Sie „Alle Dateien ( . )“ Aus dem Dropdown-Menü „Dateityp“.
2.Geben Sie Ihrer Datei im Feld „Dateiname“ einen Namen mit einem Wort und fügen Sie die Erweiterung „.HTM“ am Ende des Dateinamens hinzu.
3.Klicken Sie auf die Schaltfläche „Speichern“, um diese Editor-Datei als HTML-Datei zu speichern.
4.Klicken Sie mit der rechten Maustaste auf das Symbol für die gespeicherte Datei und wählen Sie „Öffnen mit“ aus dem Einblendmenü. Wählen Sie Ihre Webbrowser-Anwendung aus der Liste der vorgeschlagenen Anwendungen aus, um zu testen, wie die Webseite angezeigt wird, wenn Sie sie auf einen Webserver hochladen.
Tipps
- Das Tag fügt zur besseren Lesbarkeit automatisch einen zusätzlichen Abstand zwischen dem vorherigen und dem nächsten Absatz ein. Wenn Sie weniger Zeilenabstand benötigen, verwenden Sie das Tag für einen einfachen Zeilenumbruch anstelle eines Absatzumbruchs.
- Verwenden Sie ein Tag nach dem Tag an dem oberen Rand Ihres Dokuments, um eine bestimmte Schriftart auf der gesamten Webseite statt Absatz für Absatz anzuwenden. Definieren Sie innerhalb des Tags die Schriftart für alle Tags mit dem Code:
- p {Schriftfamilie: verdana;}
- HTML-Codedateien erfordern das Nur-Text-Format und die Dateierweiterung .HTM, damit ein Browser den Code erkennt und ausführt. Wenn Sie Code von Hand eingeben, ist es wichtig, einen Nur-Text-Editor zu verwenden. Aus diesem Grund eignet sich Notepad perfekt für diese Aufgabe. Wordpad und Microsoft Word können auch als reine Texteditoren fungieren. Sie müssen jedoch daran denken, die HTML-Codedatei im Dialogfeld „Speichern unter“ als „Nur Text“ zu speichern. Beide Programme hängen die Erweiterung „.TXT“ an die Datei an. Sie können die Dateinamenerweiterung jedoch später in „.HTM“ ändern, indem Sie im Windows-Explorer mit der rechten Maustaste auf das Dateisymbol klicken.
Warnungen
- Denken Sie beim Festlegen einer Schriftart im Tag oder im Tag daran, dass Browser nur Schriftarten anzeigen können, die im Betriebssystem des Computers verfügbar sind, der die Webseite anzeigt. Wenn der Computer nicht über die Schriftart verfügt, wird der Text in der Standardschriftart des Browsers angezeigt, normalerweise Times New Roman.
- Wenn Sie versuchen, HTML-Code in Microsoft Word einzugeben und das Dokument statt als Nur-Text als HTML zu speichern, interpretiert Word die HTML-Codes nicht und erstellt eine Webseite. Stattdessen konvertiert Word alle Zeichen auf der Seite in anzeigbaren Text. Dies führt dazu, dass alle HTML-Tags in ihren spitzen Klammern auf Ihrer Webseite angezeigt werden.
Solltest du aber doch eine WordPress Seite erstellen wollen, dann solltest du dir auf jeden Fall das Plugin von https://wp-webhooks.com/ genauer anschauen, mit dem du deine Seite besser verwaltest.
