HTML-Website

Eine Website zu erstellen, ist im digitalen Zeitalter keine schwierige Aufgabe mehr. Sie ist nicht mehr auf ausgefeilte Kodierung und komplexes Webdesign beschränkt. Es gibt unzählige Möglichkeiten, eine Website zu erstellen, und die Verwendung von HTML gilt als kostengünstiger Weg, eine Website zu erstellen. Du brauchst nicht viel technisches Know-how, um mit dem Schreiben von HTML-Code zu beginnen. Wenn du etwas Zeit hast, um deine Website zum Laufen zu bringen, kannst du auch HTML lernen und eine HTML-Website erstellen.

Dieser Artikel dient zwei Zwecken. Zum einen soll er Anfängern, die eine HTML-Website für ihr Unternehmen erstellen möchten, als Leitfaden für HTML dienen. Zum anderen soll er ihnen eine klare Vorstellung davon vermitteln, welche anderen Möglichkeiten sie haben, falls sie feststellen sollten, dass die Erstellung einer HTML-Website nicht wirklich ihr Ding ist.

Wir beginnen damit, dir die Grundlagen von HTML zu erläutern und dir die Schritte zu zeigen, die zur Erstellung einer funktionalen HTML-Website erforderlich sind. Um jedoch die Grundlagen von HTML zu verstehen, musst du einige grundlegende Begriffe und ihre Funktionen in einer HTML-Website kennen.

Was ist HTML und wie funktioniert es?

Wenn Sie HTML lernen und eine HTML-Website selbständig und ohne die Hilfe eines Entwicklers erstellen möchten, sollten Sie dieses HTML-Tutorial durcharbeiten, um mit der Erstellung Ihrer HTML-Website auf Touren zu kommen.

Zu wissen, wofür HTML steht, ist vielleicht nicht der Schlüssel zur Erstellung deiner HTML-Website, aber es wird dir später sicher helfen.

HTML steht für Hypertext Markup Language. Es handelt sich nicht um eine Programmiersprache. Sie kann nicht zur Erstellung dynamischer Webdesigns und Grafiken verwendet werden, sondern ermöglicht es dem Benutzer, das Design und die Struktur einer Website zu organisieren und zu formatieren. Mit HTML kannst du z. B. Abschnitte, Absätze, Überschriften, Links und Anwendungen erstellen.

Bestandteile einer HTML-Website

Um deine HTML-Website zu erstellen, solltest du einige wichtige Komponenten kennen. HTML-Websites haben zwei Hauptbestandteile:

  • Tags
  • Attribute

Obwohl sie gleichzeitig verwendet werden, dienen sie unterschiedlichen Zwecken.

∙ HTML-Tags

Ein HTML-Tag ist ein Mittel, mit dem du deiner HTML-Website Anweisungen geben kannst. Wenn du möchtest, dass deine Website eine Kopfzeile anzeigt oder das Seitenlayout organisiert, verwende ein Tag. Ein Tag wird im Allgemeinen durch spitze Klammern gekennzeichnet, und der darin enthaltene Text ist die Anweisung für den Tag.

Ein Beispiel für ein Tag ist:

Die meisten Tags müssen geöffnet < h1 > und geschlossen < /h1 > werden, damit sie funktionieren.

• HTML Attributes

HTML-Attribute hingegen liefern Anweisungen für bestimmte Tags, die sich hauptsächlich auf die Funktionalität beziehen. Sie befinden sich in der Regel innerhalb eines Tags und sind durch die gleichen spitzen Klammern gekennzeichnet. Sie werden verwendet, um Bilder, Videos, Links und andere externe Design- und Funktionsaspekte für die HTML-Website hinzuzufügen

Ein Beispiel für ein Attribut ist:

our latest product.

Hier sind die Bildquelle (src) und der Alt-Text (alt) Attribute des < img >-Tags.

Wie erstellt man eine Website mit HTML?

Du brauchst keine ausgefallene Software auf einem High-End-Computer, um eine HTML-Website zu erstellen. Du kannst es mit dem HTML-Editor auf deinem System machen, der meistens dein Notizblock ist. Sobald du den Notizblock geöffnet hast, kannst du die folgenden Schritte ausführen, um mit der Erstellung deiner HTML-Website zu beginnen.

∙ Der Doctype

Beginnen wir mit dem HTML-Doctype. Die Erstellung deiner HTML-Website beginnt in dem Moment, in dem du eine Doctype-Datei erstellst. Diese Datei teilt dem Webbrowser mit, dass es sich bei dem Dokument um eine HTML-Website-Datei handelt.

