Web Design for Developers: A Programmer's Guide to Design Tools and Techniques

Contents......Page 7
Building the Site......Page 0
Before We Get Started.........Page 13
The Design Process in Action......Page 14
YourFoodbox.com......Page 16
Acknowledgments......Page 17
The Basics of Design......Page 19
The Existing Site......Page 20
Gathering Requirements......Page 23
Know Your Purpose......Page 24
Where to Go from Here......Page 26
Sketching Your Ideas......Page 27
Summary......Page 31
The Basics of Color......Page 33
Color Context......Page 36
Evoking Emotion with Color......Page 37
Color Schemes......Page 41
The Web-Safe Color Palette......Page 46
Building Color Schemes......Page 47
Choosing Your Scheme......Page 58
Summary......Page 61
Font Anatomy......Page 62
Font Types......Page 63
Dealing with Font Limitations......Page 65
Selecting Our Fonts......Page 69
Using the Baseline Grid......Page 71
Summary......Page 76
Setting Up a Working Folder......Page 78
The Foodbox Logo......Page 79
What If We Need to Create Our Own Logo?......Page 84
Summary......Page 85
A Bit About Layers......Page 86
The Basic Structure......Page 87
Placing the Logo......Page 93
Adding a Reflection to Our Logo......Page 94
Wrapping Up......Page 96
Creating the Search Box......Page 97
The Browse Recipes Tag Cloud......Page 99
Mocking Up a Tasty Masthead......Page 100
Main Content......Page 103
Simulating the Browser......Page 104
Summary......Page 106
Creating the Search Icon......Page 107
Creating the Sign-up and Login Buttons......Page 112
You\'ve Got Content!......Page 115
Summary......Page 117
Building the Home Page with HTML......Page 119
Working with Web Standards......Page 120
The Home-Page Structure......Page 121
Semantic Markup......Page 122
The Home-Page Skeleton......Page 124
The Header......Page 134
The Sidebar......Page 135
The Main Content......Page 141
The Footer......Page 145
Validating Your Markup......Page 149
HTML 5......Page 151
Summary......Page 154
Graphics Optimization......Page 155
Dealing with Different Graphics Formats......Page 157
Creating Slices......Page 161
Extracting the Banner as a Transparent PNG......Page 164
Exporting the Rest of the Elements......Page 166
Summary......Page 167
Browsers Are Awful......Page 168
The Basics of CSS......Page 169
How Browsers Use CSS......Page 175
Creating and Linking a New CSS Style Sheet......Page 178
Defining the Basic Structure, Header, and Footer......Page 179
Turning One Column into Two......Page 184
Applying Margins to Content......Page 189
Main Content......Page 190
Summary......Page 193
Preparing the HTML to Be Replaced......Page 194
Replacing the Other Headings......Page 195
Replacing Links......Page 197
Summary......Page 198
Setting Up the Colors and Fonts......Page 199
The Tag Clouds......Page 202
The Search Form......Page 203
Cleaning Up Some Loose Ends......Page 204
Summary......Page 206
Preparing for Print......Page 207
Removing Unnecessary Elements......Page 208
Setting Margins, Widths, and Fonts......Page 209
Fixing Links......Page 210
Dealing with Surprised Users......Page 212
Summary......Page 213
Preparing for Launch......Page 214
Deciding What to Support......Page 215
Internet Explorer: The Evil You Can\'t Ignore......Page 217
Internet Explorer 7......Page 219
Internet Explorer 6......Page 220
Internet Explorer 8......Page 226
Other Browsers......Page 227
Summary......Page 228
What Does Accessibility Mean to You?......Page 229
Basic Accessibility Issues......Page 230
Being All-Inclusive!......Page 239
Critical Business Issues......Page 242
Improving Our Site\'s Accessibility......Page 243
Tabbing......Page 247
Accessibility Testing Checklist......Page 249
Summary......Page 251
Creating the Favicon......Page 252
Summary......Page 254
Content Is King......Page 255
Choosing Keywords......Page 257
Reconciling Our Content......Page 259
Links and You......Page 260
Summary......Page 261
Mobile Users......Page 262
Thinking About the (Very) Small Screen......Page 264
Serving Mobile Content......Page 265
Deciding What to Support......Page 266
Summary......Page 273
Strategies for Improving Performance......Page 274
Determining Performance Issues......Page 275
Addressing Performance......Page 277
Image Optimization......Page 284
Summary......Page 286
Additional Pages and Templates......Page 287
Advanced Templating......Page 290
Grid Systems and CSS Frameworks......Page 291
CSS Alternatives......Page 296
Visual Effects......Page 298
Experiment and Practice!......Page 304
Books on Fonts and Typography......Page 305
Web sites......Page 306
Bibliography......Page 308
B......Page 310
C......Page 311
F......Page 313
H......Page 315
I......Page 316
L......Page 317
P......Page 318
S......Page 320
W......Page 321
Z......Page 322