Businesses hire web developers to create websites for their organizations. They are now a critical component for any business to stay competitive. A website has a front-end and a back-end. The front end is what users see and interact with when they open a website i.e. the structure of the web page, its layout pattern, text styling, drop-down menus, interactive graphics, etc. The back-end comprises a server, an application and a database for storing data.
TOOLS YOU NEED TO INSTALL
- Google Chrome Browser (which already comes with chrome developer tool CDT)
- Sublime Text 3
- Browser Sync
NOTE – Browser Sync gets installed using the Node.js package manager (NPM) installer so you need to install Node.js first before installing browser sync..
ROLE OF HTML5
HTML stands for Hyper Text MarkUp Language. Hypertext is text which contains links to other texts and that’s basically the entire web, right? Markup means to mark something up, to annotate. So what HTML does is it annotates the content to tell the browser, or to tell some other machine out there, some other program out there, what this content is i.e. whether a heading, a paragraph ,a list,etc.
HTML is not case sensitive.
ANATOMY OF AN HTML TAG
Source Google* HTML consists of series of elements. * HTML elements are represented by tags. * For example to represent some content in paragraph, we use p element inside a tag i.e. <p>….</p>. Such elements have an opening and closing tags. * Now some elements are inside self closing tags which do not have content inside them like <br> for line break or <hr> to make a horizontal line. (SELF CLOSING TAG is an an xml type of shorthand notation).
- Every HTML element can have predefined attributes.
- An Attribute is a name value pair, which is kind of a meta data about the element itself that it’s being applied to.
- Attributes are specified only on opening tag.
BASIC HTML DOCUMENT STRUCTURE
Declaration : – <!Doctype html>
This declaration is used by the browser to distinguish between the compliant and non-compliant web pages. Compliant web pages are those which follow the HTML5 standards as proposed by W3C. * After the declaration, we have an html tag which contains the entire html document. It contains the head and body tags respectively. * The head tag contains items that describe the main content of the page. Things like what character coding should the browser use for the main content. It can contain authors description of the page, page title, and whatever other external resources are needed to render the page properly, among other things. * It’s always a good idea to specify the character set that the browser should know how to interpret the content of the webpage. The most commonly used character set is UTF 8. Also note that the meta tag is a stand alone tag. * Body tag contains the main contents of the web page i.e. paragraph elements, section, headings, links, lists, etc.
HTML CONTENT MODEL
Content Model tell us which element is to be nested within which. HTML 5 split the two basic content models into seven categories.
The two basic types of content models are: 1. Block Level 2. Inline Level
SOME NEW FEATURES OF HTML5
HTML5 offers new semantic elements to define different parts of a web page which will help you to create your web pages easily.
It allows the browser to display certain characters it would otherwise interpret as part of HTML code and not something display to the user.
To safeguard against more limited character encoding e.g. & quot which might turn to some wierd character in some other character set.
Keep up with the series to know about the most commonly used tags in the next part.
ABOUT THE AUTHOR
Veena Chaddha is a student at SRM University, pursuing a btech degree in computer science engineering. She is an avid learner and a tech enthusiast. Her skills are HTML, CSS, Bootstrap, Nodejs , Flutter and is looking forward to be a software developer. She is well versed in English and has good communication skills.Veena Chaddha
If You find it interesting!! we would really like to hear from you.
Ping us at Instagramfirstname.lastname@example.org
IF YOU WANT ARTICLES ON ANY TOPICS DM US ON INSTA.
Thanks for reading!!