HTML and CSS Reference
In-Depth Information
Chapter 10
Putting it All Together
You've learned a lot about modern, future-friendly markup in the last nine chapters, with a healthy dose of
CSS along the way. Although HTML and CSS are rich and nuanced languages, the fundamentals are still
quite simple, with just a few basic rules to follow. With a bit of practice and experience putting together
websites, you'll become intimately familiar with these primary languages on which the Web is built until it
all becomes second nature.
Of course, knowing the technical ins and outs of HTML and CSS is only part of a bigger picture.
Assembling a well-formed, accessible, and flexible web page requires a bit of thought and planning.
Consider the meaning of your content and choose the elements that best align with that meaning. Validate
your markup to ensure that you've adhered to the specifications. Once you've built a solid foundation of
valid, meaningful, structural HTML, you can move on to styling your document's presentation with CSS
and adding behavioral enhancements with JavaScript.
In this chapter we'll cover the process of planning, designing, and constructing a simple website from start
to finish, from concept to code. We'll walk you through the basic steps we followed to create the Power
Outfitters website, offering an example of one workflow that tends to work well for many projects. You'll
see how the site was put together from the ground up, exploring the combination of markup and style that
makes the site a reality (or at least as real as a site for a fictional superhero supply company can be).
We'll build up a framework of semantically rich, accessible HTML and wrap it in layers of CSS to make it
shine. We won't be able to cover every last detail of how this example website came together, however,
and there are a few hidden gems in the code for you to discover for yourself. Then, later in the chapter,
we'll at long last delve into some of the CSS3 we've been promising.