So beginnst du mit dem grundlegenden HTML-Code für deiner HTML-Website. Selbst wenn du eine relativ einfache Website erstellen willst, musst du eine Menge Code schreiben. Daher ist es immer ratsam, alle HTML-Dateien in einem einzigen Ordner zu speichern, damit du alles an einem Ort hast.

Hier ist eine Darstellung, wie dein Web organisiert ist.

HTML Aufbau Illustration

Bild von Strikingly genommen

Die Doctype-Datei teilt dem Browser lediglich mit, wie er die Datei lesen soll. Nun musst du Codes einfügen, die die Seiten, deines Design, deinen Inhalt und dein Layout spezifizieren. Zum Beispiel: Über-uns.html, Produkt.html, Dienstleistungen.html, Kontakt-uns.html, usw.

Jede dieser Seiten wird separat mit Codes erstellt, die ihre Besonderheiten festlegen.

∙ Weitere Tags

Der Doctype ist die Datei, die das Grundlayout der Seite festlegt. Anschließend musst du weitere Elemente und Attribute zu deiner HTML-Website hinzufügen.

Der < head >-Tag enthält alle Elemente und Attribute, die sich auf den Titel, den Meta-Tag usw. beziehen.

Mit dem < title >-Tag fügst du den Titel deiner Seite ein. Er erscheint in der Kopfzeile deiner Seite.

Der < meta >-Tag wird verwendet, um Informationen über das Dokument hinzuzufügen, z. B. Zeichenkodierung, Name (Seitenkontext), Beschreibung.

Schaue dir an, wie der Code für den Kopfbereich aussehen wird.

My HTML Website.

Wie fügt man Inhalte hinzu?

Der nächste Abschnitt ist der < body > Tag.

Hier wird der gesamte Inhalt Ihrer HTML-Website angezeigt. Dazu gehören Text, Bilder, Tabellen, Formulare und alle anderen Gestaltungselemente auf deiner HTML-Website.

∙ Hinzufügen von Überschriften zu deiner HTML-Website

In HTML werden Überschriften in die folgenden Elemente geschrieben:

Die Tags < h1 > und < h2 > sind die wichtigsten Überschriften, während die übrigen Tags als Zwischenüberschriften und andere zusätzliche Inhalte verwendet werden.

Hinweis: Diese Informationen helfen den Suchmaschinen-Bots zu verstehen, was in den Suchergebnissen angezeigt werden soll.

∙ Erstelle deine Überschrift

Lass uns das ausprobieren. Gebe in eine neue Zeile im HTML-Editor ein:

Welcome to My HTML Website

Speicher diese Datei unter dem Namen "index.html" in einem neuen Ordner und benenne sie als "meine Webseite". Öffne die Datei in deinem Webbrowser, um die Änderungen zu sehen.

∙ Wie fügt man Text in HTML hinzu?

Das Hinzufügen von Text zu unserer HTML-Seite ist ganz einfach: Wir verwenden ein Element, das mit dem Tag < p > geöffnet wird und einen neuen Absatz erzeugt. Wir platzieren unseren gesamten regulären Text innerhalb des Elements < p >.

Wenn wir Text in HTML schreiben, können wir auch eine Reihe anderer Elemente verwenden, um den Text anzupassen oder ihn auf eine bestimmte Weise erscheinen zu lassen.

Häufig verwendete HTML-Tags

HTML Abkürzungen

Bild von Strikingly genommen

Diese Tags müssen um den betreffenden Text herum geöffnet und geschlossen werden.

Probieren wir es aus. Gib in eine neue Zeile des HTML-Editors den folgenden HTML-Code ein:

Welcome to my HTML website. You can find all my latest updates here.

Speichere deine Seite, um deine Änderungen zu sehen.

Stylesheet hinzufügen

Erstelle ein Stylesheet und benenne es als 'style.css' und speichere es in einem neuen Ordner mit dem Namen 'css'. Diese Datei style.css wird uns helfen, deine Webseite zu gestalten.

Denke daran, direkt vor dem Schließen des head-Tags eine Zeile einzufügen, die lautet...

Diese Codezeile teilt dem Browser mit, dass er nach dem Stylesheet suchen muss, wenn er die Webseite lädt.

Jetzt kannst du mit der Erstellung deiner eigenen HTML-Website beginnen.

