Photoshop CS5 - mediendb.hjr-verlag.de · Mora 29 mm Photoshop CS5 für Webdesigner Adobe Photoshop...
Transcript of Photoshop CS5 - mediendb.hjr-verlag.de · Mora 29 mm Photoshop CS5 für Webdesigner Adobe Photoshop...
Mor
a
29 mm
Phot
osho
p CS
5 fü
r W
ebde
sign
er
Adobe
Photoshop CS5 für Webdesigner
Nils Manuel Mora
Außerdem zum Themabei mitp:
Aus dem Inhalt:• Konzeption des Layouts:
User Interface, Auf-lösungen, Proportionen, Farbwirkung
• Farben in Photoshop: Farbkonzepte, Farb-verläufe, Farbpaletten
• Flächen und Hintergründe: Muster, Brushes, Formen
• Fotobearbeitung für Webdesigner: Nutzungsrechte, Tonwertkorrekturen, der Goldene Schnitt, Ebenenfüllmethoden, Objekte freistellen
• Rahmen und Ränder: Briefmarkenrand, Esels-ohr, abgerundete Ecken, Fotorahmen
• Logo-Gestaltung: Origami, 3D, Eis, Gold, Feuer, Chrom
• Buttons: Lichtrefl exionen, Orb, Mini-Button, Sticker, Badges, Rollover-Effekte
• Typografi e: Schriftarten, Größe, Formatierung, Farbe, Schmuckschriften
• Slicing und Coding in HTML
• TYPO3-Template aus Bei-spielprojekt erstellen
• TYPO3 erweitern: Mail-Formular, Gäste-buch, News
• Einrichten eines eigenen Webservers
• Kostenlose Photoshop-Plugins
Photoshop CS5 ist eine extrem umfangreiche Software und bietet zahlreiche Funktionen für viele unterschiedliche Anforderungen. Wollen Sie Photoshop CS5 im Webdesign einsetzen, stehen Ihnen dafür unzählige Effekte und Werkzeuge zur Verfügung. Dieses Buch bereitet Sie gezielt da-rauf vor, Websites mit Photoshop zu erstellen und zu gestalten und Sie lernen genau die Funktionen kennen, die Sie hierfür benötigen.
Der Autor zeigt Ihnen den vollständigen Entwick-lungsprozess für Websites mit Photoshop – von der Konzeption über das Erstellen des Layouts und der einzelnen grafischen Elemente bis hin zum Coding in HTML. Sie lernen alle relevanten Vorgehenswei-sen für schlichte oder kreative Layouts kennen. In zahlreichen kleinen Workshops stellt der Autor Schritt für Schritt einzelne Elemente vor, die Sie für Ihre Website einsetzen können. Diese sind auch als Photoshop-Datei auf der CD enthalten.
Zusätzlich zeigt Ihnen der Autor in den letzten bei-den Kapiteln, wie Sie ein in Photoshop erstelltes Layout in das Content Management System TYPO3 übertragen, daraus ein TYPO3-Template mit Typo-Script erzeugen und wie Sie zuvor in Photoshop erstellte Buttons für Navigation und Menüs ein-binden.
Im Verlauf des Buches werden zwei Beispielpro-jekte umgesetzt. So bekommen Sie den typischen Workflow eines Webdesigners aus nächster Nähe mit und sind schließlich auf alle Anforderungen vorbereitet.
Sie werden umfassend für das Erstellen und Layouten von Websites mit Photoshop geschult, so dass Sie Ihre eigenen Ideen professionell umset-zen können.
Photoshop-Funktionen speziell für Webdesigner detailliert erläutertZahlreiche Workshops zum Erstellen einzelner Elemente und verschiedener Layout-VariantenVollständiger Workfl ow bis zur statischen HTML-Seite und zum TYPO3-Template
ISBN 978-3-8266-5607-1ISBN 978-3-8266-5607-1
ISBN 978-3-8266-1775-1
ISBN 978-3-8266-1779-9
(D) €
39
,95
Inklusive CD-ROM
ISBN 978-3-8266-5507-4
978-3-8266-5607-1_umschlag 02.indd 1 31.08.2010 16:26:26
391
IndexAAbdunkeln siehe EbenenfüllmethodenAktionen 104Aufhellen siehe EbenenfüllmethodenAuflösungen 22Ausschluss siehe Ebenenfüllmethoden
BBildschirmauflösungen siehe AuflösungenBriefing 35Browserkompatibilität 292
IETester 293Lunascape 292
Brushes 64ABR Viewer 66Brushes anpassen 72Eigene Brushes erstellen 66Pinselspitzen hinzuladen 65
Buttons 187Badges 202Button mit Lichtreflexion 188Button mit Symbol 206Horizontale Navigationsleiste 205Mini-Button 198Orb 191Sticker 199Vertikales Menü 209Vista-Style 197
CChronologisches Menü 316Coding
Barrierefreies Coding 240Das Kontaktformular 283Das PHP-Skript zum Einbinden von Unter-
seiten 263Die Bildergalerie 270Formularauswertung 286Formularauswertung mit externem Skript
288Formular-Chef 288Lightbox 2 271
PHP-Skript zum Einbinden von Untersei-ten 270
Unterseiten anlegen 262View Source Chart (Firefox Add-On) 250
Content-Management-Systemen siehe TYPO3CSS
CSS-Datei einbinden 240Druckversion definieren 241Dynamischer Content-Bereich 248Hintergrundfarbe 241Hintergrundgrafik 242Kommentare 241Spaltenlayout 267
Custom Shapes siehe Formen
DDifferenz siehe EbenenfüllmethodenDigital Native 19Disclaimer 290Drittel-Regel 24Dynamische Inhalte 350
EEbenenfüllmethoden 95Ebenenkompositionen 208Ebenenmasken 143Eselsohr 128
FFarbbalance 115Farbe
Adobe Kuler 50Das Farbkonzept 49Farbpalette 49Farbverläufe 51, 79Farbwirkung 25Hexadezimale Farbangaben 48
Farbe siehe EbenenfüllmethodenFarbig abwedeln siehe EbenenfüllmethodenFarbton siehe EbenenfüllmethodenFarbton/Sättigung 88, 112, 114
Färben 89Favicon 318
00_Photoshop-5607-1.book Seite 391 Donnerstag, 2. September 2010 4:51 16
© des Titels »Adobe Photoshop CS5 für Webdesigner« (ISBN 978-3-8266-5607-1) 2010 by Verlagsgruppe Hüthig Jehle Rehm GmbH, Heidelberg Nähere Informationen unter: http://www.it-fachportal.de/5607
392
I N D E X ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
Flächen und Hintergründe 55Muster 57
Formen 171Fotobearbeitung für Webdesign
Kante verbessern 101Fotobearbeitung für Webdesigner 81
Copyright siehe UrheberrechtCreative Commons 84Fotorecherche 82Horizont ausrichten 94Inhaltssensitives Füllen 102Nutzungsrechte 82Objekte freistellen 99, 210Urheberrecht 83
Fotofilter 112FTP-Manager 369Füll- und Einstellungsebenen 109
GGoldener Schnitt 24, 93Gradationskurve 91, 176Grids
960-Grid-System 23, 384Gridmaker 384
HHaftungsausschluss siehe DisclaimerHart mischen siehe EbenenfüllmethodenHartes Licht siehe EbenenfüllmethodenHellere Farbe siehe EbenenfüllmethodenHelligkeit/Kontrast 115Hierarchisches Menü 316Hover-Effekt 208HTML
Formulare 283Grundgerüst 239Interaktives Menü 268Sonderzeichen 262Zeichenkodierung 239
HTML-Editor 361CoffeeCup Free HTML Editor 366Dreamweaver 362HTML-Grundgerüst 365Weaverslave 367
IImageMagick 358Indizierte Farbe 273Ineinanderkopieren siehe Ebenenfüllmethoden
Inhaltbewahrendes Skalieren 122Interface siehe User Interface
KKarbonfasermuster 59
LLichtpunkt siehe EbenenfüllmethodenLinear abwedeln (Hinzufügen) siehe Ebenen-
füllmethodenLineares Licht siehe EbenenfüllmethodenLogo
Das 3D-Logo 155Das Abstraktions-Logo 152Das Chrom-Logo 174Das Eis-Logo 165Das Feuer-Logo 172Das Gold-Logo 170Das Origami-Logo 151Glanzeffekte 162Logo-Entwurf 39Logo-Gestaltung 149Reflexionen 160
Luce 387Luminanz siehe Ebenenfüllmethoden
NNavigationsebenen 316Navigationskonzepte 315Negativ multiplizieren siehe Ebenenfüllmetho-
den
OOut of Bounds siehe Out of FrameOut of Frame 121
PPage Curl siehe EselsohrPhotoFrame 136Photoshop
Die Arbeitsfläche 45Farben 47Photoshop-Versionen 44
Pinselspitzen siehe BrushesPlugins 383Prägnanz siehe User InterfaceProportionen 23
00_Photoshop-5607-1.book Seite 392 Donnerstag, 2. September 2010 4:51 16
© des Titels »Adobe Photoshop CS5 für Webdesigner« (ISBN 978-3-8266-5607-1) 2010 by Verlagsgruppe Hüthig Jehle Rehm GmbH, Heidelberg Nähere Informationen unter: http://www.it-fachportal.de/5607
393
––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––– I N D E X
RRahmen 119
Dynamische Rahmen 124Fixe Rahmen 124Gestrichelte Linie 127
Ränder 119Abgerundete Ecken 137Briefmarkenrand 126
Raster 206Relative Größenzuweisung in HTML/CSS 222
Elternelemente 222Rollover-Effekt siehe Hover-EffektRSS-Feeds 343
SSättigung siehe EbenenfüllmethodenScanline-Muster 60Schwarzweiß 90Scribble siehe SkizzeSkalieren (Inhalt bewahren) siehe Inhaltbe-
wahrendes SkalierenSkizze 35, 36, 42Slicing
Das Slice-Werkzeug 243, 256Slices speichern 257
Smart-Objekte 109Speaking Navigation 17Spiegeleffekt 207, 277Sprenkeln siehe EbenenfüllmethodenStapelverarbeitung 104, 107Statische Inhalte 350Strahlendes Licht siehe EbenenfüllmethodenSubtrahieren siehe Ebenenfüllmethoden
TThredgeholder 386Tonwertkorrektur 86, 111
Tonwertspreizung 86Tonwertumfang 88
TYPO3 295Backend 376Backend-Module 377Content-Darstellung 308Datums- und Zeitanzeige 343Dynamisches Grafikmenü 320Erweiterungen 329, 338Erweiterungs-Manager 329, 338, 346Erweiterungs-Template 335, 346
Extensions 328, 338Fileadmin 299Font-File 322Footer anlegen 312Gästebuch 328GhostScript 379Grafiken einbinden 299Grafikmenü 306, 320Hover-Effekt 307Installation des CMS 373Install-Tool 378Konstanten 303Konstanten-Editor 336, 346Mail-Formular 326Neue Seite erstellen 298News 338News-Einträge 340Plugins 329, 338, 346Root-Seite 298Seitenbaum 298Seiteneigenschaften 305Seiten-ID 298Seiteninhalt anlegen 310Seitensprache 332, 342Spracheinstellung 380Statische Templates einbinden 346Statische Templates einschließen 309,
331, 341Statisches Grafikmenü 305Subparts 297Template anlegen 299Template-Ressourcen 309, 321Textmenü 312, 317TYPO3-Cache 336TypoScript 296, 300, 304, 306, 307,
309, 312TypoScript-Objekt-Browser 334Unterseiten anlegen 305Weiterleitung 308
TYPO3-Extensions 346Typografie für Webdesigner
@font-face-Funktion 217Font Stack Builder 218Font-Stacks 217Generische Schriftfamilie 218Google Font Directory 217Hierarchie 223Initialen 232Schmuckschriften 235
00_Photoshop-5607-1.book Seite 393 Donnerstag, 2. September 2010 4:51 16
© des Titels »Adobe Photoshop CS5 für Webdesigner« (ISBN 978-3-8266-5607-1) 2010 by Verlagsgruppe Hüthig Jehle Rehm GmbH, Heidelberg Nähere Informationen unter: http://www.it-fachportal.de/5607
394
I N D E X ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
Schriftart 216, 217Schriftgewicht 229Schriftgröße 222Schriftstil 228Schriftvariante 229Serifen 218Systemunabhängige Schriftarten 216Textausrichtung 233Textdekoration 229Texteinrückung 231Textfarbe 234Texttransformation 230Typetester 220White Space 226Wort- und Zeichenabstand 225Zeilenabstand 223Zeilenlänge 224
Typografie im Webdesign 215
UUlead FantasyWarp 389Ulead Particle 388Unterteilen siehe EbenenfüllmethodenUsability 17User Interface 17
VVirtual Photographer 385
WWebhosting siehe WebserverWebserver 349
eigener Webserver 350, 353externer Webserver 350, 351
Weiches Licht siehe EbenenfüllmethodenWet-Floor-Effekt siehe Spiegeleffekt
XXAMPP siehe Webserver
ZZeichenstift-Werkzeug 74, 181Zielgruppe 19
00_Photoshop-5607-1.book Seite 394 Donnerstag, 2. September 2010 4:51 16
© des Titels »Adobe Photoshop CS5 für Webdesigner« (ISBN 978-3-8266-5607-1) 2010 by Verlagsgruppe Hüthig Jehle Rehm GmbH, Heidelberg Nähere Informationen unter: http://www.it-fachportal.de/5607