What is HTML?
Let’s understand this better with an example. In order to get started off with HTML on your computer, you will need nothing more than a web browser (Google Chrome, Safari, Microsoft Edge, Mozilla Firefox etc) and a Text editor.
Setup for Learning HTML
Here are a few suggestions for Text editors that would make web computing easier:
If you are all set by downloading one of the browsers and the text editor, you can now move on to code your first ever HTML web page.
Use the following code displayed below in a new file and save it as First_Page.html.
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>My First Webpage</title> </head> <body> <h1>Football</h1> <img src="sub.jpg"> <!--Add your img with the filename & extension--> <p> <b>Why Football is my Favourite Sport? </b> Everyone has a favorite sport; my favorite sport is football. I love the game of football, it is a fun game to watch and play. The game is also a physical game to play; I love to be physical. That’s probably why I like it; also, football brings people together. There’s nothing better than getting together on thanksgiving to watch football. I like every sport, but football is my favorite because of the love I have for the game, the physicality of the game, and the way the game brings people together. </p> </body> </html>
In the above code you will observe tags of HTML that are written in the format <html> and </html>.
<html> – This is called as the open tag. Whereas </html> is called as the close tag. The close tag has a forward slash that makes it different from open tag. These start and close tags mention the beginning and the ending of the tag.
HTML structure has a systematic order. Multiple tags can be written inside one html file. As you go along, you will understand a lot more about HTML.
The HTML page has 2 Major parts :
- Head – The code written here runs before the webpage loads
- Body – The code here gets loaded last and can include link of scripts and other resources.
Below is a list of a few basic HTML tags used in the above activity :
|<Tag Syntax>||Tag Name||Tag Purpose|
|<h1> to <h6>||Heading Tags||To add headings on a webpage|
|<p>||Paragraph Tags||To display text in a paragraph format on the webpage|
|<b>||Bold Tags||To change the appearance of the text to bold|
|<img>||Image Tags||To add images on the webpage|
<img src=" your_file_destination / filename.extension ">
In the image tag src stands for the source of the file. We need to specify the file destination along with the file name. HTML then tries to fetch the image. If it is located, then the image will be displayed or else a broken image thumbnail will be displayed.
The tags which are used on the webpage have no style or CSS (Cascaded Style Sheet) applied. HTML pages without CSS do not look appealing. Download all the files from the link below and edit the file for more fun.
Full Activity Available here – Download Here
2 thoughts on “Creating Your First Web Page using HTML for Kids”