HTML & CSS Resources

---

Introduction

• Codecademy Web Fundamentals
• 30 Days to learn HTML and CSS
• CSS Guidelines from Harry Roberts
• A Beginner's Guide to HTML & CSS
• treehouse Websites
• Dash Tutorials
• OOCSS
• Web Standards, CSS, HTML, Javascript
• An introduction to HTML5, CSS3 and responsive design
• Things you may not have known about HTML & CSS
• Learning principles for improving your CSS
• CSS Architecture
• A Beginner’s Guide to Leaner CSS

---

CSS

• Troubleshooting CSS
• OOCSS
• Defensive HTML and CSS
• 4 ways to create CSS that's modular and scalable
• Writing efficient CSS selectors
• A Detailed Look at the z-index CSS Property
• What the Heck Is CSS Specificity?
• CSS Architectures: New Best Practices
• The worst Css practices
• Semantic CSS With Intelligent Selectors
• CSS Positioning 101
• Write less, do more: CSS Style
• OOCSS and RWD
• 3 Must-Learn CSS Techniques for Perfect Web Typography
• Code Smells in CSS
• CSS Tehniques you couldn't live without
• 5 Steps to Drastically Improve Your CSS Knowledge in 24 Hours

---

HTML

• About HTML semantics and front-end architecture
• Using semantic HTML
• Best practices for efficient HTML5 coding
• Top 10 HTML5 Resources
• Designing an HTML Newsletter that stands out
• Create a Contact Form in HTML5
• HTML5 forms introduction and new attributes
• What is HTML5 Capable of, Features, and Resources

---

IE

• 9 Most Common IE Bugs and How to Fix Them
• Browser Specific CSS Hacks

---

PSD to HTML

• A very detailed PSD to HTML Conversion
• Landing Page Conversion
• 43 PSD to XHTML, CSS Tutorials Creating Web Layouts And Navigation
• 20+ Best Tutorials to Convert Psd to Html/CSS

---

Responsive Design

• Responsive Web Design by Ethan Marcotte
• A Responsive Web Design Process
• Top 25 Responsive Design Tools
• Responsive Resources(Huge)
• Creating a Mobile-First Responsive Web Design
• Useful Resources and Tools
• Media Queries Tutorial
• Build a Responsive, Mobile-Friendly Website from Scratch: Getting Mobile
• Create A Responsive, Mobile-First WordPress Theme
• Building a better Responsive Website
• Notes to an Agency Starting Their First Responsive Web Project

---

Editor

• Improve Workflow in Sublime Text 2
• Perfect Workflow in Sublime Text 2

---

Tools

• Codepen
• Spritepad
• Layerstyle for generating css code
• CSS3 Generator
• Colorzilla Gradient Generator
• CSS Lint for debugging CSS
• Tiny PNG
• Custom Checkboxes with CSS
• CSS TV

---

Frameworks & Component Librarys

• Cardinal
• Semantic UI
• Magin CSS Animations
• HTML Kickstart
• Furatto
• UI Kit
• UI Box
• Fireshell
• Kraken

---

E-mail templates

• Premailer
• Ink
• HTML E-mail Boilerplate
• Create Responsive E-mails
• Antwort

---

Other resources

• Huge List of Frontend Development Tools
• Front-end performance for web designers and front-end developers

---