FEWD Week #1: HTML/CSS Basics

---

Description

For the first assignment, you will begin creating the beginnings of your first website. Take what you've learned from class and build a portfolio site that showcases all of the projects you'll be completing over the next few weeks. Build two pages - an 'About Page' and a 'Portfolio' - that link to one another. Your 'About Page' should describe your mission and value proposition and your 'Portfolio' should include screenshots with descriptions of the work you [will] do for Relaxr, Startup Matchmaker, and CitiPix. Don't worry if you can't come up with any text for the pages--we've provided you with some sample copy that you can use.

---

Real-World Applications

• Create a website with multiple pages that link together
• Style a page using CSS via an external stylesheet
• Add images to a website to improve SEO
• Clearly articulate your skills and experience on a landing page
• Provide customers or site visitors with important contact and social media information in a format they're accustomed to

---

Technical Requirements

• Link both pages together using a tag
• Use a unique title and a single unique h1 tag
• Show images using img tags including unique alt attributes
• Use an external CSS stylesheet to style your pages
• Select at least 5 elements on the page and apply at least 5 different css properties (font-size, color, font-family, background, text-decoration) to these elements
• Use at least 6 different HTML tags (h1, h2, h3, h4, h5, h6, p, ul, ol, a, img) on your pages
• Follow naming conventions, maintain consistency across your .html and .css files
• Indent nested elements to increase your code's readability

Bonus

• Experiment by adding additional HTML tags and CSS properties we did not cover in class - explore!

---

Resources

• NOTE: There is no starter code for this assignment (only starter text), but a sample solution is provided. Students will build this assignment from scratch and should feel free to get creative with regard to layout, color, styling, etc.

• Slides from class 1 and class 2.

Here are examples of a simple "About" and "Portfolio" page that fulfill the assignment requirements:

• Joe, the freelance developer's "about page":

• Joe, the freelance developer's "portfolio page":

---

Evaluation / Submission

Students will create a new repository on GitHub called "homework-portfolio" and push their code to this new repository when they are ready to submit. The instructional team will grade each technical requirement and provide a numeric grade on a scale: does not meet expectations (0); meets expectations (1); exceeds expectations (2). The maximum possible score on this assignment is 16/16.