Description

Intended for use in a beginning web design or web development course The Basics of Web Design: HTML5 & CSS3, 2e takes a unique approach to prepare students to design web pages that work today in addition to being ready to take advantage of HTML5 coding techniques of the future. The text covers the basic concepts that web designers need to develop their skills:

• Introductory Internet and Web concepts
• Creating web pages with HTML5
• Configuring text, color, and page layout with Cascading Style Sheets
• Configuring images and multimedia on web pages
• Web design best practices
• Accessibility, usability, and search engine optimization considerations
• Obtaining a domain name and web host
• Publishing to the Web

Teaching and Learning Experience To provide a better teaching and learning experience, for both instructors and students, this program will:

• Apply Theory and/or Research: A well-rounded foundation of hard and soft skills will help students as they pursue careers as web professionals.
• Engage Students: Hands-on practice exercises and a running case study offer real-world perspective, and keep students interested in the material.
• Support Instructors and Students: Student files for web page Hands-on Practice exercises and the case study are available on the companion website.

Features

APPLY THEORY AND/OR RESEARCH

• Design for Today and Tomorrow. The textbook prepares students to design web pagesthat work today in addition to being ready to take advantage of new HTML5 coding techniques of the future.
• Well-Rounded Selection of Topics. This text includes both “hard” skills such as HTML5 and Cascading Style Sheets and “soft” skills such as web design and publishing to the Web. This well-rounded foundation will help students as they pursue careers as web professionals. Students and instructors will find classes more interesting because they can discuss, integrate, and apply both hard and soft skills as students create web pages and websites. The topics in each chapter are introduced in concise two-page sections that provide quick overviews and timely practice with the topic.
• Two-Page Topic Sections. Each topic in this text is introduced in a concise, two-page section. Many sections also include immediate hands-on practice of the new skill or concept. This approach is intended to appeal to today’s busy students who need to drill down to the important concepts right away.
• FAQs. Based on the author’s experience in her web design courses, FAQs are presented to help readers understand common questions.
• Focus on Accessibility. Developing accessible websites is more important than ever, and this text is infused with accessibility techniques.
• Focus on Ethics. Ethics issues as related to web development are highlighted throughout the text.
• Quick Tips. Quick tips provide useful background information, or help with productivity.
• Explore Further. Throughout the book, enrichment topics and useful web resources are identified to delve deeper into a concept.
• Reference Materials. The appendixes include an XHTML reference, an HTML5 reference, a Cascading Style Sheets reference, and a WCAG 2.0 Quick Reference.

ENGAGE STUDENTS

• Hands-On Practice. Web design is a skill, and skills are best learned by hands-on practice. This text emphasizes hands-on practice through exercises within the chapters, end-of-chapter exercises, and the development of a website through ongoing real-world case studies. The variety of exercises provides instructors with a choice of assignments for a particular course or semester.
• Website Case Study. An ongoing case study serves to reinforce skills discussed in each chapter. Sample solutions to the case study exercises are available on the Instructor Resource Center at http://www.pearsonhighered.com/irc.¿
• Focus on Web Design. Every chapter offers an additional activity that explores web design topics related to the chapter. These activities can be used to reinforce, extend, and enhance the course topics.

SUPPORT INSTRUCTORS AND STUDENTS

• Student Resources. Student files for web page Hands-on Practice exercises and the case study are available on the companion website http://www.pearsonhighered.com/felke-morris. A complimentary access code for the companion website is available with a new copy of the book. Subscriptions may also be purchased online.
• Instructor Resources. The following supplements are available to qualified instructors only. Visit the Pearson Instructor Resource Center http://www.pearsonhighered.com/irc or contact your Pearson Representative to access them:
  • Solutions to the end-of-chapter exercises
  • Solutions for the case study assignments
  • Test questions
  • PowerPoint presentations </l

New to this Edition

Building on this textbook’s successful first edition, the second edition features a focus on HTML5 instead of introducing both XHTML and HTML5 syntax together. This singular focus is beneficial to individuals new to web design. Also new for the second edition:

• Additional Hands-On Practice exercises
• New and updated case studies
• Expanded treatment of page layout design
• Expanded treatment of mobile web design
• New sections on responsive web design techniques
• New sections on CSS media queries

Chapter-by-chapter changes

Chapter 1

• Updated International Internet Usage statistics
• Removed XHTML code sample
• Updated screen captures
• Added HTML5 badge figure and Under the Hood figure
• Reworked the introduction of the structure of a web page and Hands-On Practice 1.1
• Updated Review and Apply section

Chapter 2

• Removed XHTML information
• Added Hands-On Practice for horizontal rule element
• Introduce the HTML5 header, nav, and footer
• Added the following sections from 1E Chapter 3: Anchor Element, E-mail Hyperlink, Practice with Hyperlinks
• Adapted end-of chapter exercises to use HTML5 structural elements
• Adapted Pacific Trails Resort case study to use HTML5 structural elements
• Added new adaptation of the JavaJam Coffee House Case Study
• Updated the Review and Apply section

Chapter 3

• Expanded treatment of Page Layout Design topic
• Replaced the two-page spread 'Page Layout Design' with the following two-page spreads: ¿Wireframes and Page Layout, Fixed and Fluid Layouts
• New two-page spread: Design for Mobile Web
• New two-page spread: Responsive Web Design

