1990-1995 HTML developed at CERN (Center for European Nuclear Research) and later at IETF (Internet Engineering Task Force)
1997 HTML 3.2 and HTML 4.01 developed
2014 HTML5 recommendation
Dec 2017 HTML 5.2 recommendation
2018 HTML 5.3 in development
Based on the wireframe to the left
The next stage would be to decide on the structure of the web pages themselves.
In National 5 you could have created a structure similar to the one shown on the left.
Using 3 Div tags to assist in creating the structure of the page.
<div id = "top">
<h1>Company Name</h1>
</div>
<div id = "middle">
<h2>About Us</h2>
<p>Content Text here</p>
</div>
<div id = "bottom">
<h2>Best Seller</h2>
<p>Built </p>
<img src="firstStage.jpg">
...
</div>
We have used 3 individual ID attribute's so that we can select each DIV tag individually
#top{
background-color: darkred;
}
#middle{
background-color: pink;
}
#bottom{
background-color: pink;
}
The ID selectors are denoted by the use of a # symbol. If we only styled the div tags themselves then all divs would adopt the same appearance.
We have had to use the id attribute inside the DIV tags
<div id = "top">
<h1>Company Name</h1>
</div>
To ensure that our CSS selector only targets a specific instance of a DIV element and does not style every div element we create a CSS ID
#top{
background-color: darkred;
}
ID’s can act as anchors within a page too. We have discussed how ID’s are more specific than classes but if we have an ID called Contact Us such as below:
<div id = “ContactUs”>
We can use an URL of http://yourwebsitedomain.com#contactus as a hyperlink.
<a href = http://yourwebsitedomain.com#contactus > Contact Us </a>
It will automatically scroll the page down to the point in the page where the element with an ID of contactus.