HTML and CSS Reference
In-Depth Information
5.
Locations
6.
Sitemap
The Sitemap page here contains a list of links to all the other pages on the website.
For this particular website, a sitemap is not that important because you will have a small number of pages; still, this
is a valuable resource for websites that have a lot of pages so it will be good practice for you to include it in the ex-
ample.
Most websites are based on a few different
templates
that are used to create each page. These templates provide an
empty shell that you can add content to in order to create new pages. Using templates enables you to keep all pages
looking consistent throughout your website. You will create two templates for your website: one for the
home page
and one for the
content pages.
Content pages primarily contain text, so they need a slightly different layout from the
home page.
Planning the Page Layouts
Before you start coding away, it's best to create a rough mock-up of how you want the pages to look. These mock-
ups, often referred to as
wireframes,
use boxes to indicate the position of key elements, such as the navigation, con-
tent, and logo. In this section, you create a few quick wireframes for the home and content page templates.
All your web pages will have five common elements: a header, logo, navigation, main content area, and footer. You
can use these key elements to create a quick wireframe for your pages.
Let's start with the home page template. Figure 2-2 shows a rough wireframe for the layout that I have put together.
