Designers Sourcebook
Web Technical Brief
- Hosting Environment
- Target Audience Configuration Assumptions
- HTML Component
- File and Folder Naming
- Navigation Systems
- Functionality
1. Hosting Environment considerations
Web Server Operating System
Web Server Software
Scripting Environment
2. Target Audience Configuration Assumptions
Operating System
Macintosh OS 7.0 or greater. Windows 98/2000/NT.
Screen Resolution
Optimized for 800 x 600 pixels, but scalable.
Browser
Netscape Communicator / Navigator 4.x.
Internet Explorer 4.x.
3. HTML Component
Server-side includes? PHP3? [Flash component]
HTML
- All HTML pages will minimally be developed using the W3C HTML 3.2 standard, but may contain later technologies such as Cascading Style Sheets, if applicable.
All HTML pages will be designed so that the following specific browsers will correctly resolve their layout:
- Netscape Communicator/Navigator 4.x;
- Microsoft Internet Explorer 4.x.
4. File and Folder Structure and Naming
The [insert site name here] site will make use of the following principals of File and Folder Structure and Naming.
File/Folder Structure
The directory structure created for a Web site must be created logically, and must have a structure dictated by the site's generalized elements and content types.
The following sample directory structure demonstrates an element-dictated structure:
/wwwroot/
/wwwroot/index.html
/wwwroot/scripts/
/wwwroot/content_directory1/
/wwwroot/content_directory1/*.html
/wwwroot /content_directory1/images/*.gif
/wwwroot /content_directory2/
/wwwroot /content_directory2/*.html
/wwwroot /content_directory/images/*.gif
The root directory contains all sub-directories files related to the Web site. For readability and clarity, the application root directory should be named in a way that conveys what the site is about, for example /sitename/. Application root folder names that might be misidentified should be avoided.
Naming Conventions
Directory and file names should be long and descriptive (within reason), ensuring that navigation and file identification by site administrators is as simple as possible. Spaces in directory and file names must be avoided; however a series of words in names may be delimited by the underscore symbol _.
Basic Naming Principles
- no spaces in file names
- meaningful file and directory names
- .html file extension for all HTML files (consistency)
- subdirectory whenever there is a significant number of similar files (breadth vs. depth)
- should always be a top level file called index.html or default.html, even if it is a pointer to another file
- directories should have first letter capitalized
- files names should be all lower case
- multiple word file names linked with underscore (_ not -)
Consistency of character case is imperative. The following conventions should be used:
FILE NAMES: all lowercase characters; multiple word names should be separated with the underscore (_). For example: sitename_listen.html
DIRECTORY NAMES: All site directory names should be lowercase. In the case of multiple word names each new word should be separated with an underscore. For example: sitename_listen.
5. Navigation Systems
There are 3 general characteristics of Web site navigation systems: information organizational strategy, technical implementation, and the user interface.
Organizational Strategy
The typical structure of a web site is a hierarchy with multiple levels and sections of content. Site structures generally allow users to navigate through information, moving from general topics to specific elements and facts. Each time a user clicks on a heading to obtain more specific information, they move down a 'level' in the site's hierarchy. Each time a user clicks to access information found under a different information type, they move across content sections. To maximize usability, an effective navigation system should allow for both types of movement. Users must be able to navigate freely through content sections and levels, in a consistent and continuous manner.
For the [insert site name here] site, the main content sections will dictate the global navigational headings, and therefore represent the first level of the site after the user has reached the main page. Within each global navigation heading will be associated subheadings corresponding to the second, and then third, fourth, etc. levels of the web site. The navigation system should allow users access to all of the site's information, easy identification of location, no disorientation, and facilitate easy navigation between levels and sections.
Technical Implementation
The navigation system for the [insert site name here] site can use graphical icons, standard HTML hypertext, and JavaScript rollovers to provide global and sub-navigation opportunities to users. The global (top level) navigation elements can use graphical icons and JavaScript rollovers, while sublevel navigation can be HTML hypertext.
Basic Functionality
Graphical icons created for the global level content sections can use JavaScript rollovers to swap icons on mouseover events, adding flair and interactivity to the interface. Provided that JavaScript is enabled, most commonly used browsers (Netscape 3.x and greater, Internet Explorer 4.x and greater) can accommodate this JavaScript functionality. Users interact with the menu system by moving the mouse over the main navigational headings and clicking on them. The sub-navigation elements on a selected page reflect the user's location in the site. Navigation in levels deeper than the second or third levels is handled locally within the content section. This can be through the use of additional icons, simple hypertext links, or dropdown menu boxes.
User Interface
The user interface for the [insert site name here] site will be developed according to the constraints identified within this document and the associated Creative Brief document.
6. Functionality
The Phase 1 delivery of the [insert site name here] site will include components only as described above. Additional functionality, not included in Phase 1, but that represents potential upgrades and enhancements for Phase 2 are:
- HTML-based forms and associated form handling scripts
- Tools that facilitate the administration of the site
- Multimedia components and functionality
- Database interaction
- Dynamic page / site generation
- Personalization
- Cookies
- Surveys, quizzes, random panels.
