1. A website created in HTML and CSS.
2. A written report detailing how you built your website.
Create a travel-guide web site for a European city.
This page should contain introductory information about the city. It will include one or more indicative images of the city. It should also include two short reviews of the city from members of the public. Each review should have an accompanying image of the reviewer.
This should be a single column page
Look at, and learn from, existing travel guide sites.
This page should contain information on at least four places to visit in the city. Each place should be presented in its own container. Each container should contain the following information:
Name of the place
Photo of the place
Short description of the place
Opening hours (if applicable)
Entry-price (if applicable) Tips
In a larger display, places should present in a single row. In a smaller display, places should present in a single column.
Make sure images are of a high quality, and are consistently sized
This page should contain introductory information on transport in the city. It will include basic facts about rail, taxi, metro and bus services.
Use the travel icons provided in the resources folder to denote different transport services.
This should be a two-column page in desktop. Use the left-hand column for secondary navigation elements. In smaller displays it should be a single column.
Travel tips page
This page should include five short travel tips for visitors to the city. The travel tips can be about any tourist related matter (e.g. currency, health, taxis, eating, language, etc.).
This should be a single column page.
Your site should include a primary navigation menu, footer links and header links on all pages. It should also include a secondary navigation menu on the transport page, with links to pages (not implemented) on rail, metro, bus and taxi services.
Your site should include at least two examples of the following
Box model properties (e.g. margin and padding)
Use Google Fonts.
Use CSS techniques to enhance readability (e.g. line-height).
Select and implement an appropriate colour scheme using Kuler or a similar tool.
Demonstrate at least two different ways of defining colour in your CSS (e.g. RGB, HSL, etc.).
Write standards complaint HTML. Validate your pages.
Structure your content using HTML semantic tags.
Make use of a full range of HTML elements to mark up content.
Use attributes, as appropriate.
Use relative path names for links to stylesheets and images.
Do not use HTML tables for layout.
Write standards compliant CSS.
Use an external CSS file. Include examples of class and ID selectors.
Include examples of group and descendent selectors.
Include examples of pseudo classes. Content
Write short, clear, concise content. Do not use placeholder text.
Include copyright attribution for any image or text that is not your own.
General Authoring Skills
Indent your code and add comments where appropriate.
Create a well-organized, appropriately named set of files and folders.
2. Report (25%) Create a short report (500 – 750 words) in MS Word format.
The report should include the following.
An explanation of how usability and accessibility have informed the design and implementation of your site.
An explanation of how HTML semantic elements have been used to build your site.
An explanation of the layout techniques that have been used in the implementation of your site.