Wolf HTML und CSS

Das umfassende Handbuch
5. Auflage 2023
ISBN: 978-3-8362-9730-1
Verlag: Rheinwerk
Format: EPUB
Kopierschutz: 0 - No protection

E-Book, Deutsch, 1124 Seiten

Reihe: Rheinwerk Computing

Moderne Web-Technologien für moderne Websites! In diesem Standardwerk gibt Ihnen Jürgen Wolf alle Werkzeuge an die Hand, die sie für einen starken Auftritt im Web benötigen. Lernen Sie alle Grundlagen von HTML, CSS und JavaScript kennen und erweitern Sie Ihr Wissen mit diesem umfassenden Lern- und Nachschlagewerk: vom Aufbau eines HTML-Dokuments über die Gestaltung mit CSS bis hin zur Web-Programmierung mit JavaScript. Inkl. einer Einführung in die wichtigen JavaScript-Frameworks React und Angular.

Aus dem Inhalt:

• Syntax und Aufbau von HTML-Dokumenten
• Tabellen und Hyperlinks
• Bilder, Videos und Audio
• HTML-Formulare und interaktive Elemente
• Die Selektoren von CSS
• Vererbung und Kaskade
• Flexboxen und Grid Layouts
• Responsive Layouts erstellen
• Einführung in die JavaScript-APIs
• Einführung in React und Angular

Jürgen Wolf ist seit über 16 Jahren Autor und seit mehr als 10 Jahren passionierter Digitalfotograf. Seine Buchthemen sind Bildbearbeitung, Fotografie, Webentwicklung, Betriebssysteme und Programmierung. Und egal welches Thema: Bei jedem Buch ist es sein Ziel, auch komplexe Zusammenhänge klar und verständlich zu erklären.

Autoren/Hrsg.

Wolf, Jürgen

Inhaltsverzeichnis

Materialien zum Buch ... 29  Vorwort ... 31  1.  Einführung in das HTML-Universum ... 37  1.1 ... Ist dieses Buch überhaupt etwas für mich? ... 37  1.2 ... Die verschiedenen Typen von Websites ... 38  1.3 ... Dynamische und statische Websites ... 42  1.4 ... Sprachen für die Gestaltung und Entwicklung im Web ... 46  1.5 ... Was brauche ich, um hier anzufangen? ... 50  1.6 ... Verwendete Konventionen im Buch ... 59  1.7 ... Zusammenfassung ... 59  2.  Grundlegender Aufbau von HTML(-Dokumenten) ... 61  2.1 ... Syntax und Aufbau von HTML(-Dokumenten) ... 61  2.2 ... Ein einfaches HTML-Dokument-Grundgerüst ... 72  2.3 ... Zusammenfassung ... 75  3.  Die Kopfdaten eines HTML-Dokuments ... 77  3.1 ... Die HTML-Elemente für den Kopf in der Übersicht ... 77  3.2 ... - die Überschrift der HTML-Seite ... 78  3.3 ... Exkurs: Namenskonvention und Referenzierung ... 80  3.4 ... Die Basis-URL einer Webseite mit definieren ... 85  3.5 ... Beziehung zu einem externen Dokument mit ... 87  3.6 ... Dokumentglobale CSS-Stile mit

Leseproben

Vorwort

Die erste Frage, die Sie sich wohl bei einem Buch mit diesem Umfang stellen werden, dürfte sein, ob dies überhaupt ein Buch für Sie ist und was Ihnen alles vermittelt wird. Der Titel deutet bereits an, dass hier HTML und CSS behandelt werden. Wenn Sie ein wenig im Buch quergeblättert oder das Inhaltsverzeichnis überflogen haben, wird Ihnen aufgefallen sein, dass es weitaus mehr als HTML und CSS enthält.

Der Schwerpunkt des Buches liegt nach wie vor auf HTML und CSS. So werden Sie in den ersten sieben Kapiteln die Grundlagen zu HTML kennenlernen. Da HTML die Basissprache für die Website-Entwicklung ist, ist dieses Buch auch für Neueinsteiger interessant, weil wir bei null anfangen. Auch wenn Sie noch von der alten HTML-Schule sind, sich also bereits vor der Zeit von »HTML5« mit HTML beschäftigt haben, sollten Sie sich als Wiedereinsteiger von diesem Buch angesprochen fühlen und sich auf jeden Fall mit den ersten sieben Kapiteln befassen, um sich ein Update Ihres vermutlich veralteten HTML-Wissens zu gönnen.

Webdesign und Layout von Websites werden heute mit Cascading Stylesheets (CSS) realisiert, die in diesem Buch in neun Kapiteln sehr umfangreich beschrieben werden. Zwar will dieses Buch kein Ersatz für reine CSS-Bücher oder Webdesign-Bücher sein, aber Sie werden hier auf jeden Fall viele wichtige und nützliche Grundlagen zum Webdesign und Layouten von Websites erfahren. Wenn Sie daran interessiert sind und noch keinerlei Erfahrung damit gemacht haben, finden Sie mit diesem Buch einen angenehmen Begleiter zum Einstieg in dieses Thema.

Da viele Frameworks und APIs über JavaScript angesprochen werden können, liegt es auf der Hand, dass auch JavaScript als Webprogrammiersprache behandelt werden muss. Hierbei sollte Ihnen klar sein, dass Sie lediglich eine kleine und einfachere Einführung in JavaScript erhalten, die nötig ist, um zumindest die JavaScript-APIs oder DOM-Manipulationen in der Praxis anwenden und verstehen zu können. Der Umfang von JavaScript und seinen Anwendungsgebieten in der Webentwicklung allein könnte schon ein ganzes Buch füllen. Dies sei nur erwähnt, um keine falschen Hoffnungen in das Buch zu schüren. Und wenn Sie zuvor noch nie mit einer Programmiersprache zu tun hatten, wird JavaScript vermutlich Ihre erste echte Programmiersprache sein. Sollten Sie bereits Erfahrungen mit einer anderen Programmiersprache haben, wird Ihnen JavaScript nicht schwerfallen.

Es gibt nicht nur HTML, CSS und JavaScript, sondern mittlerweile so viele weitere Themen und Technologien, die Ihnen beim Erstellen von Websites oder Webanwendungen helfen. Es findet also der berühmte Blick über den Tellerrand statt, d. h., auch auf Themen wie Ajax, React, Angular oder das Bootstrap-Framework wird eingegangen. Da Sie im Buch die dafür nötigen Grundlagen von HTML, CSS und JavaScript lernen, sollten diese Kapitel keine allzu große Hürde für Sie darstellen. Mit HTML, CSS, JavaScript und den verschiedenen Frontend-Frameworks (React, Angular oder Bootstrap) deckt dieses Buch somit rein die Arbeiten an der Benutzeroberfläche der Webanwendung bzw. der Website ab. Dieser Bereich rund um die sichtbare Benutzeroberfläche wird auch als Frontend (auch Front End oder Front-End) bezeichnet.

Nicht behandelt werden in diesem Buch Webprogrammiersprachen wie PHP, Python, Rust oder Java. Zwar wird vereinzelt PHP verwendet, aber nur am Rande, um Ihnen bestimmte Beispiele demonstrieren zu können. Für die Webprogrammierung mit Java, PHP, Python und Co. sollten Sie sich definitiv andere Literatur zulegen, falls Sie sich näher damit befassen wollen. Dieser Bereich wird auch als Backend (auch Back End oder Back-End) bezeichnet und betrifft den Teil in der Webentwicklung, der sich im Hintergrund abspielt und für den Anwender nicht sichtbar ist. Häufig ist es aber nützlich, für die Entwicklung dynamischer Websites im Backend gute Kenntnisse in HTML und CSS zu haben. Ein weiterer und guter Grund, dieses Buch zu lesen und durchzuarbeiten, wenn Sie in der Backend-Entwicklung tätig sind oder es werden wollen.

Website oder Webseite?

Eine Webseite ist eine einzelne Seite eines Internetauftritts. Die Website hingegen ist der komplette Internetauftritt. In der Regel besteht daher eine Website gewöhnlich aus mehreren einzelnen Webseiten. Ich erläutere diese beiden Begriffe hier gleich zu Beginn, damit Sie den Unterschied verstehen, wenn von einer Webseite oder Website die Rede ist, weil es gerne mal für Verwirrung sorgt.

HTML5 und der »Living Standard«

Damit es hier nicht zu Missverständnissen bezüglich HTML als Hypertext-Auszeichnungssprache, HTML5 und HTML als Living Standard kommt, sollen diese Begriffe gleich zu Beginn des Buches geklärt werden. Eingangs habe ich einmal kurz auf HTML5 hingewiesen. Nach der Erfindung des Webs gab es verschiedene Phasen, in denen ein Standard für HTML geschaffen wurde. Zunächst kümmerte sich ausschließlich das W3C als Gremium um die Standardisierung von HTML, was mit Blick auf die Browserhersteller nicht immer reibungslos verlief. Da das Web schnell von einem reinen Hypertextsystem zu einer Plattform für Webanwendungen wurde, versuchte das W3C, mit XHTML einen neuen XML-basierten Standard zu verbreiten, obgleich die Browserhersteller lieber auf Basis von HTML weiterentwickelten.

