good vs bad web design n.
Download
Skip this Video
Loading SlideShow in 5 Seconds..
Good vs. Bad Web Design PowerPoint Presentation
Download Presentation
Good vs. Bad Web Design

Loading in 2 Seconds...

play fullscreen
1 / 21

Good vs. Bad Web Design - PowerPoint PPT Presentation


  • 1696 Views
  • Uploaded on

Good vs. Bad Web Design. Graphic Design Tips. Use no more that three focal points. Big, medium, small Break the page into a few functional areas. Use colored areas to break up the page visually. Avoid using fonts set smaller than 12 point. Use standard computer system fonts for text.

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about 'Good vs. Bad Web Design' - Gabriel


An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
graphic design tips
Graphic Design Tips
  • Use no more that three focal points.
    • Big, medium, small
  • Break the page into a few functional areas.
  • Use colored areas to break up the page visually.
  • Avoid using fonts set smaller than 12 point.
  • Use standard computer system fonts for text.
  • Create style guides for a consistent look.
graphic production
Graphic Production
  • Build all Web graphics in 72 dpi.
  • Save graphics that have a mix of text, flat-colored graphics and photos as GIF files.
  • Save all purely photographic images as JPEG files.
  • Slice graphics into pieces and save each piece in either GIF or JPEG files to optimize performance.
navigation design
Navigation Design
  • Differentiate the visual design of non-clickable and clickable elements
  • Use rollover animation on buttons to enhance interaction and usability
  • Always place buttons in the same location on the page and don’t change their appearance
  • Always label icons and buttons by their function
visual design
Visual Design
  • Accomplish two things:
    • Look appealing
    • Show people how to navigate around the site
visual design1
Visual Design
  • Consistency is the key!
  • Home page layout
  • Subpage layout
    • http://www.lopuck.com/
    • http://www.resultswithstyle.com/default2.asp
    • http://www.apple.com/
color type graphics
Color, Type & Graphics
  • Choose colors that are appropriate to the subject matter.
  • Use a limited color palette.
    • Quicker delivery over the Internet
    • Smaller file size
    • No more than seven
color type graphics1
Color, Type & Graphics
  • Use fonts to set the mood.
  • Serif fonts
    • Stability, security, professionalism and longevity
    • Ex. mutual fund Web site
    • Large blocks of text
  • Sans serif fonts
    • Forward thinking, cleanliness and agility
    • Ex. advanced medical-imaging machines
    • Short blocks of text and headers
color type graphics2
Color, Type & Graphics

ACME Medical

Illuminating your future

with advanced medical technology.

ACME Medical

Illuminating your future

with advanced medical technology.

color type graphics3
Color, Type & Graphics
  • Mix fonts wisely.
    • Headings, subheadings, body text
  • Don’t use too many (< three).
color type graphics4
Color, Type & Graphics
  • Use graphic elements efficiently.
    • Big photos = Big files
    • Consider download time
  • Break up the page with graphics.
the grid system
The Grid System
  • Use a grid to lay out your Web page.
  • Limit to vertical or horizontal
    • http://www.idea.com/
    • http://www.awinfo.com/
establishing visual priority
Establishing Visual Priority
  • Equal size = equal importance
  • Your job to define the order of importance.
web critique
Web Critique
  • Audience
  • Purpose
  • Layout & Design
  • Page Names
  • Overall Quality

Oklahoma Wheat Commission

  • http://www.state.ok.us/~wheat/