Web Design sites

Miscellaneous design sites:

• 90+ Dev & Design Resources for Building Better Sites and Apps (Mashable)
• Open Source Web Design - Download free web design templates.
• Attack of Design
• Smashing Magazine
• A List Apart
• Webdesigner Depot
• CSS Zen Garden
• IE6 Countdown (by Microsoft, no less!)

BlogEngine.NET:

• Building BlogEngine.net 1.1 Themes
• BlogEngine gallery

Fonts:

• Google Font API (and Open Source fonts)
• Open Source Ampersands (yes, just ampersands!)
• The League of Moveable Type
• LinuxLibertine / Libertine Open Fonts Projekt

Diagramming and Wireframing software:

• Balsamiq Mockups (desktop, web app, plug-in for FogBugz and others)
• Mockingbird (online - subscription)
• ForeUI (Windows, OS X, Linux)
• LucidChart wireframing (also Mind Mapping, sitemaps, flowcharts, etc)(online - subscription)
• Axure (Windows, Mac)
• Mockup Screens (Windows, Mac)
• iPlotz (online - subscription)
• FlairBuilder (desktop - subscription or purchase)
• Pencil (free Firefox add-in, also in standalone for Windows and Linux)
• What Is the Best Web Prototyping Tool? (discussion at StackOverflow, 2010)
• 16 Design Tools for Prototyping and Wireframing (Gary Barber/Sitepoint, 2009)
• Diagram Designer (Windows - Open Sourcce)
• Dia Portable (Windows - Open Source)

HTML prototyping:

• An Introduction to HTML Prototyping (Sam Quayle/SpeckyBoy, 2010)
• How 37signals Does Prototyping (@Rahul/Quplog, 2010)
• Just Build It (Garrett Dimon, 2006)
• HTML Wireframes and Prototypes (Julie Stanford, 2003)

Designers:

• Stephen Caver (designer for Happy Cog)

UI/UX sites:

• UX Magazine
• Cennydd Bowles
• UX Movement
• 52 Weeks of UX
• Bokardo (Joshua Porter) (co-founder of 52 Weeks of UX)
• Francisco Inchauste
• Design View (Andy Rutledge)
• UX Crank (D.S. Willis)
• Andy Budd
• Android Interaction Design Patterns
• Baymard Institute articles: Form Field Usability, Drop-Down Usability, etc
• Jakob Nielsen

Usability testing:

• 4 Forgotten Principles of Usability Testing

Javascript:

• Mozilla Developer Network Javascript Guide
• Javascript Garden (not for beginners)
• Three Routes to Spaghetti-Free Javascript

Social Media links:

• HOW TO: Add Social Sharing Buttons To Your Website

Examples and Tools from Sexy Web Design, by chapter:

1. Interfaces Are Sexy
2. Research
3. Structure
4. Navigation and Interaction
5. Aesthetics
6. Deliverables

Interfaces Are Sexy

• 37signals' Basecamp
• Fall For Tennessee (offline)
• Dara's Garden
• Erratic Wisdon
• Mint
• 280 Slides
• Volunteer Lawn
• Decor8
• I Love Typography
• Jason Santa Maria
• Revyver
• Kayak

Research

• Web Directions North / Unplugged 2011 / @media / South
• Sidebar Workshops
• dConstruct (now d/construct - not same site?)
• South by Southwest Interactive
• An Event Apart
• A List Apart
• Patrick Haney's Design Inspiration
• Web Design Inspiration Flickr pool (administered by Patrick Haney)
• Design Nerds Flickr pool
• Vandelay Design's 99 Flickr groups for designers
• UI Pattern Factory
• Elliot Jay Stocks' photostream on Flickr
• Factory Joe (Chris Messina) - and Flickr page
• Pattern Tap's UI examples
• Chris Messina's design patterns on Flickr
• LittleSnapper (tool)
• Snagit (tool)
• Evernote (tool)

Structure

• ConceptDraw Mind Map
• WriteMaps
• Paper prototyping (by Shawn Medero at A List Apart)

Navigation and Interaction

• Tastebook
• Happy Cog
• 13 Creative
• Deluge Studios
• Emblematiq (different nav design from book)
• Cameron.io (no longer online)
• Movable Type
• SitePoint
• Web Directions North Speakers
• Media Temple knowledgebase
• Get Satisfaction (different search design from book)
• Design Reviver
• Jesus Rodriguez Velasco (screenshot at designflavr.com) (sample at beautiful2.com)
• Media Temple (book example is Web Hosting drop-down)
• Designsensory
• Coda (by Panic)
• Moo.fx
• Web Designer Wall
• Web Form Design: Filling In the Blanks (book by Luke Wroblewski)
• WEB Design: E-Commerce (book)

Aesthetics

• The Principles of Beautiful Web Design, first chapter
• Golden Ratio Calculator
• W3 Schools browser use / resolution statistics
• TheCounter browser use / resolution statistics
• CSS Layouts: The Fixed, The Fluid, The Elastic (article by Mike Cherim)
• Fixed, Fluid, or Elastic Width Layouts? (by Anup Shah)
• Sursly (Tyler Finck)
• 960 Grid System (Nathan Smith)
• Yahoo User Interface Library's Grid
• Blueprint
• Jeffrey Zeldman
• Johnny Hollow
• A Tennessee Winter
• Brunet-Garcia
• A Practical Guide to Designing for the Web (book by Mark Boulton)
• The Color Scheme Generator 2
• Kuler (Adobe)
• COLOURlovers
• The Web Designer's Idea Book (book by Patrick NcNeill)
• Silverback
• Maxvoltar (Tim Van Damme)
• ALZselftest
• Photoshop Level tutorial from Creative Pro magazine
• Picture Correct
• Deliberate blur examples from Digital Photography School blog
• article on cropping by Mark Boulton at 24ways
• Joyent
• Squared Eye
• Raka Creative
• Threadless
• article on borders by Nick La at Web Designer Wall
• Eight Definitive Font Stacks (SitePoint article)
• Revised Image Replacement by Dave Shea (font replacement)
• sIFR (scalable Inman Flash Replacement) - how-to article
• Shaun Inman
• sIFR Lite
• Screen Reader Visibility discussion as CSS-Discuss
• IE: Making Web Fonts Work (font embedding)
• SimpleBits
• I Love Typography
• designr.it
• Destroy the Web 2.0 Look (article by Elliot Jay Stocks)
• free Museo font from Jos Buivenga

Deliverables

• CSS Sprites: Image Slicing's Kiss of Death - article at A List Apart
• Better Nav Image Replacement (article by Elliot Jay Stocks)
• Writing an Interface Style Guide - article at A List Apart
• Photoshop swatches tutorial at TechTutor.tv

Next category: