Webdesign mit Photoshop CS6 und CSS3

Innovatives Webdesign war bisher ohne Adobe-Photoshop nicht denkbar. Aber: CSS3 heizt dem Konkurrenten ganz schön ein. Doch es muss nicht immer Entweder/Oder sein. Nutzen Sie die veränderten Gestaltungsmöglichkeiten und gehen Sie völlig neue Wege bei Ihrem Webdesign.


CSS3 ergänzt in vielen Bereichen die Arbeit mit Photoshop. Dieses Buch bietet daher die besten und innovativsten Lösungen aus beiden Welten. Damit gelingt jedes optisch ansprechende Layout, das außerdem den Ansprüchen moderner Webentwicklung entspricht.



Photoshop und CSS3 Hand in Hand
Da CSS3 in vielen Bereichen die Arbeit mit Photoshop ergänzt, bietet dieses Buch die Umsetzung vieler Beispiele sowohl mit Photoshop als auch mit CSS3. Damit gelingt jedes optisch ansprechende Layout, das außerdem den Ansprüchen moderner Webentwicklung entspricht. Wenn Sie sowohl die Möglichkeiten von CSS3- als auch die Photoshop-Lösung kennen, haben Sie die Wahl, welche Lösung sich für die Effekte besser eignet, die Sie sich wünschen.


Alles für attraktive und flexible Websites
Der Clou: Mit der Kenntnis aller Möglichkeiten von CSS3 und Photoshop sind Sie in der Lage, die Lösungen auszuwählen, die sich für Ihre Ansprüche am besten eignen. Planen Sie Projekte und Gestaltungsraster und entwickeln Sie passgenaue Farbkonzepte. Im nächsten Schritt arbeiten Sie in diversen unabhängigen Projekten, verbinden Farbflächen, setzen Texturen und Muster ein, optimieren Navigationselemente und Texte und erstellen Ihre eigenen Grafiken. Im letzten Schritt optimieren Sie das Layout für die Programmierung.

Responsive Webdesign
Dieses Buch behandelt die Gestaltung von Websites. Doch das Web hat sich verändert. Wurden Websites vor kurzer Zeit noch mit festen Abmessungen für wenige unterschiedliche Monitorgrößen gestaltet, hat sich dieses Bild vollständig gewandelt. Moderne Websites müssen flexibel gestaltet sein, um sich jeder Displaygröße anpassen zu können und somit den heutigen Anforderungen zu entsprechen.

Browserkompatibilität für Websites
Die verschiedenen Techniken für alle mordernen Brwoser, sowohl die Gestaltung mit Photoshop als auch die Umsetzung mit CSS3.

Praxisbeispiel zum Nacharbeiten
Anhand unterschiedlichster Beispiele und einem konkreten Webdesign-Projekt probieren Sie die wichtigsten Grafikelemente mit Photoshop CS6 aus und entdecken die Möglichkeiten, die im Programm stecken. Der Autor Jonas Hellwig liefert dabei nicht nur kreativen Input, sondern auch immer die wichtigsten technischen Hintergründe. Dabei spielt es übrigens keine Rolle, ob Sie lieber mit Windows oder Mac OS X arbeiten.


Webdesign Lösungen für Anspruchsvolle:

Gestaltungsraster planen und entwickeln
Farbkonzepte mit dem Adobe Kuler
Media Queries einsetzen und flüssige CSS-Grids erstellen
Kantenkontraste erhöhen und Linien mit Verlauf aufwerten
Wet-Floor-Effekt mit Photoshop und CSS3
Grafiken mit CSS kacheln
Bokeh-Effekt mit individueller Pinselspitze
Photoshop CS6 effizient konfigurieren
Arbeitsbereiche optimal einrichten, Werkzeuge und ihre Funktion
CSS3-Export, Ebenenstile in CSS3-Code umwandeln
Von A bis Z: Briefing und Projektplanung
Durchdachte Farbkonzepte, Layoutplanung und Scribble
Multi-Screen-Design, Grid-Systeme, Mock-ups und Wireframes
Farbflächen, White Space, Linien und Konturen
Schatten und Spiegelungen bei 2-D- und 3-D-Objekten
Layout für Smartphone und Tablet


Aus dem Buch "Webdesign mit Photoshop CS6 und CSS3" Inhalt:

Photoshop CS6 effizient konfigurieren
Arbeitsbereiche optimal einrichten, Werkzeuge und ihre Funktion
CSS3 Export, Ebenenstile in CSS3-Code umwandeln
Von A bis Z: Briefing und Projektplanung
Durchdachte Farbkonzepte, Layoutplanung und Scribble
Multi-Screen-Design, Grid-Systeme, Mock-ups und Wireframes
Farbflächen, White Space, Linien und Konturen, Transparenz
Schatten und Spiegelungen bei 2-D- und 3-D-Objekten
Muster, Strukturen, Brushes und CSS-Codebeispiele
Photoshop Brushes, eigene Brushes, skriptbasierte Muster
Grafiken mit CSS kacheln, Pattern mit CSS3
Navigationsstrukturen: Hierarchisch, Netzstruktur, Jump-linear, Infinite Scrolling u.m.
Drop-down & Fly-out, Breadcrumb-Navigation, Pagination
Navigationsmuster im Responsive Design
Attraktive Textgestaltung, Typografie im Internet
Fotos einsetzen und optimieren
Illustrationen, Icons, Animationen
Zierelemente für mehr Atmosphäre
Grafiken fürs Web optimieren
Dateiformate im Web, Slices, CSS-Sprites