Task 3 - New Input Types, Embed Audio/Video and Use iframe

3.1 

Create an Employee Registration Form with basic attributes e.g. name, gender, email, street address, city and country, etc. Choose appropriate input type for each field. 

HTML5 introduced some new input types e.g. datetime, range, email, url, search, tel, color, etc. Update form by adding moew fields that make use of new input types. Also explore and make use of some attributes of input fields e.g. required, placeholder, value, etc.

3.2

HTML5 semantic tags (e.g. header, nav, main, article, section, aside, footer etc.) are used to make web page semantically enriched and they also improve code readability that help in code maintenance. HTML5 also allows to use Microdata to help search engines to understand webpage better, by annotating different section with the type of data they contain e.g. Person, Job Title, Product, Price, Category, Review, etc.

The Microdata Schema is defined by major search engines and available at schema.org. Developer mae use of this schema. Visit https://www.pluralsight.com/guides/semantic-html for a working example of Microdata usage. The example defines how to annotate a Person info using Microdata. You shall make a webpage that define a product. Add images, heading, product description, price, brand, category, etc. Make use of semantic tags and annotate the document using Microdata of Product schema.

Once you are done with above, make a copy of final product page, and repeat same exercise using JSON-LD standard. It also help to provide information about our webpage in a structured way to make the page precisely understandable for machines e.g. Search Engines. JSON-LD is recommended by Google. Both the JSON-LD and Microdata make use of common vocabulary published by schema.org. Visit https://developers.google.com/search/docs/guides/intro-structured-data to understand how to use JSON-LD.

3.3

Make a webpage that contains audio and video files linked to it, read w3schools pages:
http://www.w3schools.com/html/html5_video.asp
http://www.w3schools.com/html/html5_audio.asp

There is another tag, called iframe. It is used to embed another page/section inside a web page e.g. embedding a YouTube video etc. Make a helloiframe.html file such that, in the first half of the page it should display lahore.comsats.edu.pk and in 2nd half it shall display nu.edu.pk, both websites should be displayed in a single page. Read Here to understand how iframe works