Translate

Tuesday, 17 November 2020

Introducing HTML

Making A Website via HTML

Make Your Own Website




Everything on the World Wide Web(WWW or web for short) is specially designed.
Websites are created in a coding language called HTML. HTML stands for "HyperText Markup Language". Hypertext refers to text that is viewable on the web.
The definition of hypertext is "a computer-based text retrieval system that enables a user to access particular locations or files in webpages or other electronic documents by clicking on links within specific webpages or documents."

Nowadays, a new version of HTML, HTML5 is used. HTML did not support vedios and audios. Users needed to type long codes to enter vedios and audios. HTML5 has made this easier. Now, editors don't need to type very long codes to insert audios and vedios into a website.
HTML uses ‘tags’ to define tasks. Html tags are denoted by "<" & ">". For eg.: <html> defines the begining of a web page. For ending html tags, we use "/" within "<>". For eg.: </html> determines the end of your webpage.

HTML documents can be made in any text editing software or html coding application. I will prefer the usage of Notepad or Atom or Notepad++ or a paid html editor software because most free html editors lack some tags and other features as well. For making a text document an html file, save it with the extension: .html (for eg.: untitled1.html)

Lets look at some basic tags in HTML5. These are listed in the order they are used:


<!DOCTYPE html>: This defines the begining of an HTML5 document.

<head>: This will help you give a name, description and metadata to the webpage.

<title>: This exactly names the webpage.

</title>: This marks the end of the "title" tag.

</head>: This marks the end of the "head" tag.

<body>: This defines the start of the viewable part of the webpage.

<br>
: The text typed after this is shown from a new line. This tag does not require the closing tag. Such tags are called 'empty tags'.

</body>: This marks the end of the viewable part of the webpage.

</html>: This marks the end of the webpage.



The "!DOCTYPE" tag is called the Doctype declaration. The Doctype declaration before the html tag declares that the document is an HTML5 document.

Now, see this example code(You may even copy it): 

<!DOCTYPE html>
<head>
<title>
This is an example webpage.
</title>
</head>
<body>
Hello Viewers! This is an example. <br>
This is the "br" tag.
</body>
</html>

Now save this file with .html format.(I saved it as example.html)
Then open the file in your browser. For eg.: a file made on notepad and saved with .html extension, when opened, will directly open in browser. If you have made your file in an html coder, then run the module(it may be done by the "play"/"browse" icon.) This will give the following output:

html output


This was just an introduction. For learning more, refer to the links below. More links will be provided below in the next update.


  1. Adding Background Effects To a Webpage.
By- Soham Kakkar




For updates, this website.


Adding Background Effects

Learn making a website

Add Background Effects to Your Webpage.




You now know how to make a webpage. Now, we shall learn how to make our webpage more beautiful by adding background effects.

So, lets begin.

Background Effects


You can add background effects to your webpage using some attributes to the "body" tag. Attributes are used in this format: . These are:
Attribute Example Input Description
bgcolor <body bgcolor="yellow"> This defines the background colour of the webpage.
background <body background="IMG-0133.jpg"> The referred image becomes the background.
topmargin <body topmargin="100"> This defines the distance(in pixels or percentage) from the top of the webpage, where no text can be entered.
leftmargin <body leftmargin="30"> This defines the distance(in pixels or percentage) from the left edge of the webpage, where no text can be entered.
text<body text="blue"> This defines the colour of the text in the entire document.


These were some of the attributes of the body tag. These tags allow you to make your webpage more adorable.
See this example code:

<!DOCTYPE html>
<head>
<title>
This is an example webpage.
</title>
</head>
<body bgcolor="blue" topmargin="10%" leftmargin="5">

Hello Friends! Welcome to your new code <br>
This is an html house.
</body>
</html>


This will give the following output:

O.K.! Now you will very well be able to add background effects. So, you can now programme basic webpages.


This was just an introduction. For returning to home page, click here.

For more information, links will be provided below in the next update.
By- Soham Kakkar




For updates, this website.