Master visually Web design

MASTER VISUALLY™ Web Design......Page 1
WHAT’S INSIDE......Page 9
TABLE OF CONTENTS......Page 11
HOW TO USE THIS BOOK......Page 23
SECTION I: CONCEPTUALIZE YOUR WEB SITE......Page 24
AN INTRODUCTION TO WEB STRATEGIES......Page 26
CRAFT A MISSION STATEMENT......Page 28
DEFINE YOUR GOALS......Page 30
ISOLATE YOUR NICHE......Page 32
DEFINE YOUR BRAND IDENTITY......Page 34
DEFINE USER GOALS......Page 36
CREATE USER PERSONAS......Page 38
CREATE USER SCENARIOS......Page 39
ISOLATE SITE COMPONENTS......Page 40
BE INTERACTIVE......Page 42
USING CONSISTENT DESIGN ELEMENTS......Page 44
RELINQUISH CONTROL......Page 46
BUILD FOR FLEXIBILITY......Page 48
USING ESTABLISHED BEHAVIOR PATTERNS......Page 50
KEEP IT SIMPLE......Page 52
SHOW VISITORS WHERE THEY ARE......Page 53
THINK GLOBALLY......Page 54
SECTION II: AUTHOR WEB PAGES......Page 56
AN INTRODUCTION TO HTML......Page 58
VIEW HTML SOURCE CODE......Page 60
CREATE AN HTML SKELETON......Page 62
SET MARGINS......Page 64
DEFINE THE BACKGROUND......Page 65
CREATE PARAGRAPHS AND LINE BREAKS......Page 66
ADD EMPHASIS TO TEXT......Page 68
SET FONT ATTRIBUTES......Page 70
ADD HEADINGS......Page 72
ADD A HORIZONTAL RULE......Page 73
ADD HYPERLINKS AND MAILTOS......Page 74
CHANGE THE COLOR OF LINKS......Page 76
CREATE INTERNAL PAGE LINKS......Page 77
ADD AN IMAGE......Page 78
CREATE A LIST......Page 80
CREATE A TABLE......Page 82
WORK WITH ROWS AND COLUMNS......Page 84
ADD COMMENTS......Page 86
USING SPECIAL CHARACTERS......Page 87
ADD < META> TAGS......Page 88
AN INTRODUCTION TO FORMS......Page 90
SET UP A FORM......Page 92
ADD A TEXT INPUT FIELD......Page 94
ADD A PASSWORD FIELD......Page 96
ADD A TEXT BOX......Page 97
ADD A SUBMIT BUTTON......Page 98
ADD CHECK BOXES......Page 100
ADD RADIO BUTTONS......Page 102
CREATE A DROP- DOWN MENU......Page 104
ADD STYLE TO FORM ELEMENTS......Page 106
USING FIELDSETS AND LEGENDS......Page 108
USING LABELS......Page 109
DISABLE FORM FIELDS......Page 110
USING HIDDEN FIELDS......Page 111
ALLOW USERS TO SEND ATTACHMENTS......Page 112
SEND FORM DATA TO AN E- MAIL ADDRESS......Page 114
AN INTRODUCTION TO FRAMES......Page 116
USING < NOFRAMES> TAGS......Page 118
CREATE A FRAMESET......Page 120
SIZE YOUR FRAMES......Page 122
CONTROL FRAME BORDERS......Page 124
NEST FRAMES......Page 125
CREATE AN INLINE FRAME......Page 126
TARGET FRAMES......Page 128
DEFINE A BASE TARGET......Page 130
USING FRAMES FOR NAVIGATION......Page 132
USING FRAMES FOR BANNER ADS......Page 133
AN INTRODUCTION TO CASCADING STYLE SHEETS......Page 134
DEFINE INLINE STYLE ATTRIBUTES......Page 136
CREATE A DOCUMENT- LEVEL STYLE SHEET......Page 138
CREATE AN EXTERNAL STYLE SHEET......Page 140
USING TAG SELECTORS......Page 142
DEFINE CLASSES......Page 144
DEFINE ID ATTRIBUTES......Page 146
SET STYLE PROPERTIES WITH < DIV> AND < SPAN> TAGS......Page 147
COMMENT WITHIN STYLE SHEETS......Page 148
SET PAGE MARGINS......Page 149
DEFINE FONT PROPERTIES......Page 150
DEFINE HYPERLINK PSEUDO- CLASSES......Page 152
DEFINE MULTIPLE CLASSES FOR HYPERLINKS......Page 154
DEFINE PARAGRAPH PSEUDO- CLASSES......Page 156
CREATE LISTS WITH STYLES......Page 158
ADD SCROLLING ELEMENTS......Page 160
POSITION PAGE ELEMENTS......Page 162
LAYER ELEMENTS WITH THE Z- INDEX PROPERTY......Page 164
CONTROL VISIBILITY......Page 166
SECTION III: BUILD AN EFFECTIVE USER INTERFACE......Page 168
AN INTRODUCTION TO USABILITY ONTHE WEB......Page 170
CODE FOR ACCESSIBILITY......Page 172
WRITE TEXT FOR SCANNABILITY......Page 174
CREATE STRUCTURED TEXT BITES......Page 176
ELIMINATE DEAD ENDS......Page 178
ELICIT FEEDBACK FROM VISITORS......Page 180
CREATE A PRINTER- FRIENDLY VERSION OF A WEB PAGE......Page 182
USING ALT ATTRIBUTES......Page 184
SPECIFY LANGUAGES......Page 186
OFFER ALTERNATIVE LANGUAGE VERSIONS......Page 188
AN INTRODUCTION TO INFORMATION ARCHITECTURE......Page 190
UNDERSTANDING ORGANIZATIONAL STRUCTURE......Page 192
STRUCTURE......Page 194
STRUCTURE......Page 196
MAP AN INFORMATION HIERARCHY......Page 198
DEVELOP A LABELING SYSTEM......Page 200
USING SCOPE NOTES......Page 202
USING ICON LABELS......Page 203
DESIGN A SEARCH INTERFACE......Page 204
DISPLAY SEARCH RESULTS......Page 206
AN INTRODUCTION TO WEB NAVIGATION......Page 208
CREATE A SIDE NAVIGATION BAR......Page 210
CREATE A BASIC TABBED NAVIGATION BAR......Page 212
IMPLEMENT A SITE MAP......Page 214
CREATE A BREAD- CRUMB TRAIL OR TOPIC PATH......Page 216
REINFORCE POSITION......Page 218
USING URLS TO REINFORCE PLACEMENT......Page 220
OPTIMIZE PAGE TITLES......Page 222
CLARIFY TEXT LINKS......Page 224
USING LINK TITLES......Page 226
USING A LOGO AS A HOMEPAGE LINK......Page 228
INCORPORATE MULTIPLE NAVIGATION SCHEMES......Page 230
SECTION IV: DESIGN A VISUAL INTERFACE......Page 232
AN INTRODUCTION TO COLORTHEORY......Page 234
USING THE WEB- SAFE COLOR PALETTE......Page 236
CONSIDER COLOR SIGNIFICANCE......Page 238
EXPLORE CONTRAST......Page 240
IDENTIFY AN ESSENTIAL COLOR PALETTE......Page 242
UNDERSTANDING AVAILABLE PAGE SPACE......Page 244
ESTABLISH VISUAL HIERARCHY......Page 246
USING WHITE SPACE......Page 248
USING TABLES FOR PAGE LAYOUT......Page 250
USING CSS FOR PAGE LAYOUT......Page 252
AN INTRODUCTION TO TYPOGRAPHY ON THE WEB......Page 254
SPECIFY CROSS- PLATFORM FONTS......Page 256
USING SCALE......Page 258
USING PRE- FORMATTED TEXT......Page 260
USING BLOCK QUOTES......Page 262
USING ANTI- ALIAS GRAPHIC TEXT......Page 264
CREATE A DROP CAP WITH CSS......Page 266
CREATE A GIF DROP CAP......Page 268
CREATE PULL QUOTES......Page 270
USING SMALL CAPS......Page 272
DEFINE LETTER- SPACING......Page 274
DEFINE WORD- SPACING......Page 276
DEFINE LINE- HEIGHT......Page 278
OVERLAP TEXT......Page 280
EMBED A FONT......Page 282
CONVERT A FONT TO USE ON THE WEB......Page 284
AN INTRODUCTION TO WEB GRAPHICS......Page 286
TAKE A SCREENSHOT......Page 288
CROP AN IMAGE......Page 290
OPTIMIZE A JPEG......Page 292
OPTIMIZE A GIF......Page 294
RESIZE A GIF......Page 296
ADD TRANSPARENCY TO A GIF......Page 298
CREATE A TRANSPARENT SPACER GIF......Page 300
CREATE AN ANIMATED GIF......Page 302
CREATE AN IMAGE MAP......Page 304
CREATE A THUMBNAIL IMAGE......Page 306
INTRODUCING THE NEW WEB GRAPHICS STANDARDS......Page 308
CREATE A PNG IMAGE......Page 310
ADD A PNG IMAGE TO AN HTML PAGE......Page 312
DOWNLOAD THE ADOBE SVG VIEWER......Page 314
CREATE AN SVG FILE......Page 316
SECTION V: ADD INTERACTIVITY......Page 318
AN INTRODUCTION TO CLIENT- SIDE JAVASCRIPT......Page 320
ADD SCRIPTS TO A WEB PAGE......Page 322
USING ESCAPE SEQUENCES......Page 324
SCRIPT AN ALERT DIALOG BOX......Page 326
WRITE TO A DOCUMENT......Page 328
DECLARE JAVASCRIPT VARIABLES......Page 330
CREATE A JAVASCRIPT OBJECT......Page 332
CREATE A JAVASCRIPT ARRAY......Page 334
CREATE AN IF STATEMENT......Page 336
CREATE A JAVASCRIPT FUNCTION......Page 338
TEST JAVASCRIPT CODE......Page 340
CREATE AN EXTERNAL JAVASCRIPT FILE......Page 342
HIDE JAVASCRIPT FROM OLD BROWSERS......Page 344
USING < NOSCRIPT> TAGS......Page 346
ADD TEXT TO THE STATUS WINDOW......Page 348
PROMPT THE USER FOR A RESPONSE......Page 350
GET CONFIRMATION......Page 352
ADD A LAST MODIFIED DATE......Page 354
SCRIPT A SCROLLING LIST......Page 356
SCRIPT BETWEEN FRAMES......Page 358
SCRIPT AROUND FRAMES......Page 360
CAPTURE KEYSTROKES......Page 362
OPEN A NEW WINDOW......Page 364
CLOSE A WINDOW......Page 366
REDIRECT TO A NEW PAGE......Page 368
REFERENCE THE DOM......Page 370
VALIDATE A FORM......Page 372
PRELOAD IMAGES......Page 374
SCRIPT IMAGE MOUSEOVERS......Page 376
CHECK FOR BROWSER VERSIONS......Page 378
SET A COOKIE......Page 380
SET A COOKIE......Page 382
READ A COOKIE......Page 384
INTRODUCTION TO SOUND......Page 386
UNDERSTANDING MULTIMEDIA PLUG- INS......Page 388
RECORD AND SAVE SOUND FILES......Page 390
ADD SOUND FILES AS LINKS ONWEB PAGES......Page 392
ADD SOUND FILES AS OBJECTS ONWEB PAGES......Page 394
ADD VIDEO FILES AS LINKS ONWEB PAGES......Page 396
ADD VIDEO FILES AS OBJECTS ONWEB PAGES......Page 398
INTRODUCTION TO FLASH ANIMATIONS......Page 400
UNDERSTANDING FLASH DISTRIBUTION METHODS......Page 402
START AND SAVE A FLASH FILE......Page 404
PUBLISH A FLASH MOVIE......Page 406
PUBLISH A FLASH MOVIE IN HTML FORMAT......Page 408
HTML FORMAT......Page 410
EXPORT A FLASH MOVIE TO ANOTHER FORMAT......Page 412
INTRODUCTION TO JAVA APPLETS......Page 414
CREATE A JAVA APPLET......Page 416
COMPILE JAVA CODE......Page 418
EMBED AN APPLET IN A WEB PAGE......Page 420
CHANGE APPLET PARAMETERS......Page 422
AN INTRODUCTION TO SMIL......Page 424
THE ANATOMY OF A SMIL DOCUMENT......Page 425
CREATE A SMIL DOCUMENT......Page 426
VIEW A SMIL DOCUMENT......Page 428
SECTION VI: WORK WITH WEB SERVERS......Page 430
AN INTRODUCTION TO WEB SERVERS......Page 432
STRUCTURE YOUR WEB SITE DIRECTORIES......Page 433
CREATE AN FTP VIRTUAL DIRECTORY......Page 434
DIRECTORY......Page 436
USING TELNET FOR SERVER ACCESS......Page 438
NAVIGATE DIRECTORIES ON AWEB SERVER......Page 440
USING UNIX COMMANDS......Page 442
STOP AND START A WEB SERVER......Page 444
CREATE A SERVER- SIDE INCLUDE......Page 446
ADD SSI MIME TYPES TO YOUR SERVER......Page 448
SET EXECUTE PERMISSIONS......Page 450
VIEW AN SSI WEB PAGE......Page 452
SECTION VII: EXPLORE EMERGING WEB TECHNOLOGIES......Page 454
AN INTRODUCTION TO WAP AND WML......Page 456
A BASIC WML DOCUMENT......Page 457
A QUICK LOOK AT INTEROPERABILITY AND USABILITY......Page 458
ADD WML MIME TYPES TO YOUR SERVER......Page 460
CREATE A BASIC WML DOCUMENT......Page 462
VIEW A WML DOCUMENT......Page 464
ALIGN AND FORMAT TEXT......Page 466
MOVE AROUND DOCUMENTS BY USING ANCHORS AND LINKS......Page 468
ASSIGN LINKS TO ACCESS KEYS......Page 470
USING A WIRELESS BITMAP CONVERTER......Page 472
ADD AN IMAGE TO A DOCUMENT......Page 474
ADD A TABLE TO A DOCUMENT......Page 476
USING ASP TO GENERATE WML TEXT......Page 478
INTRODUCTION TO XML......Page 480
CREATE AN XML DOCUMENT......Page 482
VERIFY AN XML DOCUMENT......Page 484
DECLARE A ROOT ELEMENT......Page 486
DECLARE NON- ROOT DATA ELEMENTS......Page 488
DESCRIBE DATA ELEMENTS WITH ATTRIBUTES......Page 490
CREATE CDATA FOR SPECIAL CHARACTERS......Page 492
CREATE A SIMPLE XML PROCESSOR......Page 494
CREATE A SIMPLE XSL STYLE SHEET......Page 496
ADD A COMMENT TO AN XML STYLE SHEET......Page 498
WORK WITH CHILD ELEMENTS USING XSL......Page 500
DEFINE A NAMESPACE......Page 502
DEFINE AN ENTITY DATA TYPE......Page 504
DECLARE AN INLINE DTD......Page 506
DECLARE AND SAVE AN EXTERNAL DTD FILE......Page 508
EXPLORING DIFFERENCES BETWEEN HTML AND XHTML......Page 510
CONVERT HTML DOCUMENTS TO XHTML......Page 512
UNDERSTANDING XHTML DTDS......Page 514
VALIDATING XHTML WEB PAGES......Page 516
SECTION VIII: USING WEB DESIGN APPLICATIONS......Page 518
AN INTRODUCTION TO HOMESITE......Page 520
CUSTOMIZE YOUR WORKSPACE......Page 522
CUSTOMIZE YOUR WORKSPACE......Page 524
WORK WITH TOOLBARS......Page 526
CONFIGURE AND USE EXTERNAL BROWSERS......Page 528
CONFIGURE AN INTERNAL BROWSER......Page 530
INSERT SPECIAL CHARACTERS......Page 532
USING EXTENDED SEARCH AND REPLACE......Page 534
CREATE AND ADD CODE SNIPPETS......Page 536
VALIDATE A DOCUMENT......Page 538
CREATE A PROJECT......Page 540
CONFIGURE AN FTP CONNECTION......Page 542
UPLOAD A PROJECT......Page 544
INTRODUCTION TO DREAMWEAVER......Page 546
SET UP A LOCAL SITE......Page 548
CREATE A NEW WEB PAGE......Page 550
SAVE A WEB PAGE OR REVERT TOA PREVIOUS SAVE......Page 552
VIEW AND EDIT SOURCE CODE......Page 554
INSERT AN IMAGE INTO A WEB PAGE......Page 556
CREATE HYPERLINKS TO OTHER PAGES......Page 558
INSERT A TABLE INTO A WEB PAGE......Page 560
SET TABLE PROPERTIES......Page 562
CREATE AN HTML TEMPLATE......Page 564
CREATE A ROLLOVER IMAGE......Page 566
USING THE SITE MAP VIEW......Page 568
MAKE DESIGN NOTES......Page 570
INTRODUCTION TO PHOTOSHOP......Page 572
SET PREFERENCES......Page 574
UNDO A COMMAND OR REVERT TO LAST SAVED FILE......Page 576
USE RULERS AND GUIDES......Page 578
CREATE A NEW IMAGE......Page 580
CREATE AND ADD TO A LAYER......Page 582
APPLY BLUR AND SHARPEN FILTERS......Page 584
APPLY DRY BRUSH AND DISTORTION FILTERS......Page 586
ADD TYPE TO AN IMAGE......Page 588
CROP AN IMAGE......Page 590
CREATE AND SAVE SLICED IMAGES......Page 592
OPTIMIZE FILE SIZES FOR THE WEB......Page 594
APPENDIX A: SPECIAL CHARACTERS......Page 596
APPENDIX B: CASCADING STYLE SHEET REFERENCE......Page 602
WHAT’S ON THE CD- ROM......Page 606
MASTER VISUALLY WEB DESIGN ON THE CD- ROM......Page 608
HUNGRY MINDS,INC. END-USER LICENSE AGREEMENT......Page 610
A......Page 612
B......Page 614
C......Page 615
D......Page 618
E......Page 620
F......Page 621
G......Page 623
H......Page 624
I......Page 625
J......Page 627
K - L......Page 628
M......Page 629
N......Page 631
O......Page 632
P......Page 633
Q - R......Page 635
S......Page 636
T......Page 639
U......Page 641
V......Page 642
W......Page 643
X - Z......Page 645
Read Less, Learn More......Page 646
ORDER FORM......Page 648