Website with HTML5/CSS3 (4 pages) -- 2
Budget: $10 – $30 USD
Create a website, it can be a fictitious company. The information does not have to be real.
For the creation of this mockup you should only use HTML5 and CSS3. The file will be compressed and named as follows:
firstname_lastname1_workHTML.zip or .rar
Specifications
Structure of the website and code folders
The website shall be composed of:
o Logo or company name, navigation menu and footer
- The navigation menu must be located at the top of the site and must exist on each of the HTML pages that make up the site. The menu should be used to navigate between the different pages of the site. Finally, the menu page on which the user is currently on the website should be highlighted using CSS styles.
- The footer should contain the logos of various social networks, the company address and the legal notice.
- The company name or logo may be placed in the navigation menu bar or at the top of the page.
o A home page, to be called: index.html, which will be the front page of the website. It should contain the main content of the page. It should have at least 3 different sections.
o A gallery page, which will be called: products.html or portfolio.html, this page will be in charge of showing the works or products of the company in the form of a grid, like the typical thumbnails of a gallery of images.
o An estimate page, which will be called: presupuesto.html, on this page a form should be created with HTML5 fields to check the data entered by the user. The form fields should be:
- Name
- Email address
- Telephone number
- Request more information (it should be a multi-line text field).
A checkbox must be included where users accept the company's "Privacy Policy". In order to send the data, all the fields must be filled in and the checkbox must be ticked.
o A contact page, which will be called: contact.html, in which a map with the location of the company must be inserted, it can be an image (.png or .jpg) as well as the company's data.
o The project must be organised with a folder structure, as if it were a real project
Style
The site should have an attractive and up-to-date style. You can use paletton to help you choose the colours of the website, you can select one colour and its complementary or a maximum of three colours in addition to black and white. Remember that you can also take inspiration from real websites to create it.
Example of a current watch website: https://www.seikowatches.com/es-es
Validation
The HTML of the page should validate, the CSS should NOT.
For the creation of this mockup you should only use HTML5 and CSS3. The file will be compressed and named as follows:
firstname_lastname1_workHTML.zip or .rar
Specifications
Structure of the website and code folders
The website shall be composed of:
o Logo or company name, navigation menu and footer
- The navigation menu must be located at the top of the site and must exist on each of the HTML pages that make up the site. The menu should be used to navigate between the different pages of the site. Finally, the menu page on which the user is currently on the website should be highlighted using CSS styles.
- The footer should contain the logos of various social networks, the company address and the legal notice.
- The company name or logo may be placed in the navigation menu bar or at the top of the page.
o A home page, to be called: index.html, which will be the front page of the website. It should contain the main content of the page. It should have at least 3 different sections.
o A gallery page, which will be called: products.html or portfolio.html, this page will be in charge of showing the works or products of the company in the form of a grid, like the typical thumbnails of a gallery of images.
o An estimate page, which will be called: presupuesto.html, on this page a form should be created with HTML5 fields to check the data entered by the user. The form fields should be:
- Name
- Email address
- Telephone number
- Request more information (it should be a multi-line text field).
A checkbox must be included where users accept the company's "Privacy Policy". In order to send the data, all the fields must be filled in and the checkbox must be ticked.
o A contact page, which will be called: contact.html, in which a map with the location of the company must be inserted, it can be an image (.png or .jpg) as well as the company's data.
o The project must be organised with a folder structure, as if it were a real project
Style
The site should have an attractive and up-to-date style. You can use paletton to help you choose the colours of the website, you can select one colour and its complementary or a maximum of three colours in addition to black and white. Remember that you can also take inspiration from real websites to create it.
Example of a current watch website: https://www.seikowatches.com/es-es
Validation
The HTML of the page should validate, the CSS should NOT.