#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 uniqueh1
tag - Show images using
img
tags including uniquealt
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
- 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.
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.