TABLE OF CONTENTS
Typographic and Other Conventions
1.2 What Is the World Wide Web?
1.3 What Is Meant by a Client-Server Architecture?
1.4 How Do Web Browsers and Web Servers Fit the Client-Server Model?
1.5 How Do Web Browsers and Web Servers Communicate?
1.5.1 Web Protocols and Layered Communication Architectures
1.5.2 Web Addresses and Address Resolution via DNS
1.6 A Real-World E-Commerce Website
1.7 The Technologies We Will Discuss
1.8 Some Alternative Technologies and Additional Tools
Quick Questions to Test Your Basic Knowledge
Short Exercises to Improve Your Basic Understanding
Exercises on the Parallel Project
What Else You May Want or Need to Know
2.1 What Is an Internet Service Provider (ISP)?
2.2 What Tools Will You Need to Begin Your Web Development?
2.3 How Do You Create a Simple, Static Web Page?
2.4 How Do You Test a Web Page “Offline” before “Going Online”?
2.5 How Do You “Go Live” on the Web Once You’re Ready?
Quick Questions to Test Your Basic Knowledge
Short Exercises to Improve Your Basic Understanding
Exercises on the Parallel Project
What Else You May Want or Need to Know
3.1 The Long Road to HTML5, the New Norm
3.2 A Very Important Distinction: Structure vs. Presentation
3.4 The Basic Structure of Every Web Page
3.5 Some Basic Markup: Headings, Paragraphs, Line Breaks, and Lists
3.6 What Does It Mean for a Web Page to Be Valid?
3.7 How Can We Determine if a Web Page Is Valid?
3.8 Validating with the Firefox Web Developer Add-on
3.9 Tables, Images, and Tag Attributes
3.11 Adding More Web Pages to Our Site and Connecting Them with Hyperlinks
3.11.2 Our Site Now Has Many Pages
3.11.3 Beware the “Legacy Fix”!
3.12 Using Server-Side Includes (SSI) to Make Common Markup Available to Multiple Documents
3.12.1 The “Maintenance Nightmare” Problem
3.12.2 Identifying and Extracting Common Markup
3.12.3 Using SSI to Include Common Markup Where Needed
3.12.4 One Thing Leads to Another: A Second Problem
3.12.5 The base Tag Solves Our Second Problem
3.12.6 Our Revised Site Looks and Behaves Exactly Like the Previous Version
3.13 The New HTML5 Semantic Elements
3.13.1 Block-level Elements and Inline-level Elements
3.13.2 Semantic Elements and Non-Semantic Elements
3.13.3 Two More Legacy Elements: div and span
3.13.4 New Semantic Elements in HTML5
Quick Questions to Test Your Basic Knowledge
Short Exercises to Improve Your Basic Understanding
Exercises on the Parallel Project
What Else You May Want or Need to Know
4 CSS for Content Presentation
4.1 The Rationale for CSS, and a Brief History
4.2 Simple CSS Style Rules and Their Syntax
4.3 The Placement of CSS Style Rules
4.5 Some Basic CSS Markup: More on Selectors, Declarations, Properties, and Property Values
4.6 Some Common Types of CSS Property Values and Their Formats
4.6.1 Specifying Measurement Property Values
4.6.2 Specifying Color Property Values
4.6.3 The Important Takeaway from This Section
4.7 CSS Style Sheet Structure, Comments, and Formatting
4.8 The HTML class and id Attributes and the Non-Semantic HTML div and span Elements
4.8.1 The HTML class and id Attributes (CSS class and id Selectors)
4.8.2 The HTML div and span Elements
4.8.3 Using Our Class Definitions
4.9 Inheritance and the Cascade
4.9.2 The “Cascade” and Resolution of Style Conflicts
4.9.3 Applying the Theory to Our Example
4.10 Validating Our CSS Style Sheets
4.11 The CSS Box Model and Simple CSS Page Layout
4.11.1 The CSS Box Model: A Conceptual View
4.11.2 The CSS Box Model: A Detailed Example
4.11.3 Simple CSS Page Layout with float and clear via the “Legacy” Approach with div Elements
4.12 CSS Reset: A “Best Practice”
4.13.1 Version 1: A Simple Home Page Only
4.13.2 Version 2: A Multipage Site with Menu and Footer
4.13.4 Version 4: A Copy of Version 3 with the Home Page Image Replaced by a Home Page Video
Quick Questions to Test Your Basic Knowledge
Short Exercises to Improve Your Basic Understanding
Exercises on the Parallel Project
What Else You May Want or Need to Know
5 HTML Forms for Data Collection
5.1 Web Forms Collect User Input Data in a Browser for Transfer to a Server for Processing
5.2.1 A Brief Aside, a Reminder, and Some Good Advice
5.2.2 How Will We Deal with CSS from Now On?
5.3.1 Textboxes (input Elements of Type text)
5.3.2 Radio Buttons (input Elements of Type radio)
5.3.3 Checkboxes (input Elements of Type checkbox)
5.4 The select and option Elements for Dropdown List-boxes
5.5 What Is Missing from the BMI Calculator Web Page?
5.7 The submit and reset Button Elements
5.8 Organizing Form Controls with the fieldset and legend Elements
5.9 Using the label Element for Behind-the-Scenes Logical Groupings
5.10 Getting Ready to Submit Your Form Data
Quick Questions to Test Your Basic Knowledge
Short Exercises to Improve Your Basic Understanding
Exercises on the Parallel Project
What Else You May Want or Need to Know
6 JavaScript for Client-Side Computation and Form Data Validation
6.1 Another Important Distinction: Structure vs. Presentation vs. Behavior
6.2 What Is JavaScript? (It’s not Java!)
6.2.1 JavaScript Is Interpreted, Not Compiled
6.2.2 Restrictions on What JavaScript Can Do
6.2.3 How Will We Use JavaScript?
6.3 The Placement of JavaScript Code
6.4 A Simple Example in Four Versions
6.4.1 Version 1: No JavaScript
6.4.2 Version 2: Embedded JavaScript and document.write( )
6.4.3 Version 3: Linking to an External JavaScript File
6.4.4 Version 4: Another External Script, the alert( ) Method, and Escape Characters
6.5 What Is the Document Object Model (DOM)?
6.6 JavaScript and the DOM Interact to Process Our BMI Form
6.6.1 A First Programmer-Defined JavaScript Function: Function Syntax
6.6.3 Accessing a DOM Element via Its id Attribute
6.6.4 Making Decisions with the JavaScript if-else Statement
6.6.5 Accessing a DOM Element via Its name Attribute
6.7 The Importance of Website Security and How JavaScript Can Help
6.8 JavaScript and the DOM Interact to Validate Our BMI Form Data
6.8.1 Simple JavaScript Arrays, and the options Array of a select Element
6.8.2 Getting the Height and Weight Units Chosen by the User
6.8.3 Getting the User’s Height and Weight Values, and Email Address
6.8.4 Calling Functions to Validate Height, Weight, and Email Values
6.8.5 Logical Operators and Compound Boolean Expressions
6.8.6 Relational Operators and Functions for Validating Height and Weight Values
6.8.7 Simple Regular Expressions and a Function for Validating an Email Address
6.9 JavaScript and the DOM Interact to Compute a BMI Value
6.9.1 Numerical Calculations: Three Functions Compute the BMI Value
6.9.2 Setting the Precision of the BMI Value and Displaying a Detailed Report
6.10 Regular Expressions in JavaScript and in HTML5
6.11 JavaScript and the DOM Interact to Validate Our Feedback Form Data
6.11.1 Validating First and Last Names
6.11.2 Validating Telephone Numbers
6.11.3 Validating Email Addresses
6.12 The Modernizr Tool and HTML5 Form Controls
Quick Questions to Test Your Basic Knowledge
Short Exercises to Improve Your Basic Understanding
Exercises on the Parallel Project
What Else You May Want or Need to Know
7 JavaScript for Client-Side Content Behavior
7.2 Implementing Our “Slide Show” of Rotating Images
7.2.1 The onload Attribute of the body Element: Starting the Slide Show after the Home Page Loads
7.2.2 The Revised img Element for the Slide Show
7.3 Implementing Our Dropdown Menus
7.3.1 An Overview of How Our Dropdown Menus Work
7.3.2 The onmouseover and onmouseout Attributes: Showing and Hiding Dropdown Menu Options
7.3.3 The CSS for Our Dropdown Menus
7.3.4 The JavaScript for Our Dropdown Menus: The show( ) and hide( ) Functions
7.4 Notes on the nature2 Version of Our Nature’s Source Website
7.4.1 What’s New in Our BMI Form?
7.4.2 What’s New in Our Feedback Form?
7.4.3 What’s Different about the nature2 Markup for Our Menu Bar?
Quick Questions to Test Your Basic Knowledge
Short Exercises to Improve Your Basic Understanding
Exercises on the Parallel Project
What Else You May Want or Need to Know
8 PHP for Server-Side Preprocessing
8.2 PHP as a Server-Side Scripting Language
8.3 PHP Script Structure and General Syntax: A Simple First Example
8.3.1 The PHP date( ) Function
8.3.2 Generating and Displaying the Output from welcome.php
8.4 Why We Need AJAX and How We Use It: Two More Examples
8.4.2 A Problem We Need to Solve: A “Page Refresh” Example
8.4.3 The Solution to Our Problem: An AJAX Example
8.5 Incorporating the Welcome Message into Our Home Page with AJAX
8.6 Understanding the GET and POST “Methods”
8.6.1 An Example Illustrating the GET Method
8.6.2 An Example Illustrating the POST Method
8.6.3 An Example Illustrating That a Form Is Unnecessary and GET Is the Default
8.6.4 Guidelines for Using GET and POST
8.7 Implementing the Server-Side Functionality of Our Feedback Form
8.7.1 What Happens When the User Clicks Send Feedback
8.7.2 Uploading the Feedback Form Data from the Client to the Server
8.7.3 An Overview of the PHP Code That Processes the Feedback Form Data
8.7.5 Sending an Email Feedback Message to the Business with PHP’s mail( ) Function
8.7.6 Modifying the Previous Message to the Business to Get One Suitable for the Client
8.7.7 Sending an Email Feedback Confirmation Message to the Client with PHP’s mail( ) Function
8.7.8 Returning a Browser Display to the User for Immediate Confirmation of Feedback Submission
8.7.9 Saving the User’s Feedback on the Server with PHP File Output
8.8 Revising the Implementation of Our BMI Calculator to Calculate Server-Side
8.8.1 What Happens When the User Clicks Compute your BMI
8.8.2 Uploading the BMI Form Data from the Client to the Server
8.8.3 An Overview of the “Driver” Script That Processes the BMI Form Data
8.8.4 Building the BMI Report Message with Programmer-Defined PHP Functions
8.8.5 Computing the BMI Value: Numerical Computations in PHP, and More Programmer-Defined Functions
8.9 PHP Development and Testing
Quick Questions to Test Your Basic Knowledge
Short Exercises to Improve Your Basic Understanding
Exercises on the Parallel Project
What Else You May Want or Need to Know
9 MySQL for Server-Side Data Storage
9.3 Some Architectural Aspects of a “Good” Database
9.3.2 Database Keys: Primary and Foreign, Natural and Surrogate, Simple and Composite
9.3.3 Functional Dependencies and 2NF
9.3.4 Table Relationships in a Database
9.4 Make Use of Online Resources and Don’t Reinvent the Wheel
9.5 The Data Model for Our Nature’s Source Database
9.6 MySQL, phpMyAdmin, and SQL
9.7 Using phpMyAdmin and SQL to Set Up the MySQL Database for Our Nature’s Source Website
9.7.7 A First Look at the SELECT Command
9.7.10 Inventory Management Systems
9.8 MySQL’s Command-Line Interface
9.8.1 A First Session with the Command-Line Interface
9.8.2 A Closer Look at the SELECT Command
9.8.3 Restricting the Set of Records from Which We Retrieve Our Data
9.8.4 Retrieving Data from More Than One Table with a Join
9.9 Importing and Exporting Tables and Databases
9.9.1 Copying a Table or Part of a Table
9.9.2 Copying an Entire Database
9.9.3 Potential Problem with Importing via phpMyAdmin
Quick Questions to Test Your Basic Knowledge
Short Exercises to Improve Your Basic Understanding
Exercises on the Parallel Project
What Else You May Want or Need to Know
10 PHP and MySQL for Client-Server Database Interaction
10.2.1 Getting Valid Registration Form Data from the User
10.2.2 Submitting the Form Data: Possible Outcomes
10.2.3 Actual Processing of the Registration, with Valid Form Data
10.3 Logging In and Logging Out
10.3.1 PHP Sessions Revisited: We Need to Know More about Them
10.3.2 PHP Arrays Revisited: We Need to Know More about Them
10.3.3 Logging In: The Logic of loginForm.php
10.3.4 Logging Out: The Logic of logout.php
10.4 An E-Store Session after a Successful Login
10.5 Browsing Our E-Store Product Catalog
10.5.1 Displaying a Two-Column List of Products
10.5.2 Displaying Individual Products within a Category
10.6.1 The pages/shoppingCart.php Script
10.6.2 A High-Level View of the scripts/shoppingCartProcess.php Script
10.6.3 Reviewing the Relevant Tables in Our Nature’s Source Database Structure
10.6.4 Getting the Product Details of an Existing Order with getExistingOrder( )
10.6.5 Creating a New Order with createOrder( )
10.6.6 Displaying the Header of the Shopping Cart Table with displayHeader( )
10.6.8 Displaying the Footer of the Shopping Cart Table with displayFooter( )
10.6.9 Adding an Item to the Shopping Cart with shoppingCartAddItem.php
10.6.10 Deleting an Item from the Shopping Cart with shoppingCartDeleteItem.php
10.7.1 Displaying a Customer Receipt and Updating Our Database
10.7.3 Performing Some “Cleanup” During Logout
10.8 Some Utility Files for Use at the MySQL Command-Line Interface
Quick Questions to Test Your Basic Knowledge
Short Exercises to Improve Your Basic Understanding
Exercises on the Parallel Project
What Else You May Want or Need to Know
11 XML (eXtensible Markup Language) for Data Description
11.2 Describing Our Data with Well-Formed XML
11.2.1 Nested Elements vs. Tag Attributes
11.2.2 And What Does It Mean for Our XML to Be “Well-Formed”?
11.3 Viewing Our Raw (Unstyled) XML Data in a Browser
11.3.1 What Happens If Our XML Document Is Not Well-Formed?
11.4 Validating Our XML Data with a Document Type Definition
11.4.1 Connecting an XML Document to Its DTD: DOCTYPE Revisited
11.4.2 A Simple DTD Anatomy Lesson
11.4.4 Do You Really Need a DTD for Your XML Document?
11.4.5 Validating Your XML Document Against Your DTD, If You Have One
11.5 Styling Our XML Data with CSS
11.6 Isolating Our XML Tag Sets within XML Namespaces
11.7 Transforming Our XML Data with XSL, XSLT, and XPath
11.7.1 How Does XSLT Compare with CSS for Styling?
11.7.2 Our Example in Detail: How Does XSLT Use XML Namespaces and XPath to Do Its Job?
Quick Questions to Test Your Basic Knowledge
Short Exercises to Improve Your Basic Understanding
Exercises on the Parallel Project
What Else You May Want or Need to Know
12 Collecting, Analyzing, and Using Visitor Data
12.1.1 Format of Web-Server Access Logs
12.1.2 An Extended Log-File Format
12.1.3 An Example: Apache Web-Server Access Log Entries
12.2 Analysis of Web-Server Access Logs
12.2.1 Summarization of Web-Server Access Logs Using Analog
12.2.2 Clickstream Analysis: Studying Navigation Paths with Pathalizer
12.2.3 Visualizing Individual User Sessions with StatViz
12.3 Caution in Interpreting Web-Server Access Logs
Quick Questions to Test Your Basic Knowledge
Short Exercises to Improve Your Basic Understanding
Exercises on the Parallel Project