Skip to content

Latest commit

 

History

History
30 lines (20 loc) · 1.53 KB

README.md

File metadata and controls

30 lines (20 loc) · 1.53 KB

FEMs (Front End Masters) Tutorial Series

The FEMs Tutorial Series is a sequence of progressively more complex layouts that we will build in HTML/CSS. We'll start easy and ramp up into solving difficult problems. Feedback will be based around code reviewing pull requests, so we'll learn Git along the way as well.

Exercises

  1. Exercise 1: Duplicate Google's Layout
  2. Exercise 2: Duplicate Twitter Layout
  3. 2-column fluid width layout
  4. 3-column fluid layout
  5. reponsive layout

Useful Resources

Websites

  • Mozilla Developer Network (MDN): authoritative source for info
  • HTML5 Rocks: very helpful blog post about new HTML5/JS/CSS capabilities
  • CSS Tricks: very helpful articles on specific CSS techniques
  • Can I Use...: See what browsers support the HTML/CSS/Javascript you want to use
  • Modern.ie: Check your work on all those pesky versions of Internet Explorer
  • SMACSS: A method to keep your CSS clean and organized

Scripts / Libraries

  • Modernizer: JavaScript library that detects HTML5 and CSS3 features in the user's browser.

Browser Tools

  • W3Schools Hider: Chrome extension to hide w3schools.com from search results. Seriously, when you're Googling for answers click on the links to MDN instead.