Web Design Playground

Intro

Titlepage

Copyright

Dedication

Contents

Preface

Acknowledgments

About This Book

About the Author

Part 1: Getting Started with HTML and CSS

Chapter 1: Getting to Know HTML and CSS

What Is HTML?

What Is CSS?

What Can't You Do with HTML and CSS?

How HTML and CSS Create the Web

Introducing the Web Design Playground

Adding HTML Tag Attributes

Some Helpful Features of the Playground

Chapter 2: Building Your First Web Page

Getting Your Web Page off the Ground

Learning the Most Common Text Elements

Chapter 3: Adding Structure to Your Page

HTML Elements for Structuring Page Text

Organizing Text Into Lists

Chapter 4: Formatting Your Web Page

Styling Text

Working with Text Styles

Styling Paragraphs

Working with Colors

Chapter 5: Project: Creating a Personal Home Page

What You'll Be Building

Sketching the Layout

Choosing Typefaces

Choosing a Color Scheme

Building the Page

From Here

Part 2: Working with Images and Styles

Chapter 6: Adding Images and Other Media

Understanding Image File Formats

Getting Graphics

Inserting an HTML5 Figure

Setting Up an Image as a Link

Using an Image as a Custom Bullet

Aligning Images and Text

Controlling the Background Repeat

Setting the Background Position

Adding a Hero Image

The Background Shorthand Property

Optimizing Images

Adding Video and Audio to the Page

Chapter 7: Learning More About Styles

Adding Styles to a Page

Units of Measurement in CSS

Chapter 8: Floating and Positioning Elements

Understanding the Default Page Flow

Chapter 9: Styling Sizes, Borders, and Margins

The Anatomy of an Element Box

Watch Out for Collapsing Margins!

Chapter 10: Project: Creating a Landing Page

What You'll Be Building

Sketching the Layout.

Choosing Typefaces

Choosing a Color Scheme

Building the Page

From Here

Part 3: Laying Out a Web Page

Chapter 11: Learning Page Layout Basics

The Holy-Grail Layout

Understanding Web Page Layout Methods

Learning the HTML5 Semantic Page Elements

Creating Page Layouts with Floats

Creating Page Layouts with Inline Blocks

Chapter 12: Creating Page Layouts with Flexbox

Understanding Flexbox

Chapter 13: Designing Responsive Web Pages

Creating a Responsive Layout

Chapter 14: Making Your Images and Typography Responsive

Making Images Responsive

Making Typography Responsive

Gallery of Responsive Sites

Chapter 15: Project: Creating a Photo Gallery

What You'll Be Building

Getting Your Photos Ready

Sketching the Layout

Choosing Typefaces

Choosing the Colors

Building the Page

Adding a Few Tricks

From Here

Part 4: Making Your Web Pages Shine

Chapter 16: More HTML Elements for Web Designers

More about Links

Inserting Special Characters

Using the HTML5 Entity Browser

Adding Comments

Chapter 17: Adding a Splash of Color to Your Web Designs

Understanding Colors

Adding Colors with CSS

Choosing Harmonious Colors

Using the Color Scheme Calculator

Color Scheme Gallery

Applying a Color Gradient

Chapter 18: Enhancing Page Text with Typography

Specifying the Typeface

Working with Text Styles

Web Typography Gallery

Chapter 19: Learning Advanced CSS Selectors

Working with ID Selectors

Web Page Genealogy: Parents, Descendants, and Siblings

Working with Contextual Selectors

Taking Things up a Notch by Combining Selectors

Resetting CSS with the Universal Selector

Styles: What a Tangled Web Page They Weave

Chapter 20: Project: Creating a Portfolio Page

What You'll Be Building

Sketching the Layout

Choosing Typefaces.

Choosing a Color Scheme

Building the Page

From Here

Appendix: From Playground to Web: Getting Your Pages Online

Index

List of Figures

List of Tables

List of Listings.