keineahnung sagt erst mal:" herzlich, lieben Dank!

[MichaelS]

Hallöle,

irgendetwas ist mächtig schief gegangen. Ich kann mich nicht unter dem Pseudonym: "keineahnung" einloggen und bekomme auch bei Passwortänderung keine Mail zugesandt. Daher: völlig richtig geraten: ich bin der Webmaster Michael. Na ja, zumindest klingt das gut, wenn der Rest auch nicht so toll ist!

Ich finde es ganz toll, dass ihr mir so weiterhelft. Herzlichen Dank dafür. Da ich gestern und heute ziemlich gefragt war, bin ich zu müde, um Eure Ideen sachgerecht zu durchdenken!. Ihr gebt Euch redlich Mühe, das kann und will ich nicht in 0/8/15 Manier abtun! Ich werde aber morgen intensiv Eure Posts aufarbeiten und hoffe, dass ich das Geschriebene auch für mich nachvollziehen kann. Bitte versteht: Es ist eine ganz andere ( Denk-) Welt für mich, in welche ich mich erst hineinarbeiten muss! Dabei darf ich vermuten, dass die Mehrheit unter Euch sich etwas länger als ein paar Monate mit HTML etc. beschäftigt.

Ich habe das Webinar von Prof. Schwickert verschlungen und mir die CDs von Axel Pratzner ( HTML-Seminar) gekauft. Danach W3schools, Kulturbanause,Matthias Sommer und natürlich Selfhtml gelesen. Sehr viele Eindrücke, die sich zu oft überlagern und sich mitunter auch zu widersprechen scheinen. Da begegnet Vergangenes dem "noch nicht" und was gestern ein " noch nicht" gewesen ist, ist heute fast schon veraltet. Kaum hatte ich mich mit " float" angefreundet, war es auch schon nicht mehr der absolute Design- Favorit. Also keine leichte Kost für jemanden, der keinerlei Ambition hat, ein medientechnologischer Quereinsteiger zu werden. Fange ich daher doch mal mit einer ganz wichtigen Frage an: " Welches Buch" könntet Ihr mir empfehlen", um als Anfänger auf aktuellem Stand präzise Informationen, gut aufbereitet zu erhalten ? Ich denke, dass das Lernen der beste Weg zur Wissensaneignung sein könnte. ( Bei uns gibt es ein ganz tolles Buch, welches ich den Studenten empfehle: "Einführung in das Alte Testament". Top als Ausgangsbasis für weitere Erkundungsreisen. Allerdings ändert sich da über die Jahre inhaltlich nicht all zu viel!

Liebe Grüsse von Michael

[Rolf B]

Hallo Michael,

dein Posting, das unter "keineAhnung" lief, war anonym. Es gibt diesen User nicht. Das Selfforum erfordert keine Registrierung, um posten zu können.

Sehr viele Eindrücke, die sich zu oft überlagern und sich mitunter auch zu widersprechen scheinen.

Jo. Um das zu finden, brauchst Du den Self-Raum nicht zu verlassen 🤣

Die Frequenz, mit der in der Webentwicklung neue Säue durch's Dorf getrieben werden, ist allerdings beachtlich. Das Problem bei float & Co war, dass es vor Grid kein richtiges Tool für das Seitenlayout gab. Und so wurden die vorhandenen Mechanismen genutzt und der Reihe nach für untauglich erklärt. Tables, float, position:absolute Hexerei, flexbox.

All das hat seinen Sinn, aber Seitenlayout gehört nicht dazu. Dafür haben wir Grid, das wird noch subgrid bekommen, und dann hoffentlich zum neuen Testament des Seitenlayouts werden. Microsoft hat Grid als erster in den IE eingebaut, aber leider wurde die Grid-Version von Microsoft nicht zum Standard. Und da der IE eingestampft wurde, ist Grid im Internet Explorer und Grid in anderen Browsern leider unterschiedlich. Aber da der IE mittlerweile hinreichend tot ist, kann man das ignorieren.

