DEV Community

avery
avery

Posted on

12. Web Design School - Create a Website that People Love

#webdev #beginners #programming #fullstack

BootCamp by Dr.Angela

1. Introduction to Web Design

  • Core Principles : Colour Theory, User Interface (UI) Design, Typography, User Experience (UX) Design

2. Understanding Colour Theory

  • Moods of Colors : Red(Love, Energy, Intensity), Yellow(Joy, Intellect, Attention), Green( Freshness, Safety, Growth), Blue(Stability, Trust, Serenity), Purple(Royalty, Wealth, Femininity)
  • Combining Colors : Use harmonious color palettes, Balance contrast and consistency

3. Understanding Typography and Choosing Fonts

  • Font Categories
    • Serif : Minion Pro (Traditional), Trajan (Stable), Baskerville (Respectable)
    • Sans-Serif : Helvetica (Sensible), Avenir (Simple), DIN (Straightforward)
    • Script : Freestyle Script (Personal), Adios Script Pro (Creative), Snell Roundhand (Elegant)
    • Display : VAG Rounded (Friendly), Gin (Loud), Thirsty Rough (Amusing)
    • Modern : Sackers Gothic (Stylish), Gotham (Chic), Futura (Smart)
  • Readability : Open shapes, Ample inter-character spacing, Unambiguous letterforms, Varying proportions
  • Best Practices
    • Use no more than two fonts per website
    • Combine fonts using : Similarity (same mood or era), Contrast (serif vs sans-serif, different weights)

4. Managing Attention with UI Design

  • Visual Hierarchy : Colour, Size, Layout (consistent alignment and grid usage), White space, Target audience

5. User Experience (UX) Design

  • Principles : Simplicity, Consistency, Reading patterns(F-layout(text-heavy pages), Z-layout (landing pages)), Responsive design (all platforms), Ethical design(Don’t misuse user attention)

6. Web Design in Practice

Top comments (0)