HTML and CSS Coding
A. Kahan Academy
Use KhanAcademy HTMLCSS lessons to complete the 6 projects in the HTML/CSS online lessons. Students will learn the basics of HTML tags, CSS selectors and styles.
B. General Assembly
Use https://dash.generalassemb.ly to create three projects with HTML and CSS emphasis.
- Personal Website – CSS modifications for fonts, backgrounds, background image.
- Responsive Blog Theme – CSS modifications for mobile, tablet and PC screen size.
- Dynamic Responsive Restaurant Menu – CSS modifications for custom fonts, gradient colored background, responsive screen size and font sizes.
C. Build full-page sites
The videos for these file are on the M: drive for Westview High School students. Teachers can download videos for offline access using tools like this.
- Student Newsletter - Use the starter HTML code. Create your own CSS code to format a simple newsletter without using a tutorial.
- Technology Conference - Follow the online tutorial at https://www.youtube.com/watch?v=wanMb3TbMzc to create a a fixed-background effect on a site for a technology conference.
- FlexBox - Follow the onine tutorial at https://www.youtube.com/watch?v=k32voqQhODc to demonstrate the use of the flex and flexbox in web layouts.
- CSS Menu - Follow the online tutorial at https://www.youtube.com/watch?v=uRBpD3tKKmk to create your own version of a drop down menu using only CSS code.
D. Free Code Camp
Use www.freecodecamp.com to create a cat photo app reviewing all of the HTML / CSS specifics in the previous units.
E. Web client project
Build a website for a client. Choose a design from one of the three clients: Pampered Pups, DJ Turntable or Joe the Plumber. Alternative assignments can be done for a real client.
1. Completeness -
- Minimum of 3 web pages in the design
2. Accuracy -
- Proper use of client content according to his/her request.
- Spelling and grammar.
- Demonstrates accurate use of HTML and CSS
- Navigation leads to proper locations