Web Site Design Rules 17 Rules A Welldesigned

Web Site Design Rules 17 Rules

A Well-designed Web Site Attractive and pleasing to look at and read l Well organized l Self-explanatory l ¡ User should not have to look far to know message Text and graphics that are carefully linked to each other l Design and content that are appropriate for targeted audience l

Rule 1 l Your Web Site Should be Easy to Read and be Consistent Throughout ¡ ¡ ¡ ¡ Navigational structure that is easy to navigate Complementary color scheme Graphics that are consistent in look and feel throughout Web site Text that is consistent in size, color, alignment, easy to read Hyperlinks work properly and easily accessible to user Not contain background colors that make text hard to read or strain user’s eyes Keep look and feel of all elements in your Web site the same

Rule 2 l Know Your Target Audience ¡ Determine single most important message your Web site should convey ¡ Focus on that theme

Rule 3 l Make Your Web Site’s Navigation User. Friendly ¡ Easy to navigate ¡ Don’t make user guess or hunt for hyperlinks or information ¡ Rule of thumb: l Web site visitor should be able to find what they are looking for within three mouse clicks

Rule 4 l Use White Space (area of Web page that does not include text or graphics) ¡ Do not have cluttered page ¡ Rule of thumb: l Include enough white space between text and images to allow user to read and “breathe” between different elements on your Web pages

Rule 5 l Determine Your Web Site’s Page Size ¡ Don’t want user to have to scroll to see items on the page l l ¡ ¡ ¡ Size of user’s Web browser window is probably one of the biggest headaches a Web designer will encounter To fix, you must set your Web page size at the proper width and height Possible resolutions: l l ¡ To the right Too far down 640 x 480 pixels 800 x 600 pixels 1024 x 768 pixels (most commonly used) 1152 X 870 Safest: l Not more that 800 pixels wide and 600 -900 pixels tall

Rule 6 l Lay Out Your Web Pages Using Tables ¡ Invisible tables help control layout of Web page ¡ Gain control over layout and make pages more interesting Text in columns l Images next to text l Navigation buttons in rows or columns l ¡ Pay l attention to pixel width of windows 785 pixels or less

Rule 7 l Use Fonts That Will Display Correctly ¡ Not as simple as in print design l ¡ ¡ Web visitor must have your font choice on his/her computer to display correctly To display correctly on all computers, put type face in graphic image Use font that is pre-installed on all computers l l l l Arial Courier Georgia Helvetica Times New Roman Verdana

Rule 8 l Keep Text Consistent Throughout Your Web Site ¡ Not too small or large l l ¡ Alignment should be left, not centered l ¡ Not smaller than 8 points (hard to read) Not larger than 14 points (appearance that your are “shouting” at your visitors Centered can be used in headlines Text links should be unique l Not same as surrounding text • Avoid underlining other text • Make sure linked text is a contrasting color ¡ Text color should be consistent l Same scheme for all pages in site

Rule 9 l Research ¡ Visit Competitor Web Sites other sites like the one that you are creating ¡ Compare and contrast ¡ Compatible with rest of industry

Rule 10 l Establish ¡ Web Professional Identity site’s look and design conveys intended message and identity

Rule 11 l Proofread for Spelling, Grammar, and Design ¡ Typos spoil Web pages ¡ Take time to proofread Spelling l Grammar l Design l ¡ Have one or two people review your Web site

Rule 12 l Revise, Revise ¡ Designing a Web site never comes out right the first time around ¡ Preview Web pages frequently as you build ¡ Continually look for design and content inconsistencies ¡ Looking for professional, well-designed finished product

Rule 13 l Create Well-Designed Web Site Architecture ¡ Decide l on framework or structure How it fits together ¡ How will visitors move from one page to another and back

Rule 14 l Use Consistent Graphics ¡ Images help illustrate Web page’s message ¡ Use same style Photographic quality l Cartoon-like images l ¡ Use the ‘ALT’ tag with all of your graphics

Rule 15 l When in doubt---Apply the “KISS” Rule ¡Keep It Short and Simple

Rule 16 l Guidelines for Working with Web Site Colors ¡ Maximum: two or three colors throughout Web site ¡ Color scheme coordinates with your Web site’s overall message ¡ Avoid colors that make text difficult to read ¡ What color would you pick? Company selling cotton candy l A hospital l A financial planning business l

Rule 17 l Most Importantly---Have a Paper Plan ¡ Bad l Habit Build without a plan l Complete: Web Site Structure l Complete: Page Planning Forms