Erstellen von Websites 101: Wie schwer ist es?
'Das muss auf der Website stehen und oh ja, fertig bitte gestern'. Jeder, der Websites erstellt, weiß das. Was für einen Kunden wie eine kleine Anpassung erscheint, kann hinter den Kulissen viel Arbeit bedeuten. In der Weltanschauung eines Programmierers gibt es also zwei Arten von Menschen: eine Gruppe, die „das Backend“ von Websites versteht (oder zumindest kennt) – die kleinste – und dann gibt es eine große Gruppe von „Ignoranten“. Gar nicht schlecht, natürlich, aber wenn Sie sich in irgendeiner Weise mit unserer Spezies (The Website Builder) beschäftigen, ist es schön, die Grundlagen zu kennen. Auf diese Weise erfahren Sie, dass das Hinzufügen dieses kleinen Buttons auf der Homepage eine längere Arbeit ist als erwartet, und Sie wissen, in welcher Sprache wir denken (und manchmal sogar träumen).
Mit Hilfe des bekannten CMS WordPress können Sie jetzt noch einfacher Websites erstellen. Mit den richtigen Kenntnissen ist es ein perfektes CMS, außerdem suchmaschinenfreundlich und daher super, wenn man in kurzer Zeit organisch auffindbar werden möchte. Es bietet eine schöne Basis, aber dann geht es erst richtig los. Wenn Sie wirklich etwas Besonderes schaffen wollen, müssen Sie unbedingt auch programmieren können. Auf diese Weise können Sie Anpassungen vornehmen, die über den Standard hinausgehen. Wir zeigen Ihnen hier die grundlegenden Sprachen, die zum Programmieren verwendet werden (der Code, aus dem Websites gebaut werden).
Das Skelett: HTML
Es beginnt mit HTML (und in WordPress auch PHP). Dies ist die Grundlage und der gesamte andere Code wird sich schließlich daran halten. Nicht umsonst wird dies als Skelett einer Website bezeichnet. Elemente der Website werden mit unterschiedlichen Tags beschrieben. Beispielsweise können Sie eine Überschrift mit dem Tag [h1] kennzeichnen. Das sieht dann so aus:
[h1]Hier kommt der Text der Überschrift[/h1]
Wenn Sie bedenken, wie viele verschiedene Elemente auf einer Website möglich sind – denken Sie nur an Links, Kontaktformulare oder Listen – können Sie sich wahrscheinlich vorstellen, dass es eine schier unendliche Menge an Tags gibt. Es ist eine ganz andere Sprache, die man beherrschen muss.
Die Muskeln: JavaScript
Wer sich bewegen will, braucht wirklich Muskeln. Und darum kümmert sich die Skriptsprache JavaScript. Es ist etwas komplizierter, aber es lohnt sich, denn eine dynamische Website ist viel attraktiver. Und mehr noch: Es ist hilfreich, wenn Ihr Website-Besucher sofort eine Rückmeldung erhält, wenn er ein Kontaktformular falsch ausfüllt. Das [script]-Tag ermöglicht das Einfügen eines Skripts in den HTML-Code. (Das ist also alles mit dem Skelett, der Basis, verbunden, erinnerst du dich?) Das würde zum Beispiel so aussehen:
Die Haut: CSS
Muskeln und ein Skelett sind schön, aber ohne die Haut sieht es nicht sehr gut aus. Hier kommt CSS ins Spiel. In dieser Sprache geht es um das Design des Skeletts und der Muskeln. CSS verwendet eine Selektor-Eigenschaft und gibt ihr einen Wert. Oder in normaler menschlicher Sprache: Sie wählen ein Element aus dem HTML aus und geben ihm einen Wert. Wenn wir zum Beispiel das [h1]-Tag aus dem HTML-Blau machen wollten, würde es so aussehen:
h1
Farbe blau;
Das mag jetzt einfach aussehen, aber auch hier sind die Möglichkeiten endlos. Was ist, wenn Sie dem Text auch eine Hintergrundfarbe geben, die Überschrift noch größer oder vielleicht fetter machen möchten? Und dann möchten Sie eigentlich, dass die Überschrift in der Mitte der Seite steht, mit etwas Platz drumherum. Du verstehst es.
Abschluss
Es gibt nicht nur wahnsinnig viele Möglichkeiten, wenn für eine Website schon viel programmiert wurde, sieht man meist Seiten voller Code. Wenn Sie irgendwo eine kleine Schaltfläche hinzufügen möchten, müssen Sie nur herausfinden, wo Sie dies tun können, und Sie müssen dies so tun, dass Sie den Rest des Codes nicht sofort verwirren. Suchen, wo etwas schief geht … das kann so viel Zeit in Anspruch nehmen! Aber es ist Teil des Jobs und unsere Art (Der Website Builder) ist natürlich darin geschult. Glücklicherweise können wir jetzt besser schlafen (und in Programmiersprachen träumen), da wir wissen, dass Sie unsere Sprache auch ein wenig beherrschen.
PS Diese Geschichte ist natürlich ziemlich simpel und wir haben nur die Front-End-Seite der Programmierung berührt. Dann gibt es noch das Backend… Kurz gesagt, der Unterschied ist: Wie sieht es aus vs. wie funktioniert es? Und wie genau das funktioniert, ist eine lange Geschichte für ein anderes Mal.
