Skip to main content

HTML Tutorial 1: Creating a Simple HTML Document


HTML Codes Example


If you're regular in this site, you should know I am not a programmer. Several times, I've mentioned that I'm a person with no programming knowledge. Even my HTML knowledge is not good enough. Just few days ago, I decided to enrich my knowledge on HTML. I will publish HTML lessons for you. Thus you will be also learning HTML with me! Whenever I learn something about HTML, I will publish it here. 


I'm not gonna discuss about the history of HTML. Hope you all know that HTML- Hypertext Markup Language. Whatever you see on your browser when visiting any site, your browser shows it through HTML. You can easily view what a website includes. Do as below:

  1. Open any website in your browser. 
  2. Right click on it. 
  3. A menu will appear.
  4. Click on View Source/ View Page Source. 
  5. A new window will open with the HTML of that website. You will see thousand lines codes! This is how your browser see a website. 



Today I would like to start with an example. In this lesson you will learn how to create a simple HTML document. I mean you will get an idea about the basic structure of an HTML document. 

Okay let's start. The following texts are the properties of an HTML document. 
  • Copy the texts, and paste them in a notepad file. 
  • Save the document as HTML Lesson 1 with .htm or .html extension. I mean the saved file name should look like this: HTML Lesson 1.htm or HTML Lesson 1.html
  • Remember, you can save it by any other word but it should end with .htm or .html extension.
  • I recommend you to save the file on your desktop for quick access. 

<html> 
<head> 

<title>HTML Tutorial by Marks PC Solution.</title> 
</head> 
<body> 

<h2>A Simple HTML Document</h2> 
HTML- <i>Hypertext Markup Language</i>  
<p>                
Greetings from:<br> <a href=http://www.markspcsolution.com>Marks PC Solution</a> 
<p> 
Prepared by: <b>Md. Abdur Rahaman</b> 
<br>&copy;2013 Marks PC Solution
<br>Protected by: DMCA 
</body> 

</html> 


After saving the document a new file will be appeared on your desktop named HTML Lesson 1. Double click on that file. It should be opened with your default net browser. If it doesn't then right click on that file and choose open with a browser. 

After opening the document in a browser you will get the following result in the browser window:

Basic HTML Document Example


You should notice the difference between your input (HTML Code) and output (Result in the browser). In compared to the HTML you have written on the notepad is more than double what you're getting in the browser window! Are you confused with that? Actually no unnecessary commands are used in the above HTML code. Each and every symbols and characters of the above HTML code are the basic properties of any HTML document. Without them, no HTML document can be prepared. 


In my next lesson of HTML, I will discuss about the basic parts of an HTML document. And I will also try to clarify the tags, symbols, codes used in this example. Get ready for that! 


Note: In the above code, I have created gaps between parts. After html tag, head tag I have used enter. Basically in the document this space will have no effect. This space is only for your better understanding. 


Stay with Marks PC Solution to get more interesting IT topics!



Comments

  1. HTML tutorial? That's a great progress. I thought you didn't like coding/writing codes.

    Good thing! ;-)
    Knock me if you need help in anything.

    ReplyDelete
    Replies
    1. Your though is correct! :)

      I didn't like coding. And still I don't.

      Sometimes I don't find anything to write about. That's why I decided to write about HTML. I will learn and share. So that I can publish posts regularly. :)

      Delete
  2. Nice html tutorial keep on writing
    jobs in burdwan

    ReplyDelete

Post a Comment

Popular posts from this blog

GTA San Andreas Cheat Code (PDF)

After Vice City, San Andreas is the most popular game released by Grand Theft Auto (GTA). Usually GTA releases role playing game. San Andreas is such a game where you can act like a person. You can do everything. You have to take part in missions and complete them.  To make your missions easier, there are lots of cheat codes. If you can properly apply these codes, the tough parts of the game will be easier. Cheat codes are somewhat like keyboard shortcuts of computer programs.  I've shared 63 cheat codes below. There were more cheat codes in my collection, but I've omitted the less important cheats. Effects or result of the cheats are on the left side, and the codes are on the right side.  You can copy the following codes in your PC. And for your convenience, I've also uploaded a PDF file of these codes. You will find the download link at the bottom.  Effect Cheat Code Adrenaline Mode MUNASEF All Cars Explode ALLCARSGOB

Rules for Bengali Typing in PDF (Bijoy Layout)

Bijoy is the most popular layout for Bangla typing. The layout was developed by Mostafa Jabbar. He is the pioneer of Bangla typing in computer. More than 90% people use his Bijoy layout for Bangla typing. Today, I'm gonna share a PDF file with you that contains the Bijoy Keyboard layout with English fonts! If your keyboard doesn't have bengali fonts then you can print this PDF file to know where the bengali fonts are located in your keyboard. Additionally this file contains all the necessary rules and tips which are essential for Bangla Typing.  Now there are many other software available for Bangla Typing Layout. Such as Avro Easy, Unicode, Unibijoy etc. And there rules are also somewhat different from Bijoy. And some of their layouts follow the same rules like Bijoy. Hopefully this PDF file will support most of the rules when a layout is similar to Bijoy Layout.  Click to enlarge the image Download the PDF file from the button below. Follow

Download Puzzle Flash Game - Save Them

Hey Flash Game Lovers! Today you're getting an amazing puzzle game - Save Them! It's a flash game and the download size is only 382 KB. In this game, you have to move 3 missionaries and 3 cannibals from one side to another through a boat. In any side, if the number of cannibals is more than the number of missionaries, then cannibals will eat the missionaries!  Download Save Them Download the game from the above link. It's a zipped file. Download size is only 382 KB! After downloading the game, you have to unzip it first. Then double click on the SaveThem to start the game.  How to Play? After starting the game, you will get the instruction. You have to make sure that in no side, the number of cannibals is not more than the number of missionaries. This is your only challenge. You have to take them from left side to the right side of the lake through a boat.  Press on a character to jump to the boat. Thus you can take any two of them a