Using Adobe ® Dreamweaver ® and Photoshop ® An Introduction PART ONE The design phase before launching Dreamweaver

Chapter 1-1 Creating the critical first impression of your site

 Building an Idea Book  What is an Idea Book?  Collecting screen shots of existing web sites  The art of page design vs. visitor usability  Stimulating your creativity: the art of inspiration  An important reminder of the purpose of an Idea Book Chapter 1-2

 Surfing the competition  What is included in their sites  How is the information presented  How will your site be different?  The power of brainstorming  Brainstorming alone or with friends and colleagues  Defining the specifics of your future audience Chapter 1-3

 The principle  Critical content in the top pixel viewing area  Does not refer to horizontal scrolling  Engage your visitors to want to scroll for your content Chapter 1-4

 Web equivalent colors  A combination of 6 letters and numbers between A-F, and 0-9  Photoshop’s Color Picker generates the web equivalent for a selected color Chapter 1-5

 Understanding the web safe palette  RGB are “Additive”colors  White = #FFFFFF  Red = #FF0000  Green = #00FF00  Blue = #0000FF  Black = #  CC = 80%, 99 = 60%, 66 = 40%, 33 = 20% Chapter 1-6

 Web smart colors  All web combinations of A-F and 0-9 hexadecimal values that have double identical letters or digits such as: #0077DD  A total of 4,096 colors vs. 216 original web safe colors Chapter 1-7

 Determining the color scheme for a site  Designing within an existing corporate color identity  Designing a site based on color theory and psychological influence Chapter 1-8

 Color Fundamentals  Primary, Secondary, Intermediate/Tertiary  Monochromatic  Complementary  Warm/Cool  Analogous Chapter 1-9

 Choosing a color scheme based on the psychological influence of color  Combining the psychological influence of colors  Combining color theory with the psychological influence of color Chapter 1-10

Chapter 2-1 Typography for the web vs. the printed page

 A graphic designers introduction  Adapting print typography to web typography: similarities and differences Chapter 2-2

 Type properties  Size  Alignment  Vertical Spacing  Horizontal spacing  Indenting/Block quotes Chapter 2-3

 More type properties for web text  Style  Decoration  Weight  Variant  Transform  Color Chapter 2-4

 Definition of a paragraph  New paragraph/hard return: Return/Enter key  Line break/soft return: Shift+Return/Enter key Chapter 2-5

 General typeface categories  Serif  Sans Serif  Script  Decorative/Novelty  Monospaced/Fixed-width  Symbols Chapter 2-6

 Web Readability  Serif vs. Sans Serif for body text  Caps vs. Sentence case  Type color vs. background color  WWW Consortium standards Chapter 2-7

 How type speaks to the reader  The feeling/mood/tone of a typeface  Choosing a font that will “speak” to your visitors Chapter 2-8

 Understanding the problem  Web safe fonts  Font collections Chapter 2-9

 Custom font vs. viewer’s browser  Installed font  Editing the font list  Browser substitution Chapter 2-10

 Custom headlines created in Photoshop  Fonts are converted to graphics  Freely arrange type layout  Combine multiple typefaces if desired Chapter 2-11