050 - Rezension Fachbuch - Einstieg in HTML und CSS - aus dem Rheinwerk Verlag

00:00:00: Einstieg in HTML und CSS. Das Handbuch von Peter Müller aus dem Rheinweg-Verlag.

00:00:07: Heute vorgestellt.

00:00:10: Moin aus Hamburg und herzlich willkommen im Nerdcafé Podcast.

00:00:19: Den Podcast rund um WordPress, Hosting, CMS und Web. Ich bin Johannes Meyerhofer.

00:00:26: Ich bin dein Host und ich bin Experte und Trainer für WordPress. Mit diesem

00:00:33: Podcast helfe ich dir dabei alle Themen, die dich interessieren, wenn du mit einem

00:00:37: eigenen Webseiten-Projekt starten möchtest, besser zu verstehen. Und jetzt

00:00:42: wünsche ich dir ganz viel Spaß mit der Podcast-Episode. Mit dem Rheinweg-Verlag

00:00:47: arbeite ich jetzt schon eine ganze Weile zusammen. Früher einfach als Rätseln

00:00:52: senden von deren Fachbüchern, aber in diesem Jahr auch mit einer Medienpartnerschaft.

00:00:58: Wie die aussieht, warum wir das machen und so weiter habe ich in der Episode 40

00:01:03: einmal ausführlich erklärt. Und auch in der Episode 35 habe ich schon einen

00:01:08: Buch aus dem Rheinweg-Verlag vorgestellt. Ebenfalls von Peter Müller.

00:01:12: Das heißt "Einstieg in WordPress 6". Für diesen Podcast wurden mir die Bücher

00:01:20: zur Verfügung gestellt. Das ist Teil der Partnerschaft mit dem Rheinweg-Verlag.

00:01:25: Und ich freue mich auch jetzt nochmal ein Buch vorzustellen. Das heißt "Einstieg in

00:01:29: HTML und CSS aus dem Rheinweg-Verlag" und ebenfalls von Peter Müller.

00:01:36: Ich bin nicht so der Programmierer, nutze aber natürlich, da ich WordPress-Trainer bin,

00:01:44: immer wieder auf CSS und kann zumindest HTML und PHP Code lesen. Und finde, dieses

00:01:53: Buch ist auch, wenn du da jetzt einsteigen willst und Webseiten selber erstellen willst,

00:01:59: aber auch wenn du WordPress nutzt und einfach ein bisschen an den Code ran willst,

00:02:03: eine Superergänzung einerseits zu WordPress, aber andererseits auch zu dem Buch

00:02:09: "Einstieg in WordPress 6". Und jetzt möchte ich dir ja mal ein bisschen was aus dem Buch zeigen.

00:02:16: Es ist aufgeteilt in mehrere Teile. Teil 1 bezieht sich auf Webseiten HTML und CSS.

00:02:24: Du hörst das vielleicht, ich habe es auch direkt hier vorliegen. Teil 2, da geht es dann um HTML.

00:02:31: In Teil 3 geht es um CSS Grundlagen und in Teil 4 um den "Das CSS" Layout. Also alles Themen,

00:02:43: die dich interessieren, wenn du mit Webseiten Programmierung starten möchtest und vor

00:02:48: all dem, dass CSS Teil ist für dich interessant, wenn du bei WordPress in dem Customizer Benutzer

00:02:57: definierten oder Custom CSS heißt, dass du dort einsetzen willst. Denn am Ende ist WordPress ja

00:03:04: auch nur ein Anführungszeichen, PHP, HTML und CSS. Klar, eine Datenbank ist dabei und ein bisschen,

00:03:11: was das Ganze so zusammenfügt quasi. Aber du kannst WordPress auch komplett individuell

00:03:18: ändern. Das ist ja der Schöne daran. WordPress ist open source, das heißt der Code ist offen.

00:03:24: Und du kannst auch WordPress selber hosten auf deinem Server und dann den Code so weit verändern,

