HTML is a basic element of a website, it allows the user to create and structure sections, paragraphs, headings, links, images, and many more in a website. Learning to code HTML is the first step to become a web developer, but in this article, we will show you how you can create a simple HTML webpage right on your computer.
1) Create and loading an HTML file in your browser
Yes, you can create an HTML file directly from your computer and your browser will load that file on your computer hard drive.
If you are wondering how to make websites that can be accessed by anyone who has an internet connection? The answer is that those HTML files need to be stored on computers called servers. But the basic process is pretty similar.
To create your simple HTML webpage file:
Choose the place where you want to store the file.
Then right-click and select “New” and “Text Document.” Make sure that the filename reads “index.html” and doesn’t end in “.txt.”
When you have your file all set, you’ll want to open it in your browser.
If it has a Chrome or other browser icon on the left, that means you can double click to automatically open it. If it doesn’t, right-click and then select “Open with” and choose your favorite browser.
In the browser, everything will look blank and that is fine because you aren’t write anything in the file yet.
2) Editing that HTML file
The simplest way you can edit an HTML file is to right-click that file and choose edit, but that is the way no tech-skill people edit an HTML document.
For everyone who’s learning to code HTML, you will need a code editor, my preference is using Sublime text, but here are other choices you can choose from:
3) Basic element to create an HTML webpage
As we have mentioned above, HTML is made up of tags.
Tags are just special text that you use to mark up, or distinguish, parts of your web page. So that's why we all called it the hypertext “markup” language.
Different tags will tell the browser to display the different way content inside the tag in a specific way.
Here is one example: Learning HTML is <b> easy</b>
As you can see, all tags in HTML have an open and close tag.
For the example above, the open tag is <b> and the close tag is </b>
So, these two tags will tell the browser to make whatever text is between them become bold.
And the tag itself is invisible from your eye when you see this HTML file with your browser.
4) Basic structure and common tags of an HTML document:
Yes, you just need that simple line to create a webpage. But for a real webpage on the internet, we need to add some more tags to the file for everything to work properly.
4.1) Doctype and HTML tag:
The very first tag you need is the doctype tag. It’s not exactly an HTML tag, but it can tell the browser that this is an HTML5 document.
Here’s what it looks like <!DOCTYPE html>
This is a special tag because it doesn’t require a closing tag because it’s not surrounding any text, it’s just declaring that this is an HTML file. Other doctypes that were used in the past are HTML 4 or XHTML, but right now HTML5 is the only doctype used by most webpage on the internet.
After the doctype, you have an <html> tag. This one tells the web browser that everything inside it is written for HTML.
4.2)Head and body section:
Usually, inside the HTML tag, we will have 2 separate sections is <head> and <body>.
The head tag contains all information about the website and it’s also commonplace to put CSS and JavaScript files (So that all will be load instantly within the content).
The body tag is the place for the main content on the web page. Everything that you see on the page will usually be placed inside the body tag.
Summary
HTML is not a programming language, so it is very easy to learn and you must know well about HTML before working on any website project. And there are so many free courses on the internet to help you learning and improve your tech skill.
Source: Internet
-------------------------------
JT1 - IT Recruitment Agency
Website: https://www.jt1.vn
Email: hi@jt1.vn
Điện thoại: +8428 6675 6685
Xem thêm các bài viết khác tại: https://www.jt1.vn/blog
Theo dõi chúng tôi tại: https://www.facebook.com/jt1asia/
