Orion Project Proposal HTML Tutorial Website

Define

Needs Analysis HTML Tutorial sites vary in design, delivery, and breadth. There are sites for the beginning business professional, the amateur coder, the nonchalant web browser. There are very few sites that cater to every individual. HTML Tutorial sites vary in design, delivery, and breadth. There are sites for the beginning business professional, the amateur coder, the nonchalant web browser. There are very few sites that cater to every individual. Tutorial sites are often bogged down with excess advertisements and solicitations for services. Tutorial sites are often bogged down with excess advertisements and solicitations for services. Despite the call for “good” web design, many tutorial sites are difficult to navigate or are plagued with very difficult instructions. Despite the call for “good” web design, many tutorial sites are difficult to navigate or are plagued with very difficult instructions. HTML is an evolving language. Many tutorial sites are already out-of-date. HTML is an evolving language. Many tutorial sites are already out-of-date.

Problem Statement The ORION HTML Tutorial Site will feature clear navigation, an up-to-date HTML technique and tag library, a clean, advertisement-free layout, and available resources for further study, while targeting the novice HTML developer. The ORION HTML Tutorial Site will feature clear navigation, an up-to-date HTML technique and tag library, a clean, advertisement-free layout, and available resources for further study, while targeting the novice HTML developer.

Audience Team Orion understands that the novice HTML user can be anyone: casual browser, student, business professional, or doctorate holder. Therefore, the ORION HTML Tutorial Site targets a broad and vast audience, featuring content that has not been over-specialized to one particular group. Anyone who wants to learn HTML coding should visit. Team Orion understands that the novice HTML user can be anyone: casual browser, student, business professional, or doctorate holder. Therefore, the ORION HTML Tutorial Site targets a broad and vast audience, featuring content that has not been over-specialized to one particular group. Anyone who wants to learn HTML coding should visit. While it is the hope of Team Orion’s to provide useful and practical applications of HTML, the sample code will be provided in a generalized format, rendering it useful to a vast audience. This general approach allows the visitor and end-user to customize the HTML to suit his/her needs. While it is the hope of Team Orion’s to provide useful and practical applications of HTML, the sample code will be provided in a generalized format, rendering it useful to a vast audience. This general approach allows the visitor and end-user to customize the HTML to suit his/her needs.

Tasks Identify Objectives Identify Objectives Outline Content Outline Content Outline Navigation Outline Navigation Storyboard Site Storyboard Site Develop Site Develop Site Test Site Test Site Modify Site (if needed) Modify Site (if needed) Publish Site Publish Site

Responsibilities Identify Objectives – as a group, objectives of the site are to be drawn up after extensive research into existing sites and the goals of the ORION HTML Tutorial Site. Identify Objectives – as a group, objectives of the site are to be drawn up after extensive research into existing sites and the goals of the ORION HTML Tutorial Site. Outline Content – first draft Brandi, revision Diane, group revision. Outline Content – first draft Brandi, revision Diane, group revision. Outline Navigation - first draft Brandi, revision Diane, group revision. Outline Navigation - first draft Brandi, revision Diane, group revision. Storyboard Site – group brainstorm, best designer or designer of winning layout storyboards the site, group revision. Storyboard Site – group brainstorm, best designer or designer of winning layout storyboards the site, group revision. Develop Site – group development. Develop Site – group development. Test Site – input from class, group revision. Test Site – input from class, group revision. Modify Site (if needed) – group revision. Modify Site (if needed) – group revision. Publish Site – group publish. Publish Site – group publish.

Timeline Timeline from July 18, 2004 (proposal due date). Identify Objectives – August 1 (2 weeks) Identify Objectives – August 1 (2 weeks) Outline Content Outline Content General outline – August 8 (3 weeks) General outline – August 8 (3 weeks) Content written – August 22 (5 weeks) Content written – August 22 (5 weeks) Content revised and final – September 5 (7 weeks) Content revised and final – September 5 (7 weeks) Outline Navigation Outline Navigation General outline – August 22 (5 weeks) General outline – August 22 (5 weeks) Navigation mapped – August 29 (6 weeks) Navigation mapped – August 29 (6 weeks) Navigation revised and final – September 8 (7 ½ weeks) Navigation revised and final – September 8 (7 ½ weeks) Storyboard Site Storyboard Site First storyboard session – September 6 (7 weeks+) First storyboard session – September 6 (7 weeks+) Rough storyboards due – September 12 (8 weeks) Rough storyboards due – September 12 (8 weeks) Storyboard revision session – September 13 (8 weeks+) Storyboard revision session – September 13 (8 weeks+) Final storyboards due – September 19 (9 weeks) Final storyboards due – September 19 (9 weeks) Develop Site Develop Site First development session – September 20 (9 weeks+) Last development session – October 10 (12 weeks) Test Site Test Site Internal tests performed – October 11 (12 weeks+) External tests performed – October 19 (13 weeks+) Modify Site (if needed) Modify Site (if needed) Ongoing modifications as tests indicate. Final modifications done – October 31 (15 weeks) Publish Site – November 1 (15 weeks) Publish Site – November 1 (15 weeks) Total time from proposal due date to site publication: 15 weeks