00:03:31: dass es für dich komplett individuell funktioniert. Passt dazu, möchte ich direkt mal einsteigen

00:03:37: mit einem Zitat aus dem Buch auf Seite 38. Geht es um Quelltext besteht aus HTML, CSS und JavaScript.

00:03:45: Und jetzt lese ich ein bisschen was vor. Der Quelltext einer Webseite besteht aus den Sprachen

00:03:51: HTML, CSS und optional JavaScript, die sich perfekt ergänzen. Das Fundament einer Webseite ist

00:03:57: HTML. HTML strukturiert eine Webseite und deren Inhalt, das ist nicht hübsch, aber flexibel.

00:04:04: CSS gestaltet das HTML. Die Schwierigkeit beim Gestalten besteht darin, die Seite attraktiv und

00:04:11: übersichtlich zu machen, ohne dabei deren natürliche Flexibilität zu verlieren. JavaScript ist

00:04:18: eine Programmiersprache, mit der man das Verhalten der Website steuern und so zum Beispiel deren

00:04:23: Bedienung erleichtern kann. Einfache Webseiten kommen fast ohne JavaScript aus. In interaktiven

00:04:30: Web-Applikationen spielt es in Gegen oft die Hauptrolle. CSS und JavaScript machen die Seite

00:04:36: also hübscher und besser bedienbar, aber das Fundament ist HTML. Ohne HTML sind CSS und

00:04:44: JavaScript arbeitslos. Weil dieser Sachverhalt recht abstrakt klingt, möchte ich Ihnen zur

00:04:50: Zusammenarbeit von HTML und CSS ein konkretes Beispiel zeigen. Dann kommen jetzt tatsächlich

00:04:56: konkrete Beispiele. Du siehst auch im Buch dann den geschriebenen Code und das Ergebnis,

00:05:02: wie der Code denn in der Webseite aussehen könnte. Im Buch gibt es auch viele Übungsdateien

00:05:11: und alle diese Dateien kannst du tatsächlich auch runterladen. Apropos runterladen, du kannst auf

00:05:17: der Website vom Verlag auch das Inhaltsverzeichnis komplett einsehen und Probekapitel lesen. Ich

00:05:24: blinke das natürlich in den Shownotes. Du willst jetzt vielleicht direkt loslegen und die erste

00:05:30: Seite mit HTML erstellen. Dazu lese ich dir auch einen ganz kurzen Abschnitt vor. Seit der 54,

00:05:37: jede Website hat dein HTML Grund gerüst. Der Quelltext einer jeden Webseite besteht aus vier

00:05:44: Abschnitten. Erstens, ganz am Anfang in der allerersten Zeile steht der Doktype. Zweitens,

00:05:51: das Stammelement HTML enthält nur die Elemente Head und Body. Der Vorspann Head enthält wichtige

00:05:59: Infos über die Webseite. Viertens, Body enthält den Imbrowser sichtbaren Bereich der Webseite.

00:06:06: Diese vier Abschnitte bilden zusammen das HTML Grundgerüst, das einer Website wie ein Skelett

00:06:13: eine Struktur gibt und sie im Innersten zusammenhält. Wenn du jetzt sagst, das möchte ich mal sehen,

00:06:20: kannst du in der nahezu jeder Webseite mit der rechten Maustaste auf die Website am besten

00:06:26: bei der Homepage drauf gehen und je nach Browser heißt es unterschiedlich, meistens aber Quelltext

00:06:33: anzeigen. Also, du rufst irgendeine Website auf, gehst mit der rechten Maustaste irgendwo hin in

00:06:40: der Webseite und sagst dann Quelltext anzeigen. Dann wirst du genau das sehen,

00:06:46: was hier steht und zwar den Doktype Body und die HTML Text. Schaut es doch gerne schon mal an.

00:06:53: Moin aus dem Schnitt und ganz kurze Unterbrechung. Wenn dir dieser Episode gefällt, nutzt doch gerne