Chapter 4

• Updates as needed to reflect chapter number change
• Changed terminology from older term contextual selectors to newer term descendant selectors
• Updated Pacific Trails Resort Case Study
• New JavaJam Coffee House Case Study

Chapter 5

• Added information about the new WebP image format
• Removed section on optimizing an image for the Web
• Reworked section on positioning background images to include the hands-on practice
• Added section on Image Maps
• Updated Pacific Trails Resort Case Study
• New JavaJam Coffee House Case Study

Chapter 6

• New section 'CSS3 HSL Color'
• New section 'CSS3 Background Image Properties' with more information on background-attachment, background-clip, background-origin, and background-size
• Updated Pacific Trails Resort Case Study
• New JavaJam Coffee House Case Study

Chapter 7

• This is the first part of the old Chapter 8
• Reworked the 'Positioning' section
• New section 'Practice with Positioning' (reworked old Chapter 11 CSS Image Gallery)
• New section 'CSS Sprites'
• New Pacific Trails Resort Case Study
• New JavaJam Coffee House Case Study

Chapter 8

• Expanded treatment of relative hyperlinks to documents (from Chapter 3)
• Expanded treatment of Fragment Identifiers (from Chapter 3)
• Reworked 'Caption a Figure' to 'Figure and Figcaption Elements'
• New section 'Practice with Floating Figures'
• Reworked 'HTML5 Structural Elements' (header, nav and footer elements are now introduced in Chapter 2) into 'More HTML5 Elements'
• New section 'HTML5 Compatibility with Older Browsers'
• Reworked 'CSS for the Mobile Web

Table of Contents

Chapter 1 Internet and Web Basics 1

The Internet and the Web 2

Web Standards and Accessibility 4

Information on the Web 6

Web Browsers and Web Servers 8

Internet Protocols 10

Uniform Resource Identifiers and Domain Names 12

HTML Overview 14

Under the Hood of a Web Page 16

Your First Web Page 18

Review and Apply 22

 

Chapter 2 HTML Basics 25

Heading Element 26

Paragraph Element 28

Line Break and Horizontal Rule 30

Blockquote Element 32

Phrase Elements 34

Ordered List 36

Unordered List 38

Description List 40

Special Entity Characters 42

HTML Syntax Validation 44

Structural Elements 46

Anchor Element 48

Practice with Hyperlinks 50

E-Mail Hyperlinks 54

Review and Apply 56

 

Chapter 3 Web Design Basics 65

Design for Your Target Audience 66

Website Organization 68

Principles of Visual Design 70

Design to Provide for Accessibility 72

Use of Text 74

Web Color Palette 76

Use of Color 78

Use of Graphics and Multimedia 80

More Design Considerations 82

Navigation Design 84

Wireframes and Page Layout 86

Fixed and Fluid Layouts 88

Design for the Mobile Web 90

Responsive Web Design 92

Web Design Best Practices Checklist 94

Review and Apply 96

 

Chapter 4 Cascading Style Sheets Basics 101

Cascading Style Sheets Overview 102

CSS Selectors and Declarations 104

CSS Syntax for Color Values 106

Configure Inline CSS 108

Configure Embedded CSS 110

Configure External CSS 112

CSS Selectors: Class, Id, and Descendant 114

Span Element 116

Practice with CSS 118

CSS Syntax Validation 120

Review and Apply 122

 

Chapter 5 Web Graphics Styling Basics 129

Web Graphics 130

Image Element 132

Image Hyperlinks 134

Configure Background Images 136

Position Background Images 138

CSS3 Multiple Background Images 140

The Favorites Icon 142

Configure List Markers with CSS 144

Image Maps 146

Review and Apply 148

 

Chapter 6 More CSS Basics 157

Fonts with CSS 158

Text Properties with CSS 160

Align and Indent Text with CSS 162

Width and Height with CSS 164

The Box Model 166

Margin and Padding with CSS 168

Borders with CSS 170

CSS3 Rounded Corners 172

Center Page Content with CSS 174

CSS3 Box Shadow and Text Shadow 176

CSS3 Background Clip and Origin 178

CSS3 Background Resize and Scale 180

CSS3 Opacity 182

CSS3 RGBA Color 184

CSS3 HSLA Color 186

CSS3 Gradients 188

Review and Apply 190

 

Chapter 7 Page Layout Basics 197

Normal Flow 198

Float 200

Clear a Float 202

Overflow 204

CSS Two-Column Page Layout 206

Vertical Navigation with an Unordered List 208

Horizontal Navigation with an Unordered List 210

CSS Interactivity with Pseudo-Classes 212

Practice with CSS Two-Column Layout 214

Positioning with CSS 216

Practice with Positioning 218

CSS Sprites 220

Review and Apply 222

 

Chapter 8 More on Links, Layout, and Mobile 227

More on Relative Linking 228

Fragment Identifiers 230

Figure and Figcaption Elements 232

Practice with Floating Figures 234

More HTML5 Elements 236

HTML5 Compatibility with Older Browsers 238

CSS for Print 240

Mobile Web Design 242

Viewport Meta Tag 244

CSS3 Media Queries 246

Practice with Media Queries 248

Flexible Images 250

Testing Mobile Display 252

Review and Apply 254<