| |
| |
| |
Introduction to the Internet and World Wide Web | |
| |
| |
| |
The Internet and the Web | |
| |
| |
The Internet | |
| |
| |
Birth of the Internet | |
| |
| |
Growth of the Internet | |
| |
| |
Birth of the Web | |
| |
| |
The First Graphical Browser | |
| |
| |
Convergence of Technologies | |
| |
| |
Who Runs the Internet? | |
| |
| |
Intranets and Extranets | |
| |
| |
| |
Web Standards and Accessibility | |
| |
| |
W3C Recommendations | |
| |
| |
Web Standards and Accessibility | |
| |
| |
Accessibility and the Law | |
| |
| |
Universal Design for the Web | |
| |
| |
| |
Information on the Web | |
| |
| |
Reliability and Information on the Web | |
| |
| |
Ethical Use of Information on the Web | |
| |
| |
| |
Network Overview | |
| |
| |
| |
The Client/Server Model | |
| |
| |
| |
Internet Protocols | |
| |
| |
File Transfer Protocol (FTP) | |
| |
| |
E-mail Protocols | |
| |
| |
Hypertext Transfer Protocol (HTTP) | |
| |
| |
Transmission Control Protocol/Internet Protocol (TCP/IP) | |
| |
| |
| |
Uniform Resource Identifiers and Domain Names | |
| |
| |
URIs and URLs | |
| |
| |
Domain Names | |
| |
| |
| |
Markup Languages | |
| |
| |
Standard Generalized Markup Language (SGML) | |
| |
| |
Hypertext Markup Language (HTML) | |
| |
| |
Extensible Markup Language (XML) | |
| |
| |
Extensible Hypertext Markup Language (XHTML) | |
| |
| |
HTML5�the Newest Version of HTML | |
| |
| |
| |
Internet and Web Trends | |
| |
| |
Chapter Summary | |
| |
| |
Key Terms | |
| |
| |
Review Questions | |
| |
| |
Hands-On Exercise | |
| |
| |
Web Research | |
| |
| |
Focus on Web Design | |
| |
| |
| |
HTML Basics | |
| |
| |
| |
HTML Overview | |
| |
| |
HTML | |
| |
| |
XHTML | |
| |
| |
HTML | |
| |
| |
| |
Document Type Definition | |
| |
| |
| |
Example XHTML Web Page | |
| |
| |
| |
Example HTML5 Web Page | |
| |
| |
| |
Head, Body, Title, and Meta Elements | |
| |
| |
The Head Section | |
| |
| |
The Body Section | |
| |
| |
| |
Your First Web Page | |
| |
| |
| |
Heading Element | |
| |
| |
Accessibility and Headings | |
| |
| |
More Heading Options in HTML | |
| |
| |
| |
Paragraph Element | |
| |
| |
Alignment | |
| |
| |
| |
Line Break Element | |
| |
| |
| |
Blockquote Element | |
| |
| |
| |
Phrase Elements | |
| |
| |
| |
Unordered List | |
| |
| |
The type Attribute | |
| |
| |
HTML5 and Unordered Lists | |
| |
| |
| |
Ordered List | |
| |
| |
The type Attribute | |
| |
| |
HTML5 and Ordered Lists | |
| |
| |
| |
Description List | |
| |
| |
| |
Special Characters | |
| |
| |
| |
Div Element | |
| |
| |
| |
Anchor Element | |
| |
| |
Absolute Hyperlinks | |
| |
| |
Relative Hyperlinks | |
| |
| |
E-Mail Hyperlinks | |
| |
| |
Accessibility and Hyperlinks | |
| |
| |
Block Anchor | |
| |
| |
| |
HTML Validation | |
| |
| |
Chapter Summary | |
| |
| |
Key Terms | |
| |
| |
Review Questions | |
| |
| |
Apply Your Knowledge | |
| |
| |
Hands-On Exercises | |
| |
| |
Web Research | |
| |
| |
Focus on Web Design | |
| |
| |
Website Case Study | |
| |
| |
| |
Configuring Color and Text with CSS | |
| |
| |
| |
Overview of Cascading Style Sheets | |
| |
| |
Advantages of Cascading Style Sheets | |
| |
| |
Configuring Cascading Style Sheets | |
| |
| |
CSS Selectors and Declarations | |
| |
| |
The background-color Property | |
| |
| |
The color Property | |
| |
| |
Configure Background and Text Color | |
| |
| |
| |
Using Color on Web Pages | |
| |
| |
Hexadecimal Color Values | |
| |
| |
Web Safe Colors | |
| |
| |
CSS Color Syntax | |
| |
| |
| |
Inline CSS with the Style Attribute | |
| |
| |
The Style Attribute | |
| |
| |
| |
Embedded CSS with the Style Element | |
| |
| |
Style Element | |
| |
| |
| |
Configuring Text with CSS | |
| |
| |
The Property | |
| |
| |
More CSS Font Properties | |
| |
| |
| |
CSS Class, Id, and Contextual Selectors | |
| |
| |
The Class Selector | |
| |
| |
The Id Selector | |
| |
| |
The Contextual Selector | |
| |
| |
| |
Span Element | |
| |
| |
| |
Using External Style Sheets | |
| |
| |
Link Element | |
| |
| |
| |
Center HTML Elements with CSS | |
| |
| |
| |
The -Cascade | |
| |
| |
| |
CSS Validation | |
| |
| |
Chapter Summary | |
| |
| |
Key Terms | |
| |
| |
Review Questions | |
| |
| |
Apply Your Knowledge | |
| |
| |
Hands-On Exercises | |
| |
| |
Web Research | |
| |
| |
Focus on Web Design | |
| |
| |
Website Case Study: Implementing CSS | |
| |
| |
| |
Visual Elements and Graphics | |
| |
| |
| |
Configuring Lines and Borders | |
| |
| |
Horizontal Rule Element | |
| |
| |
The border and padding Properties | |
| |
| |
| |
Types of Graphics | |
| |
| |
Graphic Interchange Format (GIF) Images | |
| |
| |
Joint Photographic Experts Group (JPEG) Images | |
| |
| |
Portable Network Graphic (PNG) Images | |
| |
| |
New WebP Image Format | |
| |
| |
| |
Image Element | |
| |
| |
Accessibility and Images | |
| |
| |
Image Hyperlinks | |
| |
| |
Optimize an Image for the Web | |
| |
| |
| |
HTML5 Visual Elements | |
| |
| |
HTML5 Figure Element | |
| |
| |
HTML5 Figcaption Element | |
| |
| |
HTML5 Meter Element | |
| |
| |
HTML5 Progress Element | |
| |
| |
| |
Background Images | |
| |
| |
The background-image Property | |
| |
| |
Browser Display of a Background Image | |
| |
| |
The background-repeat Property | |
| |
| |
The background-position Property | |
| |
| |
The background-attachment Property | |
| |
| |
| |
More About Images | |
| |
| |
Image Maps | |
| |
| |
The Favorites Icon | |
| |
| |
Image Slicing | |
| |
| |
CSS Sprites | |
| |
| |
| |
Sources and Guidelines for Graphics | |
| |
| |
Sources of Graphics | |
| |
| |
Guidelines for Using Images | |
| |
| |
Accessibility and Visual Elements | |
| |
| |
| |
CSS3 Visual Effects | |
| |
| |
The CSS3 background-clip Property | |
| |
| |
The CSS3 background-origin Property | |
| |
| |
The CSS3 background-size Property | |
| |
| |
CSS3 Multiple Background Images | |
| |
| |
CSS3 Rounded Corners | |
| |
| |
CSS3 Box Shadow | |
| |
| |
CSS3 Text Shadow | |
| |
| |
CSS3 Opacity | |
| |
| |
CSS3 RGBA Color | |
| |
| |
CSS3 Gradients | |
| |
| |
Chapter Summary | |
| |
| |
Key Terms | |
| |
| |
Review Questions | |
| |
| |
Apply Your Knowledge | |
| |
| |
Hands-On Exercises | |
| |
| |
Web Research | |
| |
| |
Focus on Web Design | |
| |
| |
Website Case Study: Using Graphics & Visual Elements | |
| |
| |
| |
Web Design | |
| |
| |
| |
Design for Your Target Audience | |
| |
| |
Browser-Friendly | |
| |
| |
Screen Resolution | |
| |
| |
| |
Website Organization | |
| |
| |
Hierarchical Organization | |
| |
| |
Linear Organization | |
| |
| |
Random Organization | |
| |
| |
| |
Principles of Visual Design | |
| |
| |
Repetition: Repeat Visual Elements throughout Design | |
| |
| |
Contrast: Add Visual Excitement and Draw Attention | |
| |
| |
Proximity: Group-Related Items | |
| |
| |
Alignment: Align Elements to Create Visual Unity | |
| |
| |
| |
Design to Provide Accessibility | |
| |
| |
Who Benefits from Universal Design and Increased Accessibility? | |
| |
| |
Accessible Design Can Benefit Search Engine Listing | |
| |
| |
Legal Requirements | |
| |
| |
Accessibility is the Right Thing To Do | |
| |
| |
| |
Writing for the Web | |
| |
| |
Organize Your Content | |
| |
| |
Text in Hyperlinks | |
| |
| |
Reading Level | |
| |
| |
Use of Fonts | |
| |
| |
Spelling and Grammar | |
| |
| |
| |
Use of Color | |
| |
| |
Choosing Colors | |
| |
| |
Accessibility and Color | |
| |
| |
Appealing to Children and Preteens | |
| |
| |
Appealing to Young Adults | |
| |
| |
Appealing to Everybody | |
| |
| |
Appealing to Older Adults | |
| |
| |
| |
Use of Graphics and Multimedia | |
| |
| |
File Size and Dimension Matter | |
| |
| |
Antialiased/Aliased Text in Media | |
| |
| |
Use Only Necessary Multimedia | |
| |
| |
Provide Alternate Text | |
| |
| |
| |
Navigation Design | |
| |
| |
Ease of Navigation | |
| |
| |
Navigation Bars | |
| |
| |
Breadcrumb Navigation | |
| |
| |
Using Graphics for Navigation | |
| |
| |
Dynamic Navigation | |
| |
| |
Site Map | |
| |
| |
Site Search Features | |
| |
| |
| |
Page Layout Design | |
| |
| |
Wireframes and Page Layout | |
| |
| |
Page Layout Design Techniques | |
| |
| |
Design for the Mobile Web | |
| |
| |
| |
More Design Considerations | |
| |
| |
Load Time | |
| |
| |
Above the Fold | |
| |
| |
White Space | |
| |
| |
Avoid Horizontal Scrolling | |
| |
| |
Browsers | |
| |
| |
Screen Resolution | |
| |
| |
| |
Web Design Best Practices Checklist | |
| |
| |
Chapter Summary | |
| |
| |
Key Terms | |
| |
| |
Review Questions | |
| |
| |
Hands-On Exercises | |
| |
| |
Web Research | |
| |
| |
Focus on Web Design | |
| |
| |
Website Case Study: Web Design Best Practices | |
| |
| |
| |
Page Layout | |
| |
| |
| |
The Box Model | |
| |
| |
Content | |
| |
| |
Padding | |
| |
| |
Border | |
| |
| |
Margin | |
| |
| |
The Box Model in Action | |
| |
| |
| |
Normal Flow | |
| |
| |
| |
CSS Positioning | |
| |
| |
Relative Positioning | |
| |
| |
Absolute Positioning | |
| |
| |
| |
CSS Float | |
| |
| |
| |
CSS Clearing a Float | |
| |
| |
The clear Property | |
| |
| |
The overflow Property | |
| |
| |
| |
CSS Two-Column Page Layout | |
| |
| |
Two Column with Left Navigation | |
| |
| |
Two Column with Top Header and Left Navigation | |
| |
| |
| |
Hyperlinks in an Unordered List | |
| |
| |
Configure List Markers with CSS | |
| |
| |
Vertical Navigation with an Unordered List | |
| |
| |
Horizontal Navigation with an Unordered List | |
| |
| |
| |
CSS Interactivity with Pseudo-Classes | |
| |
| |
| |
Practice with CSS Two Column Layout | |
| |
| |
| |
CSS Resources | |
| |
| |
CSS Debugging Techniques | |
| |
| |
CSS Web Resources | |
| |
| |
| |
HTML5 Structural Elements | |
| |
| |
Header Element | |
| |
| |
Hgroup Element | |
| |
| |
Nav Element | |
| |
| |
Footer Element | |
| |
| |
| |
| |
| |
Article Element | |
| |
| |
Aside Element | |
| |
| |
Time Element | |
| |
| |
HTML5 & Today�s Browsers | |
| |
| |
More on Links and Layout | |
| |
| |
Another Look at Hyperlinks | |
| |
| |
CSS Sprites | |
| |
| |
Three-Column CSS Page Layout | |
| |
| |
CSS Styling for Print | |
| |
| |
CSS Styling for the Mobile Web | |
| |
| |
Tables | |
| |
| |
Table Overview | |
| |
| |
Table Rows, Cells, and Headers | |
| |
| |
Span Rows and Columns | |
| |
| |
Configure an Accessible Table | |
| |
| |
Style a Table with CSS | |
| |
| |
CSS Structural Pseudo-classes | |
| |
| |
Configure Table Sections | |
| |
| |
Forms | |
| |
| |
Overview of Forms | |
| |
| |
Input Element Form Controls | |
| |
| |
Scrolling Text Box | |
| |
| |
Select List Select List | |
| |
| |
Image Buttons and the Button Element | |
| |
| |
Accessibility and Forms | |
| |
| |
Styling a Form | |
| |
| |
Server-Side Processing | |
| |
| |
HTML5 Form Controls | |
| |
| |
Web Development | |
| |
| |
Successful Large-Scale Project Development | |
| |
| |
The Development Process | |
| |
| |
Domain Name Overview | |
| |
| |
Web Hosting | |
| |
| |
Choosing a Virtual Host | |
| |
| |
Web Multimedia and Interactivity | |
| |
| |
Plug-Ins, Containers, and Codecs | |
| |
| |
Getting Started with Audio and Video | |
| |
| |
XHTML Object & Param Elements | |
| |
| |
Adobe Flash | |
| |
| |
HTML5 Audio & Video Elements | |
| |
| |
Multimedia Files & Copyright | |
| |
| |
CSS3 & Interactivity | |
| |
| |
Java | |
| |
| |
JavaScript | |
| |
| |
Ajax | |
| |
| |
HTML5 Canvas Element | |
| |
| |
Accessibility and Multimedia/Interactivity | |
| |
| |
E-Commerce Overview | |
| |
| |
What Is E-Commerce? | |
| |
| |
E-Commerce Business Models | |
| |
| |
Electronic Data Interchange (EDI) | |
| |
| |
E-Commerce Statistics | |
| |
| |
E-Commerce Issues | |
| |
| |
E-Commerce Security | |
| |
| |
Order and Payment Processing | |
| |
| |
E-Commerce Storefront Solutions | |
| |
| |
Web Promotion | |
| |
| |
Search Engine Overview | |
| |
| |
Popular Search Engines | |
| |
| |
Components of a Search Engine | |
| |
| |
Designing Your Pages for Promotion | |
| |
| |
Listing in a Search Engine and Search Index | |
| |
| |
Monitoring Search Listings | |
| |
| |
Link Popularity | |
| |
| |
Social Media Optimization | |
| |
| |
Other Site Promotion Activities | |
| |
| |
Serving Dynamic Content with Inline Frames | |
| |
| |
A Brief Look at JavaScript | |
| |
| |
Overview of JavaScript | |
| |
| |
The Development of JavaScript | |
| |
| |
Popular Uses for JavaScript | |
| |
| |
Adding JavaScript to a Web Page | |
| |
| |
Document Object Model Overview | |
| |
| |
Events and Event Handlers | |
| |
| |
Variables | |
| |
| |
Introduction to Programming Concepts | |
| |
| |
Form Handling | |
| |
| |
Accessibility and JavaScript | |
| |
| |
JavaScript Resources | |