Docstoc

spec_design_v1_1_

Document Sample
spec_design_v1_1_ Powered By Docstoc
					         Web Site

   Specification/Design

         Document

              For

www.MichelleLloyd.com

           company
             street
       Ho Chi Minh City
           Vietnam




            Version 2
      Last Updated: 4/28/09
           Status: Draft




               by
      Information Systems
        118 N. Gwen Dr.
      Ridgecrest, CA 93555
      forrest@ridgenet.net
          769 900 3205
                               Specification/Design Document


Document Revision History
Revision 1
       Author: Forrest Lloyd
       Date: 4/15/09
       Description: Document prior to tailoring to meet customer needs.




                                                                          2
                                                          Specification/Design Document


Table of Contents

1 PURPOSE OF DOCUMENT ..................................................................................................................................6
    1.1 SCOPE OF DOCUMENT ..........................................................................................................................................6
    1.2 SUPPORT DOCUMENTS .........................................................................................................................................6
    1.3 SUPPORT REPORTS ...............................................................................................................................................6
    1.4 DOCUMENT DEVELOPMENT INSTRUCTIONS .........................................................................................................6
2 BUSINESS OVERVIEW .........................................................................................................................................8
    2.1 BUSINESS NAME ..................................................................................................................................................8
    2.2 BUSINESS POINT OF CONTACT .............................................................................................................................8
    2.3 BUSINESS HISTORY ..............................................................................................................................................8
    2.4 BUSINESS MISSION STATEMENT ..........................................................................................................................8
    2.5 BUSINESS SUPPORT DOCUMENTS.........................................................................................................................8
    2.6 COMPETITIVE POSITION .......................................................................................................................................8
    2.7 DOMAIN ...............................................................................................................................................................8
    2.8 SERVER ................................................................................................................................................................8
    2.9 WEB SITE VISITOR PROFILE .................................................................................................................................9
    2.10 WEB SITE BUSINESS REQUIREMENTS............................................................................................................... 10
    2.11 CUSTOMER IN HOUSE WEB EXPERTISE ............................................................................................................ 10
    2.12 CURRENT WEB SITE EVALUATION ................................................................................................................... 10
    2.13 WEB SITE UPGRADE GOALS ............................................................................................................................ 10
    2.14 EXPECTED WEB SITE IMPACT ON BUSINESS .................................................................................................... 10
    2.15 MARKETING PLAN UPDATE ............................................................................................................................. 10
3 INFORMATION DESIGN .................................................................................................................................... 12
    3.1 WEB CONTENT .................................................................................................................................................. 12
    3.2 SITEMAPPING ..................................................................................................................................................... 12
    3.3 WIREFRAMING ................................................................................................................................................... 12
    3.4 NAVIGATION ...................................................................................................................................................... 13
4 VISUAL DESIGN ................................................................................................................................................... 14
    4.1 DEFINE SMART DESIGN ..................................................................................................................................... 14
    4.2 REVIEW SITE GOALS .......................................................................................................................................... 14
    4.3 DEVELOPING CONCEPTS .................................................................................................................................... 14
    4.4 DESIGNING FOR YOUR AUDIENCE ...................................................................................................................... 14
    4.5 PRESENTING DESIGN AND GATHERING FEEDBACK ............................................................................................ 14
    4.6 TESTING FUNCTIONALITY .................................................................................................................................. 15
    4.7 CREATE GRAPHIC TEMPLATES ........................................................................................................................... 15
    4.8 CREATING A DESIGN STYLE GUIDE ................................................................................................................... 15
    4.9 COPYRIGHT PROTECTED MATERIAL LIST .......................................................................................................... 16
5 FUNCTIONS ........................................................................................................................................................... 17
    5.1 SEARCH ENGINE SCORE ENHANCEMENTS .......................................................................................................... 17
       5.1.1 HTML Title tag.......................................................................................................................................... 17
       5.1.2 Meta Data – Description ........................................................................................................................... 17
       5.1.3 Meta Data – Keywords.............................................................................................................................. 17
    5.1.4 META TAG - ROBOTS ...................................................................................................................................... 18
       5.1.5 Search Engine Robot Include Directive .................................................................................................... 18
       5.1.6 Search Engine Robot Exclude Directive ................................................................................................... 18
       5.1.7 Validate Web Site Syntax .......................................................................................................................... 18
       5.1.8 Out Going Hyperlinks ............................................................................................................................... 18
       5.1.9 In Coming Hyperlinks ............................................................................................................................... 18
       5.1.10 Handicapped Enhancements ................................................................................................................... 18



                                                                                                                                                                             3
                                                           Specification/Design Document

       5.1.11 Flash, Shockwave, Real, MP3 ................................................................................................................. 19
       5.1.12 Internal Navigation Links........................................................................................................................ 19
       5.1.13 Register Web Sites ................................................................................................................................... 19
    5.2 HANDICAPPED ENHANCEMENTS ........................................................................................................................ 19
       5.2.1 Non Text Elements..................................................................................................................................... 19
       5.2.2 Color Only................................................................................................................................................. 19
       5.2.3 Style Sheet Requirements .......................................................................................................................... 19
       5.2.4 Redundant Links ........................................................................................................................................ 19
       5.2.5 Client-Side Image ...................................................................................................................................... 19
       5.2.6 Table Requirements ................................................................................................................................... 20
       5.2.7 Screen Flicker ........................................................................................................................................... 20
       5.2.8 Form Requirements ................................................................................................................................... 20
       5.2.9 Plug-in Links ............................................................................................................................................. 20
       5.2.10 Time Extension ........................................................................................................................................ 20
       5.2.11 Proper Text Markup ................................................................................................................................ 20
    5.3 VISITOR STATISTICAL DATA .............................................................................................................................. 20
    5.4 FORMS ............................................................................................................................................................... 21
    5.5 LOGIN ................................................................................................................................................................ 21
    5.6 SHOPPING CART ................................................................................................................................................. 21
    5.7 E-COMMERCE .................................................................................................................................................... 21
    5.8 CONTENT MANAGEMENT SYSTEM (CMS)/DATABASE ...................................................................................... 21
