Getting started with HTML is not complicated, but you have to be very careful when entering tags and attributes. Any error will cause the page you are building not to display correctly in the browser. When this happens, analyse the code and try to locate the error. Getting it wrong at the beginning is the best.
Let's get started in the html language for this we are going to create a Fake news invented by you. It has to be something that looks realistic, with a catchy headline, take care of your written expression and add an image.
Open Notepad by going to Start / All Programs / Accessories / Notepad/Pen Text Editor.
Save the document as Practice6.FirstNameLastName.html . It is very important that it is saved with the web page extension .html otherwise it will not be displayed in the browser.
In the structure of a web page there are three main tags that belong to the general structure of the page.
The first is the start tag <html></html> This tag indicates the language in which the document is written, where the page starts and where it ends. The other two are inside it.
The second <head></head> Inside these tags is where the information about author, language, title .... is information that is not shown on the page.
The third <body></body> Between these two tags is where you find all the content of the page. In short, what the website shows.
They are distributed in this way, This is the initial form any web page.
<html>
<head>
</head>
<body>
</body>
</html>
Once you have this structure in the document we are going to add the information and the design of the page:
Between <head></head> tags in the header section is included:
Add title Fake news add these tags inside Head.
<title>page title</title>.
Now we expand the information of our page with these tags, write them inside head in a new line, the first is to recognize the keyboard characters such as accents, the second you have to put your name in quotes, the third is to indicate the language in which the page is written.
<meta charset="utf-8"/>
<meta name="author" content="Author's name" />
<html lang="en">
Between the <body> </body> tags inside the body section.
Come up with a title for your fake news, it has to be a headline that engages and catches the reader's attention. Titles are tagged with:
<H1>news headline</H1>.
If you would like to add subtitles we can do this at a smaller size <H2> ....hasta <H6> following the same procedure.
Then add the content of the page, i.e. write the news separated into paragraphs. The tag is:
<p>Write the paragraph</p>.
<p>another paragraph</p>
if you want to change the line (line break) at some point write this tag <br> without ending.
Finally, we will add an image to our page from an internet link. The image can also be found in the Body section. Look for an image according to the news we have described, click on the right mouse button and select the option copy the address of the image. Insert the image with this tag and enclose the URL of the example image in inverted commas:
<img src="https://www.example.com/images/dinosaur.jpg">
Save the changes to the file and exit the editor.
Let's see the result. Access the file by double clicking on the file you just created. Your default browser will open and you should see the result.
Finally, upload the file Practice6.SurnameName.html to the virtual classroom.