To development and create a website using the development process outlined in Chapter 10 of the Textbook and applying knowledge and hands-on skills learned throughout the semester (including Chapters 1 through 9).
You will conceptualize, analyze, design and code a professional website using the knowledge and skills you have gained throughout the semester. You MUST select a topic from the list below for your website:
Topics
1. Project Proposal and Plan
a. Conceptualization:
What opportunity or issue is the site addressing? What is the motivation for the site?
What are the short-term goals?
What are the long-term goals?
Who is the target audience?
What value is being created for whom through this site?
b. Analysis:
Functional requirements
Environmental requirements
Content requirements
c. Design:
Site organization/architecture
Prototypes - wireframes
Color scheme, logos, images
Site layout
d. Testing plan:
What browsers and browser version are being used for testing?
Mobile devices
e. Accessibility:
What accessibility standards did you implement?
f. What domain name has been selected for the site?
g. Assuming this is a real business - provide a list of possible team members and their roles to continue and maintain this web site project on an on-going basis.
Basics:
1. The site should have at least 5 pages
2. Property coded HTML elements
3. Properly code CSS selectors
4. CSS and HTML must be validated:
a. https://validator.w3.org/
b. https://jigsaw.w3.org/css-validator/
Page layout and design:
1. You decide on the site layout. You can use a two or three column layout or one you create yourself.
2. Build the page layout using the box model and CSS
3. Use at least one float
4. If you wish you can use additional HTML5 Structural Elements see page 282
Hyperlinks:
1. Each page in the site should be linked to the other pages in the site using the Anchor Element < a>< /a>
2. Use relative hyperlinks in the navigation area
3. Links on each page of the site should appear in the same order
4. Use CSS Interactive PseudoClasses on the navigation, and remove the bullet and underline
Site styling with CSS:
1. Most of your styles should be contained in an external stylesheet. In the external style sheet:
Use mostly html selectors
Use class selectors
Use id selectors
2. Center HTML elements with CSS - width, margin-left and margin-right
3. Use box-shadow and textshadow
4. Use rounded corners, opacity, and gradient if appropriate
Images:
1. Find some images that work with your layout and enhance your design
2. Optimize the images
3. Make the images are of proper size for your web page
4. Apply at least one image on each page
5. Use some of the HTML5 image elements
Tables:
1. One table
Forms:
1. One form - could be a sign-up form or an email form
Mobile design:
1. Apply responsive website design using CSS media queries