Ein Buch kann ich Dir leider nicht empfehlen. Meine Lernbasis sind die Specs, Mozilla Developer Network (MDN) und eben Selfhtml. Wenn ich für Forendiskussionen weitergehend recherchiert habe, oder wenn Gunnar mir mal wieder das Fell über die Ohren gezogen hat, habe ich immens viel gelernt. D.h. ich habe hier vielen Leuten geholfen, aber unterm Strich hat mir das mindestens genauso viel geholfen.

Rolf

[encoder]

Die Frequenz, mit der in der Webentwicklung neue Säue durch's Dorf getrieben werden, ist allerdings beachtlich.

Lassen wir das "Web" weg 😉

Ich finds auch bei der sonstigen Entwicklung schrecklich, was es ständig neues gibt und wie alles hochgelobt wird.
Wenn ich mir ansehe was es alles für Sprachen gibt - Hauptsache alles anders machen als mans gewohnt ist. Nicht besser, nur anders.
Fachfremde Führungskräfte und zu euphorische Entwickler steigen begeistert um und wundern sich ein Jahr später, dass ihr Produkt nicht weiter kommt.

Willkommen im Land der Säue 😂

[Der Martin]

Hallo,

Die Frequenz, mit der in der Webentwicklung neue Säue durch's Dorf getrieben werden, ist allerdings beachtlich.

Lassen wir das "Web" weg 😉

guter Punkt. Ja, das trifft auch für viele andere Bereiche zu. Zum Beispiel der Automobilsektor. Ich bin durchaus ein Freund von Neuerungen, die z.B. mehr Sicherheit oder mehr Umweltfreundlichkeit bringen. Ich bin aber absolut dagegen, dass Einrichtungen wie etwa die Klimaanlage, das Autoradio oder auch das Navi so kompliziert zu bedienen sind, dass man wirklich erst das Handbuch studieren muss - und die Bedienung dieser Einrichtungen dann trotzdem lieber dem Beifahrer überlässt (oder als Fahrer mal eben rechts ranfährt). Denn das Zeug erfordert in vielen Fahrzeugen so viel Aufmerksamkeit, dass man das während der Fahrt eigentlich nicht verantworten kann.

Ich finds auch bei der sonstigen Entwicklung schrecklich, was es ständig neues gibt und wie alles hochgelobt wird.

Ja, und nicht alles was neu ist und "gehypt" wird, ist auch wirklich sinnvoll.

Willkommen im Land der Säue 😂

Amen. 🙄

Live long and pros healthy,
 Martin

[Gunnar Bittersmann]

@@Der Martin

Ich bin aber absolut dagegen, dass Einrichtungen wie etwa die Klimaanlage, das Autoradio oder auch das Navi so kompliziert zu bedienen sind, dass man wirklich erst das Handbuch studieren muss - und die Bedienung dieser Einrichtungen dann trotzdem lieber dem Beifahrer überlässt

Ja!!1elf

War gerade zwei Wochen mit ’nem Leihwagen unterwegs. (Hab schon seit Ewigkeiten kein eigenes Auto mehr – brauch ich nicht.) Nagelneuer Ford Puma. (Nein, keinen SUV bestellt gehabt.)

Ich hatte noch nie ein Auto mit so ’nem bescheuerten Navi. Ich benutze ein Navi so gut wie nie als Navi (und schon gar nicht will ich, dass das Ding spricht!), aber gern als Karte zur Orientierung. Und dafür ist das Ding völlig ungeeignet. Pinch to zoom? Fehlanzeige. Und wenn man es doch mal geschafft hat, sich den Maßstab wie gerade benötigt einzustellen, springt das Ding von selbst in wenigen Sekunden in die Ansicht zurück, die es meint, dass es die bessere für den Fahrer wäre.