Design

Objectives 1. HTML Overview 2. HTML Basics 3. Getting Started 4. Customizing the Basic Page 5. Hyperlinks 6. Tables 7. Forms 8. Multimedia 9. Frames 10. CSS 11. JavaScript and Java 12. Appendices 13. Tag References 14. Additional Resources

Content 1. HTML Overview What is it, what is it used for, what can a novice expect in attempting to learn it. 2. HTML Basics What code looks like, rules of coding, good coding principles. 3. Getting Started The basic tags of an HTML document ( ), provide descriptions of tags, show where and how to layout tags, and provide sample code. 4. Customizing the Basic Page More basic tags ( ), introduce the concept of attributes and the available attributes for the tags introduced so far (, show how to layout tags, and provide sample code. 5. Hyperlinks Introduce the concept of hyperlinks, how they work (provide visual examples of links), and introduce the tag. Discuss the attributes of the tag, show how to layout and provide sample code with visual examples of hyperlinks. Show additional attributes and discuss the idea of customizing links for a particular page. 6. Tables Introduce the concept of tables, providing examples of BOTH data tables and then layout tables, introduce the tag and its attributes, show how to layout code to maximize organization when hand coding, and provide sample code of both tabular tables and layout tables. STAY AWAY from specialized examples for a particular group (like teachers, excel users, sales professionals). Provide techniques on how to achieve a specialized table using attributes, and offer a links to additional, perhaps more specialized, resources.

Content (continued) 7. Forms Introduce the concept of forms, what forms look like in an online format, the different options for gathering information, how to decide upon a particular option, introduce the tags and attributes, show how to layout form in plain html, show how to layout form using a table, and provide sample code. Again, stay away from specialized examples. 8. Multimedia Introduce the concept of multimedia (what it is and what it looks like on a web page), illustrate the different types of multimedia (sound, video, outside elements [flash, JavaScript and java]), introduce the different methods of including multimedia a and the tags to do so, note the different file formats and the standards on including extension and plug-in download links, show attributes, show how to layout using plain html and tables, provide sample code. 9. Frames Introduce the concept of frames, show examples of pages using frames, illustrate some of the problems in usability and accessibility when using frames, provide overview of tags and attributes, show how to layout using visual examples (like the links page) and provide sample code. 10. CSS Introduce the concept of CSS and the uses and benefits, explain the differences (generally) between CSS and plain html, show examples visually (perhaps using external sources), show how to layout and provide sample code.

Content (continued) 11. JavaScript and Java Introduce the concept of JavaScript and Java as programming languages, clearly explain the differences between html and a programming language, show examples visually or explain what JavaScript and Java can accomplish, explain plug-ins, provide resources for finding outside applets, show how to incorporate applets into page’s code, show how to layout and provide sample code. Do not get into specifics about Java programming. 12. Appendices Include appendices for user’s reference of additional tags and attributes, web safe colors, special characters, an overview of how to FTP a site in order to publish it, a CSS reference, and additional JavaScript and Java references. 13. Tag References Include a detailed tag reference of both tags introduced and their attributes, tags not included or referenced in the tutorials, and the descriptions of those tags and what they might be used for. 14. Additional Resources An appendix of additional resources for CSS, JavaScript and Java, Forms, etc. This would be the appropriate place to reference resources available to specialized audiences.

Navigation Main Page Main Page Overview Overview HTML Tutorials HTML Tutorials Basics Basics Getting Started Getting Started Customizing Code Customizing Code Hyperlinks Hyperlinks Tables Tables Forms Forms Multimedia Multimedia Frames Frames CSS CSS JavaScript and Java JavaScript and Java Appendices Appendices Tables Forms Multimedia Frames CSS JavaScript and Java FTP Reference Resources Resources Additional Resources listed by category Specialized Resources listed by specialization User Forums User Forums Message boards, contact forms for user questions, concerns, or tutorial requests

Storyboard

Execute

Demo

Credits Authors: Brandi Piseno Brandi Piseno Diane Zimmermann Diane Zimmermann Demo Template courtesy of: The Template Store