|
|
Home | Audio | DIY | Guitar | iPods | Music | Brain/Problem Solving | Links| Site Map
This work is licensed under a Creative Commons License.
Graphic Design Index
One of the most important components in designing a Web site, is to use proper graphic design techniques. One of the best sites availble in introducing graphic design is www.webdesignfromscratch.com We are using their pages primarily because we feel that this is such a valuable resource and use it to teach students in our Web Design classes. The problem is that we often run into problems trying to access pages at Scratchmedia, since they are located in Europe. We have contacted them, and have thrown them some financial support. We hope to increase our financial support to them in the future. Likewise, we would encourage all of our readers who are not students in the classroom to visit them and provide them with some financial support.
Graphic design basics
- Clarity in web page design
- Making a clear web page depends on making the most important elements appear important, less important stuff less important, related stuff look related, and different stuff look different.
- Colour
- General guidelines on how to use colour in web pages.
- Contrast
- The importance of contrast in graphic design for the web
- Readabilty
- Making pages easy to read by design
- Effective text
- The strengths of using HTML text rather than words as graphics in web design
- Imagery
- How to use imagery to best effect
- Attention Map
- A low-tech tool for planning page layout, helping you plan what your page should do before you get your hands dirty
Page layout
- Layout for web page design
- Overview of the major graphic design devices
- Containment
- Containment is a layout tool that says visually "This thing is part of that"
- Alignment
- Using alignment in visual design for the web to associate related elements
- Grouping
- Associating elements through relative positioning in space
- Rhythm and repetition
- A further technique for associating elements is through repeating common styling
- Logical order
- Importance of logical order of visual components in web page design
Visual techniques
- 3D Effects in graphic design for the web
- Guidelines on how to use 3D effects effectively in graphic design for the web
- Logo design
- The four attributes of an effective logo: shape, presence, weight, and contrast
- Text-based logos
- Why text-based logotypes are very effective
- Favourite logos
- A collection of my favourite logos from around the web, with analysis of why I think they work.
Case studies
- Artorg: Worked example
- Tweaking the layout to ehance the user experience of a nice community site for graphic artists
- Case study: Business Improvement Network
- Applies a totally new look and feel to the web site of a business networking organisation
- Case study: Foruse
- A new clean look and a simpler tone of voice for the site of a usabilty engineering company
Home | Audio | DIY | Guitar | iPods | Music | Links | Brain and Problem Solving | Site Map | Contact
