Reference no: EM131106114
Assignment Description:
For this project, you will work with a partner (one other person) and select one local service agency from among several for which to create a web site (no less than three pages). The agency has supplied the content for their website, and you will structure the website design and rearrange the content (text, graphics and data) into a website according to (if supplied) the agency's preferences. Your focus will be on professional design elements, adding value, and following the customer's instructions.
XHTML will provide the structure of your pages, and CSS will be used for all formatting, including - as much as possible - the layout of the html elements. Tools permitted include text editors with syntax highlighting and tag completion (e.g., NotePad++, HomeSite+, etc.), text editors with drag-and-drop capabilities (e.g., DreamWeaver, NVU, etc.), pre-existing website templates found online (you must retain all credits to the original source as required by any license agreement), and any FTP or SCP application of your choice.
As you work on your project over time, you will periodically submit your work to your instructor and incorporate feedback appropriately after each milestone due date as follows:
1. milestone 1 (ms1) is due at the end of the second week of the project
2. milestone 2 (ms2) is due at the end of the fifth week
3. milestone 3 (ms3) is due at the end of the seventh week
In each case (above), the "end of the week" means Friday at midnight. Your lab instructor will support your progress toward each milestone. For each milestone, both you and your partner will receive identical grades.
This assignment involves the following tasks:
- Cleaning up, Formatting, and Documenting the Code
- Updating and Modifying the XHTML and CSS
- Improving the Website
Conditions of Satisfaction:
To be considered for grading, your submission must meet the following conditions. If they do not, the corresponding points will be deducted from your grade:
- When a contemporary browser opens your URL, it must automatically display your index page. In order for this to happen, your website must be uploaded onto Mercury, be saved to your witnt, folder, and your home page must be given the name indexiaml.
- Your website should be professional, in good taste, and must not violate the Code of Student Rights, Responsibilities, and Conduct. Washes which serve to devalue a person or group of persons, or which are derogatory, hateful or intimidating to a person or groups of persons based on gender, religion or ethnicity miss the intent of the assignment and will be rejected.
- Your website must make use of external Cascading Style Sheets (CSS), and the <link I> element must be in the HEAD section of the document of each web page that is a part of your website.
Instructions
Clean Up, Format, and Document the Code
- Remove extraneous code (unnecessary meta tags, incomprehensible comments, tables that don't serve much purpose or which need to be convened to css, scripts that you will not be using, etc.) Filenames should not include spaces, parentheses or brackets.
- Apply a style of your choice to the code. This involves inserting tabs and spacing to make the code readable to both yourselves and others who want to modify the site, and to demonstrate the hierarchical structure of the elements (i.e., to show which elements are contained within other elements, etc.)
- Markup your code with useful and explicit comments so the agency (and your instructor) can see what you have done, and to make debugging easier.
Update and Modify XHTML and CSS
- The layout of each page should provide a consistent look throughout the website, making use of sections. Therefore, insert <div> tags with the following classes or identifiers: "heading", "main", and "footer". Include a logo image in <div id="headine, the primary content in <div id="main">, and a copyright in <div id="footer">. Since the content belongs to the agency, they retain the copyright. (You can put your name on the project in a well-placed comment within the code on each page).
- Use an additional <div> with id="all" to control properties such as margin, width, and background. The other <div> tags should be contained within this one.
- Create an external style sheet named "style.css" and link it to each web page on your site. Use at least five of the following html selectors or css properties below (you will assign your own values):
- <hl>, <h2>, or <h3> as appropriate. (Counts only once).
- Create a class of <p for a distinguishing purpose (a magazine pull quote, for example). Use at least once; class="shade".
- Use a descendant selector other than an anchor tag.
- Tables should be indented left and right, and have a background color distinct from the body background. Table headings should have a distinguishing property.
- Choose a contemporary professional font for all pages, except where it may be appropriate to use italics or bold. Avoid the use of whimsical fonts.
- Make use of background images for at least two elements.
- Invoke the float property appropriately.
On each page the navigation should include a link to "home" (index.html).
- Follow the current xhtml standards (i.e., every tag requires a closing tag). Supply a DOCTYPE with valid DTD (we will use XHTML 1.1). Validate your website (xhtml and css) using an approved validator.s
Improve the Site
Choose two or more ways to improve the site overall. Each item is worth 3 points, for a maximum of 6 points.
- Modify index.html to be appealing and descriptive of what the agency's social issue is and what they arc doing to address it.
- Move content from large, difficult-to-understand pages onto easier-to-use, shorter pages designed for a narrow topic. Use appropriate links or submenus.
- Improve the layout of all pages. Different from the above option, this would involve moving the content itself into better positions using recognizable layouts. Avoid content straight down the center of the page, with no complementary text to the left or right; avoid stacking each element in blocks and content-dominant sections with large, unexplainable "white space".
- Incorporate pages with little to no content onto higher-level pages in an elegant way. Remember that some pages might be under construction and will be used later by the organization.
- Standardize the navigation for all the pages. This should include identical language and position on the web pages. Use lists or apply styles to anchors.
- For an image gallery, be sure to make thumbnails of the images and link from the thumbnails to the high-resolution images.
Milestone 1 - The Home Page
The skeleton of the website has been created, including sections <div>, customer-specific navigation and improved layout. A simple theme is noticeable. Comments have been inserted to document the code appropriately. The main/index page is located on Mercury and you have registered your URL in the student showcase.
Milestone 2 - The Wide Load
You have a style sheet for your website. The website shows marked improvement. All pages are present even though some images may be missing. Navigation is complete. Styling is at least 50% complete. Site is on Mercury.
Milestone 3 - The Home Stretch
Links maintain integrity when copied to Mercury. The site looks professional. Styling is 90% complete. Documentation is at least 50% complete.
Complete the Project
Styling and documentation are complete. You are satisfied with the results. Upload all files into your group's web account.
Update your URL in the showcase if it has changed.
Zip your web pages along with your image(s) and style.css file, and upload them to Oncourse.
Project
Our Philosophy:
Everyone needs their morning coffee and it may not always be readily accessible on your commute. It is our philosophy to position our business where customer options are limited and make it as quick and easily accesible as any other fast food restaurant or coffee shop. Mobile Brew Drive Thru... find us where you never thought your morning coffee would be.
Our Vision:
Stirring up the way coffee is served.
Attachment:- web question.rar