Web design and development began with static HTML sites, billboards on the Information Highway. Today, web design and development covers everything from basic dynamic websites and blogs to mobile web apps.

The following is a basic collection of web design and development resources and references applicable to the classes I teach on WordPress, web design, web development, blogging, web publishing, and related subjects.

• Web Design and Development
  • Web Design Theory and Research
  • Web Design Checklists
  • Web Design Tips
  • Web Design Architecture, HTML5, CSS3, Layouts, Wireframes, and Frameworks
  • Web Fonts
  • Coders and Hackers Tips and Techniques for Web Design, PHP, JavaScript, Web Apps, and more
  • Validation and Testing
  • Web Accessibility Resources
• Web Practitioner
  • Working with Clients
  • Professional Standards, Policies, and Skills
  • Questions to Ask Clients
  • Client Checklists
  • Statement of Work Agreements

---

Web Design Theory and Research

• A Two Factor Theory for Website Design (PDF in Google Docs)
• Thursday Theory: 6 Ways to Make Your Work More Original – PSDFan
• Thursday Theory: Common Web Design Mistakes People Keep Making – PSDFan
• Thursday Theory: The Importance of Perspective and Depth in Your Designs
• Thursday Theory: Using Movies as Design Inspiration
• Unconventional Sources of Design Inspiration
• 50 Totally Free Lessons in Graphic Design Theory – Psdtuts+
• A Look into Color Theory in Web Design
• Web Design Overview – Treehouse (Requires Flash)
• Beginner’s Guide to Responsive Web Design – Think Vitamin
• Designing for a Responsive Web – Webdesigntuts+
• How Clean is Your Web Design? – Webdesigntuts+
• The Gestalt Principle: Design Theory for Web Designers – Webdesigntuts+
• Web Design Theory – Webdesigntuts+
• Dark Patterns: Deception vs. Honesty in UI Design – A List Apart
• Demystifying Design – A List Apart
• Designing Fun – A List Apart
• Findings from the Web Design Survey, 2010 – A List Apart
• Personality in Design – A List Apart
• A List Apart: Articles: Responsive Web Design
• AskTog: First Principles of Interaction Design
• Jakob Nielsen on Usability for Mobile Sites and Apps – ClickZ
• How to Create “Touchable” Web Designs
• Factors Influencing Your Overall Website Design
• Why Inspiration Playing a Critical Role in Web Design
• Understanding the Theory of Minimalism in Web Design – Web Design – instantShift
• Material Designer – Design
• A Unified Field Theory of Design
• Graphic Design Theory: 50 Resources and Articles – Noupe
• Classic Graphic Design Theory
• Gestalt Principles of Perception
• Human-Computer Interface Design
• use it.com – Jakob Nielsen
• Papers and Essays by Jakob Nielsen
• 10 Heuristics for User Interface Design
• Clean Up Your Mess – A Guide to Visual Design for Everyone
• Web Site Development Life Cycle

Web Design Checklists

• mezzoblue – CSS Crib Sheet
• Web Design & Development Checklist – NetReach
• 50 Questions to Evaluate the Quality of Your Website – Search Engine Journal
• Essential Navigation Checklists for Web Design – SitePoint
• Website Check List (David Skyrme Associates)
• Common CSS Mistakes for a Beginner – CSS Bugs and Debugging Checklist – Soh Tanaka
• Comprehensive Web Design Checklist
• 45 Incredibly Useful Web Design Checklists and Questionnaires
• GUI Screen Design Checklist
• Step-By-Step Website Development – Check List – Lorelle on WordPress
• Web Design Best Practices Checklist
• The Official ‘Successful Website Checklist Challenge’ – CHROMATIC
• A solid web design checklist – DT Blog
• A Website Design & Development Project Plan Checklist / Template – Hobo
• Web standards checklist – Max Design
• Checklist for Better Forms
• Checklist for Better Web Graphics
• Design Checklist Before You Finalize Any Web Project – Mert TOL
• Web Redesign Checklist Part One from Web Pages That Suck – learn good web design by looking at bad web design

Web Design Tips

• 20 Reasons Why Your Website Design Sucks Part 1
• 20 Reasons Why Your Website Design Sucks Part 2
• Ancient Website Design Practices That Beginners Should Avoid Part 1
• Ancient Website Design Practices That Beginners Should Avoid Part 2
• 101 Five-Minute Fixes to Incrementally Improve Your Web Site – Inside CRM
• Tips for better web design — Visual28

Web Design Architecture, HTML5, CSS3, Layouts, Wireframes, and Frameworks

• A List Apart: Articles: Fluid Grids – A List Apart
• Make Your Mockup in Markup – 24 Ways
• 960 Grid System
• Web Design Iterations And Algorithms – Design Informer
• Yahoo YUI Grids CSS
• HTML5 Front End Development Framework – G5 Framework
• HTML5 Boilerplate – A rock-solid default template for HTML5 awesome.
• HTML5 Gallery – A showcase of sites using HTML5 markup
• Eric Meyer’s Archived Thoughts: CSS Reset Reloaded
• p.erkins CSS3 LESS Framework
• HTML5 Starter Pack by Radu Chelariu – Sickdesigner.com
• HTML 5 – Working Draft
• HTML 5 Visual Cheat Sheet by Woork
• 30 Useful and Cutting Edge CSS3 Text Effect and Web Typography Tutorials
• 20+ Useful CSS3 and HTML5 Frameworks, Tools and Templates
• Pros And Cons Of Using Frameworks
• 52framework – The framework from the future, HTML5, CSS3, and more!
• Blueprint CSS Framework
• Modernizr JavaScript Library for HTML5 and CSS3
• Touch The Future: Create An Elegant Website With HTML 5 And CSS3 – PVM Garage
• 10 Pixel Grid System — Visual28
• The All-In-One Entirely-Not-Alphabetical No-Bullshit Guide to HTML5 Fallbacks
• Grid Style In Modern Web Design: Showcase and Resources

Web Fonts

• The Elements of Typographic Style Applied to the Web – a practical guide to web typography
• Web Design Theory: Legibility and Readability – KLIF Media
• A Typographers Checklist – Green Boat House (PDF)
• More Meaningful Typography – A List Apart
• Typetester – Compare fonts for the screen
• Some Typographic Rules to Remember
• Font Tester – CSS Font Comparison Tool
• Font Squirrel – Create Your Own @font-face Kits
• 20 Best WordPress Typography Plugins To Enhance Readability

Coders and Hackers Tips and Techniques for Web Design, PHP, JavaScript, Web Apps, and more

• Modern Debugging Tips and Tricks – A List Apart
• Checklist for Securing PHP Configuration – Ayman Hourieh
• CakePHP
• Google Summer of Code – Google Code
• Google Project Hosting – Google Code
• Code Igniter
• jQuery
• jQuery Mobile
• External Links with CSS3 or jQuery
• Snippet Space iwebkit projects for iweb apps
• Install multiple versions of IE on your PC – TredoSoft
• Structured process you must know to develop a web application
• How to install and get started with SVN (Subversion) on Windows – WPCandy
• actiWATE – Free Web Application Testing Software
• DHTMLX Touch is an HTML5-based JavaScript library for building mobile web applications
• SimpleTest – Unit Testing for PHP
• Symfony Project