Calentamiento zDefine yMi hermana yEl abuelo yMi prima yEl hijo único yEl tío yEl hermano mayor.
Design methods zDiscuss basic design concepts zApply lowest common denominator zDefine and indicate...
-
Upload
nathaniel-black -
Category
Documents
-
view
220 -
download
0
Transcript of Design methods zDiscuss basic design concepts zApply lowest common denominator zDefine and indicate...
Design methodsDiscuss basic design concepts Apply lowest common denominator Define and indicate when appropriate to
use frames and menusCompare and contrast intrapage, intrasite
and intersite hyperlinksDiscuss the rationale for selecting linksDiscuss the role of volatility in web designApply the linkage matrix to web design
Lowest Common Denominator
Resolution Pixels: 640x480 (or less)
Color depth 256 (or less) Netscape palette: 216 colors Perhaps most applicable for non-
developed countries
Elements in Creating a Web Site
Content text and artwork effectiveness and affectiveness something compelling
DesignProgramming
TextEffective
complete accurate easy to read clear useful to at least one defined audience concise
Balancing act
Text Hints
Be specific when it is to your advantage “We have been in business 26 years” vs
“We have been in business a long time”
Use active voice “You will receive a discount” vs.
“A discount will be given to you”Use logical groupings
location, alphabetic,time, etc
Text Hints (cont)
Layout (alignment)Typeface
limit to 2 or 3 on a pageType size
72 points in an inch 8 point type - minimum 12-18 point - bulk of screen
Color
Text Arrangement
Proximity volatility, relationship
Alignment centered for effect left aligned for standard columns for long passages
ContrastRepetition
Text: Contrast and Repetition
Identify focal pointMake differences starkAvoid underlining and boldfaceUse serif typeface for body and sans
serif for headersUse color for contrastUse repeated, consistent use of colors
Page FormattingMenus
fast to load columns (indented), tables
Hot regions (i.e., parts of store)Frames
i.e., menu, header, details allow for simultaneous display for all browsers supporting HTML 3.0 often need more screens and complex navigation
Home Pages
Greet usersHave catchy headlineGive overview of things to followInclude all company’s key informationList main areas you can go from thereDon’t put favorite sites on home pageDon’t ignore text-based Web users
Linkage and Web Design
Intrapage hyperlinks good for longer pages bookmarks
Intrasite hyperlinksIntersite, or free, hyperlinks
Intrasite LinksPurpose
Compose meaningful threads Provide links between business relationships Provide alternative to intrapage linkages (150 lines
upper limit/page; 2-3 screens/page)
Selection factors Ease of maintenance Use Load time (>15 secs) Number of screens, levels (<4)
Intersite Links
Search for free links should be accurate, complete,
related, compatibleAdd information for customerMust be checked periodicallyAvoid free links on home pageMay impact impression
Linkage RulesUse hyperlinks wellA page with no links or graphics is
boring Intrapage links with more than150 lines Intrapage links every 10-20 lines
Too many hyperlinks One or two links per paragraph 7 +/- 2 links per page (except lists or products)
Use linkage matrix
Linkage Guidelines
Be concise, direct and accurateConsider your sponsor’s needsConsider link colorsrelate to one or more specific
user groups (one or more threads)
More Hints for Creating Web SitesUse icons to create clear navigational paths
with a theme (but also include text-based links)
With storefronts, give your customers a way to pay order form toll-free telephone number fax line
Return button at bottom of each pagePut contact name,address at bottom
Hints for Using Multimedia on Web SitesThe use of multimedia should match the
needOnly use quality photos
use clipart, saved images (noncopyrighted) if photos aren’t good
cartoons are good for presenting socially taboo subjects
Use audio sparinglyDon’t use too much bandwidth
100K or less
Still More Hints for Using Multimedia on Web Sites
Still graphics logo on website smaller version of logo on main page avoid “angry fruit salad” don’t clutter
Moving graphics save movies at ftp site bullets and borders can attract attention use seasonal themes in bullets and borders
Steps in Creating Web PresentationsStoryboardingPrototypes
evaluating threads evaluating multimedia proving a design concept works
Walkthrough testing headings and hyperlinks scrolling (6x4 inches or 640-480 pixels) - try to keep everything on screen fully visible disclaimers, update and contact info