Difference between revisions of "Course Time Machine"
From Publication Station
VKranendonk (talk | contribs) |
VKranendonk (talk | contribs) |
||
| Line 20: | Line 20: | ||
## [https://www.w3schools.com/cssref/pr_font_font.asp font] | ## [https://www.w3schools.com/cssref/pr_font_font.asp font] | ||
## [https://www.w3schools.com/cssref/pr_font_font-family.asp font-family] | ## [https://www.w3schools.com/cssref/pr_font_font-family.asp font-family] | ||
font-size | ## [https://www.w3schools.com/cssref/pr_font_font-size.asp font-size] | ||
font-stretch | ## [https://www.w3schools.com/cssref/css3_pr_font-stretch.asp font-stretch] | ||
font-style | ## [https://www.w3schools.com/cssref/pr_font_font-style.asp font-style] | ||
font-weight | ## [https://www.w3schools.com/cssref/pr_font_weight.asp font-weight] | ||
height | ## [https://www.w3schools.com/cssref/pr_dim_height.asp height] | ||
margin | ## [https://www.w3schools.com/cssref/pr_margin.asp margin] | ||
opacity | ## [https://www.w3schools.com/cssref/css3_pr_opacity.asp opacity] | ||
padding | ## [https://www.w3schools.com/cssref/pr_padding.asp padding] | ||
color | ## [https://www.w3schools.com/cssref/pr_text_color.asp color] | ||
line-height | ## [https://www.w3schools.com/cssref/pr_dim_line-height.asp line-height] | ||
visibility | ## [https://www.w3schools.com/cssref/pr_class_visibility.asp visibility] | ||
border | ## [https://www.w3schools.com/cssref/pr_border.asp border] | ||
box-shadow | ## [https://www.w3schools.com/cssref/css3_pr_box-shadow.asp box-shadow] | ||
text-shadow | ## [https://www.w3schools.com/cssref/css3_pr_text-shadow.asp text-shadow] | ||
background | ## [https://www.w3schools.com/cssref/css3_pr_background.asp background] | ||
filter | ## [https://www.w3schools.com/cssref/css3_pr_filter.asp filter] | ||
cursor | ## [https://www.w3schools.com/cssref/pr_class_cursor.asp cursor] | ||
text-shadow | ## [https://www.w3schools.com/cssref/css3_pr_text-shadow.asp text-shadow] | ||
transform | ## [https://www.w3schools.com/cssref/css3_pr_transform.asp transform] | ||
transition | ## [https://www.w3schools.com/cssref/css3_pr_transition.asp transition] | ||
position | ## [https://www.w3schools.com/cssref/pr_class_position.asp position] | ||
perspective | ## [https://www.w3schools.com/cssref/css3_pr_perspective.asp perspective] | ||
grid | ## [https://www.w3schools.com/cssref/pr_grid.asp grid] | ||
columns | ## [https://www.w3schools.com/cssref/css3_pr_columns.asp columns] | ||
animation | ## [https://www.w3schools.com/cssref/css3_pr_animation.asp animation] | ||
Revision as of 08:50, 30 September 2022
Welcome to the Time Machine course.
The Time Machine consists of two classes in which we introduce basic HTML and CSS skills. We start of in The Sh***y 90's, building websites from back in the day. We then fast-forward, via the fourth dimension, to the BRUTALIST design period.
Screenshot of the recreated page of the first website. Photograph: Rao, Achintya © 2019-2022 CERN
Program
Class 1
Demos
- Websites in the 90's
- Take a look at websites made in the 90's
- Quiz question: What is the first item ever sold on the web?
- What do you notice changing over time? Does the content and audience change? And how about the design?
- Follow along HTML / CSS
Tasks
