Was sind die Grundlagen von HTML?
Veröffentlicht: 2023-09-25HTML (Hypertext Markup Language) ist ein grundlegender Baustein des Webdesigns in Orange County. Es handelt sich um eine Auszeichnungssprache, die zur Erstellung der Struktur und des Inhalts einer Webseite verwendet wird und die Grundlage aller Websites bildet. Wahrscheinlich sind alle Webdesigner im Laufe ihrer Karriere mit HTML in Berührung gekommen!
HTML ist die Standardsprache zum Erstellen statischer Webseiten. Dabei handelt es sich um Seiten, die sich ohne manuelle Bearbeitung des HTML-Codes nicht ändern, sodass Benutzer keinen Einfluss darauf haben.
Die Grundlagen von HTML
HTML besteht aus einer Reihe von Elementen oder Tags, und jedes Element stellt eine bestimmte Webseitenkomponente dar. Klingt einfach, nicht wahr? Das liegt daran, dass es so ist! Diese HTML-Dokumente werden mit einem Texteditor erstellt und mit der Erweiterung .html gespeichert. Damit ein einfaches HTML-Dokument ordnungsgemäß funktioniert, sollte es die folgenden Elemente enthalten:
Die <!DOCTYPE>-Deklaration
Die <!DOCTYPE>-Deklaration dient als Eröffnungsakt für Ihr HTML-Dokument und bereitet die Bühne, indem sie den Browser über die spezifische HTML-Version informiert, die Sie verwenden. Betrachten Sie es als eine freundliche Einführung, die sagt: „Hey, Browser, wir werden im HTML5-Rhythmus tanzen!“ HTML5 ist der aktuelle Star in der Welt der Webentwicklung und bringt eine Reihe spannender Funktionen und Verbesserungen mit sich. Wenn Sie also diese Erklärung einfügen, weisen Sie den Browser im Wesentlichen an, sich auf ein modernes, funktionsreiches HTML-Erlebnis vorzubereiten. Auf diese Weise stellen Sie sicher, dass Ihre Webinhalte korrekt dargestellt werden und alle coolen HTML5-Funktionen nutzen.
<!DOCTYPE html>
Das <HTML>-Element
Stellen Sie sich das <html>-Element als den großen Boss in Ihrem HTML-Dokument vor. Es ist der Oberboss, der Platzhirsch und derjenige, der für Ordnung sorgt. So wie ein Chef ein Unternehmen leitet, verwaltet das <html>-Element Ihre gesamte Webseite. Es ist der Ausgangspunkt und Container für alle anderen Elemente, die Sie zum Erstellen Ihrer Webinhalte verwenden.
In diesem <html>-Element finden Sie den Entwurf für Ihre Webseite, einschließlich der Elemente <head> und <body>. Das <head>-Element enthält wichtige Informationen zu Ihrem Dokument, wie den Titel, Meta-Tags und Links zu externen Ressourcen. Unterdessen enthält das <body>-Element alle sichtbaren Inhalte, die Benutzer sehen, wenn sie Ihre Website besuchen.
Kurz gesagt ist das <html>-Element das Gesamtbild, der Oberbefehlshaber und der ultimative Organisator Ihres HTML-Dokuments. Es stellt sicher, dass alles reibungslos läuft und dass Ihre Webseite strukturiert ist und Ihrem Publikum korrekt präsentiert wird.
Das <Head>-Element
Das <head>-Element ist wie das Gehirn Ihres Dokuments und enthält wichtige Informationen wie den Titel, Meta-Tags und Links zu ausgefallenen Dingen wie Stylesheets und Skripten. Auch wenn das <head>-Element auf Ihrer Webseite möglicherweise nicht sichtbar ist, spielt es eine entscheidende Rolle dabei, sicherzustellen, dass Ihre Website gut aussieht, eine gute Leistung erbringt und effektiv mit Benutzern und Suchmaschinen kommuniziert. Es ist wie die Kommandozentrale, die dafür sorgt, dass Ihre Webseite optimal funktioniert.
Das <Title>-Element
Das <title>-Element gibt den Titel des Dokuments an, der in der Titelleiste des Browsers angezeigt wird. Es ist nicht nur eine technische Voraussetzung, sondern auch ein leistungsstarkes Kommunikationsmittel. Die Erstellung eines klaren, prägnanten und relevanten Titels ist von entscheidender Bedeutung, um sicherzustellen, dass Ihre Webseite leicht erkennbar, zugänglich und sowohl für Benutzer als auch für Suchmaschinen ansprechend ist.
Das <Body>-Element
Das <body>-Element enthält den gesamten Webseiteninhalt, z. B. Text, Bilder, Videos und andere Elemente. Es ist wie die Hauptbühne eines Theaters – hier findet das gesamte Geschehen in Ihrem HTML-Dokument statt. Es ist einer der grundlegenden Bausteine jeder Webseite und seine Rolle ist recht einfach, aber dennoch wesentlich: Es enthält alle sichtbaren Inhalte, die Benutzer sehen, wenn sie eine Website besuchen.
HTML-Elemente
HTML-Elemente sind in öffnende und schließende Tags eingeschlossen und von spitzen Klammern umgeben. Das öffnende Tag beginnt mit dem Namen des Elements, gefolgt von etwaigen Attributen in Form von Name-Wert-Paaren. Das schließende Tag ist genau das gleiche wie das öffnende Tag, hat jedoch vor dem Elementnamen einen Schrägstrich (/) als eine Art schließende Bemerkung.
Der folgende Code erstellt beispielsweise eine einfache HTML-Seite:
<!DOCTYPE html>
<html>
<Kopf>
<title>Meine erste HTML-Seite</title>
</head>
<Körper>
<h1>Willkommen auf meiner Website</h1>
<p>Dies ist meine erste HTML-Seite.</p>
</body>
</html>
Hier ist das <html>-Element das Stammelement und enthält die Elemente <head> und <body>. Das <head>-Element enthält das <title>-Element, das den Titel des Dokuments angibt. Das <body>-Element enthält den Seiteninhalt, der eine Überschrift und einen Absatz umfasst. In einem typischen HTML-Dokument sollten Sie zuerst mit dem größten Element beginnen (in diesem Fall HTML) und dann beim Erstellen der Seite zu den kleineren Teilen übergehen (z. B. Kopf, Titel, Text usw.).
HTML-Attribute
HTML-Attribute liefern zusätzliche Informationen zu einem Element und sind im öffnenden Tag enthalten. Sie fungieren gewissermaßen als Deskriptor. Zu den häufigsten Attributen gehören die folgenden:
Das ID-Attribut
Das id-Attribut identifiziert ein Element und ermöglicht in JavaScript und CSS die Manipulation des Elements.
Das Klassenattribut
Das Klassenattribut gruppiert Elemente und ermöglicht so deren Formatierung mit CSS.
Das Style-Attribut
Das style-Attribut ist eine praktische HTML-Funktion, mit der Sie Stile direkt auf ein einzelnes Element anwenden können, direkt im HTML-Code. Es ist, als würde man diesem bestimmten Element ein modisches Makeover verpassen und Dinge wie Farben, Schriftarten und Abstände festlegen, ohne ein separates Stylesheet erstellen zu müssen. Dies kann praktisch sein, wenn Sie das Erscheinungsbild eines Elements schnell und einmalig ändern möchten, ohne die übrigen Stile Ihrer Website zu beeinträchtigen. Es ist also Ihr Werkzeug der Wahl, um bestimmten Elementen in Ihrem Webdesign einen Hauch von Einzigartigkeit zu verleihen.
Das Href-Attribut
Das href-Attribut wird in Links verwendet, um die URL der Zielseite anzugeben.
Abschluss
HTML ist die Grundlage des Webdesigns und für die Erstellung einer gut strukturierten Webseite unerlässlich. Sie sind die ersten Schritte zu einer vollwertigen Website! Daher ist es für jeden, der eine Website erstellen möchte, unerlässlich, die Grundlagen von HTML zu verstehen. HTML ist eine Auszeichnungssprache, die Elemente, Attribute und Inhalte umfasst. Jedes Element stellt eine bestimmte Komponente der Webseite dar und Attribute liefern zusätzliche Informationen zu einem Element. Mit HTML können Sie eine strukturierte, optisch ansprechende und interaktive Website erstellen.
Siehe verwandten Artikel hier: https://www.drivetrafficmedia.com/the-different-coding-linguals-of-web-design/
