Oft werde ich gefragt, ob man im Zeitalter von Künstlicher Intelligenz und einfachen Baukasten-Systemen überhaupt noch „coden“ lernen muss. Meine Antwort ist ein klares Ja! Wer die Grundlagen von HTML und CSS beherrscht, versteht die DNA des digitalen Raums. Selbst wenn eine KI heute Code-Schnipsel generieren kann, muss man verstehen, was dort passiert, um Fehler zu korrigieren und eigene, individuelle Ideen wirklich präzise umzusetzen. Ohne dieses Basiswissen bleibt man immer nur Nutzer – mit HTML und CSS wird man zum Gestalter.

Was viele nicht wissen: Dieses Wissen ist auch das Fundament für die Welt der mobilen Anwendungen. Wer davon träumt, später einmal eigene Smartphone-Apps zu programmieren, kommt an HTML und CSS kaum vorbei. Moderne Apps basieren oft auf Web-Technologien oder nutzen diese für ihre Benutzeroberflächen. Wer hier die Logik von Struktur und Design versteht, hat den wichtigsten ersten Schritt in die Software-Entwicklung bereits getan.

In meinem Buch zeige ich Schritt für Schritt, wie man ganz ohne teure Software eine eigene Webseite aufbaut. Wir fangen mit einfachen Texten und Überschriften an und arbeiten uns vor bis zu komplexeren Elementen wie Tabellen, Formularen und dem Einbinden von Musik und Videos. Mit CSS verleihen wir dem Ganzen dann den nötigen Glanz: Wir gestalten Hintergründe, setzen schicke Rahmen und sorgen dafür, dass die Seite auf jedem Gerät gut aussieht.

Neben dem reinen Programmieren vermittle ich auch wichtiges Hintergrundwissen. Mir ist wichtig, dass meine Leser nicht nur „nachbauen“, sondern verstehen, wie man eine Seite professionell und sauber aufsetzt. Die Fachpresse, wie etwa Mac Life, beschreibt das Buch als „leicht verständliches Lehrbuch“, und der ekz-Bibliotheksservice hebt hervor, dass außer einem Texteditor und einem Browser keinerlei Vorkenntnisse nötig sind.

Damit der Einstieg perfekt gelingt, gibt es zum Buch ein umfangreiches Download-Paket mit allen Beispielen, Lösungen zu den Übungsaufgaben. Es ist also alles bereit für das erste eigene Projekt im World Wide Web!

ISBN Buch: 9783747501177
ISBN eBook: 9783747501191
Preis: 12,99 Euro
304 Seiten

Du hast dir eine WordPress-Seite erstellt, ein schönes Theme gewählt, aber irgendwie… passt die Farbe der Überschrift nicht zu deinem Logo? Oder der Abstand zwischen den Absätzen ist dir zu groß?

Viele Einsteiger denken, sie müssten jetzt ein Informatikstudium beginnen oder teure Plugins kaufen. Aber die Lösung ist viel einfacher: Custom CSS.

WordPress bietet in fast jedem Theme unter Design -> Customizer -> Zusätzliches CSS ein kleines Fenster an. Hier kannst du mit minimalem Aufwand maximale Wirkung erzielen. Ich zeige dir heute drei „Magic Tricks“, die jeder Anfänger beherrschen kann.

1. Die Farbe deiner Überschriften ändern

Standard-Themes nutzen oft ein langweiliges Schwarz oder Dunkelgrau. Mit diesem Schnipsel gibst du deiner Seite Charakter:

h1, h2, h3 {
color: #4CAF50; /* Ersetze dies durch deinen Hex-Farbcode */
}

Das war schon alles. Genial, oder? Und du wirst sehen, die anderen Schnipsel sind genauso einfach. Kleine Ursache, große Wirkung.

Tipp: Suche bei Google nach „Color Picker“, wähle deine Wunschfarbe und kopiere den Code mit dem #.

2. Bessere Lesbarkeit durch Zeilenabstände

Nichts ist anstrengender als Text, der zu eng gequetscht ist. Gute Lesbarkeit ist das A und O.

p {
line-height: 1.8;
margin-bottom: 20px;
}

Damit verleihst du deinem Text eine luftige, professionelle Optik, wie man sie aus hochwertigen Magazinen kennt.

3. Einen Button hervorheben

Hast du einen Link, der wie ein Button aussehen soll?

.mein-button {
background-color: #ff5722;
color: white;
padding: 10px 20px;
border-radius: 5px;
text-decoration: none;
}

Du musst dem Link in WordPress dann nur unter „Erweitert“ die CSS-Klasse mein-button geben. Etwas HTML und CSS Wissen sind jetzt schon notwendig – was kein Problem ist, wenn du die Grundlagen von HTM und CSS kennst. Mein Tipp dazu (du ahnst es bestimmt) eines meiner Bücher, z.B. HTML und CSS für Kids (ist auch eine ganz einfache Einführung für Erwachsene). Achtung, der Link zum Buch leitet dich zu Amazon weiter, wenn du das nicht willst, klick nicht darauf.

So, das wars auch schon für heute mit einem Quick-Tipp. Ich hoffe er hat dir geholfen.

Und noch was zum Schmunzeln:

Der Vollständigkeit halber: Bild ist KI-erzeugt (Kennzeichnungspflicht)

Hand aufs Herz: Ich hätte jetzt stundenlang WordPress-Instanzen aufsetzen, Screenshots zuschneiden und im Grafikprogramm hübsch machen können. Aber ganz ehrlich? Die Zeit verbringe ich lieber mit Schreiben (oder einem Kaffee).

Ich habe stattdessen die KI gefragt, wie sie sich einen Vorher-Nachher-Vergleich vorstellt. Das Ergebnis siehst du oben. Wie man sieht, beherrscht die KI zwar fantastische Welten, aber beim Thema Text im Bild schreibt sie immer noch so, als hätte sie ein paar Gläser Wein zu viel gehabt. Aber hey, die Botschaft kommt an, oder? Struktur und Farbe gewinnen immer gegen die graue Textwüste – und wie genau du das mit den Codeschnipseln von oben machst, hast du ja jetzt auch ohne perfekte Screenshots im Kasten!