Skip to content

Instantly share code, notes, and snippets.

@leesc22

leesc22/design_checklist.md

Created August 21, 2018 02:34
Show Gist options
  • Save leesc22/b855a6708dbd8a7db9094ec512a472ee to your computer and use it in GitHub Desktop.
Save leesc22/b855a6708dbd8a7db9094ec512a472ee to your computer and use it in GitHub Desktop.
Download ZIP
Design Checklist
Raw
design_checklist.md

https://dev.to/aspittel/a-web-design-crash-course-from-one-non-designer-to-another-2o2m

Color

  • Uses consistent colors throughout
  • Uses non-clashing colors
  • The color choice makes sense for the business purpose of the site

Text

  • The text has padding on both sides.
  • The line-height is 1.5-2.0
  • There's padding between paragraphs
  • If your headings are in all caps, there's increased word spacing
  • Blocks of text are un-justified
  • Blocks of text are left-aligned
  • Sans-serif fonts are used for body text
  • A maximum of two fonts are used - one decorative or serif and one sans-serif
  • body text isn't pure black on white
  • body text is 16-18px and is scalable

Backgrounds

  • Use a pattern or simple image
  • A text shadow is used to make headings readable
  • The background isn't too bright

Calls to Action

  • Important information is highlighted in order to attract user interaction
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment