HTML ist eine Markupsprache, die zum Erstellen von Webseiten verwendet wird. Wenn Sie gerade erst mit der Webentwicklung beginnen, fragen Sie sich wahrscheinlich, wie Sie mehrere Seiten in HTML erstellen können. Keine Sorge, wir werden Ihnen helfen, das herauszufinden!
Der erste Schritt beim Erstellen mehrerer Seiten in HTML besteht darin, eine separate Datei für jede Seite zu erstellen. Sie können dazu einen beliebigen Texteditor wie Notepad (Windows) oder Texteditor (Mac) verwenden.
Wenn Sie eine HTML-Datei erstellen, fügen Sie grundlegende HTML-Tags der Struktur hinzu. Beginnen Sie mit dem Öffnen und Schließen von Tags . Zwischen diesen Tags sehen Sie andere wichtige Tags wie und .
Innerhalb eines Tags können Sie einen Seitentitel mit einem Tag hinzufügen . Der Titel wird in der Registerkarte des Browsers angezeigt.
Erstellen einer neuen HTML-Datei
Um eine neue HTML-Datei zu erstellen, öffnen Sie einen Texteditor wie Notepad++ oder Sublime Text und erstellen eine neue leere Datei. Sie können auch einen einfachen Texteditor wie Notepad verwenden, wenn Sie keinen Zugriff auf andere Programme haben.
Nachdem Sie eine neue Datei erstellt haben, speichern Sie sie mit der Erweiterung ".html" - Dies ermöglicht es dem Computer, es als HTML-Dokument zu erkennen. Sie können einen beliebigen Namen für die Datei auswählen, aber es ist eine gute Praxis, einen aussagekräftigen Namen zu verwenden, der mit dem Inhalt der Inhalte auf der Webseite verknüpft ist.
Öffnen Sie die neu erstellte Datei in einem Texteditor, und beginnen Sie mit dem Schreiben von HTML-Code. Der gesamte Inhalt der Webseite wird zwischen dem öffnenden und dem schließenden Tag platziert und .
Sie sollten auch einen Seitentitel mit einem Tag hinzufügen . Innerhalb eines Tags können Sie den Seitentitel mit einem Tag angeben. Ein Beispiel:
Моя первая веб-страница Anstelle des Kommentars " " können Sie beginnen, Inhalte Ihrer Webseite wie Text, Bilder, Links und andere HTML-Elemente hinzuzufügen.
Sobald Sie mit dem Schreiben des HTML-Codes für Ihre Webseite fertig sind, speichern Sie die Datei und öffnen Sie sie zum Anzeigen in einem Webbrowser. Sie sollten Ihre neue HTML-Seite mit dem hinzugefügten Inhalt sehen. Herzlichen Glückwunsch, Sie haben gerade eine neue HTML-Datei erstellt!
Öffnen einer Datei im Code-Editor
Es gibt viele Code-Editoren, und jeder hat seine eigenen Besonderheiten und Fähigkeiten. Einige beliebte Code-Editoren umfassen:
- Visual Studio Code: Ein kostenloser Code-Editor, der von Microsoft entwickelt wurde. Unterstützt viele Programmiersprachen, einschließlich HTML.
- Sublime Text: Leistungsstarker und flexibler Code-Editor mit umfangreichen Anpassungsmöglichkeiten und Erweiterungen.
- Atom: Ein kostenloser Code-Editor, der vom GitHub-Team erstellt wurde. Hat eine einfache Benutzeroberfläche und viele Erweiterungen.
Führen Sie die folgenden Schritte aus, um eine HTML-Datei im Code-Editor zu öffnen:
- Starten Sie den von Ihnen gewählten Codeeditor.
- Wählen Sie die Option Datei öffnen oder verwenden Sie Strg+ O (unter Windows) oder Cmd+O (unter Mac).
- Suchen und wählen Sie die HTML-Datei aus, die Sie öffnen möchten.
- Klicken Sie auf die Schaltfläche Öffnen oder drücken Sie die Eingabetaste.
Nachdem Sie diese Schritte ausgeführt haben, öffnet der von Ihnen ausgewählte Codeeditor die HTML-Datei und Sie können mit der Bearbeitung beginnen. Sie können alle HTML-Tags, Text und andere Elemente sehen, aus denen die Seite besteht.
Wenn Sie eine HTML-Datei im Code-Editor bearbeiten, können Sie die Struktur und den Inhalt der Seite ändern, neue Elemente hinzufügen und das Erscheinungsbild anpassen. Wenn Sie Änderungen vornehmen, können Sie die Datei speichern und die Ergebnisse in einem Webbrowser anzeigen.
Die Verwendung eines Code-Editors vereinfacht das Erstellen von Webseiten und ermöglicht es Ihnen, mit HTML-Dateien auf einer fortgeschritteneren Ebene zu arbeiten. Dank der vielen Funktionen und Funktionen des Editors können Sie effektive und qualitativ hochwertige Websites erstellen.
Definieren der Hauptseitenstruktur
Wenn Sie eine Webseite erstellen, ist es wichtig, ihre Hauptstruktur zu definieren. Dies hilft Ihnen, den Inhalt der Seite zu organisieren und die Organisation der Seite für die Benutzer verständlich zu machen.
Die Grundstruktur der Seite umfasst den Titel, den Hauptinhalt und die Fußzeile.
Der Titel ist wichtig, da er die Benutzer über das Thema der Seite informiert. Es befindet sich normalerweise oben auf der Seite und kann den Namen einer Website oder einer bestimmten Seite enthalten.
Der Hauptinhalt ist dort, wo sich alle grundlegenden Informationen befinden, die Sie auf der Seite bereitstellen möchten. Hier werden normalerweise Text, Bilder, Videos und andere Inhaltselemente platziert.
Eine Fußzeile ist der Bereich am unteren Rand der Seite, der zusätzliche Informationen wie Links zu sozialen Medien, das Erstellungsdatum der Seite oder ein Texter enthalten kann.
Die Organisation der Hauptstruktur der Seite kann unterbrochen werden, wenn Sie die entsprechenden HTML-Tags und -Elemente nicht verwenden. Sie können ein h1- oder h2-Tag verwenden, um einen Titel zu definieren, und für den Rest des Inhalts können Sie Absatz–Tags verwenden
oder Listenelemente
- ,
- . Sie können beispielsweise eine Liste von Elementen verwenden
um ein Navigationsmenü in der Fußzeile zu erstellen. Denken Sie also beim Erstellen einer Webseite daran, ihre Grundstruktur zu definieren, um sie verständlich und benutzerfreundlich zu machen.
Titel hinzufügen
Im HTML-Code wird der Titel verwendet, um den Haupttitel einer Seite oder eines Abschnitts anzugeben. Verwenden Sie ein Tag, um dem HTML einen Titel hinzuzufügen, , und so weiter bis . Die Zahl nach "h" im Tag gibt die Wichtigkeit des Titels an. Je kleiner die Zahl ist, desto wichtiger ist die Überschrift. Wenn Sie beispielsweise den Haupttitel einer Seite angeben möchten, können Sie den folgenden Code verwenden:
Моя веб-страница
. und so weiter. Zum Beispiel:
Введение
Текст
Пункт 1
Текст
Пункт 2
Текст
Auf diese Weise hilft das Hinzufügen eines Titels im HTML-Code, die Informationen auf der Seite zu organisieren und zu strukturieren, damit sie leicht gelesen werden können.
Einfügen von Textinhalten
Sie können auch ein Tag verwenden um den Text kursiv zu formatieren und ihm eine besondere emotionale Färbung zu verleihen. Anwendungsbeispiel: Dieser Text wird in Fettschrift hervorgehoben Dieser Text wird kursiv dargestellt und hat eine besondere emotionale Färbung Auf diese Weise können wir mit HTML Textinhalte einfach und bequem in eine Webseite einfügen.
Hinzufügen von Bildern
Hier ist ein Beispielcode, der der Seite ein Bild hinzufügt:
- Beginnen Sie mit dem Öffnen des Tags
.
- Geben Sie im Attribut src den Pfad zum Bild an (dies kann entweder ein lokaler Pfad auf Ihrem Computer oder eine Internet-URL sein).
- Falls gewünscht, können Sie dem Bild alternativen Text hinzufügen, indem Sie das Alt- Attribut verwenden. Dieser Text wird angezeigt, wenn das Bild aus irgendeinem Grund nicht gefunden oder geladen wird.
Hier ist ein Beispielcode mit einem Katzenbild:
Beachten Sie, dass der Bildpfad ( src ) relativ zum Speicherort der HTML-Datei angegeben wird. Wenn sich das Bild im selben Verzeichnis wie die HTML-Datei befindet, geben Sie einfach nur den Dateinamen an.
Beim Hinzufügen von Bildern zu einer Webseite wird empfohlen, die Breite und Höhe des Bildes mit den Attributen width und height anzugeben, um zu verhindern, dass das Bild heruntergeladen und langsam geladen wird.
Jetzt wissen Sie, wie Sie Bilder mithilfe eines Tags zu einer Webseite hinzufügen . Viel Spaß beim Codieren!
Erstellen von Links
Verwenden Sie die folgende Syntax, um einen Verweis zu erstellen:
- ein href - Attribut, das die Adresse (URL) der Seite oder Ressource angibt, zu der der Link führt;
- linktext - Der Text, der als Link angezeigt wird.
Als Ergebnis der Webseite wird ein Link mit dem Text "Klicken Sie hier, um zur Website zu gelangen" angezeigt. Wenn Sie auf diesen Link klicken, wird der Benutzer an die im href-Attribut angegebene Adresse weitergeleitet.
Zusätzlich zu Textlinks können Sie Links zu Bildern oder anderen Medieninhalten erstellen. Verwenden Sie dazu die folgende Syntax:
- das src- Attribut, das den Pfad zum Bild angibt;
- alt ist ein Attribut, das einen alternativen Text angibt, der angezeigt wird, wenn das Bild nicht geladen werden kann.
Als Ergebnis der Webseite wird ein Bild angezeigt, das als Link zur Website dient. Wenn Sie auf dieses Bild klicken, wird der Benutzer an die im href-Attribut angegebene Adresse weitergeleitet.
Speichern und Anzeigen einer Seite
Wenn Sie Ihre Seite in HTML erstellt haben, müssen Sie sie speichern, um sie in einem Webbrowser anzeigen zu können. Um die Seite zu speichern, müssen Sie die folgenden Schritte ausführen:
Schritt 1: Öffnen Sie den Texteditor, in dem Sie die Seite erstellt haben.
Schritt 2: Klicken Sie im oberen Menü des Editors auf die Schaltfläche "Speichern".
Schritt 3: Wählen Sie den Ordner aus, in dem Sie Ihre Seite speichern möchten.
Schritt 4: Geben Sie einen Dateinamen für Ihre Seite ein. Der Name muss die Erweiterung "html" oder "htm" haben, z. B. "mypage".html".
Schritt 5: Klicken Sie auf die Schaltfläche "Speichern", um Ihre Seite im ausgewählten Ordner zu speichern.
Nachdem Sie Ihre Seite jetzt gespeichert haben, können Sie sie in einem Webbrowser anzeigen. Führen Sie dazu die folgenden Schritte aus:
Schritt 1: Öffnen Sie einen Webbrowser auf Ihrem Computer.
Schritt 2: Klicken Sie auf die Schaltfläche "Datei öffnen" oder geben Sie den Befehl "Strg+ O" ein.
Schritt 3: Wählen Sie im angezeigten Fenster die Datei Ihrer Seite aus und klicken Sie auf Öffnen.
Schritt 4: Jetzt sollten Sie Ihre Web-Browser-Seite sehen.
Beachten Sie, dass Sie mit dem Internet verbunden sein müssen, um Ihre Seite anzuzeigen, wenn Sie einen Webbrowser verwenden, um die Seite herunterzuladen.