Von so Kleinigkeiten wie die aktuelle Position nicht in der Mitte zu fixieren, sondern nach Wunsch mehr am Rand, damit das Zielgebiet in der Mitte ist, will ich gar nicht erst anfangen … Ford 0 Punkte.

Das Beste, wozu das Ding zu gebrauchen ist: als iPad-Halterung. Einfach das iPad mit einem Gummi befestigen, Apple Maps laufen lassen – schon hat man was Brauchbares.

😷 LLAP

[Matthias Scharwies]

Servus!

Ich finde es ganz toll, dass ihr mir so weiterhelft. Herzlichen Dank dafür.

Danke für die Wertschätzung!

...

Sehr viele Eindrücke, die sich zu oft überlagern und sich mitunter auch zu widersprechen scheinen. Da begegnet Vergangenes dem "noch nicht" und was gestern ein " noch nicht" gewesen ist, ist heute fast schon veraltet. Kaum hatte ich mich mit " float" angefreundet, war es auch schon nicht mehr der absolute Design- Favorit. Also keine leichte Kost für jemanden, der keinerlei Ambition hat, ein medientechnologischer Quereinsteiger zu werden. Fange ich daher doch mal mit einer ganz wichtigen Frage an: " Welches Buch" könntet Ihr mir empfehlen", um als Anfänger auf aktuellem Stand präzise Informationen, gut aufbereitet zu erhalten ?

E ben deswegen keins. Im Webdesign dreht sich die Uhr schneller als anderswo. Grad letztes Jahr fanden wir bei uns noch ein Tutorial zu floats, dass wir durch Beispiel mit Grid Layout ersetzten.

Lass uns Deine Webseite Stück für Stück modernisieren. Rom ist auch nicht an einem Tag erbaut worden.

Herzliche Grüße

Matthias Scharwies

[Gunnar Bittersmann]

@@MichaelS

Danach W3schools

Oh-oh. Das mag inzwischen besser geworden sein als sein Ruf – aber trauen würde ich dem, was da drin steht, nicht.

Kulturbanause

Ja, der weiß, wovon er spricht.

" Welches Buch" könntet Ihr mir empfehlen", um als Anfänger auf aktuellem Stand präzise Informationen, gut aufbereitet zu erhalten ?

Resilient web design von Jeremy Keith. Gibt’s auch als Hörbuch.

😷 LLAP

[keineAhnun]

@Gunnar

Danke für den tollen Text. Ich habe ihn mit Genuss gelesen und dabei festgestellt: ersetzte die web- Fachbegriffe und setze die Entsprechenden aus der Juristerei, Theologie, Medizin, what ever ein und Du wirst feststellen, der Jeremy Keith hat ausgezeichnete Gedankengänge formuliert von allg. Gültigkeit. Muss man erst mal hinbekommen. Ich habe es gleich weitergeleitet an unseren " Cheftheologen", der immer für herausragende Ideen zu haben ist! Das Postel´sche Gesetz ist doch herrlich "Be conservative in what you send; be liberal in what you accept." und allgemeingültig: " sei behutsam ( im Sinne von bewahrend) was Du sagt, aber frei in dem, was Du hörst.

Ein ganz toller Text und nochmal Dank dafür !!!!

@Rolf und Matthias Schaarwies

Großer Respekt vor Eurem Können und Eure Mühe!

Ich habe mir den Code aus diesem Editor in meine leeren Editordateien kopiert, die HTML Datei vervollständigt und damit gearbeitet, weil es für mich besser lesbar ist und ich somit zusätzliche Fehler vermeide. Die positive Nachricht zuerst: 90 % vom Code sind klar und für mich nachvollziehbar.

Probleme habe ich bei

display: grid;

grid-template: ". . losung logo ." auto
"y y stamm menu m-over " auto ". . stamm main ." 1fr /

              1fr 3em 10em minmax(20em, 50em) 1fr; 

Hintergrund: Ich habe bisher immer nur die Gitter benannt und nie die Kurzschreibweise genutzt. Daher lese ich dies Anweisung so:

