Creative Exploration
The creative media resources on this site are continually growing and expanding, just like the tools, technologies, and best practices used by industry professionals, so please feel free to mark this page as your base camp.
HTML Basics: Elements and Syntax
What Project Should I Choose?
Intro to Web Hosting
Intro to Design Patterns
Intro to Front-end Build Tools
Web Layout Techniques & Strategies
JS Basics: Functions and Syntax
Level Up +
Intro to Web Animation Techniques
The Box Model
Typography for the Web
How to Begin Planning
Web Design Terminology: A Primer
Iterative Design
Git-based Workflows using Github
Quality Assurance Checklist
Inspiration
Intro to CMS via WordPress
Intro to Node.js and npm
Design Systems
Intro to SASS via PrePros
CSS Basics: Selectors and Syntax
Intro to Frontend Web Development
The Web Design and Development Process
Project Brief
Code a Simple Web Page with CSS
Code a Simple HTML Web Page
Set Summer Goals
Create a Course Web Site
Draft a Conceptual Plan
Create a Featured Projects Portfolio Site
Markup Text with HTML
Positioning and Layout Tests
Typography Specimen Tests
Create a Simple Image Grid Portfolio Site
Design Your Resume
U.S. Web Design Standards
StatCounter Global Stats
Interaction Design Foundation
Nielsen Norman Group
Usability.gov
Don’t Make Me Think by Steve Krug
Swiss Graphic Design
Designing with Web Standards
Graphic Design: A Concise History
Animation at Work
The Elements of Typographic Style
HTML & CSS
The Design of Everyday Things
Butterick’s Practical Typography
Javascript & JQuery
Homepage Usability: 50 Websites Deconstructed
Big list of web design related people:
- Donald Norman – https://jnd.org/
- Jakob Nielson – https://www.nngroup.com/people/jakob-nielsen/
- Jeffrey Zeldman – http://www.zeldman.com/
- Jeremy Keith – https://adactio.com/
- Eric Meyer – https://meyerweb.com/
- Ethan Marcotte – https://ethanmarcotte.com/
- Chris Coyier – https://chriscoyier.net/
- Dave Rupert – https://daverupert.com/
- Jen Simmons – https://jensimmons.com/
- Rachel Andrew – https://rachelandrew.co.uk/
- Andy Bell – https://bell.bz/, https://piccalil.li/
- Adam Argyle – https://nerdy.dev/
- Andy Clarke – https://stuffandnonsense.co.uk/
- Val Head – https://valhead.com/
- Sarah Drasner – https://sarahdrasnerdesign.com/
- Brad Frost – https://bradfrost.com/, https://designtokenscourse.com/
- Michael Beirut – https://www.pentagram.com/about/michael-bierut
- Jason Pamental – https://ethanmarcotte.com/
- Jason Santa Maria – https://jasonsantamaria.com/
- Zach Leatherman – https://www.zachleat.com/
- Elliot Jay Stocks – https://elliotjaystocks.com/
- Scott Jehl – https://scottjehl.com/
- Remy Sharp – https://remysharp.com/
- Richard Rutter – http://clagnut.com/
- Nicolas Gallagher – http://nicolasgallagher.com/
- Una Kravetts – https://una.im/
- Chen Hui Jing – https://chenhuijing.com/
- Chris Ferdinandi – https://gomakethings.com/, https://vanillajsguides.com/, https://vanillajsacademy.com/, https://vanillajstoolkit.com, https://vanillajspodcast.com/, https://kelpui.com/
- Josh Comeau – https://www.joshwcomeau.com/ (amazing well crafted blog posts)
Smashing Magazine Email Newsletter
UI Animation Newsletter
TLDR
Web Designer Depot Newsletter
Typewolf
List of Online Learning Sites
- Jen Simmon’s HTML Essential Training course on LinkedIn Learning (FREE)
- Wes Bos’s Courses
- JavaScript 30 (FREE)
- What the Flexbox? (FREE)
- CSS Grid (FREE)
- Ethan Marcotte’ Designing Accessible and Responsive Websites course via The Gymnasium (FREE)
- Frontend Masters Courses
List of Online Surveys (for usage stats)
- Design Tools Surveys – 2022
- State of CSS
- State of JS
- Browser Stats – GS Stat Counter
- CSS Tricks
- Can I Use
- CSS Dev Conf
- WordPress.org
- WordPress.com
- Display Posts Shortcode
- Insert Pages
- SiteOrigin Page Builder
- Responsive Screenshots
- Am I Responsive
- Golden Ratio Typography Calculator
- PSD Covers
- 12 Principles of Animation
- Fonts In Use
- Cody House
- Little Snippets
- Animated Flexbox
- Codrops
- Font Pairing Suggestions
- Daily UI Design Challenge
- Mockup Templates
- Premium Pixels
- Graphic Pear
- Adobe Color
- Site Inspire
- MarkSheet
- Jeffrey Zeldman 20 years of Web Design
- The Grid System
- Coursera
- Student Work
Videos & YouTube Channels
- Youtube Channels
- Layout Land by Jen Simmons (coded layout lessons)
- Keyframers (coded web animation)
- Chris Coyier (CSS-Tricks screencasts)
- A List Apart (conference talk videos)
- JamStack Conf (conference talk videos)
- The Futur (design lessons)
- Level Up Tutorials by Scott Telinski (Javascript lessons)
- Wes Bos (Javascript lessons)
Golden Ratio Typography Calculator
Graphic Design: A Concise History
Typography for the Web
I Love Typography
The Elements of Typographic Style
Typewolf
Typography Specimen Tests
Swiss Graphic Design
Art of the Menu
Smashing Magazine Podcast
Code a Simple HTML Web Page
JS Basics: Functions and Syntax
Typography Specimen Tests
The Web Design and Development Process
Smashing Magazine
Code a Simple Web Page with CSS
Designing with Web Standards
CSS Basics: Selectors and Syntax
HTML Basics: Elements and Syntax
Quality Assurance Checklist
Smashing Magazine Email Newsletter
Sass
Netlify
ScrollOut
Intro to Web Animation Techniques
Shop Talk
Positioning and Layout Tests
HTML & CSS
Intro to Web Hosting
TLDR
Create a Simple Image Grid Portfolio Site
Figma
Github
Create a Featured Projects Portfolio Site
CSS Podcast
Create a Course Web Site
The Box Model