web design and development
DESCRIPTION
Web Design and Development. Web Pages for the Real World. Color Scheme Readability Navigation Content Graphics. Speed Universal Access Page Size Page Layout Site Structure. Areas to Consider. Site Structure. Planning is the key Folder organization File naming 8.3 preferred scheme - PowerPoint PPT PresentationTRANSCRIPT
Areas to ConsiderAreas to ConsiderColor SchemeReadabilityNavigationContentGraphics
SpeedUniversal AccessPage SizePage LayoutSite Structure .
Site StructureSite StructurePlanning is the keyFolder organizationFile naming
8.3 preferred schemeno spaces or symbolsno caps or punctuation
Webs with links to and froLinks to outside sites use
target= attribute with value set to “_blank” .
Page SizePage SizeMinimum 800 x 600
fit most important information in area
Standard 1024 x 768maximum width, browser edgesless scrolling
1 ½ pages max lengthless vertical scrollingbetter for printinge.g., 900-1100 pixel length .
Page LayoutPage LayoutLoads left to rightLoads top to bottomNavigation: top & left (prefer text
links)Most important text information
at top (above fold)Body of text: top & leftLogos & other graphics: right or
further down page .
NavigationNavigationRedundant placement
left menutop and bottom of pagewithin written textlinked to images with
alternative text, alt=Clearly visible Limit choicesUse text labelsNo mystery meat!!! .
Color SchemeColor SchemeEvokes emotionSets toneEnhances lookAdequate contrastChoose a paletteIntegrate links,
backgrounds, text, borders, graphics and design elements .
ContentContentRelevant and relatedAccurateOriginalDepth and breadthOrganizedLinks to other resources .
ReadabilityReadabilityEasy to read fonts
style (normal, bold…)color (contrast)size (default 3)
Small blocks of textConcise sentencesBulleted/numbered listsUse <blockquote>Include some white space .
Speed (loading)Speed (loading)10 second limitMore text, fewer graphics
at firstLink to multimedia50k goal per pageConsider access
dial up, DSL, cableOptimize/compress files .
Universal AccessUniversal AccessSpecial software for
people with disabilitiesMore text, fewer pixLarger fontsLess content per page“Alt” text on graphicsMultiple versions of site.
GraphicsGraphicsLimit file sizeLimit screen size
link from thumbnailsJPG for photosGIF for cartoons72-96 dpi resolutionRelevantGood quality!
Web Resources on DesignWeb Resources on Designwww.webmonkey.comwww.visibone.com/colorlabwww.webpagesthatsuck.com/info.med.yale.edu/caim/manual/www.coolhomepages.com/www.useit.com/alertbox/9605.htmlwww.htmlhelp.com/