Warum solltest du deine Website nicht selbst programmieren?

Laptop

Bild von Strikingly Website Nutzer genommen

Eine eigene Website zu programmieren, scheint der beste Weg zu sein, eine Website einzurichten. Es gibt jedoch einige Nachteile, die du bedenken solltest, bevor du mit dem Programmieren deiner Website beginnst.

  • Es reicht nicht aus, wenn du nur über einige grundlegende Programmierkenntnisse verfügst, wenn du eine vollwertige Website einrichten willst. Du musst HTML gut beherrschen, sonst vergeudest du nur wertvolle Zeit, die du anderweitig hättest verwenden können.
  • Kodierung geht nicht schnell. Selbst wenn du einen Profi engagierst, wird es Zeit kosten. Du kannst dir also vorstellen, wie Zeitaufwendig es werden kann, einige HTML-Tutorials zu befolgen und deine HTML-Website zu erstellen.
  • Und es ist ja nicht so, dass deine Arbeit getan ist, sobald du die Website erstellt hast. Nein. Du musst deine Website auf dem neuesten Stand halten, das heißt, du musst die Codes ständig ändern. Das kann sich negativ auf dein SEO-Ranking auswirken.

Das Erlernen von HTML ist nicht so einfach, wie manche Lehrvideos es erscheinen lassen. Es gibt viele Feinheiten, die du vielleicht nicht verstehst und die dein Geschäft behindern könnten. Du kannst zwar vorgefertigte HTML-Vorlagen verwenden, aber das macht keinen großen Unterschied zur Realität. Und auch wenn eine HTML-Website zahlreiche Vorteile bietet, solltest du abwägen, was für dich am besten geeignet ist, und dich nicht von der Massenmeinung leiten lassen.

Ein Website-Builder ist ein Werkzeug, mit dem du das gleiche Ziel erreichen kannst, aber auf einem anderen Weg. Im Gegensatz zu einer HTML-Website, bei der du alle Codes für jeden einzelnen Aspekt des Designs und der Funktionalität manuell eingeben musst, verfügen Website-Builder über eingebaute Codes. Du musst nur wissen, welche Art von Design oder Funktion deine Website haben soll. Danach klicke einfach auf die Optionen, die dir gefällt, und fertig! Schon ist deine Website fertig.

Das kann viel einfacher sein als die Verwendung von HTML-Codes und ebenso beeindruckend.

Das Website-Builder-Tool hilft deinen Kunden, schnell vollwertige Websites zu erstellen. Dein Kunde kann auf der Grundlage des Webspace und der Anzahl der Webseiten, die mit einem bestimmten Plan angegeben werden, abgerechnet werden.

Die Änderung deiner HTML-Website ist nicht so schwierig wie zeitaufwändig. Wenn dein Unternehmen auf Hochtouren läuft, hast du vielleicht nicht die Zeit, für jede einzelne Änderung an deiner Website HTML-Codes zu schreiben. Andererseits verfügen Website-Baukästen über integrierte Designvorlagen, Farbpaletten und Funktionen, die nur einen Mausklick erfordern.

Vorteile der Verwendung eines Website-Builders

Hier sind einige überzeugende Gründe, die dich davon überzeugen, deine Website mit einem professionellen Website-Builder zu erstellen.

  • Du musst nicht programmieren - Ein großer Vorteil ist, dass du alles sofort zur Verfügung hast. Du musst nicht programmieren lernen oder verstehen, wie Website-Builder funktionieren. Alles, was du brauchst, ist ein Konto bei einem Website-Builder wie Strikingly einzurichten und mit der Bearbeitung einer der vielen kostenlosen Website-Vorlagen zu beginnen.
  • Schnell - Wenn du HTML lernst und eine Website erstellen willst, wird das nicht an einem Tag geschehen. Aber der Aufbau einer Website auf einer Plattform wie Strikingly ist viel schneller als der Aufbau einer HTML-Website. Der Prozess ist schnell, da die Codes bereits eingebaut sind. Du musst nur die richtigen Codes anwenden, um deine Website zu erstellen.
  • Benutzerfreundlich - Es kann sein, dass dir die Verwendung einer Plattform zur Erstellung von Websites völlig fremd ist. Trotzdem kannst du eine Website erstellen, die viel besser aussieht als eine HTML-Website. Nimm zum Beispiel die einfache Benutzeroberfläche von Strikingly. Jeder, der über grundlegende Computerkenntnisse verfügt, kann ohne externe Hilfe eine voll funktionsfähige Website erstellen.
  • Leicht zu aktualisieren Bei einer HTML-Website ist es eine echte Aufgabe, die Website zu ändern oder zu aktualisieren. Website-Builder wie Strikingly sind bemerkenswert einfach. Der benutzerfreundliche Aspekt reduziert die Verwaltung der Website auf ein paar Klicks. Das Hinzufügen einer neuen Seite, das Ändern eines Banners, das Hinzufügen einer E-Mail-Liste usw. kann mit äußerster Leichtigkeit erfolgen.
  • Erstelle großartige Websites - Die große Auswahl an Design, Layout, Farbschemata und Widgets hilft dir, eine Website nach deinen Vorstellungen zu erstellen. Im Vergleich zu einer HTML-Website hast du mit einer Plattform wie Strikingly nicht nur die Möglichkeit, eine atemberaubende Website zu erstellen. Mit einer Strikingly-Website wird dein Unternehmen bei den wichtigsten Interessengruppen deines Unternehmens bekannt gemacht, was deinem Unternehmen den nötigen Auftrieb gibt.