6 TECHNICAL CONSTRAINTS ............................................................................................................................ 22
    6.1 TECHNICAL ARCHITECTURE .............................................................................................................................. 22
    6.2 SECURITY .......................................................................................................................................................... 22
       6.2.1 Cross-site Scripting ................................................................................................................................... 22
       6.2.2 Injection Flows .......................................................................................................................................... 22
       6.2.3 Malicious File Execution .......................................................................................................................... 22
       6.2.4 Cross-site request forgery ......................................................................................................................... 22
       6.2.5 Insecure direct object reference ................................................................................................................ 23
       6.2.6 Information Linkage & Improper Error Handling .................................................................................... 23
       6.2.7 Broken Authentication and session management ...................................................................................... 23
       6.2.8 Insecure Cryptographic Storage ............................................................................................................... 23
       6.2.9 Insecure Communications ......................................................................................................................... 23
       6.2.10 Failure To Restrict URL Crosses ............................................................................................................ 23
    6.3 SERVER SPECIFICATIONS ................................................................................................................................... 23
       6.3.1 Development Server .................................................................................................................................. 23
       6.3.2 Customer Server ........................................................................................................................................ 24
    6.4 VISITOR VIEWING EQUIPMENT REQUIREMENTS................................................................................................. 24
       6.4.1 Viewing Devices ........................................................................................................................................ 24
       6.4.2 Browsers/OS/Computer for Screens .......................................................................................................... 25
       6.4.3 Browser Plug-In/Options .......................................................................................................................... 26
       6.4.4 Screens ...................................................................................................................................................... 26
       6.4.5 Internet Connections ................................................................................................................................. 27
7 CONTENT MAINTENANCE ............................................................................................................................... 28
    7.1 GENERAL INFORMATION .................................................................................................................................... 28
    7.2 CONTENT CREATION .......................................................................................................................................... 28
    7.3 PRODUCTION EXPERTISE.................................................................................................................................... 28
    7.4 PROMOTION ....................................................................................................................................................... 29
    7.5 CONTENT MAINTENANCE REPORT ..................................................................................................................... 29
8 DESIGN ................................................................................................................................................................... 30
    8.1 CONTENT PARTITIONING ................................................................................................................................... 30
    8.2     INTERNET DESIGN TECHNOLOGIES ............................................................................................................ 30
    8.3 VALIDATION ...................................................................................................................................................... 30


                                                                                                                                                                              4
                                                   Specification/Design Document

       8.3.1 W3C Markup Validation Service of XHTML ............................................................................................ 30
       8.3.2 W3C CSS Validation Service of CSS ......................................................................................................... 30
       8.3.3 Firefox Real Time Error Checker for JavaScript ...................................................................................... 30
9 FUTURE ENHANCEMENTS ............................................................................................................................... 31
APPENDIX A – HANDICAPPED REQUIREMENTS .......................................................................................... 32




                                                                                                                                                         5
                                Specification/Design Document



1 Purpose of Document
   This document defines the web site.

1.1 Scope of Document
   This document defines the web site in its entirety. The document is started after the phase I
proposal is approved by the customer and is completed prior to web site software coding. As this
document is developed, the “Test Plan/Description/Report Document” is also developed. This
document is done when the customer approves the document following the “Design Review”.

1.2 Support Documents
   a.   Web ReDesign 2.0 by Kelly Goto & Emily Cotler (Recommended text book)
   b.   Web Site Evaluation Document (If upgrading a web site)
   c.   Proposal Phase I - Web Site Definition Report
   d.   Test Plan/Description Document (Template)

1.3 Support Reports
   Reports are generated in parallel with this document and provided to the customer to insure
understanding. Customers are expected to review the report and return with comment.
Dialogue associated with these reports is designed to minimize rework of documents presented at
the design review. The reports include:
    a. Web Site Evaluation Report – Team evaluation of current web site
    b. Visitor Profile – Profiles the targeted web site visitors
    c. Content Maintenance Report – Procedures for keeping web site current
    d. Style Guide – Defines overall web site appearance
    e. Viewing Equipment Matrix Report – List of customer web serf equipment

1.4 Document Development Instructions
   a. This document starts out as the Specification/Design Document template. Most template
      content is required to build all web sites. Instructions are identified with brackets as such
      {instructions} that provide guidance in completing this document. Remove the
      instructions from the document as the instructions are executed.

   b. Section “2 Business Description” has already been completed in the “Project Proposal
      Phase I – Definition” document. Use copy and past to move the information from one
      document to the other.

   c. If a web site evaluation was performed, use the “Web Site Evaluation Report” and
      customer input to identify what old web site content will be used in the new web site.
      Modify this document to reflect those decisions. See section “3.1 Web Content”.

   d. Section “2.9 Web Site Visitor Profile” is critical information in completing this
      document. The customer provided this information when the “Project Proposal Phase I –
      Definition” document was prepared. If there is any drought about the accuracy of this


                                                                                                  6
                             Specification/Design Document


   information, make changes and provide this information back to the customer using a
   “Visitor Profile Report”. Use the same information format for this document and the
   report.

e. Section “7 Web Site Content Maintenance” addresses how often and how much
   information will change on the web site. It is important to identify this information early
   in preparing this document. It will impact the web site design. When section 7 is
   completed, product a “Content Maintenance Report” and have the customer review and
   approve this section prior to document approval at the “Design Reviw”.

