Refinement Production Implementation Design and Development Stages
Project Analysis & Design Phases Discover Exploration Refinement Production Implementation Launch Maintenance
Refinement Refinement – Polishing the navigation, layout, and flow of the selected design. By the end of the refinement phase, you will have a highly detailed design to present to your client.
Interactive Prototype Production – Developing the fully interactive prototype that embodies and represents the final design idea. The client will have a better feel for how the finished web site will look and perform.
Design Guidelines Fonts Color of links Color scheme Style guide for consistent writing (for example, do you use or )
Setting up your File Structure Organize your file structure and set naming conventions as established during the structuring phase.
Naming Convention Some prefer "aboutthecompany.html" vs. "about.html". Try to avoid falling into the trap of "AboutTheCompany.html". Using key caps will only be another convention to remember.
Version Control If you have 3 or more people working on the HTML of your site, you will want to have some kind of established method of version control in place to avoid writing over files or duplication of efforts.
Dynamics Sites For dynamic sites, HTML naming conventions don't apply directly, but discipline is still required. Pages are divided and individual sections can be called out as "header," "footer," "main," "navigation" and so on. Be descriptive, but keep it simple.
Usability Testing Make sure you have reached the goals - test to see if the web user can complete the task(s) you want them to accomplish.
Inverse Pyramid Writing Style Customers want web pages to download fast, be easy to use and fast to scan. Employ a common journalistic style called inverse-pyramid writing.
Headlines Blurb Less important background Info, supporting details, long quotes
Grab attention within 7 seconds! Place the most important information above the ‘fold’ or before they need to scroll. scratch.com/attention_map.cf mhttp:// scratch.com/attention_map.cf m
Screen Resolution Best Screen Resolution to design Websites 800x600? 1024x768? The oldest question in website design - 'What's the best monitor screen resolution to use when building your site? ps/25.htmhttp:// ps/25.htm
Headlines with Drawing Power Tell in Headlines and Blurbs why each page is important, unique, and valuable to visitors. Readers want to quickly determine whether this page is what they want.
Distinctive HTML Titles Write distinctive HTML title for every page – they are used as the page title in search results and sometimes search engines rank pages higher. Use keywords, those you would use most to describe the site’s purpose and offerings to customers.
Write a Concise, Descriptive Headline The best headlines indicate action – buy or sell anything here. It does not tell the whole story, so readers continue to read. Write short sentences with short paragraphs. (please use spell and grammar checkers!)
CNET Titles CNET.COM –News-E-Business-How to build that elusive customer loyalty. CNET Builder.com – Web Graphics – Conceptualize Your Site.
Use Bullets and Numbered Lists They are conductive to rapid skimming They highlight information quickly Limit bullets to seven
Writing Printable Pages If needed create a printable template for a printer-friendly version of a page.
Development Stage Implementation – Developing the code, content, and images for the web site.
Web Browser Compatibility Browser Compatibility SafariTest - Returns a screenshot of your page as viewed with Safari.SafariTest Browsershots - Screenshot of your page in many browsers. Up to 24 hour wait.Browsershots
Validators XHTML Validators W3C Markup Validation Service CSS Validtators W3C CSS Validator
Don’t Forget Accessibility Issues Accessibility WebXACT - test single pages of web content for quality, accessibility, and privacy issuesWebXACT
Optimization Web Page Analyzer
Client’s ISP During the Development Phase make sure your client provides you with the ISP information for uploading the site.
Go Impress Them! You can do it!