display:grid /* ist klar*/ <br>

grid-template: " leer leer losung logo leer ( was bedeutet " an dieser Stelle?) auto;

In der nächsten Zeile kann ich mit: "y y stamm menue m-over" auto

nichts verbinden. Steht "y" für die Nebenachse - hier die senkrechte?

in der Zeile ". . stamm main ." 1fr/ kann ich erkennen: " leer leer stamm main leer -- Ende! Warum stehen die Anführungszeichen VOR "auto" und VOR "fraction"? Da habe ich Lernbedarf!

Dann, bedeutet: ... flex: 2 0 40%; = flex-grow:2 flex-shrink:0 flex basis: 40%;

und

.x {

   grid-area: x;
   background-color:linen;
    }

kann ich nicht zuordnen.

Sodann noch eine Frage zu der Ordnung. Nein ich bin bestimmt kein Ordnungsfetischist, aber ich frage mich, warum der Bereich weit unten im Codelauf definioert wurde, während weiter oben die inhaltlichen Dinge verzeichnen sind. Welcher Gedankengang steht dahinter?

Eine wichtige Frage ist noch offen ( habe ich aber mit dem neuen Code auch noch nicht probiert: Wie bekomme die den "stamm", also das verticale Menue angenagelt? Mit "position: fixed;" soll es bei "Flexbox" und "Grid" nicht funktionieren. "position: absolut" darf in responsiven Seiten nur sehr bedingt ( z.B. Menü) verwendet werden. Bliebe "position: sticky;". Wie würdet Ihr das machen?

1. gar nicht!
2. mit "position: sticky;" oder
3. mit einer anderen Lösung?

Ich versuche mal das CSS- Abbild mit meinen Anmerkungen zu laden, damit jeder / jede sogleich weiß, um was es eigentlich geht.

Mit dem "radikalem Aufräumen" ist das so eine Sache. Meine Frau würde liebend gerne mal in meiner Werkstatt all die Maschinen und Werkzeuge, die 2 oder dreifach vorhanden sind radikal entsorgen. Aber das geht eben nur" über meine Leiche". An jeder Maschine, jedem Schnippel Code hängt eine Geschichte und die Kunst dabei ist, nicht zum Messi zu werden! Dabei geht gar nicht um gewollte Unordnung! Es geht um das Nichtwissen des besseren Weges. Es ist letztlich immer ein Spagat zwischen den pers. Fähigkeiten und dem anvisiertem Ziel.

Euch allen- nochmals ein ganz herzliches Dankeschön! Ein gesegneten Sonntag wünscht MichaelS

[Rolf B]

Hallo Michael,

ich habe Dich für Hintergrundinformationen aus gutem Grund an unser Wiki verwiesen.

Es gibt eine Menge Varianten, wie man ein Grid definieren kann. Dabei sind diese Aufgaben zu lösen:

• Wie breit ist welche Spalte
• Wie hoch ist welche Zeile
• Welches Grid-Item kommt in welchen Rasterbereich.
• Und dann kommen noch Optionen für automatische Platzierung und für automatisches Hinzufügen von Zeilen (oder Spalten).

grid-template-columns definiert Spaltenbreiten, grid-template-rows definiert Zeilenhöhen. Das hast Du verwendet.

Und dann hast Du deine Grid-Items mit grid-row/column-start/end platziert. Das kann man machen. Es ist nur nicht so gut lesbar. Und umständlich.

Eine Alternative sind benannte Grid-Bereiche. Dafür gibt es die Eigenschaft grid-template-areas. Ich habe grid-template verwendet, das ist eine Kurzform, die erkläre ich ganz zum Schluss.

Wenn Du ein Grid aus 5 Spalten und 3 Zeilen machen willst, dann gibtst Du für grid-template-areas drei Zeichenketten an, eine pro Zeile. Und jede Zeichenkette enthält fünf Namen. Oder einen Punkt für unbenannte Bereiche. Die unabgekürzte Version sieht dann so aus:

body {
  grid-template-areas: ". .  losung logo ." 
                       "y y  stamm  menü m-over"
                       ". .  stamm  main .";
  grid-template-rows: auto auto 1fr;
  grid-template-columns: 1fr 3em 10em minmax(20em, 50em) 1fr;
}

.stamm
{
  grid-area: stamm;
  /* Die grid-area Angabe ersetzt das Folgende: */
  grid-row-start: 2;
  grid-row-end: 4
  grid-column-start: 3;
  grid-column-end: 4;
}

Ich habe also 3 Zeilen. Die Höhe der beiden ersten soll automatisch an Hand des Inhalts bestimmt werden, die dritte Zeile füllt den Rest der Höhe aus (1fr). Und ich habe 5 Spalten. Die zweite Spalte ist 3em breit, die dritte Spalte 10em, die vierte Spalte ist so breit wie möglich, aber mindestens 20em und höchstens 50em. Die Spalten 1 und 5 füllen den verbleibenden Platz. D.h. solange die Spalte 4 nicht 50em breit ist, haben die Spalten 1 und 5 die Breite 0. Und danach breiten sie sich aus und haben die gleiche Breite, d.h. der eigentliche Body in den Spalten 2 bis 4 wird dadurch horizontal zentriert.

Nun zu den template-areas. Wie gesagt, das sind drei Zeichenketten (also Text, der in Anführungszeichen steht), eine pro Zeile. Jede Zeichenkette enthält 5 Angaben für Spalten.

Zeile 1: Zwei Punkte, also kein benannter Bereich in Spalte 1 und 2. Dann losung, Zeile 1, Spalte 3 hat also den Namen losung. logoist in Zeile 1, Spalte 4. Und Spalte 5 ist wieder unbenannt.

Zeile 2: Wenn zwei Namen in diesen Zeichenketten gleich sind, macht das Grid einen zusammenhängenden Bereich daraus. Der Name y nimmt in Zeile 2 also die Spalten 1 und 2 ein. Da soll kein Inhalt hinkommen, da soll nur ein Dummy-div zum Färben hin, darum heißt er nur y, du könntest ihn auch kain oder kreuz-links nennen. Mit der y-Achse hat das nichts zu tun - ich hatte die inhaltslosen Bereiche nur zuerst x, y und z genannt und dann x und z duch Punkte ersetzt. Der Name m-over steht dann für "menu overflow", das ist das Gegenstück zum ersten y auf der linken Seite. Ich konnte aber menu und m-over nicht gleich nennen, denn ich möchte ja, dass das Menü im Hauptbereich bleibt und der m-over Bereich lediglich Farbe hat.

Zusammenhängende Bereiche können auchüber Zeilen hinweg gehen, das ist bei stamm der Fall.

Du kannst auch Bereiche mit 2 Zeilen und 3 Spalten machen, kein Problem. Grid schreibt nur vor, dass solche Bereiche quadratisch oder rechteckig sein müssen^[1]

Diese Namen sind Namen für Gridbereiche und haben mit Klassen oder HTML IDs nichts zu tun. Der nächste Schritt ist deshalb, HTML Elemente in benannten Gridbereichen zu platzieren. Das siehst Du darunter: Für Elemente mit der Klasse stamm wird per grid-area festgelegt, dass sie im Gridbereich stamm platziert werden sollen. Statt dessen könntest Du auch Zeilen und Spalten angeben, aber das ist lästig. Namen sind viel eleganter.

Und vor allem: wenn Du über eine @media Abfrage dein Layout umschalten willst, musst Du bei Verwendung von benannten Bereichen nur die templates umbauen. Die Grid-Items musst Du nicht mehr anfassen.

Und dann habe ich Mist gemacht. Ich habe nämlich gespart und es nicht erklärt. Das div mit Klasse balken hat dieses CSS:

.balken {
   grid-area: y-start / y-start / y-end / m-over;
}

Das ist kryptisch und - leider - inkonsistent.

Kryptik 1: Das grid-area Attribut kann mehrere Dinge tun. Es kann ein Element einem Bereich zuordnen, das war in dem .stamm Beispiel oben der Fall. Und es gibt die Version mit drei Schrägstrichen, dann ist es die Zusammenfassung von grid-row-start, grid-column-start, grid-row-end und grid-column-end - in dieser Reihenfolge.

Kryptik 2: Wenn ich einen benannten Bereich erstelle, dann erzeugt das Grid automatisch weitere Namen. Wenn ich den benannten Bereich y habe und y-start an einer Stelle hinschreibe, wo eine Spaltenangabe erwartet wird, dann steht y-start für die Spalte, in der y startet. Also 1. Schreibe ich y-start oder y-end an einer Stelle hin, wo eine Zeile erwartet wird, ist das die Zeile, wo y beginnt oder endet.

Inkonsistenz: Statt m-over hätte ich m-over-end schreiben müssen. Und nun kommt Magie hinzu, denn das habe ich gar nicht gewusst: Wenn ich m-over an einer Stelle hinschreibe, wo eine End-Angabe erwartet wird, verwendet der Browser automatisch m-over-end.

Besser wäre also gewesen:

.balken {
         /*  Von Zeile/Spalte bis  Zeile/Spalte */
   grid-area: y-start / y-start / y-end / m-over-end;
/* In Zahlen wäre das dies: 
   grid-area: 2  / 1 / 3 / 6;
*/
}

Und funktionieren würde auch jede der beiden folgenden grid-area Angaben:

.balken {
   grid-area: y / y / y / m-over;
   grid-area: y / y / m-over / m-over;
}

Der Browser denkt sich die passenden -start und -end automatisch dazu. Aber das ist dann schon höhere CSS Lehre. Es gibt noch mehr Möglichkeiten - aber ich habe sie nicht verstanden…

Und dann habe ich auch noch gespart: Ich hatte nämlich keine Lust, für die Füllbereich links und rechts jeweils ein eigenes DIV zu machen. Statt dessen gibt's nur eins, nämlich das mit der Klasse balken. Und das geht in Zeile 2 von Spalte 1 bis Spalte 5. Im HTML steht es vor dem Stamm- und Menü-Teil, deswegen liegt es im Hintergrund (was später kommt, wird obendrauf gestapelt).

Bei der HTML Reihenfolge der übrigen Teile war ich möglicherweise fehlerhaft. Man sollte das HTML so anordnen, dass die Inhalte in der gewünschten Reihenfolge stehen, wenn man das CSS ganz weglässt. Das Grid erlaubt mir beliebige Platzierung, das kann schon mal zu falschen Anordnungen verleiten.

Das alles kannst Du so verwenden. Ich bin aber noch einen Schritt weitergegangen.

Kennst Du die Eigenschaft background? Sie fasst 6 oder 7 Background-Eigenschaften zusammen. Genauso fasst grid-template die drei Template-Eigenschaften zusammen, die ich im body benutzt habe. Und natürlich muss man die Angaben auf eine Weise zusammenmixen, die intuitiv ist.

body {
  grid-template: ".   .   losung logo               ."      auto
                 "y   y   stamm  menü               m-over" auto
                 ".   .   stamm  main               ."      1fr /
                  1fr 3em 10em   minmax(20em, 50em) 1fr;

Du erkennst die Werte wieder? Die Namensbereiche für jede Zeile, hinter jedem Zeilenbereich steht die Zeilenhöhe. Und dann kommt ein / und danach die Spaltenbreiten. Das ist alles.

Rolf

---

1. Jajaja, ich weiß, ein Quadrat ist ein Spezialfall eines Rechtecks, aber ich rede hier mit einem Theologen und nicht mit einem Mathematiker ↩︎

[MichaelS]

Herzlichen Dank, Rolf! Jetzt habe ich das Prinzip verstanden!

War um 1994 "m-over" ein Begriff für "mouse over"- oder gab es da schon :hover? Ich weiß es nicht mehr, jedenfalls fragte ich mich, was ein "mouse over" in der Deklaration von Grid zu sagen hat. Naja, irren ist menschlich, sprach der Regenpilz im Kochtopf. Es gibt ( leider?) viele Möglichkeiten ein Grid-System zu definieren. Angefangen von meiner Lieblingsmethode, jede Bereiche per Rasterlinie zu beschreiben. Dann gibt es ja die Möglichkeit mit " stretch" zu arbeiten. Dann Areas zu direkt zu benennen ( wie Du es getan hast) u.s.w. . Das muss erstmal verstanden werden. Ich wandelte auf einem anderen gedanklichen Wanderpfad!

Ich habe gerade Teile der Mozilla Seite studiert: developer.mozilla.org und - wie im Wiki, viele wissenswerte Dinge gefunden. Ich mache dann mal langsam weiter, denn nun kenne ich den Weg!

Ganz lieben und herzlichen Dank für Deine viele Mühe! Bleib behütet und gesegnet!

Liebe Grüsse aus dem wunderschönen Köthener Land

von MichaelS

[Mitleser 2.0]

" Welches Buch" könntet Ihr mir empfehlen", um als Anfänger auf aktuellem Stand präzise Informationen, gut aufbereitet zu erhalten ?

Resilient web design von Jeremy Keith. Gibt’s auch als Hörbuch.

Habe ich gerade mal 10 Minuten überflogen. Klingt sehr gut und interessant. Aber anfängertauglich ist das m.E. nicht.

[Gunnar Bittersmann]

@@Mitleser 2.0

Resilient web design von Jeremy Keith. Gibt’s auch als Hörbuch.

Habe ich gerade mal 10 Minuten überflogen. Klingt sehr gut und interessant. Aber anfängertauglich ist das m.E. nicht.

Das würde ich nicht sagen. Das Buch ist sicher nicht dafür gedacht, HTML und CSS oder gar JavaScript im Detail zu lernen.

Aber es vermittelt einen guten Einstieg in grundlegende Dinge wie progressive enhancement, responsive design und inclusive design. Und dadurch ist es auch für Anfänger lesenswert. Wenn man diese Grundlagen gleich zu Beginn verinnerlicht hat, muss man später nicht mühsam umlernen.

😷 LLAP

[Mitleser 2.0]

Resilient web design von Jeremy Keith. Gibt’s auch als Hörbuch.

Habe ich gerade mal 10 Minuten überflogen. Klingt sehr gut und interessant. Aber anfängertauglich ist das m.E. nicht.

Das würde ich nicht sagen. Das Buch ist sicher nicht dafür gedacht, HTML und CSS oder gar JavaScript im Detail zu lernen.

Aber es vermittelt einen guten Einstieg in grundlegende Dinge wie progressive enhancement, responsive design und inclusive design. Und dadurch ist es auch für Anfänger lesenswert. Wenn man diese Grundlagen gleich zu Beginn verinnerlicht hat, muss man später nicht mühsam umlernen.

Ohne mindestens Grundkenntnisse hätte ich da nur Bahnhof verstanden, bzw. nicht einmal verstanden, worum es überhaupt geht. Für Anfänger daher IMHO untauglich.

[Henry]

Hallo Gunnar,

Danach W3schools

Oh-oh. Das mag inzwischen besser geworden sein als sein Ruf – aber trauen würde ich dem, was da drin steht, nicht.

Geht dort ja nicht nur um die Theorie, obwohl die da auch besser geworden sind, das tolle dort ist die effiziente Umsetzung der Beispiele gepaart mit dem Editor. So macht Try&Error Spass.

Gruss
Henry