00:07:03: die Chance und lasst mir ein Abo da. Wenn du magst, empfehle den Podcast gerne weiter,

00:07:07: das würde mich sehr freuen. Und würde noch mehr Menschen die Möglichkeit geben,

00:07:12: WordPress zu verstehen. Jetzt aber weiter mit der Episode. Das dritte Beispiel ist wieder eins,

00:07:18: was mir persönlich sehr am Herzen liegt und das ist die Barrierefreiheit. Ich finde es cool,

00:07:23: dass der Peter und auch der Verlag sich dafür einsetzen und das auch hier behandeln. Auch hier

00:07:30: lese ich einen kurzen Abschnitt vor. Seite 43, Webseiten und Barrierefreiheit. Da geht es jetzt

00:07:36: eher so ein bisschen allgemein um Barrierefreiheit im Buch insgesamt. Kommt das Thema aber oft vor und

00:07:43: es gibt auch immer wieder Tipps, welche Codebereiche denn mit Barrierefreiheit zu tun haben und warum

00:07:49: das denn wichtig ist. Jetzt aber hier eben Buch das Zitat. Barrierefreiheit bezeichnet laut Wikipedia

00:07:56: die Gestaltung der Umwelt, die es allen Menschen ermöglicht, ohne Hindernisse mit ihrer Umgebung

00:08:02: zu interagieren. Und das gilt natürlich auch für das World Wide Web. Barrierefreiheit heißt

00:08:08: dem englischen Accessibility, Wörtlich-Zugänglichkeit und zur barrierefreien Gestaltung von Webseiten

00:08:15: gibt es die von der Web Accessibility Initiative, erstellten und sehr umfangreichen Web Content

00:08:21: Accessibility Guidelines, die WCAG. Eine kurze Einführung finden Sie auf der Webseite WCAG2,

00:08:28: dann kommt so ein Link, den die Sie jetzt nicht vor. Und dann beschreibt der Peter auch sehr gut die

00:08:34: vier grundlegenden Prinzipien für barrierefreien Webseiten und das ist einmal die Wahrnehmbarkeit,

00:08:40: die Bedienbarkeit, die Verständlichkeit und die Robustheit. Dazu weiß ich jetzt zufälligerweise

00:08:47: ziemlich gut Bescheid und habe dazu zwei Episoden schon aufgenommen, mache dazu auch immer

00:08:53: wieder Vorträge und bin da sehr dran und halte das für sehr relevant. Die beiden Episoden im

00:09:02: Podcast, wo ich mich damit beschäftigt habe, ist die Episode 12 "Digitale Barrierefreiheit und Episode

00:09:09: 22 "Inhalte barrierearm umsetzen". Die Episode 12 ist eher so ein bisschen der gesellschaftliche

00:09:16: Blick und die Episode 22 ist dann die konkrete Umsetzung, wie du deine Webseite Barriereärmer

00:09:23: gestalten kannst. Zurück zum Buch. Ich finde es wirklich toll, auch egal ob du jetzt wirklich

00:09:30: komplett zum Webprogrammierer werden willst und alles per Code selbst machen willst oder ob du sagst,

00:09:37: ne mir reicht es ja, wenn ich Code so einigermaßen lesen kann, so wie ich das zum Beispiel mache

00:09:42: und vielleicht ein bisschen mit CSS deine WordPress-Seiten anpassen. Da ist für jeden Geschmack

00:09:50: was dabei. Ich kenne den Peter Müller auch tatsächlich so ein bisschen persönlich. Wir sind

00:09:56: immer wieder im Austausch über LinkedIn oder Mast zu donnen und ich finde, dass er da eine sehr

00:10:03: gute Art hat, die Dinge zu beschreiben. Ich kann es persönlich finden, das mit dem Sie ein bisschen

00:10:09: vor dem Niveau gejammert, aber das finde ich befremdlich, weil ich gar kein Siehtyp bin. Ich bin

