Mini web site using XHTML and HTML 5 pages, CSS formatting, web form pages and JavaScript (using objects string, array, Date, RegEx, math, cookie, jQuery, etc. and functions).
Choose one out of 3 different domains (History, Geography, or Sport) that you want to create your project. If you want to create it for different domain, you must mention it.
The web site will be formatted and using the index.html page (use framesets or table and div) as of your project first page. The page should be divided in 3 sections.
- The topmost section for presenting the logo and name of the company (Top) and also to be able to login to your web site (use as username: FName@proj.ca and as password: 123 as global variables).
- Another section (Menu) will be on the left or top section and will be used to present different options (internal links or buttons) to visit your web site.
- The last section (Content) will display the content of your selection from the Menu section web pages.
You will show only the top login section where the user can connect by using Username: FName@proj.ca and Password: 123 (use global variables) and then, the user will access the menu links and can check all the web pages of your web site.
If the username or password is not correct you will show a web page to create the account (show the right password and username to be entered).
JavaScript (jQuery) will be used into your web site pages to show or hide different fields or web elements, like login name and password, some calculated values, like the subtotal and total amount, the current time and date, that will be shown on some web pages by using cookies.
The web pages will be created by using XHTML/HTML5 and CSS, and of course, will include JavaScript (internal and/or external).
The 1st and the 2nd page will describe the subject you choose: a region, a country, a city or a culture. Use internal links, tables, div, images and text formatting by using CSS (internal, external and/or inline). The description should be divided in multiple sections having images, headings and paragraphs and use internal links to go from top menu to some section and back. Use CSS formatting: margin, padding, borders, float, text alignment, colors and/or background colors (XHTML).
The 3rd page will use an image and mapping some different areas using the appropriate shape to present some information (text and images), related to the topic that you choose (use internal and/or external links and HTML5 tags).
The 4th page will present some information of your subject in details by using JS and form fields for the search on a particular keyword based on your topic (use HTML5, arrays and functions).
Example:
If the user is searching for: canada or CANADA keyword, if this keyword is into your array of keywords, the Content of the page will display the information related to the keyword (text and images), and give the possibility to search for some other subjects or keywords. If the keyword is not find, an error message, and a selection of some keywords to be used will be displayed. Use JavaScript objects and methods (document, array and jQuery) in order to control the information to be presented.
The 5th page will contain a form and, will have different input fields (at least 6) for user identification, or to have a subscription to a service or a blog, or to enter some comments about your web site. The web page will validate the entries (Regular Expressions), calculate the time the user takes to fill up the form, and present all the entered information and the time on the next web page using JS cookies (HTML5).
Validate all the forms fields by using Regular Expressions before "sending" the information to the server or to others web pages.
The 6th page will contain all the references URL of the web sites that you did use for the images, text or some other elements that you did use or get inspired by (HTML5).
Add references to the existing web sites from where you get the information to build your web site.