Difference between revisions of "Courses/Browser as Canvas"
Lucia Dossin (talk | contribs) (Created page with "File:Browser canvas day2 (1).pdf") |
Lucia Dossin (talk | contribs) |
||
Line 1: | Line 1: | ||
=Overview= | |||
Making a HTML page that looks more like a poster than a website - and giving students a basic introduction to HTML and CSS. These are the course main goals. | |||
The course does not require any previous HTML or CSS knowledge. | |||
Note: this course was formerly known as ‘Making Web Posters’ | |||
=Learning Achievements= | |||
– basic HTML/CSS skills, the CSS box model and how different browsers deal with that | |||
– how to accommodate a layout in various screen sizes and how to use typography on the web | |||
=Planning= | |||
The course is divided into 3 lessons of 3 hours. After the theory is explained, there is time to practice. | |||
==DAY 1== | |||
Basic html elements: div, span | |||
Colors: RGB model | |||
Introduction to CSS: positioning, z-index, color, width, height, border, margin, padding, box-shadow, gradient, transform, border-radius, float | |||
Practice | |||
==DAY 2== | |||
Web fonts: existing formats and ways to use it. | |||
Basic html elements: h1-h6, p | |||
CSS: font-family, text-align, line-height, letter-spacing, text-shadow | |||
Practice | |||
==DAY 3== | |||
Media queries. | |||
Practice | |||
[[File:Browser canvas day2 (1).pdf]] | [[File:Browser canvas day2 (1).pdf]] |
Revision as of 13:13, 24 June 2015
Overview
Making a HTML page that looks more like a poster than a website - and giving students a basic introduction to HTML and CSS. These are the course main goals.
The course does not require any previous HTML or CSS knowledge. Note: this course was formerly known as ‘Making Web Posters’
Learning Achievements
– basic HTML/CSS skills, the CSS box model and how different browsers deal with that – how to accommodate a layout in various screen sizes and how to use typography on the web
Planning
The course is divided into 3 lessons of 3 hours. After the theory is explained, there is time to practice.
DAY 1
Basic html elements: div, span Colors: RGB model Introduction to CSS: positioning, z-index, color, width, height, border, margin, padding, box-shadow, gradient, transform, border-radius, float Practice
DAY 2
Web fonts: existing formats and ways to use it. Basic html elements: h1-h6, p CSS: font-family, text-align, line-height, letter-spacing, text-shadow Practice
DAY 3
Media queries. Practice