It is up-to designer how he perceives the layout, colors and elements which requires in-depth of experience in analytical skills of design which is called aesthetics. A designer himself has to see why the design is good and why the design is bad and when he overcomes this, he will see the difference in quality all the ways which will lead him! However, apart from this, below are some key elements that a web designer can consider while designing a layout.
Lines
- Increase readability
- Improve content presentation
- Organize content in better fashion
- Various styles of lines – Horizontal / vertical, Dotted / solid,Dashed / double
Shapes
- Controls the outlook of design
- Dependency on rest of the elements of design like logo, colors, subject
- Various types of shapes – Rounded, Square
Textures
- Useful to get feel of the subject
- Creates contrast or add depth to the design
Fonts
- System fonts are recommended
- Standard sizes
- Avoid bold unless required in the body content, it make users to jump directly to the bold content and they skip the other important things
- Avoid CAPS in multiple words together – reduce the readability
Colors
- Least important element, not mandatory
- Start with gray scale and enhance with color light or heavy color additions to create contrast and improve the presentation
- Use complimentary colors
Harmony
- Eye Movement is important
- Show what you need to show
- Achieve it using the above elements
- Website with good design doesn’t attract users if required harmony is not there since it confuses users
Rhythm
- Consistency is important to make users engage in the same mindset
- Use the important elements repetitively so that they leave impression to users memories
Usability
- Use Advanced Features
- Ajax, CSS, JQuery – better user experience to make users visit the page again
- User-friendly navigation through out the site
- Use breadcrumbs
- Use bookmark for lengthier pages
- Avoid Popups – disturb users to view the page content
Layout Structure
- Work on wireframe (outlined sketch using blocks) to better understand the flow (harmony) of the design and content organization
- Use 2-3 columns or maximum 4 columns
- Information Architecture
- Split up the stuff
- Provide ways for people to find their way through it to get what they want.
Web 2.0 Elements
- Simplicity
- Central layout
- Fewer columns
- Separate top section
- Solid areas of screen real-estate
- Simple navigation
- Bold logos
- Bigger text
- Bold text introductions
- Strong colors
- Rich surfaces
- Gradients
- Reflections
- Cute icons
- Star flashes
