Web design principles

• Web design principles


  The general rules for the design of web based media that includes basic guidelines for the design of layouts and interaction design
• Visual language


  • Use a consistent template on each page with a uniform color scheme
  • Use contrasting color between text and background
  • Avoid large and small font sizes and many typefaces
  • Use common font style to similar items across the web pages
  • Make important links or menus more prominent in terms of color
  • Use high quality pictures
  • Use the rule of thirds for images
• Balance


  • There should be a balance distribution of heavy and light elements on the page
  • Proper alignment of text and images in a web page helps maintain consistency in design
  • Important information is placed near the top
  • The size of a button should be proportional to its expected frequency of use
  • Group similar things together in terms of shape, color, and shading
  • Create a pattern which will make your page easier to use, remember, and understand
• Paradox of choice


  • The more choices you provide the easier for others to choose nothing
  • You should eliminate unnecessary designs
  • Focus on the needs of the user
  • Design around context of multi-user in a multi screen in a multi device
• Focus on content


  • Match the content of the web page with its purpose
  • Content should be spellchecked
  • Content should be organized
  • There should be a clear delivery of content
  • Include images on your content not just pure text
  • Content should be updated
• Simplify


  • Follow a simple design
  • Keep the content simple
  • Use minimal animated graphics
  • Maintain a consistent look and feel across all web pages
• Grid based layout


  • Grids help the structure your design and keep your content organized
  • The grid helps to align elements on the page and keep it clean
  • The grid base layout arranges content into a clean rigid grid structure with columns, sections, that line up and feel balanced and impose order and results in an aesthetically pleasing website
• Load time


  • Waiting for a website to load will lose visitors
  • Users are likely to leave a site that is included within 3 seconds
  • To make load time effective, optimize image sizes, combine code in the central css or javascript file, and minify