Daraufhin gründeten Apple, Opera und Mozilla mit der WHATWG eine neue Gruppe, der sich dann auch Google und Microsoft anschlossen, um unabhängig vom W3C am HTML-Standard weiterzuarbeiten. Als das W3C den Wechsel zu XML nicht durchsetzen konnte, konzentrierte man sich auch hier wieder auf die Weiterentwicklung von HTML. Daraus entstand dann zusammen mit der WHATWG der HTML5-Standard. Die Harmonie zwischen W3C und WHATWG hielt nicht lange. Während das W3C an einer Versionierung festhielt, wollte die WHATWG einen »Living Standard« ohne Nummer daraus machen.

Auch hier hat sich das W3C jedoch der WHATWG angeschlossen, und seit dem 28. Mai 2019 ist HTML ein Living Standard ohne Versionsnummer. Ein »HTML6« wird es demnach vermutlich niemals geben. Weiterführende Links dazu:

• https://html.spec.whatwg.org/ – der HTML Living Standard

• https://pmueller.de/eine-kurze-geschichte-von-html5/ – Entwicklungsgeschichte von HTML

Vorwort zur zweiten Auflage

Neben der allgemeinen Aktualisierung von HTML- und CSS-Elementen und den einzelnen Themen und der Korrektur von Fehlern wurde auch der JavaScript-Teil überarbeitet. Obgleich der JavaScript-Teil nach wie vor nur eine kleine Einführung ist, wurde die Einführung hierzu verbessert, sodass Sie im Buch eine etwas rundere Abhandlung zu JavaScript vorfinden. Auch die Strukturierung des Buches wurde jetzt mehr nach den Bausteinen HTML, CSS und JavaScript aufgeteilt.

Vorwort zur dritten Auflage

Es wurden allgemeine Aktualisierungen von HTML- und CSS-Elementen vorgenommen, wo es Änderungen oder Neuerungen gab oder wo etwas noch nicht im Buch vorhanden war. Ebenso wurden einige Fehler behoben. Neu hinzugefügt wurde ein abschließendes Kapitel mit einem einfachen Beispielprojekt, in dem ich das im Buch Gelesene in der Praxis anhand der Erstellung einer (privaten) Website zeige.

Vorwort zur vierten Auflage

In dieser Auflage wurden wieder einige Aktualisierungen vorgenommen und Fehler behoben. Neu hinzugefügt wurde jeweils eine Einführung in React und Angular. Beides sind sehr beliebte JavaScript-Technologien für eine schnelle Entwicklung von Websites und Webanwendungen. Auch eine Einführung in den CSS-Präprozessor Sass und SCSS wurde neu hinzugefügt. Um den Platz für die neuen Kapitel zu schaffen, wurde der Anhang ausgelagert und kann nun von der Verlagswebsite zum Buch heruntergeladen werden.

Vorwort zur fünften Auflage

In dieser Auflage sind viele Aktualisierungen vorgenommen worden. Insbesondere der CSS-Teil wurde stark überarbeitet, und viele neue oder fehlende Themen wurden hinzugefügt. Alte Dinge wie Layouterstellung mit float oder die jQuery-Bibliothek wurden gestrichen. Viele Beispiele im Buch wurden neu erstellt. Flexboxen und CSS Grid haben nun ein eigenes Kapitel erhalten. Weitere neue Themen sind u. a. der Dark Mode, Variable Fonts, Lazy Loading, Custom Properties oder die Fetch-API. Auf vielfachen Wunsch wurde auch ein einfaches Beispielprojekt am Ende des Buches eingefügt, ähnlich wie es dies bei der dritten Auflage bereits gab. Dabei lernen Sie auch gleich, wie Sie Websites testen und optimieren können.

Zielgruppe

HTML und CSS bilden mit ungefähr 70 % den Hauptschwerpunkt des Buches. Die restlichen 30 % widmen sich etwas komplexeren, aber auch essenziellen Themen wie JavaScript, Web-APIs, DOM-Manipulationen, Ajax, React, Angular usw. – eben den Themen oder Technologien, denen Sie früher oder später bei der Erstellung von Websites begegnen werden und für die dann zumindest grundlegende Kenntnisse nützlich sind. Wenn Sie sich zu den folgenden Gruppen zählen,...

Über Autor(innen)

Wolf, Jürgen
Jürgen Wolf ist seit über 16 Jahren Autor und seit mehr als 10 Jahren passionierter Digitalfotograf. Seine Buchthemen sind Bildbearbeitung, Fotografie, Webentwicklung, Betriebssysteme und Programmierung. Und egal welches Thema: Bei jedem Buch ist es sein Ziel, auch komplexe Zusammenhänge klar und verständlich zu erklären.