
Following are a number of tips for basic Web design. When constructing a portfolio, beginning Web developers should consider some of these essential rules for design. Once you’ve mastered the basics, you can explore advanced techniques. Start simple for now, however, and improve your site over time.
Layout
- Use a consistent layout and design. For the most part, your banner, navigation and footer should be the same on every page. The content area of each page can change.
- Keep navigation simple and consistent. Side navigation and top navigation are accepted standards. Learn to use those before trying “experimental” structures.
- Remember that a picture is worth a thousand words. If you can communicate with photos and clear icons, you should.
- If you can use text for links, however, you should. Unnecessary images make your layout load slower.
- Try to have central focus on every page. Often this is a photo, a chart/infographic or a quote.
- Don’t be afraid of empty space. You don’t have to fill in everything.
- Try to maintain some balance and symmetry to your page.
- Center-aligned is very popular. Consider this option with your layout over left aligned if possible.
Color
- Use no more than four or five colors. Choose a color scheme and stick with it.
- Consider the concepts of color theory. Many color scheme generators can help:
- Use high-contrast colors for text. You can’t go wrong with black text on a white background.
- Whenever possible, use table background color instead of a graphic. Solid table background colors don’t make your page load as slowly as images.
Typography
- Use no more than three or four typefaces. Remember that text on the Web is dependent on the viewer’s computer, not the designer’s. Stick with universally accepted typefaces.
- Convert text to graphics if you must use unusual display typefaces.
- Establish a consistent style for
- Headlines
- Body text
- Navigation
- Small text (such as for footers)
Resources
0 Responses
Stay in touch with the conversation, subscribe to the RSS feed for comments on this post.