Skip to content

Buchvorstellung: Modernes Webdesign mit CSS

Modernes Webdesign mit CSS

Modernes Webdesign mit CSS

Druckfrisch erreicht mich das Buch „Modernes Webdesign mit CSS“ von Heiko Steigert, den ich im letzten Jahr als Gastautor im Rahmen des Stadtportal-Vergleichs gewinnen konnte. In dem Buch geht Heiko detailliert auf CSS, HTML und JavaScript & Co ein, und er verdeutlicht mit seinem zweiten Buch über Webdesign, dass es bei der Website-Entwicklung unerlässlich ist, sich mit den Veränderungen, die das Internet mit sich bringt, auseinanderzusetzen. Für dt-Leser stehen zwei Exemplare bereit. Wer wissen will, wie man an ein Gratis-Exemplar gelangt und was das Buch zu bieten hat, liest weiter.

„Modernes Webdesign mit CSS“ richtet sich an Webentwickler und Webdesigner, die schon erste Erfahrungen gesammelt haben. Der Autor zeigt, wie man standardkonforme Webseiten mit CSS3 attraktiv und modern gestalten kann. Die Workshop-Beispiele sind praxisnah und räumen mit dem Mythos auf, dass barrierearme und mit Webstandards umgesetzte Webanwendungen langweilig und alles andere als kreativ sind.

Das Buch im Detail

Im ersten Themenschwerpunkt werden Grundlagen und CSS-Basiswissen, wie etwa der Aufbau von CSS-Regeln, unterschiedliche Layouttypen (fix, fluid, elastic) und auch die Vor- und Nachteile absoluter Größenangaben vermittelt. Hilfreich sind auch die unter „Seitenoptimierung und Debugging“ aufgeführten Tools, die eine wertvolle Unterstützung bei der Entwicklung und Überprüfung der Seiten darstellen. Sehr praxisnah ist der zweite Themenblock angelegt, in dem die Struktur der Site und wichtige Seitenelemente, wie etwa die Hauptnavigation, der Footer und die Kommentare besprochen und inklusive Code leicht nachvollziehbar vorgestellt werden. Unter dem Kapitelnamen „Trends, Tipps & Tricks“ werden im dritten Block einige Projekte (Blog, Firmenwebsite, Freelancer-Portfolio und Shop) präsentiert, die als inspirierende Beispiele den Lesern dazu einladen, die erlernten Techniken (u.a. Parallax-Effekt) gleich anzuwenden. Auch die optimale Aufbereitung von Online-Formularen und Kommentaren wird in diesem Abschnitt vermittelt. Der letzte Themenabschnitt beschäftigt sich sowohl mit weiteren kreativen Gestaltungstechniken (z.B. Akkordeon) als auch mit der Optimierung von Websites für mobile Anwendungen. Auf der mitgelieferten DVD liegen die einzelnen Beispiele als fertige HTML-CSS-Anwendungen bereit. Hier einige Seiten aus dem Buch:

Fazit

Insgesamt ein wunderbares Buch, das sehr schön die aktuellen Möglichkeiten des Webdesigns veranschaulicht. Als Nachschlagewerk wie auch als Arbeitsbuch leistet es sehr gute Dienste. Die für den Verlag gewohnt gute Aufmachung des Buchs wie auch die anschauliche Vermittlung des Stoffs durch den Autor sorgen für Kurzweil und laden dazu ein, zeitgemäßes Webdesign anzuwenden.

Basisdaten

erschienen bei Galileo Design
444 Seiten., 2011, gebunden, komplett in Farbe, mit DVD
ISBN 978-3-8362-1666-1
Preis 39,90 Euro

Verlosung / Die Aufgabe

Wie kommt man nun zu einem Gratis-Exemplar dieses Buches? Ganz einfach: Wer bis Donnerstag den 18.08.2011 22.00 Uhr einen Kommentar mit einem Tipp, Trick oder Trend zum Thema (CSS)Webdesign anheftet, hat die Chance, eines der beiden Bücher zu gewinnen. Das kann ein Link zu einem hilfreichen Tool sein, ein Tipp bezüglich einer ansprechend gestalteten Webanwendung oder auch die Vorstellung einer interessanten Technik oder eines sehenswerten Effektes. Jeder Kommentar, der in diese Richtung geht, nimmt an der Verlosung teil.

Dieser Beitrag hat 177 Kommentare

  1. SEO mit CSS und jQuery

    ZIEL:
    Viel Text auf der Webseite unterbringen, der für Suchmaschinen relevant ist und gut gelesen werden kann

    BEDINGUNG:
    Der Text darf die Usability und die Übersichtlichkeit der Seite nicht beeinträchtigen

    LÖSUNG:

    1. den Text in kleinere Teilabschnitte aufteilen

    2. für jeden Abschnitt eine passende Überschrift (H2) mit passenden, aber ausreichend oft gesuchten Keywords finden (z.B. über google.com/insights/search)

    3. für jeden Textabschnitt eine DIV-Box mit dem Text und eine DIV-Bos für die entsprechende H2 machen

    4. https://jqueryui.com/demos/toggle verwenden, um die Textboxen ein- und ausblendbar zu machen

    5. H2 jeweils als Link formatieren, der die zugehörige Box jeweils ein- oder ausblendet

    6. jeweils DIVs mit Texten und Überschriften nebeneinander anordnen und per Default nur einen Teil der Textboxen einblenden

    ERGEBNIS: Viel suchmaschinenlesbarer Content, ohne dass dieser den User stört

    Wichtig: Der User muss auf den ersten Blick erkennen können, dass er per Klick mehr Content sehen kann, ansonsten wäre das Cloaking. Darauf sollte man beim Design achten.

    Kann man auch mit anderen jQuery-Funktionen kombinieren.

    Ach, btw.: das o.g. Buch habe ich übrigens noch nicht und fände es sehr interessant… ;-)

  2. ***************************************************************************
    Was für eine tolle Linksammlung, die hier entstanden ist! Herzlichen Dank für die rege Teilnahme. Ich denke, nach dem Durchgehen die Tipps ist man eine ganze Ecke schlauer. Sehr inspirierend diese Sammlung.

    Nun also die Bekanntgabe der Sieger. Mit Hilfe des Zufallsgenerators habe ich zwei Zahlen ermittelt und zwar:

    Die Zahlen lassen sich leicht den Kommentaren zuordnen, da diese nummeriert sind. Freuen dürfen sich über ein Exemplar „Modernes Webdesign mit CSS“:
    Nina sowie oli

    Herzlichen Glückwunsch!
    Und allen anderen ganz herzlichen Dank fürs Mitmachen! Die Aktion ist nun beendet. Aber natürlich können auch weiterhin Tipps eingestellt werden.

    ***************************************************************************

  3. Als Nachschlagewerk und Ideenbringer wirklich geeignet. Ich habs mir auch zugelegt und konnte einige Beispiele direkt umsetzen. Erstauntlich, dass viele Agenturen immer noch fern von den Möglichkeiten von CSS arbeiten.

Kommentare sind geschlossen.

An den Anfang scrollen