Guidater: HTML

Guidater

Lets Learn Coding

Latest

Recent Posts: Label / Tag Ex:

Post Top Ad

Showing posts with label HTML. Show all posts
Showing posts with label HTML. Show all posts

HTML-5 Attributes

April 26, 2017 0

HTML Attributes

In HTML5 every element contains different attributes. The attributes are used to define additional information of an HTML tag. For example you can change the length and the weight of an image using length and with attribution in the HTML tag. All the HTML attributes are defined in the first tag or you can say the starting tag. Attributes are usually defined as attribute="value". 
There are many types of attributes: 
  • The language attribute 
  • the title attribute 
  • The Href attribute 
  • The size attribute 
  • The alt attribute etc...

The language attribute/ lang 

The language or lang attribute is used to define the language of an web page. Which tag is usually used in the <html> tag of the webpage. Declaring a language is very important nowadays because it helps the search engine to find out the main language of the website it also helps you in Search Engine Optimization. This is also beneficial if if you are using a translator in your website.

<!DOCTYPE html>
<html lang="en-US">
<!--web code-->
</html>

The Title Attribution

The title attribution is used to define the title of a paragraph. It activates when when your mouse is over the paragraph so it will show you a bubble containing the title of the paragraph you have defined in the title attribution within the paragraph tag.


<!DOCTYPE html>
<html>
<body>

<h1>Title Attribute Example</h1>

<p title="Guidater blog">
Mouse over this line, you will see the title attribute as Guidater blog.
</p>

</body>
</html>

Output

Title Attribute Example

Mouse over this line, you will see the title attribute as Guidater blog.

The Href Attribute 

The href is used to define the URL address of link tag.

<!DOCTYPE html>
<html>
<body>

<a href="https://guidater.blogspot.com">Guidater</a>

</body>
</html>

Output

Guidater

The Alt Attribute 

The ALT is the abbreviation of alternative which is used to define the alternative text offer image of video. This is very helpful for search Indian to understand what all about is your video on image and also helpful for the people with the disabilities. When you put your mouse over the image of the video the alternative text will be shown in a small bubble on the screen.
Another feature of alternative text is if you video or image is not supported by the device of the uses the alternative text will be shown and the place of that image or video. This technique could be very helpful to reach out to the people with the old internet Browsers and devices.

<!DOCTYPE html>
<html>
<body>

<img src="blogger.jpg" alt="This image is not working" width="104" height="142">

</body>
</html>



This image is not working

The Size Attributes 

Decide attributes are used to define the size of a image of a video in HTML web page. With the help of lens attribution you can define the length of the image and with the attribution of which you can define the weight of an image or a video. The src attribution define the source of an media file like image and video in a HTML webpage.

<!DOCTYPE html>
<html>
<body>

<img src="image.jpg" width="104" height="142">

</body>

</html>
Read More
on No comments:
Labels:

HTML Elements

April 25, 2017 0
HTML Elements

HTML elements are consist of are starting tag and an ending tag. All the content between the tags is considered as the part of that element. For example:
<p> this is a paragraph </p>
<h1> this is a heading </h1>
There are some HTML tags which does not have ending tags and we will discuss these tags further.

Nested Elements

In HTML 5 you can use tags in a nested form like tags within the tags elements within the elements. For example:
The HTML tag define HTML language hands all the text within this element will be called as nested. Same is the case with body and header tags and many many more.
<html>
<body>

<h1>Nested Elements Example</h1>

</body>
</html>

Common Mistake

The most common mistake people make in nested elements is there they forget to end the tags. For example if the H1 tag is open and you write a paragraph within, it will be considered as heading and many time the people find it hard to debug it. The best protest is to write starting and ending tags together so that you will never forget to close a HTML tag.

Single or Empty Tags

In HTML5 most of the text contain a starting and ending tag but there are some rare cases where the HTML tag is single or just a starting tag. These elements are called empty elements. For example the <br> tag is used to break a line which does not contain and ending tag. Remember this type that does not need ending tags and if you do so it will be considered mistake in HTML5.

Note:

