Make own portfolio by maximizing the use of HTML 5, CSS 3, and Javascript, as well as bootstrap 5.The portfolio information includes:* Your data* Your hobby* Your achievement* AwardsMake sure to not use any templates from any websites.Please make sure to make a simple but elegant design.

Task 1: HTML5 Semantic Elements Create a web page layout using HTML5 semantic elements such as: o <header> o <nav> o <section> o <article> o <footer> Structure the content in a meaningful way using these elements. For example, create a blog layout with: o A header that includes the site logo and navigation links. o A main content section that holds multiple articles.o A footer with contact information and copyright notice. Task 2: Advanced Form Validation 1. Create a form with the following input fields:o Name (required, minimum length 3)o Email (required, must follow email format)o Password (required, must have at least 8 characters) o Confirm Password (must match Password field)o Date of Birth (use HTML5 date input) 2. Apply advanced validation techniques using: o The required attribute o The pattern attribute for custom validationo The minlength, maxlength, and type attributes for validation rules. Task 3: HTML5 Anchor Element 1. Add anchor…

Question p .Full explain this question and text typing work only     We should answer our question within 2 hours takes more time then we will reduce Rating Dont ignore this line

How to Create the Product webpage of Chapter 11 working with images and icons. Halloween 11 Create a product page In this exercise, you’ll create a product page that uses a variety of features for working with images. When you’re through, the page should look similar to this:   Specifications • To create the product page, you can copy the index.html file you worked on in exercise 7 to the products folder and rename it cat.html. Then, you can delete the content from the section, modify the URLs on the page as necessary, and add the content shown above. • Create a new style sheet named product.css for the product page, and copy the styles you need from the main.css file to this style sheet. Then, modify the link element for the style sheet in the cat.html file so it points to the correct style sheet. • Modify the horizontal navigation menu so it indicates that no page is current. • In the section, float the image to the left of the text. In addition, set the left margin for the text so…