f. Section “4.8 Creating a Design Style Guide” captures web style information to maintain
   presentation consistency throughout the web site life cycle. The style guide is produced
   in parallel with this document and reviewed and approved by the customer prior to
   completion of this document. Prototype web pages are developed to help the customer
   and developer define the web style. The web development team in Phase II will use the
   document. Web site maintainers will also use the document.

g. Section “6.4 Visitor Viewing Equipment Requirements” identifies the equipment this
   web site will be designed to be viewed by. The lack of rigid browser standards means
   different browsers render a web site differently. Extra effort is required to make web site
   render the same on all browsers. To minimize cost, customers are advised to have web
   sites build to accommodate browsers most used by their customers.




                                                                                              7
                                Specification/Design Document



2 Business Overview
   The business provider is a private yoga instructor living and teaching yoga in Ho Chi Minh
City, Vietnam. Classes are taught in her private studio. Classes are by appointment. The
language is limited to English and Spanish.

2.1 Business Name
{Insert from Business Overview section of Proposal Phase I – Definition}


2.2 Business Point of Contact
Michelle Lloyd
Ho Chi Minh City
Vietnam
michelleglloyd@gmail.com
Phone +84 909 64 8193

2.3 Business History
{Insert from Business Overview section of Proposal Phase I – Definition}


2.4 Business Mission Statement
{Insert from Business Overview section of Proposal Phase I – Definition}


2.5 Business Support Documents
   The business documents are under development. An availability date has not been
established.

2.6 Competitive Position
{Insert from Business Overview section of Proposal Phase I – Definition}


2.7 Domain Name Provider
Dotster, Inc.
P.O. Box 821066
Vancouver, WA 98682
U.S.A.
http://www.dotster.com


2.8 Server
Information Systems


                                                                                                8
                                 Specification/Design Document


118 N. Gwen Dr.
Ridgecrest, CA 93555
(760) 900 3205
forrest@ridgenet.net

2.9 Web Site Visitor Profile
   The web site is designed for yoga partisans, instructors, and retreat organizers, and related
business people. The web site is also targeting potential practitioners and people new to the
practice of yoga.

2.9.1 Profile 1
a.   Who are your site visitors?
b.   Age?
c.   Gender?
d.   Online frequency?
e.   Why did they come to the site?
f.   What is the visitor looking for?
g.   What tasks will they be performing?
h.   What platforms will they use to view the site?
i.   What network access speed will they be using?
j.   What programming languages will they have?
k.   What plug-ins will they be using?
l.   What browsers will they be using?
m.   Will they need a secure web site?
n.   Will they want e-commerce?
o.   Will they want to Login?


2.9.2 Profile 2
a.   Who are your site visitors?
b.   Age?
c.   Gender?
d.   Online frequency?
e.   Why did they come to the site?
f.   What is the visitor looking for?
g.   What tasks will they be performing?
h.   What platforms will they use to view the site?
i.   What network access speed will they be using?
j.   What programming languages will they have?
k.   What plug-ins will they be using?
l.   What browsers will they be using?
m.   Will they need a secure web site?
n.   Will they want e-commerce?
o.   Will they want to Login?




                                                                                                   9
                                  Specification/Design Document


2.10 Web Site Business Requirements
     a. Provide basic information such as Michelle‟s yoga instructor bio, class offerings,
        scheduling, special events, media information, community links and personal
        inspirations.
     b. Present the viewer with an aesthetically beautiful and inspiring experience into the
        practice of yoga as well as the beauty of the SE Asia region. This will be carried out by
        the various digital imagery and media depicted throughout the website.

2.11 Customer In House Web Expertise
   The customer‟s business capabilities include:
    a. Photographer
    b. Videography
    c. Graphic art.
The customer‟s company will provide most if not all web content involving any of the listed
disciplines.

2.12 Current Web Site Evaluation
The business does not have a web site.

2.13 Web Site Upgrade Goals
NA

2.14 Customer Reference Web Sites
     a. www.jamesdomingo.com
     b. www.vivekkevin.com

2.15 Expected Web Site Impact on Business
{Insert from Business Overview section of Proposal Phase I – Definition}

2.16 Marketing Plan Update
    The business-marketing plan needs to be modified to include this web site as part of the
overall plan. The web site will be designed to provide a high search engine score. Details are
included later on in this document. The web site will be designed for accessibility by the
visually and hearing impaired. This web site capability will expand your audience and is
required for a high search engine score. Tools will be designed into the web site to provide
visitor statistical data. The information will help evaluate both business performance and web
site performance. This information can be evaluated on whatever time interval desired by the
business.

    The off line part of the business marketing plan will need modification to optimize the
overall business marketing plan. Include web address on business cards. Include web address
on vehicle signs. Mail flyers to potential clients with web address enclosed. Visit potential




                                                                                                 10
                               Specification/Design Document


clients and hand out business cards. Purchasing an ad with Google for selected key words can
increase the Google search engine score.




                                                                                               11
                                 Specification/Design Document



