Mobile Homepage mit HTML

Html Editor Html Editor Html Editor

Wer sich neu mit dem Thema „Eigene Homepage erstellen“ beschäftigt, wird mit vielen bisher unbekannten Fachbegriffen konfrontiert. Einerseits hört man vieles von den unterschiedlichen Programmiersprachen, die für Web Design eingesetzt werden, zumindest deren Namen. HTML ist eine davon.

Was ist HTML?

Die Abkürzung HTML steht für Hypertext Markup Language, zu deutsch in etwa „Auszeichnungssprache für Hyper-Text“. Damit ist auch bereits der erste wichtige Punkt genannt: HTML ist keine Programmiersprache, sondern eine Auszeichnungssprache. Doch was genau ist der Unterschied?


Mit Hilfe einer Programmiersprache kann man dem Computer oder einzelnen Programmen Logik und gewissermaßen das Denken beibringen. Das Programm, in unserem Fall eine Homepage, kann auf unterschiedliche Benutzereingaben unterschiedlich reagieren. So kann, bei entsprechender Programmierung, eine ungültige E-Mail-Adresse erkannt werden, die in ein Kontakt-Formular eingegeben wurde. Das Programm erkennt also gegebenenfalls nicht nur ungültige Eingaben anhand bestimmter Muster, sondern reagiert auch entsprechend auf richtige und ungültige Eingaben. Im Falle ungültiger Eingaben wird dem Nutzer ein entsprechender Hinweis angezeigt, andernfalls wird das Kontaktformular anstandslos weiter bearbeitet und eine E-Mail an den Betreiber der Homepage verschickt.


Mit einer Auszeichnungssprache hingegen lassen sich keine solchen logischen Konstrukte erzeugen. HTML dient vereinfacht ausgedrückt dazu, die Struktur des eigentlichen Textes, der auf der Homepage erscheint, auch für Suchmaschinen und Browser, wie zum Beispiel den Internet Explorer, verständlich zu machen. Versetzt man sich hierfür in die Rolle eines Blinden, so hat man eine ganz gute Vorstellung davon, wie das funktioniert. Bekommt ein Blinder eine Zeitung vorgelesen, so muss man ihm mitteilen, dass es sich bei einer Überschrift um eine Überschrift handelt, man betont Zitate anders und weist auf diese hin und beschreibt Bilder. Für den Sehenden sind Überschriften und Zwischenüberschriften sofort an ihrer Größe, dem Fettdruck und dem Abstand zum Fließtext erkennbar. Direkte Zitate werden durch Anführungszeichen kenntlich gemacht, besonders wichtige Passagen und Wörter durch Kursivdruck oder eine farbliche Hervorhebung.


Und genau diese Kenntlichmachung erledigt HTML. Dabei werden die einzelnen Inhalte durch sogenannte Tags markiert. Eine Hauptüberschrift zum Beispiel wird mit <h1> gekennzeichnet. Dadurch wissen Browser, aber auch Suchmaschinen wie Google, dass es sich hierbei eben um eine Hauptüberschrift handelt und können diese entsprechend darstellen und gewichten. Und es ermöglicht die barrierefreie Nutzung des Internet durch zum Beispiel Sehbehinderte und Blinde, die über Browser mit Sprachausgabe oder Ausgabegeräte via Braille-Schrift verfügen.


HTML und mobile Homepages

Wer bisher aufmerksam gefolgt ist, dem wird sich nun zu Recht die Frage stellen, ob HTML denn etwas mit mobilen Websites und Responsivem Design zu tun hat. Die Antwort lautet dann auch tatsächlich: Nein. Der reine HTML-Code einer Website mit und ohne Berücksichtigung von Responsivem Design ist im Prinzip gleich. Eine Überschrift bleibt eine Überschrift und ein Absatz ein Absatz, ganz gleich, auf welchem Display und in welcher Größe sie angezeigt werden. Die Aufgabe, eine Homepage auch auf mobilen Geräten optimal darzustellen, übernehmen andere Programmiersprachen.


Homepage-Baukästen und Responsives Design

Wer seine Homepage mit Hilfe eines Homepage Baukastens erstellt, braucht sich weder um HTML noch um Responsives Design Gedanken zu machen. Solange die verwendete Design-Vorlage (Template) auch eine für Smartphone und Tablet optimierte Darstellung beinhaltet, übernimmt der Homepage Baukasten alles weitere.


Außerdem gibt es für fortgeschrittene Nutzer, die bereits HTML-Kenntnisse mitbringen, auch HTML-Bausteine, die innerhalb des Baukastens eingesetzt werden können. So lassen sich zum Beispiel externe Video- und Audio-Player von YouTube oder Soundcloud in die eigene Homepage einbinden.


Fernec Nagy Erstellt von:
Ferenc Nagy
Homepage-Experte
Erstellt am:
Zuletzt aktualisiert am: