Here's how you'll make your final project website.
- Ideas: Done
- Structure: list the pages and how they relate Next
- Prototype: build a rough model of the site
- Make it: make the final version
Time for the second step. Here's the idea I chose.
Final project: Idea
Pupperware
A small business that brings doggos to your event. Pages:
- Home
- What we do - what the company does
- Packages - what people buy, with the prices
- Doggos - meet some of our doggos
- About - address, things like that
- Contact
OK, let's flesh it out. We have a start on the page list, but let's expand it.
In the following, a "top page" has an entry in the main menu. A "subpage" is linked from a top page. It's like a child of a top page.
Final project: Structure
By Suzie Chen
Our project will be a website for Pupperware, a small company that brings doggos to your event. Here are the pages.
Top page: HOME
What the company does, slideshow of doggos at events, like parties.
Top page: SERVICES
More deets than on home page. Service area, service time (8am - 9pm?), what we bring, cleaning up.
Top page: PACKAGES
What people buy. Maybe three packages. Small (two doggos, two hoomans), medium (four doggos, three hoomans), large (eight doggos, three hoomans). With prices. Link to deets of each package. Booking button.
Subpage: Small
Deets of the small package. Booking button.
Subpage: Medium
Deets of the medium package. Booking button.
Subpage: Large
Deets of the large package. Booking button.
Subpage: Booking
Fake booking page, with a fake form to fill in.
Top page: DOGGOS
Meet our doggos. Profiles of a few. Pictures. Cute and happy!
Top page: ABOUT
Deets on the company. Where it is, facilities, like that.
Top page: WORK FOR US
Job openings, how to apply.
Top page: CONTACT
A contact form.
Subpage: Terms
Legal stuff, what we are not liable for. Linked from the packages and booking pages.
Exercise
Project: Site structure
List the pages that will be on the website for your final project. At least ten pages. For each one, give a page name, and a sentence or two about the page.
Limit the top-level pages to seven or less. Other pages can be under the top level. For example, Products might be a top-level page. Under that, you might have pages for Shoes, Hats, and Scarves.
In your page list, use dashes or something else (like doggos) to show the subpages. E.g.:
Products - description of Product page
- Shoes - description of the Shoes page
- Hats - etc.
You can change your mind about the pages later. That's common, as you work on the project.
You must do this project by yourself. You only get to submit it once, as with all projects, so check your work.
Up next
Next, you'll learn the basics of HTML and its sister language CSS. You'll use what you know to make a prototype of the final project.