Course Time Machine

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.

The Hampster Dance website in 1999 in Netscape Navigator 4.04. Screenshot taken from YouTube - Web Design Museum

Program

Class 1

Demos

1. Websites in the 90's
   1. Take a look at websites made in the 90's
   2. Quiz question: What is the first item ever sold on the web?
   3. What do you notice changing over time? Does the content and audience change? And how about the design?
2. Follow along HTML / CSS

Tasks

1. Try out
   1. text-align
   2. font
   3. font-family
   4. font-size
   5. font-stretch
   6. font-style
   7. font-weight
   8. height
   9. margin
   10. opacity
   11. padding
   12. color
   13. line-height
   14. visibility
   15. border
   16. box-shadow
   17. text-shadow
   18. background
   19. filter
   20. cursor
   21. text-shadow
   22. transform
   23. transition
   24. position
   25. perspective
   26. grid
   27. columns
   28. animation

Class 2

Demos

1. BRUTALIST
   1. Take a look at BrutalistWebsites.com
2. Code
   1. Installing Live Share
   2. Classes
   3. CSS grid
   4. Position absolute
   5. Fonts from Google Fonts

Tasks