Anpassungen mit HTML vs. Strikingly

Dies ist ein Vergleich, wie du deine Website mit HTML im Vergleich zu einem Website-Builder erstellen würdest. Website-Builder sind im Vergleich zu HTML-Websites bemerkenswert einfach und benutzerfreundlich.

html-website

Bild von Strikingly genommen

Header

Bild von Strikingly genommen

Das Beispiel hier zeigt, was du tun musst, um die Textfarbe zu ändern. Bei einer HTML-Website musst du den Code für die Farbe und die Größe einzeln in den entsprechenden Tag einfügen. Bei einem Website-Builder wie Strikingly sind es nur ein paar Klicks und du bist fertig.

Du verstehst also, warum du dich für einen Website-Builder wie Strikingly entscheidest und die Codierung ganz vermeiden kannst. Aber weißt du nicht, wie du eine Website erstellen sollst? Kein Problem! Strikingly hat die Einfachheit der Website-Erstellung auf die nächste Stufe gehoben.

Wie erstellt man eine Website mit Strikingly?

Hier ist eine schnelle Methode, um deine Website zum Laufen zu bringen:

1. Erstelle ein Konto

Als erstes benötigst du ein bei Strikingly registriertes Konto. Du kannst deine E-Mail-ID verwenden oder dich mit deinem Google-Konto anmelden.

anmelden Strikingly

Bild von Strikingly genommen

2. Wähle eine Vorlage

Sobald du dich registriert hast, kannst du eine der vielen bemerkenswerten Vorlagen aus der umfangreichen Bibliothek von Strikingly auswählen. Die Vorlagen sind so kategorisiert, dass die Auswahl der richtigen Vorlage für dein Unternehmen problemlos ist.

vorlagen

Bild von Strikingly genommen

3. Die Vorlage bearbeiten

Nachdem du die Vorlage ausgewählt hast, wirst du auf die Seite weitergeleitet, auf der du mit der Bearbeitung deiner Seite beginnen kannst. Das ist der Punkt, an dem die Magie beginnt. Du kannst jeden Aspekt deiner Website anpassen. Füge alle erforderlichen Seiten, Schaltflächen, Bilder, Texte und Inhalte hinzu, damit sich deine Seite von den anderen abhebt.

Editor

Bild von Strikingly genommen

4. Veröffentliche deine Website

Website veröffentlichen

Bild von Strikingly genommen

Der nächste Schritt besteht darin, deine Website zu veröffentlichen und zu sehen, wie sie im Internet aussieht. Du kannst alle visuellen und funktionellen Aspekte der Website testen.

Deine Website ist jetzt einsatzbereit. Achte darauf, dass du eine Domain für deine Website registrierst. Damit wird deine Website im Internet registriert und ein Bereich geschaffen, in dem deine Website gehostet wird.

Und das war's auch schon. So einfach ist das. Du brauchst keine HTML-Codes zu lernen, hast keine Probleme mit der Bearbeitung oder Aktualisierung, und das alles an einem Tag. Wenn du wenig Zeit und Ressourcen hast oder eine persönliche Website für dein neu gegründetes Start-up brauchst, ist das ein Kinderspiel. Worauf wartest du also noch? Hole dir deine kostenlose Website bei Strikingly und vergiss deine Probleme mit der Website-Erstellung.