FnbWorld...Taste of Good Life
News for Soul
Music
Music
Click to Open
Email

Enter text.
    INSIDE
FAQ

Direct Connect

 

DECODING THE HTML!



Gursimar Singh
Kochhar-fnbworld By Gurinder Kaur Kochhar

 

 

html 5-fnbworld

Despite our fast paced lives, modern gadgets and smart phones connect us instantaneously with friends and folks from across the globe via social media, notably Facebook, Whatsapp and twitter. Our shopping has undergone a sea-change too with just a feather-touch in a world of online purchases via dedicated e-commerce websites and Apps. For everything else, there’s google – the potent search engine.


The other day, out of curiosity, my friend asked me,“isn’t it brilliant the way people working on the Internet manage  versatile tasks at lightning speed. They must be geniuses! “HTML”, I replied. “HTML what’s that? she probed. I began sharing my knowledge with her: HTML stands for “Hyper Text Mark Up language”. Hypertext means “text with links in it.”  A Markup language is a programming language used for transforming text into images, links, tables and much more. And then there is Cascading Style sheets (CSS), which makes the web pages look attractive and act as a skin or makeup which covers the bones of the HTML. While CSS defines how the elements of HTML are to be displayed. HTML is the creation of Tim Berners Lee in the late 1980’s.

HTML basically contains instructions for the Web Browser application on your computer or Phones on how to show the website, what font? Which color? Alignment etc. We open HTML files using browser, and the browser renders (shows) the file. You can think of HTML as the skeleton that gives every webpage a structure. Using HTML we can add paragraphs, headings, images and links to a webpage using various tags. HTML works in a very simple, very logical format. It is read from top to bottom and from left to right.


“But HTML must be quite hard to work on”, probed my friend. “On the contrary, to get hold of HTML is quite simple. It would take a short time to create a basic HTML page”, I told her.


Firstly, all html files are saved with .html extension, i.e. for example let us say test.html. The syntax for writing html uses keywords in angle brackets known as tags. Tags are paired. <”Keyword or tag “>“content information “.The beginning<”keyword or tag”>is called starting tag. The ending tag is same as the starting tag with additional “/” before the name.


An HTML file can be divided into two parts: Head and Body. The head contains the main information about the webpage, like the title. This is what you see in the browser’s title bar or the page tab: the body where you add content, images, links and text. This is what will be visible on the actual page. The body tag is included inside the tag after the tag. You can create paragraphs inside the body tag by including”Your matter here”.

.

Whats HTML


The first Tag “! DOCTYPE html” tells the web browser that this is an html file. The end tag for this is “”. 

The to provides information about the document. 

The title of the webpage is displayed in the to tag.

When we open test.html in the browser we can see the below:


“That completes a basic website.”

“Wow!! This looks quite simple.”

“Let me show you one more simple tag called the anchor tag

Using the anchor tag you can send the user to another part of your website or to another website altogether. Anchor tag has an attribute called “href”. On clicking anchor tag, the user is taken to link which is provided in the value of “href”.


 “Let’s look at image tag”.

Image can be represented by tag. This tag is bit different from the other tags. Instead of putting the content between the tag we use the “src” attribute which tells the tag from where to get the image from. One more difference of this tag is that it doesn’t have an ending tag . It can be end by just using “/”.

 


For example: 


 

There are many additional tags for some complex website representation in HTML.“Let’s if we talk about CSS”…CSS can be placed inside the tag which is to be placed in the head tag of the HTML Page. 


A CSS rule set consists of a selector and a declaration. The html tag that needs to be applied style to is the selector and the declaration are the kind of styles which need to be applied to the tag.

 


“Now you tell me what the following CSS tag will do.”

“OK. I can try.” Body {background-color: orange}

“This will give the background color as orange to the webpage.”

“That’s correct!”. “ So let us incorporate what we have learnt till now.”

WHATS HTML

“Looks better.”

“We can do a whole lot with the power of CSS and HTML5”

HTML5 is the fifth revision of the HTML standards with amazing tags like svg and canvas for graphics, audio and video for multimedia and many more. HTML5 has implementation of interesting functionalities like HTML geo-location which is used to locate user position , HTML Drag and Drop which allows controls to be placed anywhere on the page and HTML storage which acts as a browser to work as a database and store values.


“Well that was quick. I feel more IT savvy now with this information”, said my friend in a flattering manner to me.

HTML has a simple and coherent syntax. The future of HTML is HTML5. HTML5 is the next HTML now. It is what we use to markup our websites.  


HTML5 tags


HTML5 introduces a bunch of new tags that are essentially used for handling the style. These are not just tag, because they have some semantic meaning like content, article, figure etc.


Most of the validations can be done using the html5 tags.  The form can automatically do the JavaScript validations like type= ‘email’, it will check for a valid email or type = ‘url’, it will check for a valid URL when a user submits their form.


One of the most important features of HTML5 based websites is that they are mobile compatible (also called responsive).  We don’t need to make a separate or new website for our Mobile/Tablets. Thus, HTML5 is not one big thing. It’s a series of a bunch of smaller things. Simply put, HTML5 is…now!

 

__________________________

The writer is a lecturer at Delhi University.

 






All fields are required.
COMMUNE/SHARE
Copyright Right Impact Media Inc., All rights reserved.2003-2018 Terms & Conditions

Valid XHTML 1.0 Strict