You are previewing Absolute Beginner’s Guide to Creating Web Pages.
O'Reilly logo
Absolute Beginner’s Guide to Creating Web Pages

Book Description

Learn to create Web pages and Web sites using the latest HTML standards with this book's friendly, professional approach. Without relying on technical jargon, Absolute Beginner's Guide to Creating Web Pages serves as a hands-on tutorial for the novice. It begins by explaining the need for HTML and the basics of good Web page design. It then covers using HTML tags and tools, formatting text, adding images and building links. Later chapters demonstrate how to add features to Web pages including tables, colors, frames, multimedia content, JavaScript, Style Sheets and Dynamic HTML. The book finishes with a useful HTML command reference readers can flip to quickly while creating Web pages.

Table of Contents

  1. Copyright
  2. About the Author
  3. Acknowledgments
  4. Tell Us What You Think!
  5. Introduction
    1. Is This the Book for You?
      1. How This Book Is Organized
    2. Conventions Used in This Book
    3. For More Information
  6. I. Creating Web Pages
    1. 1. Fundamentals of Web Publishing
      1. A Two-Minute History of the Internet
      2. How the Web Works
        1. What Is HTTP?
        2. What Is HTML?
        3. Hypertext and Hyperlinks
        4. Uniform Resource Locators
        5. The Different Protocols for URLs
      3. HTML Versus XHTML
        1. Who Sets HTML Standards?
        2. Why a New Standard?
        3. Which Should You Use?
      4. HTML Is Not Programming
        1. Markup Fundamentals
        2. Decorating with Style Sheets
        3. Adding Scripts to the Mix
      5. Summary
    2. 2. A Crash-Course in Web Design
      1. The Fundamentals of Page Design
        1. Web Design Theory
        2. Organizing Your Page
        3. Images and Multimedia
        4. Interactivity and Scripting
        5. What Good Pages Look Like
      2. Planning a Site
        1. Considering Your Audience
        2. Organizing the Site
        3. Design Ease and Consistency
      3. HTML Trends and Issues
        1. Accessibility
        2. Internationalization
        3. Browser Compatibility
      4. Summary
    3. 3. What You Need to Get Started
      1. The Basic Tools
        1. Text Editors
        2. HTML Editors
      2. Other Tools You’ll Want
        1. Graphics Editors
        2. Animation Tools
        3. Multimedia Tools
        4. Scripting Resources
      3. Finding a Web Server
        1. What Is a Web Server?
        2. Dealing with an ISP
        3. What Software Does Your Server Run?
        4. Accessing Your Web Server Space
      4. Organizing a Web Site’s Files
        1. Types of File Organization
        2. Creating the Hierarchy
        3. Naming Your Files
        4. Updating Your Web Site
      5. Summary
    4. 4. Creating Your First Page
      1. Build Your HTML Template
        1. Add Document Elements
        2. The DTD
      2. The comment Element
      3. Create an HTML Template
      4. The Document Head
        1. Your Web Page’s Title
        2. The <base> Element
        3. The <meta> Element
      5. The Body Section
        1. Entering Paragraph Text
        2. The <br /> Element
      6. Saving, Testing, and Validating
        1. Saving Your Page
        2. Testing Your Page
        3. Validating the Page
      7. Summary
  7. II. Design and Conquer
    1. 5. Formatting Your Text
      1. Organize the Page
        1. Add Headings
        2. Horizontal Lines
      2. Styling Your Text
        1. Physical Style Elements
        2. Logical Style Elements
      3. Paragraph Style Elements
        1. The <pre> Element
        2. Using <pre> for Tables
        3. The <blockquote> Element
        4. The <address> Element
        5. Marking Changes: <ins> and <del>
      4. Using Lists on Your Web Page
        1. Ordered and Unordered Lists
          1. Ordered List Attributes
          2. Bullet List Attributes
        2. Definition Lists
      5. Summary
    2. 6. Visual Stimulus—Adding Graphics
      1. Images on the Web
        1. What Images Can You Use?
        2. What Images Should You Use?
      2. Creating and Translating Web Images
        1. Using Paint Shop Pro
          1. Cropping the Image
          2. Resizing an Image
          3. Adding Text
          4. Saving or Translating the Image File
        2. Using GraphicConverter
          1. Cropping (Trimming) the Image
          2. Resizing an Image
          3. Adding Text
          4. Saving or Translating the Image File
      3. The <img /> Element
        1. Alternative Text
        2. Aligning Text and Images
        3. Right- and Left-Aligning Images
        4. Width and Height
      4. Summary
    3. 7. Building Hypertext Links
      1. How Hyperlinks Work
        1. The Uniform Resource Locator
        2. Relative Versus Absolute URLs
      2. The <base> Element
      3. Creating Links
        1. Linking on the Same Page
        2. Building Links Using Images
      4. Using Special Links
        1. Creating a mailto: Link
        2. Creating a Link to an FTP Site
        3. Gopher Servers
        4. Link to Newsgroups
        5. Links to Telnet Servers
      5. Cool Tricks: Targets and Client-Pull
        1. Open a New Window
        2. Changing Pages Automatically
      6. Summary
    4. 8. Basics Tables
      1. Creating a Table
        1. The <table> Element
        2. Captions and Summaries
        3. Table Rows
        4. Table Cell Elements
        5. Changing a Cell’s Span
        6. Cell and Row Colors
      2. Additional Table Attributes
        1. The width Attribute
        2. The border and align Attributes
        3. The cellpadding and cellspacing Attributes
      3. Summary
    5. 9. Advanced Table Elements and Table Design
      1. Table Design Theory
        1. Using Images in Tables
        2. Nesting Tables
      2. Grouping Columns and Rows
        1. Table Row Groupings
        2. Column Groupings
      3. Frames and Rules
      4. Table Design Examples
        1. A Row-Centric Table
        2. Focusing on Columns
      5. Summary
    6. 10. Get Splashy: Style Sheets, Fonts, and Special Characters
      1. Style Sheets in Theory
        1. What Are Style Sheets?
        2. Why Use Style Sheets?
        3. Understanding CSS and XHTML
        4. What Style Sheets Replace
      2. Creating Style Sheets
        1. The style Attribute
        2. The <style> Element
        3. Creating Special Classes
        4. Using the <span> Element
        5. Using the <div> Element
        6. Linking Versus Embedding
      3. Properties and Styles
        1. Text Styles
        2. Font Properties
        3. Background and Color Properties
        4. Alignment and Block Appearance Properties
        5. Styles for Links and Objects
        6. First Letter and First Line
        7. Special Table Styles
      4. Special Characters
      5. Summary
    7. 11. Advanced Web Images and Imagemaps
      1. Making Your Images Better
        1. Optimizing Web Images
          1. Color Depth
          2. Resolution
        2. Image Compression and Progressive Encoding
          1. Compression
          2. Saving Progressive Images
        3. Image Transparency
      2. Creating Animated Images
        1. Jasc Animation Shop
        2. VSE Animation Maker
      3. Using Imagemaps
        1. Creating a Client-Side Imagemap
        2. Adding usemap to <img>
        3. The <map> and <area> Elements
        4. Working with Server-Side Maps
      4. Summary
  8. III. Building Your Site
    1. 12. Creating Sites with HTML Frames
      1. The Great Frames Debate
        1. What Frames Are
        2. What’s Wrong with Frames?
        3. When Should You Use Frames?
      2. Adding Frames to Your Site
        1. Creating the Frameset
        2. <frame> and <noframes>
        3. Naming and Targeting Frames
        4. Options for <frame>
        5. Nesting Framesets
      3. Advanced Frames
        1. Special Targets and Removing Frames
        2. Offering Options to Users
          1. The Index Page
          2. Self-Referential URLs
          3. Outlinks
        3. The <iframe> Element
      4. Summary
    2. 13. Adding Multimedia and Java Content
      1. Understanding Multimedia
        1. Why Include Multimedia?
        2. Understanding Multimedia File Types
        3. Linking Versus Embedding
      2. Adding Multimedia to Your Pages
        1. Adding Hyperlinks
        2. Embedding Multimedia
        3. Embedding QuickTime
        4. Windows Media Movies
        5. RealMedia Movies
        6. Flash Controls and Movies
      3. Working with Java
        1. Java Applets
        2. Add Applets Using <object>
      4. Summary
    3. 14. Site-Wide Styles: Design, Accessibility, and Internationalization
      1. The Site-Wide Style Sheet
        1. The Basic Site
        2. Planning the Styles
        3. Style Sheet Power
      2. Accessibility Through Style Sheets
      3. International Issues
        1. lang and <q>
        2. Table and Block Directions
      4. Summary
  9. IV. Interacting with Your Users
    1. 15. Adding HTML Forms
      1. The Basics of HTML Forms
        1. The <form> Element
        2. Other <form> Attributes
      2. Creating the Form
        1. Text Fields and Attributes
        2. The <input> Element
          1. Text Boxes
        3. Password Entry Boxes
          1. Check Boxes
          2. Radio Buttons
          3. Hidden Fields
          4. The Reset Button
          5. The Submit Button
          6. The Image Submit Button
          7. Other Buttons
        4. Creating Menus
        5. Sample Feedback Form
      3. Designing Forms Well
        1. Form Design Issues
        2. Line Breaks, Paragraphs, and Horizontal Lines
        3. Horizontal Lines
        4. Using Paragraphs
      4. Other Elements for Form Formatting
        1. Using Lists for Forms
        2. Using Tables for Forms
        3. Form Structure
        4. Accessibility: Labels and Access Keys
      5. Summary
    2. 16. CGIs and Data Gathering
      1. What Is CGI?
        1. CGI Languages
        2. A Simple CGI Script
        3. Referencing CGIs
      2. How Scripts Work
        1. Receiving Form Data
        2. The mailto: Option
        3. Your Script’s Output
      3. Finding and Using Scripts
        1. Working with Other’s Scripts
          1. Installing the Script
          2. Using a Hosted Script
        2. Creating Your Own Scripts
      4. Summary
    3. 17. Introduction to JavaScript
      1. What Is JavaScript?
        1. The JavaScript/Java Relationship
        2. JavaScript Versus VBScript
        3. How Web Scripts Work
      2. Entering Scripts in Your Web Documents
        1. The <script> Element and Script Hiding
        2. Strict Versus Transitional
        3. Script Meta Type and <noscript>
        4. The “Hello World” Example
      3. Creating Functions in JavaScript
        1. Declaring Functions
        2. Function Calls and Value Return
        3. Function Call Example
      4. Working with Variables
        1. Variable Names
        2. Variables, Math, and Assignments
        3. Incrementing and Decrementing Variables
        4. Understanding Arrays
      5. Controlling Your JavaScript
        1. Comparison Operators
        2. The if...else Condition
        3. Looping Conditionals
        4. Break and Continue Your Loops
        5. Loops and Arrays
      6. Understanding JavaScript Objects
        1. Creating New Objects
        2. More on Methods
        3. Built-In Objects
          1. The String Object
        4. The Math Object
        5. The Date Object
      7. Summary
    4. 18. JavaScript and User Input
      1. Understanding JavaScript Events
        1. Types of Event Handlers
        2. The this Keyword
      2. Introducing the Document Object Model
        1. Understanding Scope and Pointers
        2. Working with High-Level Objects
          1. The window Object
          2. The location Object
          3. The document Object
      3. JavaScript and HTML Forms
        1. The form Object
        2. Form Error Checking with JavaScript
        3. Client-Side JavaScript
      4. JavaScript for Redirection and Frames
        1. Browser Redirection
        2. The JavaScript Link Menu
        3. JavaScript and HTML Frames
      5. Summary
    5. 19. Adding Dynamic HTML
      1. What Is Dynamic HTML?
        1. The Document Object Model Revisited
        2. Browser Compatibility
        3. CSS and CSS Positioning
      2. Mouseovers: Changing Things Without Clicks
        1. Basic Image Mouseover
        2. Remote Image Mouseover
        3. Preloading Images
      3. CSS Positioning and Layers
        1. Basic CSS Positioning
        2. Overlapping Elements and z-index
        3. Nesting Positioned Elements
        4. Relative Positioning
      4. Dynamic Positioning and Layers
        1. CSSP Layers
        2. Dynamic Positioning
        3. CSSP Visibility
        4. Netscape Layers
        5. Netscape’s Inline Layer
        6. Scripting Netscape’s Layers
      5. Cross-Browser DHTML Example
        1. Cross-Browser APIs
      6. Dynamic Styles and Classes
        1. Scripting Styles and Properties
        2. Dynamic Classes and IDs
      7. Summary
  10. V. Web Publishing Tools
    1. 20. Graphical Editors
      1. Netscape Composer
        1. Where to Get It
        2. Composer’s Strengths
        3. Composer’s Weaknesses
        4. Composer’s Highlights
      2. Adobe GoLive
        1. Where to Get It
        2. GoLive’s Strengths
        3. GoLive’s Weaknesses
        4. GoLive’s Highlights
      3. Macromedia Dreamweaver
        1. Where to Get It
        2. Dreamweaver’s Strengths
        3. Dreamweaver’s Weaknesses
        4. Dreamweaver’s Highlights
      4. Microsoft FrontPage 2002
        1. Where to Get It
        2. FrontPage’s Strengths
        3. FrontPage’s Weaknesses
        4. FrontPage’s Highlights
      5. Summary
    2. 21. Forums, Chats, and Other Add-Ons
      1. Creating and Hosting Forums
        1. Forum Types and Technologies
        2. Choosing a Server-Side Forum
        3. Installing a Server-Side Forum
        4. Hosted Forum Solutions
      2. Add Live Chat to Your Site
      3. Counters and Web Statistics
        1. Accessing Your Web Statistics
        2. Adding a Web Counter
      4. Server-Side Includes
      5. Summary
    3. 22. Web Publishing Services
      1. Finding the Right Web Host
      2. Using Free Servers
        1. America Online Hometown
        2. Yahoo! GeoCities
        3. Lycos Tripod
        4. Apple’s iTools
      3. E-Commerce Solutions
        1. Yahoo! Store
        2. Catalog.com
        3. Oracle Small Business
        4. Miva Merchant Servers
      4. Summary
  11. VI. Appendix
    1. A. XHTML and CSS Command Reference
      1. Document Elements
        1. DTD Declarations
        2. The <html> Element
        3. The <head> Elements
          1. The <title> Element
          2. The <meta> Element
          3. The <base /> Element
        4. The <body> Element
        5. The Comment Element
      2. Styles and Scripting
        1. The <script> Element
        2. The <noscript> Element
        3. The <style> Element
        4. Style, Script, and Universal Attributes
        5. class
        6. id
        7. style
        8. dir
        9. lang
      3. General Markup
        1. Formatting Blocks
        2. Formatting Text
          1. Physical Styles
          2. Logical Styles
          3. <ins> and <del>
        3. Creating Lists
      4. Images, Hyperlinks, Java, and Plug-Ins
        1. Adding Images
        2. Adding Hyperlinks
        3. Imagemaps
        4. Multimedia Content
        5. Java Applets
      5. Creating Tables
      6. Creating Framesets
      7. Creating Forms
        1. The <form> Element
        2. <textarea>
        3. The <input /> Element
        4. The <select> Element
      8. CSS