Tài liệu Creating Cool Web Sites with HTML, XHTML, and CSS

Preface . xi
Acknowledgments . xv
Part I: Building a Wicked Cool Web Page
Chapter 1: So What’s All This Web Jazz? . 3
What Is the Web Anyway? . 3
Linear media . 3
Hypermedia . 4
Cool spots on the Web 5
Introduction to Internet Explorer 8
Launching Internet Explorer . 9
Changing the default page . 11
All about URLs 12
URLs to the rescue . 12
Reading a URL . 13
FTP via URL 14
Anonymous FTP . 14
Nonanonymous FTP . 15
Ports 15
Using FTP URLs 16
Special characters in URLs . 16
E-mail via URL . 17
Telnet via URL . 17
Usenet news via URL 18
The heart of the Web: HTTP URLs . 18
Summary 20
Chapter 2: Building Your First Web Page: HTML Basics 21
Basics of HTML Layout 21
HTML and browsers . 22
If you open it, close it 23
Breaking at Paragraphs and Lines . 24
Building Your First Web Page . 28
Launching your HTML editor 28
Saving your file as HTML 29
Opening the file in Internet Explorer 31
Improving the HTML and viewing it in the browser . 32
Breaking Your Document into Sections 32
Adding a Title to Your Page 34
Adding Footer Material 35
Defining Section Heads 37
Using the Horizontal Rule . 40
Introducing XHTML 41
Summary . 42
Chapter 3: Presenting Text Attractively . 43
First, a Little History 44
Helping Readers Navigate with Bold and Italic . 44
Underlining, Monospace, and Other Text Changes 46
Specifying Font Sizes, Colors, and Faces . 49
Applying Logical Styles 52
Putting It All Together . 54
Summary . 56
Chapter 4: Moving into the 21st Century with Cascading Style Sheets . 57
Types of CSS . 58
Inline CSS . 58
One definition, many references 59
Sharing a single style sheet . 62
The Components of CSS . 62
Classes and IDs . 63
Subclasses . 64
Adding comments within CSS . 65
Compatible style blocks 65
Text Formatting with CSS . 66
Bold text 66
Italics 66
Changing Font Family, Size, and Color 67
Typefaces and monospace . 67
Changing font size . 69
The color of text 70
Additional Neato Text Tricks in CSS 71
Small capitals 71
Stretching or squishing letter spacing 72
Stretching or squishing words 73
Changing line height 73
Text alignment . 74
Vertical text alignment . 74
Text decorations 75
Changing text case . 76
Putting it all together 76
Summary . 80
Chapter 5: Lists and Special Characters 81
Definition Lists . 81
Good list, bad list 84
Unordered (Bulleted) Lists . 85
Ordered (Numbered) Lists . 87
List Formats 90
Bullet shapes 92
CSS control over lists 94
Counting the CSS way . 95
List-style shortcuts . 96
Character Entities in HTML Documents 96
Nonbreaking Spaces . 99
Comments within HTML Code . 99
Summary . 101
Chapter 6: Putting the Web in World Wide Web: Adding Pointers and Links . 103
Pointing to Other Web Pages . 103
Referencing Non-Web Information 106
Referencing Internal Documents with Relative URLs . 108
Organizing a Web Site 109
Defining Web Document Jump Targets 113
Adding Jump Links to Your Web Pages 114
Jumping into organized lists 117
Linking to jump targets in external documents 119
Changing Link Colors 119
Summary . 120
Chapter 7: From Dull to Cool by Adding Graphics 121
Image Formats . 122
Including Images in Web Pages . 123
Text Alternatives for Text-Based Web Browsers . 127
Image Alignment Options 128
Standard alignment 129
More sophisticated alignment . 130
Background Colors and Graphics 136
Where Can You Find Images? 140
Creating your own . 140
Clip art or canned image libraries? 141
Scanned or digital photographs 142
Working with digital photographs . 144
Grabbing images off the Net . 146
Art today 146
The shock zone . 146
But wait! There’s more 147
Transparent Colors 147
Animated GIF images 149
Image-Mapped Graphics . 149
Building an image map 150
Audio, Video, and Other Media 153
Movies all night 154
Streaming audio and video 154
Summary 156
Part II: Rockin’ Page Design Strategies 157
Chapter 8: Tables and Frames . 159
Organizing Information in Tables . 159
Basic table formatting . 160
Advanced table formatting 165
Table attributes that aren’t 100 percent portable . 168
Modifying edges and grid lines 169
Tricks with Table Layouts 171
Tables within tables 171
Grouping table elements for faster rendering . 176
Grouping tables to speed up display 177
Pages within Pages: Frames . 181
The basics of frames . 181
Specifying frame panes and sizes . 183
More fun with frames . 189
Inline Frames . 190
Summary 193
Chapter 9: Forms, User Input, and the Common Gateway Interface . 195
An Introduction to HTML Forms . 196
Asking for feedback on your site . 198
Adding drop-down lists and radio buttons . 200
Tweaking the select element . 201
Fancy Form Formatting . 204
Easy Searching from Your Page . 206
Another Look at Hidden Variables 208
How CGI Scripts Work 210
The world’s simplest CGI example . 211
Sending information via the environment . 213
Sending and reading data . 214
Receiving information from forms . 215
Learning more about CGI programming 216
Summary 217
Chapter 10: Advanced Form Design . 219
The button Input Type 220
Using Labels to Organize User Focus . 222
Dividing Forms into Fieldsets 224
Tab Key Control on Input . 228
The accesskey Attribute . 230
Disabled and Read-Only Elements 231
Summary 233
Chapter 11: Activating Your Pages with JavaScript 235
An Overview of JavaScript 236
Variables . 236
Where do you put JavaScript? . 237
Events . 237
Expressions 238
Looping mechanisms . 239
Subroutines, built-in and user-defined . 240
Built-in functions 240
Testing Browser Compatibility 241
Graphical Rollovers . 243
Creating a new image container 244
Assigning a URL to the new image container . 244
Changing values on the fly 245
Telling the time 248
Time of day, the friendly version 249
Locale-specific date and time . 249
A built-in clock 250
Testing Form Values . 251
Creating a test condition 252
A Temperature Converter 254
Other Scripting Solutions . 255
Visual Basic Script . 255
Java 256
Referencing Java applets 257
Online Java applets 257
ActiveX 257
XSLT . 258
Flash . 259
Summary 260
Chapter 12: Advanced Cascading Style Sheets 261
Boxes and Containers 261
The Different Parts of a Container 263
Margins 263
Borders 265
Multiple value options . 266
Border-style values . 267
Padding 269
Container Dimensions 271
Setting the container height 272
Text and container flow 273
Container Positioning . 274
Absolute positioning 275
Relative positioning 276
So what’s the point? 277
Fixed positioning . 278
Hide Containers with the Visibility: Attribute . 279
Controlling visibility with JavaScript 280
The display: attribute controls visibility and flow 283
Stacking: Using z-indexes for a 3D page . 286
Using JavaScript to change z-index values 287
Summary 291
Chapter 13: Site Development with Weblogs . 293
What Is a Weblog? 294
Working with a Weblog 297
Installing a weblog . 297
Configuring a weblog . 298
Adding a weblog entry 300
The World of RSS 301
Creating Valid XML / RSS Feeds . 303
Validating an RSS feed 305
Exploring further . 306
Summary 306
Part III: Expanding Your Page into a Web Site 307
Chapter 14: Web Sites versus Web Pages . 309
Working with Subdirectories . 309
The subdirectory structure of AnswerSquad 311
An even bigger site: Intuitive.com . 311
Protecting Web Sites and Directories . 313
Server-Side Includes . 316
Useful server-side include options . 317
config 317
include . 317
echo 317
fsize 318
flastmod 318
exec 318
SSI environment variables . 319
Building a Web site using SSI . 321
Summary 322
Chapter 15: Thinking about Your Visitors and Your Site’s Usability 323
What Makes a Site Usable? 323
Amount of information presented . 324
Organize information on the page . 326
Standardize the screen layout . 326
Presentation of text and graphics . 328
Choice and uses of color . 329
Navigating Your Web Site . 330
Tracking navigation 331
Site search engines 332
Site maps . 332
Using Cookies to Remember User Information 333
Summary 334
Chapter 16: Validating Your Pages and Style Sheets . 335
Validating HTML and XHTML Web Pages . 335
Specifying a character set . 337
Validating an HTML page . 337
Validating XHTML Pages . 341
Validating CSS 344
MIME types and brick walls 344
Uploading CSS specifications by file 345
Creating Valid Mobile Web Page Layouts . 347
A deck of cards 348
WAP versus WML . 348
So what does WML look like? . 348
Summary 350
Chapter 17: Building Traffic and Being Found . 351
Producing Crawler-Friendly Sites . 352
Creating meaningful titles . 352
Using keywords in your title 352
Using the <meta> tag . 353
Microsoft (http://www.microsoft.com) . 355
Nostarch Press (http://www.nostarch.com) . 355
Intuitive Systems (http://www.intuitive.com) 355
The Internet Movie Database (http://www.imdb.com/) . 355
Contentious (http://www.contentious.com) . 355
Other uses for the <meta> tag . 356
Content rating with PICS 356
Keeping crawlers away 358
The Dark Side of Crawlers 360
Registering with Web Index and Search Sites 360
Joining a directory site 361
Yahoo! (http://www.yahoo.com) 361
The Open Directory Project (http://www.dmoz.org/) 361
Signing up for a crawler or robot site . 362
Google (http://www.google.com) 362
Lycos (http://www.lycos.com) . 362
AltaVista (http://www.altavista.com) 363
Tying In with Related Sites Using a Web Ring . 363
The Basics of Banner Advertising 364
Text Advertising Options and Pay Per Click . 367
Smart text advertisements . 368
Publicizing Your Site . 369
Summary 369
Closing Thoughts . 371
Appendix A: Step-by-Step Web Site Planning Guide 373
Appendix B: Finding a Home for Your Web Site 379
Index 385