00:10:15: der absolute Do-Typ. Das merkst du ja vielleicht schon. Ich duze ja auch hier im Podcast. Ich duze

00:10:20: auch 99 Prozent meiner Kund*innen. Ich duze in Social Media, aber einfach in der Geschmacksfrage. Du

00:10:26: kannst natürlich auch ein Fan des Sieges sein. Es spielt auch keine Rolle. Es ist nur ein bisschen

00:10:34: komisch für mich, aber der Inhalt ist ja viel wichtiger als die Art und Weise, wie ich hier

00:10:39: angesprochen werde. Mit dem Buch bekommst du auf jeden Fall einen sehr guten Überblick und Einblick.

00:10:45: Heißt ja auch Einstieg in HTML und CSS. Ich kann dir empfehlen, auf der Website vom Verlag zu

00:10:51: schauen. Verlinke ich dir die Show Notes. Da bekommst du nochmal ein Überblick. Du kannst ins

00:10:56: Buch einblicken, weil Probekapitel online sind und du kannst das Buch sowohl als Print als auch

00:11:05: digital bestellen. Ich wünschte damit auf jeden Fall viel Spaß. So eine kleine Überraschung habe

00:11:13: ich aber jetzt doch noch. Weihnachten steht ja vor der Tür und wenn du jetzt noch ein Geschenk

00:11:18: brauchst, für dich oder zum Weiterverschenken habe ich hier noch eine kleine, kleine nachträgliche

00:11:24: Überraschung. Der Reinwerkverlag hat mir nämlich drei Exemplare des Buches zur Verfügung gestellt

00:11:31: als eBook und die darf ich jetzt hier noch vergeben. Ich habe mir eine kleine Aufgabe überlegt und zwar

00:11:39: freue ich mich hier, wenn der Podcast noch ein bisschen wächst, wenn noch mehr Menschen davon

00:11:43: erfahren und das funktioniert natürlich gut über Bewertungen. Das heißt, ich würde mich freuen,

00:11:50: wenn du den Podcast auf einer Plattform deiner Wahl bewertest und mir die Bewertung bzw. ein

00:11:57: Screenshot davon per E-Mail schickst. Und die ersten drei Bewertungen, die ich hier bekomme,

00:12:11: die bekommen von mir als Gegenzug das Buch. Ganz einfach, ihr bekommt einen Code, den könnt ihr

00:12:18: sofort einlösen und wenn alles gut läuft und ihr schnell seid mit dem Zusenden der Bewertung,

00:12:24: dann habt ihr noch rechtzeitig zu Weihnachten ein eBook in der Hand. Damit jetzt aber wirklich

00:12:32: tschüss und schöne Weihnachten. Tschüss, das heißt auf Wiedersehen. Ich freue mich, wenn wir uns hier

00:12:40: sehr bald wiedersehen bzw. hören. Wenn du darauf auch Lust hast, abonnier doch am besten diesen

00:12:46: Podcast und empfehle ihn auch deinen Freundinnen und Kollegen, denn so wird die Reichweite einfach

00:12:51: noch mal vergrößert. Bei LinkedIn findet außerdem jede Woche meistens am Donnerstag das Nerdcafé

00:12:58: live statt. Hier tausche ich mich regelmäßig mit verschiedenen Expertinnen über deren Fachgebiete

00:13:04: aus. So kann ich meine fachliche Filterbabel erweitern und über den eigenen Tellerrand schauen. Und

00:13:10: auch du kannst davon profitieren, denn im Nerdcafé live hast du die Möglichkeit, deine Fragen zu

00:13:15: stellen. Ich hoffe, du konntest heute einiges mitnehmen. Wenn du magst, schick mir doch dein

00:13:20: Feedback und Themenwünsche an die Espresso@nerdcafé.online. Espresso@nerdcafé.online. Tschüss!

00:13:28: [Zwischenruf]

00:13:30: [MUSIK]