Suche
Suche Menü

Wie lernt man eigentlich HTML?

Heute habe ich mal wieder festgestellt wie schwierig es eigentlich ist, jemandem HTML und CSS beizubringen.

Geht das überhaupt? Kann man HTML wirklich von jemandem gezeigt bekommen?

Ich denke nicht. Ich glaube das Thema ist viel zu komplex um es “einfach mal so” zu erklären.
Natürlich kann man jemandem zeigen wie er sich eine Seite in Dreamweaver “zusammenklickt” aber das ist dann immer noch kein HTML. Webdesign betrachtet weit mehr als nur das Zusammenklicken einer Seite in einem Programm.

Der Web-Designer und auch der angehende muss erstmal verstehen, was er da eigentlich macht. Muss in erster Linie natürlich vertraut sein mit dem Internet. Was ist ein Link? was ist eine statische Seite?

Jemandem sein Wissen zu vermitteln in gar nicht so einfach. Vieles geht einem im täglichen Trott in Fleisch und Blut über und so viele Dinge sind so selbstverständlich. Aber wie erkläre ich in drei Sätzen was semantisches Webdesign ist? Was ist ein Float und warum schreibe ich mein CSS nicht mitten in mein Dokument? Warum stellen eigentlich einige Browser meine Seite so komisch dar?

Solche Fragen kann ich zwar beantworten, aber ich denke beibringen kann man sich HTML nur selbst.
Such dir ein Projekt, z.B. Deine eigene Website oder eine Seite für Deinen Verein. Natürlich darf man am Anfang keine Wunder erwarten.

Für den Start empfehle ich folgendes Vorgehen:

Als erstes muss man die Trennung von Inhalt und Design verstehen. Als gutes Beispiel zeige ich an dieser Stelle immer die Seite CSS-Zen-Garden. Die meisten Web-Designer kennen diese Seite, aber viele “Frischlinge” kennen sie noch nicht und man kann ihnen daran zeigen was CSS eigentlich alles kann und wie es wirkt.

Dann geht es an das Erstellen der Seite. Als erstes müssen ein Erscheinungsbild festlegen. Professionelle Web-Designer entwerfen ihre Layouts meistens in Photoshop. Das ist die edelste, aber eben auch die teuerste Version.

Wenn man nur mal ausprobieren will wie es geht, kann man sich bei Adobe eine 30 Tage Testversion herunterladen und dann entscheiden ob man für sich einen Zugang dazu findet oder ob alles zu kompliziert ist. Denn für Einsteiger ist Photoshop ganz schön kompliziert. Wenn man das Programm beherrscht kann man sich nichts anderes mehr vorstellen.

Als einzig kostenlose Alternative kenne ich nur GIMP. Das Programm soll die gleichen Funktionen haben, ich habe es aber ehrlich gesagt nie ausprobiert.

Jeder muss sehen womit er selbst am besten zurecht kommt.

Um HTML zu lernen ist eine Grafiksoftware aber gar nicht erforderlich. Ganz nach demMotto “nur die harten kommen in´ Garten” genügt ein Texteditor wie z.B. Notepad auf dem Windows-PC oder Text-Edit auf dem MAC. Diesen muß man jedoch in den Einstellungen auf “nur Text” umstellen.

Ich persönlich arbeite übrigens mit Espresso und CSS-Edit von der Firma MACRabbit. Bei Tools sind schlank und schön und durchaus empfehlenswert und kosten im Bundle 89,95 €.
Besonders Espresso kann ich nur empfehlen, weil noch eine schöne Dateiverwaltung und ein kleines FTP-Tool angehängt sind.

Wenn also das Layout fest steht, macht man sich am besten Gedanken über den HTML-Aufbau der Seite. Ich nehme mir meistens ganz klassisch einen Zettel und einen Stift und male ein grobes Raster der Seite auf das Papier und entscheide dann, wie ich die HTML-Elemente verteile und wie groß die einzelnen Elemente sein sollen. Die meisten Layouts sind komplizierter aber die Struktur links kann man auf den meisten Seiten anwenden.

Danach ziehe ich im Html Dokument die grobe Struktur auf.

Diese sieht dann ganz schlicht und einfach so aus:

#LeftCol (Spalte für Text und Bilder, Content)
#RightCol (Spalte z.B. im Blog für Suchfunktionen und andere Widgets)

Und das ist der Code dazu:

#LeftCol
#RightCol

Dabei kann ich dann schon sehen, welche Div-Container ich anlegen muss, ob mein Layout wirklich umsetzbar ist und wie ich weiter vorgehen muss.
Das weitere Vorgehen entscheide ich dann je nach Projekt.

Natürlich ist das erst der Anfang, man muss sich mit den wichtigen Tags und Formatierungen auseinandersetzen und dann einfach machen.

Anlesen und gleich umsetzen:

Gute Ressourcen für den Anfang:

http://www.andreas-kalt.de/blog/webdesign-lernen-grundlagen#punkt1

Self HTML (der Klassiker)

http://www.css-lernen.net/css-grundlagen.php

Author:

Ich bin Daniela Müller, Web-Designerin und Frontend-Entwicklerin aus Flensburg. Hier schreibe ich über Wordpress, HTML und CSS für alle, die noch ein paar Tricks und Kniffe übers Bloggen lernen möchten und vor allem für all jene, die sich bisher noch nicht an Wordpress ran getraut haben. In meiner Freizeit nähe, stricke, backe und koche ich und probiere Neues aus. Mein Kreativ-Code: www.cozy-and-cuddly.de

Schreibe einen Kommentar

Pflichtfelder sind mit * markiert.