RWD Certification Pages (M6B Setup / M9 Build Out)
A two-part assignment pairing your course-site building with the freeCodeCamp RWD certification projects. Part A (M6B) frames in the pages; Part B (M9) builds them out around a theme of yours. Use AI if you want to, but don't trust it.
The Five Pages
- survey.html - Build a Survey Form (FCC's HTML section). Heads-up: later you'll build a form collecting introduction info - seed some of those inputs here where they fit.
- cards.html - Build a Page of Playing Cards (images themed to you, not actual playing cards)
- inventory.html - Build a Book Inventory App (things from your theme: products, prizes, ideas)
- documentation.html - Build a Technical Documentation Page
- product.html - Build a Product Landing Page
Part a (M6B) - Setup
- Create all five as empty framed pages: common header/footer components, default.css linked, validation in place, and an h2 in main saying what the content will be - nothing else.
- Link them in your primary navbar, in order, after Home and Contract.
- Make a second navbar for anything not themed like your course site - move your CRAPpy page link there, plus client sites and any other off-theme links, now and in the future.
Part B (M9) - Build Out
- Every page reflects one consistent theme tied to you, your mascot, or an idea the mascot's name suggests. Think village pub: the Salty Dog has nothing to do with salt or dogs, and it works. Dapper Vicuña might sell deep-fried Oreos - then every page relates to deep-fried Oreos. Pick something entertaining or meaningful so the pages amuse you. (You may change your mascot if the initials still match.)
- Inspiration: the 826 Valencia pirate-store TED talk, or Bubba's shrimp list from Forrest Gump.
- Every page has the Accumulus validator, all tests passing, including WCAG (click the cloud) - contrast issues are the classic miss.
Submitting (Both Parts)
- Your course URL - the pages evident in the menu.
- Notes welcome; questions go on the class discussion board instead, preferably before submitting.
- Peer reviews: these instructions as a GO/NO-GO checklist on at least two classmates who don't already have two reviews.
What gets checked: M6B - all five pages exist and the primary nav links them. M9 - each page is built out: survey has a form with 3+ inputs, cards has 6+ themed images, inventory has a table of rows, documentation has 3+ sections, product has sections plus an image - with an h2 naming every page.