Resources
Lectures
Troubleshooting
Try to be patient when writing code, so much of programming is debugging – typos are one of the most common errors! If you find yourself stuck, try breaking your issue down into smaller, more manageable parts.
Search Google or Stack Overflow for how to solve those parts, one at a time. While frustrating, these bugs will may lead you to discover something new you would not have considered before!
Naming
Because of the way special characters and spaces are treated in URLs, it’s best to avoid them when naming files and folders for web. It’s also recommended to use all lowercase, because of the way some systems may or may not be case-sensitive.
- Rename
Filename Final.html
→filename-final.html
Downloads
- To edit code, download Sublime Text.
- For Browsing the web and viewing our pages, use Google Chrome
we’ll use Chrome exclusively because of its devtools)
Online Tools
- Figma for image/media generating, editing, and prototyping
- Glitch for online coding
- Zoom for video calls
Debugging
Getting Started
- mozila: Getting started with the web: Dealing with files
- mozila: Getting started with the web: So what is HTML?
- mozila: Getting started with the web: So what is CSS, really?
More
Books
While much of the information is available online, it's always nice to have a hard-copy reference. Here are some options:
- HTML & CSS | Javascript & JQuery by Jon Duckett
- CSS: The Definitive Guide by Eric Meyer
- Eloquent Javascript (Available for free online)
- Interactive Data Visualization for the Web by Scott Murray (Available for free online)
Basic reading
- What is a URL?
- About Semantic HTML elements
- A good primer: Chapter 3 of Scott Murray's Interactive Data Visualization for the Web
- CSS inheritance
Tools and Tips
- Responsive previewer
- Working with SVG
- What goes in your head
- Why Coding Style Matters on Smashing Magazine (with useful list of validators)
- Writing your Best Code: HTML/CSS coding best practices and list of resources
- Sublime Text unofficial documentation & keyboard shortcuts
- Sublime Text 2 tutorial videos.
- Using Style Tiles