all the html tags are not case sensitive. Both <P> and <p> will work in a same way. The HTML 5 standards say that if you use lower case letters then the upper case letters will be more effective in a way of reading but still you can use upper case if you want. 
Read More
on No comments:
Labels:

HTML Basics

April 25, 2017

HTML Document

All HTML documents and websites are started with the doctype HTML tag. This HTML tag help the browser to understand that this is a hTML website. 
Note - This tag is not case sensitive.

<!DOCTYPE html> 
<html>
<head> </head>
<body> </body>
</html>
This tag does not have an ending tag and only used once in a website or webpage.

Headings

In HTML5 the headings are defined with <h1>, <h2> till <h6>. Each tag have a different height, font and display properties where <h1> is defined as the most important heading with the largest font size and <h6> is defined as the least important and the smallest heading font size. Each of them is used to tell Browser which heading is important and which is not.

<!DOCTYPE html>
<html>
<body>

<h1>This is heading h1</h1>
<h2>This is heading h2</h2>
<h3>This is heading h3</h3>
<h4>This is heading h4</h4>
<h5>This is heading h5</h5>
<h6>This is heading h6</h6>

</body>
</html>

Output

Paragraphs

In HTML5 the paragraph are defined with <p> and </p>. All the text between the stats will be considered as the paragraph. For example 

<!DOCTYPE html>
<html>
<body>

<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<p>Guidater is a website which provide the best HTML blogs.</p>

</body>
</html>

Output


HTML links

<a> is used to define link in HTML5. With the help of which tag you can create a link on text, video and image. 
<!DOCTYPE html>
<html>
<body>

<a href="https://guidater.blogspot.com">Guidater</a>

</body>
</html>
 Href is used to define the web address that you want to link to your content.

Output


HTML Image

With the help of HTML5 you can embed an image into your web page by giving its source in an <img> tag. You can also define the weight and the height of the image by simply giving the values in pixels. For example:
<img src="html.jpg" alt="HTML" width="104" height="142">
 
Note - The ALT tag is used to define what all the image is about. It help me search engine to read the image and also help disable people to understand it. If the image does not display due to incompatibility off the device is alt text will be shown instead of image.
Read More
on
Labels:

Introduction to HTML-5

April 25, 2017

What is HTML?

HTML stands for Hyper Text Markup Language which is the "mother tongue" of website. HTML was invented by Berners-Lee in 1990 to make a simple webpage. HTML describes the structure of a web-page or we can say that the HTML elements are the building blocks of a web-page. This web-page development language become very popular and the it laid the foundation of the websites that we use to day.

The HTML language not only empower is you make a website but also helps you to create a responsive web pages. Now a days, there are more than 9 billion web pages which are totally created by HTML. 

HTML Tags

As you know that html is a tag based language which have a closing and end in tags for example 
  • <HTML> is the starting tag of a website and </HTML> is the ending tag of a website. 
  • You can start a paragraph with <p> and then finish it with </p>. 
Both the starting and ending tags are same but the ending tag contain / in this start. Every element with in the tags is considered as the part of that tag. There are many tags in HTML like 
  • <p> for paragraph 
  • <h1>, <h2>....<h6> for headings 
  • <title> for title etc..

HTML-5

The HTML was created in 1990 and first version was called HTML 1.0 after sometime many new technologies came to the market as the HTML evolved. Now a days, web developers use html 5. There were many bugs and issues till html 4 but now with HTML 5 it is way more easy to create a web page. HTML 5 is a tag based language which have a closing and end tag. This website is also created with HTML 5. You can find out HTML of any website by going to it source code like in Chrome you can find the source code by pressing control + u. 
HTML 5 have two parts: 
  1. The Header part
  2. The Body part


Header Part

In the header part of HTML we create the path of website which is not visible to the user. For example 
  • The title page of the website <title>Page title</title> 
  • The language of the website 
  • The mata tags of the website
  • Backlinks to the websites and many many more.


Body Part

The body part of HTML contain all the code which is shown to the user. For example 
  • The text of the website 
  • The images of the website 
  • The layer of the website 
  • Content of the website etc..

Demo Code

<html>
<head>
<title>Page title</title>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
</body>
</html>

Output
Read More
on
Labels:

Post Top Ad