3 Information Design
3.1 Web Content
   {The “Project Proposal Phase I – Web Site Definition Document” contains a “Web Content
Plan” section. The plan needs to be executed now. Extract old web site content for reuse as
approved by the customer. Use the “Web Site Evaluation Document” if one was produced to
identify relevant content. Content includes text, audio, video, images, and graphic art. Work
content issues soon after delivery from the content provider.

   Start with a content outline. Use web page names for the top level of the outline. Make the
second highest outline level subtitles to that web page. Prioritize the content. Rate the content
for quality and edit as required. Format the content for compatibility with the web site.

   At this point the project team should know the content change rate. They should also know
who will be keeping the content current, and what their skills are. Consider how to design the
web site to minimize the effort to keep the content current. Design the web site to accommodate
anticipated growth areas. Capture this information in the “Web Site Content Maintenance
Report”. Deliver this document prior to design review.

   Perform content analysis to identify meta data to support search engines. Consider if the meta
data will change when content is changed during the maintenance of the web site. For details on
how to treat meta data key words, refere to Appendix A.

3.1.1 Photo Gallery
   Include a photo gallery that has a similar layout as the one located at
www.jamesdomingo.com .

3.2 Site Mape
   The sitemap shows a visual representation of the site‟s structure, organization, flow, and
grouping of content. Every page gets a box and most major links are represented. The sitemap
also shows interaction between the front end and back end if the site has a backend. The
backend refers to functions that perform actions that the visitor may or may not directly interact
with. Examples include login, database store and retrieval, and dynamic page changes.



3.3 Wireframing
   Wireframing is storyboarding a web page. It identifies all major content on a page and can
have some graphic art but not required.

   Whenever moving into a new menu selection, background images will change, but stay
consistent in size and placement.




                                                                                                 12
                                 Specification/Design Document


{Wire framing is performed for unique main, secondary, and templates pages. Wire framing
checklist:
Images/figures/illustrations
Content general or actual if available
Global navigation
Functionality is described
Primary links
Secondary links
Media
Actual window size including pixel measurements
Header and Footer documentation}

{For coloring, specify hex numbering for the background, main palette, and accents. Clearly
indicate which colors get applied to navigation headers, what color for text when background
color changes what color for buttons, bullets, arrows, stars, and other graphic accents. Be sure to
specify all body text/content and links.}

3.4 Navigation
   Navigation will be clear and simple. Navigation colors will be neutral. Drop down menus
will be used for profile and contact. They will have some transparency against the background
photo. Look at www.jamesdomingo.com for an example.

An example is located at www.vivekkevin.com .

   All external links will open in a new window rather than navigate away from the site.




                                                                                                13
                                Specification/Design Document



4 Visual Design
    The design will be elegant, friendly, and approachable. Neutral background and color scheme
to complement the focus on natural elements of yoga photography. The background will be
neutral colors such as cream or taupe. Fonts will be dark brown, and elegant such as “Book
Antiqua”.

4.1 Define Smart Design
   Smart Design combines style and function.

   {What is the viewer equipment capable of displaying? Are your viewers using handheld
viewing devices? Are they using 800X600 screens or 1024X768 screens? Can the design be
implemented in CSS? Will the design provide a high search engine score? Will the design load
fast? What will the design cost?}

4.2 Review Site Goals
  {What are the client redesign objectives? What is the tone? What are the visual goals? What
would please the audience? What does the competition look like?}


4.3 Developing Concepts
  Review the prototype web site at location {url}. This review does not include the customer.
Good design ideas are located at http://www.alvit.de/web-dev/index.html .

   {The first web site prototype focuses on fonts, color, and page layout. Use some of the
content developed during the content design analysis in section 3 earlier in this document.
   This is the time to start a prototype web page development effort. Tools required to build a
prototype web page are the same tools used to build the full web site and include:
    a. Web server with username and password protect to limit viewing audience
    b. Web design tool such as Dreamweaver
    c. Graphic art tool such as Photoshop
    d. FTP program to upload web pages to web server}

4.4 Designing for Your Audience
   Review the prototype web site at location {url}. This Review does not include the customer.

  {What visual or graphic cues are needed to guide the user to the information of interest?
Review the navigation buttons for effectiveness. Validate load speeds for viewer equipment.}

4.5 Presenting Design and Gathering Feedback
   Review the prototype web site at location {url}. This review includes the customer.

   {Limit designs to three choices or less. Review designs internally before showing designs to
customer. Request a written response. Questions to ask include:


                                                                                                  14
                                  Specification/Design Document


     a. Is what the company has to offer clear?
     b. What action will a visitor take after arrival?
     c. Is the web site organization comprehensive?
     d. Is the interface appealing?
     e. Move forward or redesign visual interface?
If the client has been through several iterations and still having difficulty deciding, the project
scope may need modification.}

4.6 Testing Functionality
    Functionality testing should be limited here to high-risk areas that need design clarity and/or
risk mitigation. The following functions have been tested at the prototype web site and include:
    a. TBD
    b. TBD
    c. TBD

   {Identify some preliminary functionality testing to assure cross platform and cross browser
capability. Building multiple web pages to overcome functionality issues is expensive. Losing
customers due to equipment incompatibility is also expensive. Add some of these functions to
the web prototype to validate function compatibility. Examples include DHTML, pull-down
menus, rollover menus, CSS, forms, shopping carts, database, and pop up screens.}


4.7 Create Graphic Templates
    Graphic art items are made ready here to support the web site. They must work with XHTML
and CSS. Review customer provided content for web ready now. All copyright items are listed
in section 4.9 along with cost.

   Items developed for the web site by the team are done now. Photoshop and Illustrator are
good tools to support this effort. Each item is documented to include the tool that produced the
item, format, pixel density, and other design data. The original layered file is kept to support
redesign and maintenance efforts later.

  The items can be made available for review as stand alone items or/and incorporated into the
web prototype for review and approval. The items include:
   a. TBD
   b. TBD

   {The list includes logos, photographs, background images, and graphic arts. These items
include global items such as the header, footer, and navigation artwork. Also included are
specific page art works. }

4.8 Creating a Design Style Guide
   The “Web Design Style Guide Document” documents the web site style. This document will
be used to develop the complete web site. The style guide will include the XHTML template and




                                                                                                      15
                                 Specification/Design Document


associated CSS file produced for the web site prototype. Use this document to support
maintenance after the web site has been launched.

   {Normally more than one web page template will be required for a web site. Large web
pages could have a dozen templates.}


4.9 Copyright Protected Material List
    The following copyright protected items along with their cost are planned for use in this web
site and include:
    a. TBD
    b. TBD




                                                                                                16
                                  Specification/Design Document



 5 Functions
   Functions can be larger-scale technology issues that may include high-level programming and
backend development. Web functions are also known as backend processes. Functions can
include:
    a. Search engines
    b. Personalization (login/cookie set)
    c. Security features
    d. Survey/voting tools
    e. Email newsletter distribution
    f. Shopping cart
    g. Discussion board/bulletin board
    h. News/press release area

5.1 Search Engine Score Enhancements
   Search engine scores are very important to a business. This is because many visitors arrive at
your web site because a search engine put their site near the top of all other web sites for a
specific subject search. If you do not make the first ten, that web surfer will not visit your site.

    Search engine companies keep web site scoring algorithms secret. The intent is to maximum
the experience for the web site audience and not allow web developers to utilize gimmicks to
inflate scores. The search engine companies do tell web developers what types of web
capabilities and characteristics they are looking for.

   Key words were discussed in the content design section of this document. At this point the
key words should already be identified and are located in the web site content as well.
For more information, visit: http://www.thesitewizard.com/


5.1.1 HTML Title tag
{The title tag is used to bookmark pages and describes the page content. A descriptive title
makes bookmarks useful to the visitor and improves search engine scores. Guidance on good
page titles can be found at http://www.sitepoint.com/article/html-title/2/ . List page titles here
for all XHTML and PHP pages.}

5.1.2 Meta Data – Description
{Write a description of the web site purpose here. Length should not exceed 200 characters.
For guidance on how to write a description, visit
http://htmlhelp.com/reference/html40/head/meta.html .}

5.1.3 Meta Data – Keywords
{List 20 to 30 keywords that relate to the web site subject. For details, visit Appendix A of this
document.}




                                                                                                     17
                                 Specification/Design Document


5.1.4 Meta Tag - Robots
   The meta tag robots is used to instruct robots to search your web site using web site links.
Add tag: <meta name="robots" content="index,follow" /> to the web index page. For more
information, visit: http://www.thesitewizard.com/archive/metatags.shtml .


5.1.5 Search Engine Robot Include Directive
   File sitemap.xml contains directives to a visiting search engine robot on which web pages to
make indexes for. This increases the likely hood that a search engine will score your web site
correctly when web surfers search the Internet. For information on construction this file, visit
web site: http://www.sitemaps.org/ . Go to the “Software Coding Standards Document” to see
an example.

5.1.6 Search Engine Robot Exclude Directive
   The robot exclusion standard, also known as the Robots Exclusion Protocol or robots.txt
protocol, is a convention to prevent cooperating web spiders and other web robots from
accessing all or part of a website which is otherwise publicly viewable. This increases the likely
hood that a search engine will score your web site correctly when web surfers search the Internet.
For information on construction this file, visit web site:
http://www.javascriptkit.com/howto/robots.shtml . Go to the “Software Coding Standards
Document” to see an example.

5.1.7 Validate Web Site Syntax
   Validation is addressed in section 8.3 of this document.

5.1.8 Out Going Hyperlinks
   {Search engines are looking for lots of hyperlinks to organizations performing the same
services and providing the same products as your web site. A list of competitors and suppliers
are needed here. Web sites pointed to will be scored and that score will impact your score. If
you are not willing to put competitor hyperlinks in your web site, your score will be reduced.}

5.1.9 In Coming Hyperlinks
   {Search engines are looking at web sites that point to your web site. Those sites will be rated
and their score will impact your score. Provide a list of web sites to be contacted to request this
web site be added to their web site.}

5.1.10 Handicapped Enhancements
   Web site handicapped enhancements to help the sight or hearing imparted enhances the score.
Implement the enhancements recommended later in this section to raise the score. Supporting
information is located at:
    a. http://www.w3.org/TR/WAI-WEBCONTENT/




                                                                                                  18
                                 Specification/Design Document


5.1.11 Flash, Shockwave, Real, MP3
   If any of these files are being used, imbed them in XHTML tags. Review ways for search
engines to capture information about the content associated with these files.
{List video and sound files used in the web site here.}

5.1.12 Internal Navigation Links
  All navigation buttons will include text to insure search engines can navigate the web site.
When pictures are used with navigation, always include text.

5.1.13 Register Web Sites
   Register web sites with search engine companies to improve score. Registration is performed
on line at:
    a. www.google.com/intl/en/submit_content.html
    b. http://search.yahoo.com/info/submit.html
    c. http://searchmarketing.yahoo.com/srchsb/ssb.php
    d. www.dmoz.org/
    e. www.webworldindex.com/submit.htm


5.2 Handicapped Enhancements
   Handicapped enhancements require little extra time to design and implement.
Implementation of the handicapped enhancements increases search engine scores. For details
concerning federal law, see Appendix A.

5.2.1 Non Text Elements
    A text equivalent for every non-text element shall be provided (e.g., via "alt", "longdesc", or
in element content).


5.2.2 Color Only
   Web pages shall be designed so that all information conveyed with color is also available
without color, for example from context or markup.

5.2.3 Style Sheet Requirements
   Documents shall be organized so they are readable without requiring an associated style
sheet.

5.2.4 Redundant Links
   Redundant text links shall be provided for each active region of a server-side image map.

5.2.5 Client-Side Image
   Client-side image maps shall be provided instead of server-side image maps except where the
regions cannot be defined with an available geometric shape.



                                                                                                  19
                                  Specification/Design Document


5.2.6 Table Requirements
   Use either the caption or the summary tag to summarize table information. Use row and
column header tags to describe rows and columns. Use thead, tfoot, and tbody structural
grouping tags.

5.2.7 Screen Flicker
  Pages shall be designed to avoid causing the screen to flicker with a frequency greater than 2
Hz and lower than 55 Hz.

5.2.8 Form Requirements
   When electronic forms are designed to be completed on-line, the form shall allow people
using assistive technology to access the information, field elements, and functionality required
for completion and submission of the form, including all directions and cues. See
http://www.w3.org/TR/WCAG10-HTML-TECHS/#forms
    a. Provide logical tabs through links, form controls and objects
    b. Group form controls
    c. Explicitly connect labels and controls
    d. Include text with graphical buttons

5.2.9 Plug-in Links
   When a web page requires that an applet, plug-in or other application be present on the client
system to interpret page content, the page must provide a link to a plug-in or applet that complies
with §1194.21(a) through (l).

5.2.10 Time Extension
   When a timed response is required, the user shall be alerted and given sufficient time to
indicate more time is required.


5.2.11 Proper Text Markup
    Using markup improperly -- not according to specification -- hinders accessibility. Misusing
markup for a presentation effect (e.g., using a table for layout or a header to change the font size)
makes it difficult for users with specialized software to understand the organization of the page
or to navigate through it.

5.3 Visitor statistical Data
   Web statistical data is collected from every web site visitor and stored on the server. The
information is used to evaluate the web site effectiveness and business marketing effectiveness.
The web site owner or the web site developer can download the data and provide reports for
whatever time interval is desired. The server must support MySQL and PHP. Data collected for
analysis includes:
    a. How many people visit our web site each day?
    b. How long do people stay on our site?
    c. How many return visitors do we have to our site?



                                                                                                   20
                                  Specification/Design Document


   d.   Which times of the day or days of the week do the most visitors use our site?
   e.   Which of our site‟s pages are most frequently viewed?
   f.   How do people find out about our site (from which sites are they referred)?
   g.   What kinds of computers and browsers do our visitors use?
   h.   Are there common patterns of navigation through our site?
   i.   Which search engines brought visitors to this site?
   j.   Which key words were used in the search engine to find the web site?

5.4 Forms
   {If forms will be used on the web site to provide information to the business, here is the place
to define form requirements. If the web site will not use forms, state so here.}

5.5 Login
    {If a login will be used on the web site to provide limited access to certain information, here
is the place to identify that area and define login requirements. If the web site will not use login,
state so here.}

5.6 Shopping Cart
    {Will this web site have a shopping cart? If so describe the shopping cart requirements here.
If not, state that.}

5.7 E-Commerce
   {Will the web site perform e-commerce such as handle credit cards? If so, identify the
requirements here. If not state no.}

5.8 Content Management System (CMS)/Database
  {If server side data storage is required, here is the place to identify what is required. If the
web site will not use server side data storage, state so here.}




                                                                                                     21
                                  Specification/Design Document



6 Technical Constraints
   The Technical specification is the most important part of the specification to get right the first
time. It is made up of hard facts and will cause significant rework later if it is modified. This
section includes:
    a. Technical architecture
    b. Security
    c. Server specification
    d. User machine specification
    e. Other

6.1 Technical Architecture
   {What is the web site file structure? How do the front end and backend interact? What are
the lines of control? How does the data flow?}

6.2 Security
  Web sites can be used to penetrate into a server and collect information and do damage.
Measures will be taken during the web site design, code, and test to reduce these risks.

6.2.1 Cross-site Scripting
   Cross-site scripting occurs when a visitor enters information into a form that damages or
provides access to information on the server not intended. Validating form data on the client
machine and on the server will mitigate this risk.

6.2.2 Injection Flows
   When user-supplied data is sent to interpreters as part of a command or query, hackers trick
the interpreter – which interprets text-based commands – into executing unintended commands.
Injection flows allow attackers to create, read, update or delete any arbitrary data available to the
application. In the worst-case scenario, those flows allow an attacker to completely compromise
the application and the underlying systems, even bypassing deeply nested fire walled
environments.

6.2.3 Malicious File Execution
    Hackers can perform remote code execution, remote installation of root kits, or completely
compromise a system. Any type of web application is vulnerable if it accepts filenames or files
from users. The vulnerability may be most common with PHP, a widely used scripting language
for web development.

6.2.4 Cross-site request forgery
  This attack takes control of victim‟s browser when it is logged on to a web site, and sends
malicious requests to the web application.




                                                                                                   22
                                 Specification/Design Document


6.2.5 Insecure direct object reference
   Attackers manipulate direct object references to gain unauthorized access to other objects. It
happens when URLs or form parameters contain references to objects such as files, directories,
database records or keys.

6.2.6 Information Linkage & Improper Error Handling
   Error messages that applications generate and display to users are useful to hackers when they
violate privacy or unintentionally leak information about the program‟s configuration and
internal workings.

6.2.7 Broken Authentication and session management
    User and administrative accounts can be hijacked when applications fail to protect credentials
and session tokens from beginning to end. Watch for privacy violations and the undermining of
authorization and accountability controls. Flaws in the main authentication mechanism are not
uncommon, but weaknesses are more often introduced through ancillary authentication functions
such as logout, password management, timeout, remember me, secret questions and account
update, “OASP writes.

6.2.8 Insecure Cryptographic Storage
   Protecting sensitive data with cryptography has become a key part of most web applications.
Simply failing to encrypt sensitive data is very widespread. Applications that do encrypt
frequently contain poorly designed cryptography; either using inappropriate ciphers or making
serious mistakes using strong ciphers. These flaws can lead to disclosure of sensitive data and
compliance violations

6.2.9 Insecure Communications
   This is a failure to encrypt network traffic when it‟s necessary to protect sensitive
communications attackers can cross unprotected conversations, including transmissions of
credentials and sensitive information. For this reason, PCI standards require encryption of credit
card information transmitted over the Internet.

6.2.10 Failure To Restrict URL Crosses
   Some web pages are supposed to be restricted to a small subset of privileged users, such as
administrators. Yet often theirs no real protection of these pages and hackers can find the URLs
by making educated guesses.

6.3 Server Specifications
   To learn about server capability, visit: http://www.thesitewizard.com/archive/findhost.shtml

6.3.1 Development Server
   The web site require the following host server capabilities:
   a. PC computer
   b. FreeBSD version 6.2
   c. Apache version 2.2.9


                                                                                                23
                                Specification/Design Document


   d.   MySQL version 5.0
   e.   PHP version 5.2.6
   f.   JavaScript Core Version 1.5
   g.   Pages will upload over Secure FTP.
   h.   Backup every 24 hours


6.3.2 Customer Server
{ The customer sever must support:
  a. ISP name
  b. ISP backup schedule
  c. ISP bandwidth
  d. IP address
  e. Number/configuration of servers
  f. Shared/unshared server
  g. SFTP
  h. CPU performance
  i. CPU memory
  j. Disk memory
  k. XHTML
  l. CSS
  m. JavaScript
  n. PHP
  o. MySQL}

6.4 Visitor Viewing Equipment Requirements
   A variety of equipment is available to view web sites. The viewing equipment is evolving as
fast as the technology. Currently hand held devices are growing in popularity. Their screens are
small and the user interface is different than computer workstations. Web sites are designed
differently to accommodate handhelds. To minimize cost, carefully consider your customer base
and design to it. A “Viewing Equipment Matrix” is produced when completing this section to
facilitate web site testing. {“Viewing Equipment Matrix” is an excel file that is completed while
selecting viewing equipment in this section.}


6.4.1 Viewing Devices
  When a request comes into the web server, the viewing device is included with the domain
name. The viewing devices are:
   a. Aural - Used for speech and sound synthesizers
   b. Braille - Used for Braille tactile feedback devices
   c. Embossed - Used for paged Braille printers
   d. Handheld - Used for small or handheld devices
   e. Print - Used for printers
   f. Projection - Used for projected presentations, like slides
   g. Screen - Used for computer screens
   h. TTY - Used for media using a fixed-pitch character grid, like teletypes and terminals


                                                                                              24
                                 Specification/Design Document


    i. TV - Used for television-type devices
   This specification only addresses Screen and Printer at this time. Other devices will be
included in this document at a later date.

   The devices that will be tested include:
   a. Screen
   b. {Printer is optional}
{When completing the “Viewing Equipment Matrix”, provide a spread sheet for each web page
and for each viewing device.}


6.4.2 Browsers/OS/Computer for Screens
   Different browsers, Operating Systems (OS), and computers sometimes render web sites
differently if special web site software is not deployed. For this reason, web sites are tested with
multiple combinations of equipment. To minimize cost, review customer profiles and choose
equipment most commonly used by visitors. For the latest statistics on viewing equipment
usage, visit: http://www.w3schools.com/browsers/browsers_stats.asp and
http://www.w3counter.com/globalstats.php .

Listed below are browsers and their popularity as of early 2009.
    a. Internet Explorer 7.0 31%
    b. Internet Explorer 6.0 26%
    c. Firefox 3.0           16%
    d. Firefox 2.0           14%
    e. Chrome                4%
    f. Safari 3.1            1%
    g. Opera 9.2             1%

Listed below are Operating Systems and their popularity as of early 2009.
    a. Windows XP            71%
    b. Windows Vista         14%
    c. Mac OS                5%

Listed below are required and optional equipment combinations for testing subject web site:
    a. Internet Explorer 6, XP, PC
    b. Internet Explorer 7 Vista 64, PC
    c. Firefox 3.0, Vista 64, PC
    d. {Optional choices are: Internet Explorer 8, Vista 64, PC
    e. Firefox 3.0, Leopard, Mac
    f. Safari 3.0, Leopard, Mac
    g. Opera 9.0, Leopard, Mac}

{In “Viewing Equipment Matrix” insert the above choices down the left side of the spreadsheet.}




                                                                                                  25
                                 Specification/Design Document


6.4.3 Browser Plug-In/Options
   Browsers have options and plug-ins that may be required to support web site capabilities.
The web site owner must consider the web site visitors‟ wants and needs to decide what
capabilities to design into the web site. Listed below are browser options that a web visitor can
disable:
    a. JavaScript
    b. Cookies

The web site will be designed to function with the following options to be turned off:
   a. {Optional JavaScript off
   b. Cookies off}

{When completing the “Viewing Equipment Matrix” note options off at the bottom if off is
selected. Recommend designing web site with cookies on and JavaScript on}

Web site plug-ins include:
  a. Flash 8.x
  b. Flash 9.x imbedded
  c. Flash 9.x streaming
  d. Real Player
  e. Scrolling
  f. WAV
  g. AU
  h. AVI
  i. MOV

The web site will be designed to be able to use the following plug-ins:
   a. {Optional Flash 8.x
   b. Flash 9.x imbedded
   c. Flash 9.x streaming
   d. Real Player
   e. Scrolling
   f. WAV
   g. AU
   h. AVI
   i. MOV}

{When completing the “Viewing Equipment Matrix” note plug-ins at the bottom that are
selected here.}

6.4.4 Screens
   Web pages render differently depending on the screen dimension, resolution, and color range.
Screens are constantly being improved in all three parameters. Listed below you will find the
most common screen resolutions being used as of early 2009:
   a. 1024X768                37%
   b. 1280X800                17%


                                                                                                26
                                 Specification/Design Document


   c. 1280X1024               15%
   d. 1440X900                7%
   e. 800X600                 5%

The following screen resolutions will be tested:
   a. 1024X768                37%
   b. {Optional 1280X800             17%
   c. 1280X1024               15%
   d. 1440X900                7%
   e. 800X600                 5%}
{When completing the “Viewing Equipment Matrix” note screen resolution across the top of the
matrix.}


6.4.5 Internet Connections
   Bandwidth or web site data load speeds vary depending on Internet services available and
cost. If a web site is designed to load fast across a dial up modem, the web site will be designed
significantly different. If a web site takes more than 2 seconds to load, visitors will not be
impressed. Select the rage of services the web site must be designed to accommodate. Do not
include dial-up modem unless a significant number of customers use dial up.
    a. Dial up modem
    b. Cable modem
    c. DSL

{When completing the “Viewing Equipment Matrix” note type of Internet access at the top of
the spreadsheet.}




                                                                                                27
                                  Specification/Design Document



7 Content Maintenance
   {This is the place to capture the content change rate, quantity of change, which will make the
changes, and what skills will the data entry person need. This information is also provided to the
customer in a report prior to the design review. This section is placed in the Web Site Content
Maintenance Report and provided to the customer prior to the design review.}


7.1 General Information
a. What areas of the redesigned site will be updated (for example, news, photos, horoscopes,
products, reviews) and how often (for example, daily, weekly, monthly, quarterly,
annually)?

b. Describe the maintenance team and individual responsibilities and time allocation, if known.
(Full time? Part time? Split jobs?)

c. How will the site be updated? Will you be inputting content manually into HTML or XML
files? Will you be using a content management system (CMS) to dynamically update and
deploy content (useful, for example, in the management of e-commerce inventory or
textpublishing databases)? If using a content management system, please describe in detail.

d. Who is responsible for maintaining the site from a technical standpoint, and what is this
person’s technical expertise level? What experience and capabilities does he or she have?
Will the person require training?

e. Who is responsible for making graphic changes on the site? What is his or her design
expertise level?


7.2 Content Creation
a. Who is responsible for creating the content for the site? Is this person able to dedicate part- or
full-time resources to content creation?

b. Who is responsible for approving look-and-feel changes (as the site expands) to ensure that
the quality of the site is maintained?

c. How often will new sections or areas be added to the site? Will they be based on the existing
site’s template or be independent sections?


7.3 Production Expertise
a. What technological expertise is necessary to update the site (basic HTML knowledge, li ght
scripting knowledge)?

b. Is there an automated process of changing content on the home page (an automatic


                                                                                                   28
                                Specification/Design Document


refresh of images or text each time a person comes to the site, a randomly generated quote,
or a date change)?

7.4 Promotion
a. How will the user know the site has been updated? Will there be email announcements
or specials tied into the site updates?

b. Who is responsible for continued search engine and keyword updates and submissions?
How often will keywords and META tags be revised?


7.5 Content Maintenance Report
{Send this section to the customer for review and approval.}




                                                                                              29
                                 Specification/Design Document



8 Design
   Much of the web site design is identified throughout this document and defined in the
Software Coding Standards Document.

8.1 Content Partitioning
a. Each web site page will have its own XHTML code packaged in its own file. The file name
   will include the navigation button name to help associate code with web page.
b. Web pages will follow the site map defined in section 3.2 of this document.
c. Web page layout will follow the guidelines defined in section 3.3 of this document.

8.2 Internet Design Technologies
   a.   XHTML
   b.   CSS
   c.   Client Side JavaScript
   d.   Server Side PHP
   e.   MySQL

8.3 Validation
   All web sites will be validated and errors removed. Validated software renders more
   predictable than software with syntax errors. Validated software produces higher search
   engine scores.

8.3.1 W3C Markup Validation Service of XHTML
The service is acquired by visiting web site: http://validator.w3.org/#validate_by_upload . The
validator tests for web page syntax errors for the following HTML versions:
    1. xhtml 1.0 Strict
    2. xhtml 1.0 Transitional
    3. html 4.0


8.3.2 W3C CSS Validation Service of CSS
   This service is acquired by visiting web site: http://jigsaw.w3.org/css-validator/ . The
validator tests for web page syntax errors for the following CSS versions:
    1. CSS 1.0
    2. CSS 2.0
    3. WCSS 2.0


8.3.3 Firefox Real Time Error Checker for JavaScript
   Run all web pages that include JavaScript using Firefox web browser with error checking
turned on. Fix all run time errors.




                                                                                              30
                              Specification/Design Document



9 Future Enhancements
   Web site development is best performed in phases. A phased approach reduces risk for the
development team and the customer. Knowing what future enhancements are being considered
will minimize rework when those enhancements or implemented. List future enhancements that
should be considered when designing this web site.




                                                                                         31
                                Specification/Design Document



Appendix A – Handicapped Requirements
   Section 508 of the Workforce Rehabilitation Act as amended in 1998 (http://www.access-
board.gov/508.htm ) requires that the web sites of Federal agencies be accessible. Section 508
has no direct bearing on public, non-government web sites. But Section 508 has indirect effect
on the accessibility of public information technology, as was the intent of the law. There is a
robust set of Accessibility Standards developed as part of Section 508 (http://www.access-
board.gov/sec508/guide/index.htm ). Those standards serve to define accessibility of information
technology. The idea is that companies will develop accessible technology to sell to the
government and then use that same technology for all customers. When web development
companies write accessible web sites for Federal agencies they will be able to use the same
techniques and practices for all clients.

The following list of web sites provides background information on when and how web sites
should be designed for handicapped people.

Government Law Explained:
http://www.section508.gov/index.cfm?FuseAction=Content&ID=3

Web design for compliance:
http://www.access-board.gov/sec508/guide/1194.22.htm

Jim Thatcher „s overview:
http://jimthatcher.com/law-target.htm




                                                                                              32

				
DOCUMENT INFO
Shared By:
Categories:
Tags:
Stats:
views:4
posted:8/30/2011
language:Italian
pages:32