Alle Kategorien
Suche

Ein HTML-Dokument erstellen - so funktioniert's

HTML-Dokumente am besten strukturiert mit einem HTML-Editor erstellen
HTML-Dokumente am besten strukturiert mit einem HTML-Editor erstellen
Einfache HTML-Dateien können Sie im Grunde schnell und einfach mit jedem Texteditor Ihrer Wahl schreiben und speichern. Wenn Sie allerdings öfter Dokumente erstellen oder relativ ausgiebig programmieren, empfiehlt es sich, einen speziellen HTML-Editor zu nutzen, da dieser deutlich mehr Funktionen und Übersichtlichkeit bietet. Unabhängig vom jeweiligen Editor funktioniert das Erstellen der HTML-Dokumente nach demselben Prinzip und erfordert keine großen Vorkenntnisse.

Einne passenden Editor zum Erstellen verwenden

Grundsätzlich können Sie bei jeder Programmiersprache jeden beliebigen Editor nutzen, um den entsprechenden Code zu schreiben und die Datei dann abzuspeichern.

  • Allerdings haben Sie dann bei einigen Programmiersprachen das Problem, dass Sie den Quellcode nicht ausführen oder überprüfen können, was zum Beispiel bei PHP oder Java der Fall ist. 
  • HTML gehört zu den einfachsten Programmiersprachen, sodass Sie die Dokumente theoretisch auch mit dem Standardeditor Ihres Betriebssystems bei Windows erstellen könnten - also bei Windows mit Notepad, bei Mac OS X mit TextEdit und bei Linux zum Beispiel gedit oder Kate.
  • Wenn Sie jedoch einen speziellen Editor installieren, der zumindest HTML unterstützt, haben Sie je nach Programm verschiedenste Funktionen, die Ihnen das Erstellen von HTML-Dateien deutlich vereinfachen. 
  • Standardmäßig verfügen alle Programme über die Funktion "Syntax-Highlight", welche Ihnen die einzelnen Tags und Attribute farblich hervorhebt, sodass Sie den Quellcode übersichtlicher dargestellt bekommen. Zudem gibt es oftmals die Möglichkeiten, den Quellcode überprüfen zu lassen, das fertige HTML-Dokument direkt innerhalb der Software zu betrachten oder Ihre Dateien über einen integrierten Dateimanager einfach aufzurufen.
  • Zum Einstieg in HTML sollten Sie am besten zunächst ein kostenloses Programm verwenden. Dieses hat neben dem finanziellen Aspekt noch den Vorteil, dass der Funktionsumfang auf die wichtigsten Optionen beschränkt ist und Sie sich somit schnell in das Programm einarbeiten können. Kostenpflichtige Software ist dann für spätere Arbeiten empfehlenswert, wenn Sie zum Beispiel Ihre Programmierarbeit erweitern und Techniken wie JavaScript, jQuery oder PHP erlernen. 
  • Als Freeware sind unter anderem "Notepad++", "Webocton - Scriptly" und HTML Phase 5 empfehlenswert. Bei den kostenpflichtigen Editoren sind UltraEdit und phpDesigner zu empfehlen, die Sie auch für 45 bzw. 21 Tage kostenlos ausprobieren können. Beim phpDesigner haben Sie zudem die Möglichkeit, ältere Versionen ("Older Downloads") dauerhaft kostenfrei zu nutzen. 

HTML-Dokument mit einem Editor schreiben und speichern

  1. Starten Sie entweder den Standardeditor Ihres Betriebssystems oder öffnen Sie einen speziellen HTML-Editor.
  2. Erzeugen Sie ein leeres Dokument, was Sie standardmäßig mit Strg+N machen können. Einige Editoren bieten Ihnen dabei die Möglichkeit, direkt HTML-Dateien zu erstellen, sodass einerseits das Syntax-Highlighting automatisch aktiviert wird und anderseits teilweise bereits ein Grundgerüst erzeugt wird. Sie finden die Option regelmäßig im Menü-Punkt "Datei" unter "Neu". Teilweise ist dies auch unter "Einfügen" eingebaut, wobei Sie dies erst nutzen können, wenn Sie bereits eine leere Datei angelegt haben.
  3. Unabhängig davon, was Sie mit Ihrer HTML-Datei darstellen möchten, benötigen Sie ein Grundgerüst. Dieses könnten Sie natürlich per Hand eingeben oder eine Vorlage verwenden, die Sie zum Beispiel bei SELFHTML finden. Der Internetdienst ist generell zu empfehlen, wenn Sie anfangen, HTML zu lernen. Sie finden auf dieser Seite ein Tutorial mit Beispielen, sodass Sie die Theorie mit der Praxis zusammen vermittelt bekommen.
  4. Sobald Sie Ihr Grundgerüst haben, könnten Sie die Datei theoretisch bereits abspeichern. Damit Sie aber auch einen Inhalt sehen, schreiben Sie im Body-Bereich einen beliebigen Text. Der Body-Bereich beginnt bei "<body>" und endet mit "</body>". Für die Ausgabe "Das ist ein Beispiel" müssten Sie also in Ihrer Datei neben den anderen Elementen zumindest "<body>Das ist ein Beispiel</body> stehen haben.
  5. Speichern Sie nun Ihr HTML-Dokument ab. Dafür können Sie standardmäßig die Tastenkombination Strg+S verwenden. Achten Sie dabei darauf, dass die Dateiendung "html" lautet, wobei auch "htm" möglich wäre.
  6. Um sich das Ergebnis anzuschauen, können Sie die Datei mit einem beliebigen Browser öffnen. Meist reicht dafür ein Doppelklick auf die Datei, sodass diese mit Ihrem Standardbrowser aufgerufen wird. Wenn Sie allerdings einen anderen Browser nutzen wollen oder die Dateiendung einer anderen Software zugewiesen wurde (zum Beispiel einem neu installierten Editor), müssen Sie einen Rechtsklick auf die Datei machen und bei "Öffnen mit" den gewünschten Browser auswählen. 
helpster.de Autor:in
Kevin Höbig
Kevin HöbigKevin ist ein alter Hase bei HELPSTER. Als Webdesigner und Mediengestalter, der auch auf journalistische Erfahrung zurückblicken kann, beschäftigt er sich nicht nur privat mit technischen Themen. Dank seines Wissens hilft er anderen oft mit praktischen Tipps weiter.
Teilen: