HTML Basics Part 4: Getting Started with HTML
In this post, I will talk about the basics that you will need to get started building your very first web page with HTML.
You can start working with HTML right away. HTML does not require an HTML editor or special software. You can write HTML code and display it on a web browser on any platform as long as there is a simple text editor such as Notepad for Windows or TextEdit for Mac.
Furthermore, you don't need a website or a web server in order to write and test HTML code, your local PC or Mac will be enough for you to work with HTML. This is great, isn't it?
You might want to use higher level paid software with enhanced features such as Adobe Dreamweaver or Microsoft Visual Studio but free text editing tools like Notepad or Notepad++ will be enough to start with.
Actually, simple text editing tools are also used by professional coders and it is always better to keep things as simple as possible while starting out. That's why we will be using Notepad in this tutorial.
If you are ready, let's start with creating your first HTML document.
Create Your First HTML Document
1. Create a new file with Notepad and insert the following HTML code in it.
<title>My First Web Page</title>
<p>This is my first web page.</p>
Change the title and the paragraph text as you wish. Please do not copy-paste at this stage, because if you write the code by your hand you will learn HTML faster.
2. On the Notepad menu, go to File > Save As and save the file to your desktop or tutorial folder with the name of your choice but don't forget that it should have .html (or .htm) extension, e.g. "mypage.html".
3. Double click on the file and it will be opened with your default web browser (Firefox, Chrome, etc.). In the browser window, you will see a mostly blank web page with a title displayed on the browser's title bar and one paragraph of text.
Congratulations! You've just created your first web page. Play with its title and the paragraph as you wish and see how it updates in the browser as you save the HTML file and hit refresh button of the browser.
Note that you can use either .html or .htm as the file extension. There is no practical difference but if you want to learn more about why two extensions exist please check our following article: What is the Difference Between .html and .htm?
Don't worry about how your first web page looks. HTML is not about the style but it is about the structure of the web page. As you improve your knowledge in HTML and CSS, you will be designing nice looking sites.
Now that you learned how to create and save HTML documents, we can continue with the next part where we will briefly talk about HTML syntax.
More HTML Tips
HTML Basics Part 3: What is HTML (in Detail)? HTML Basics Part 5: HTML Syntax HTML Basics Part 2: The Structure of a Basic Web Page HTML Basics Part 6: HTML Tags HTML Basics Part 7: HTML Elements HTML Basics Part 1: Introduction to HTML HTML Basics Part 8: HTML Attributes HTML Basics Part 9: HTML Main Elements Publish Your First HTML Website Online Today How to Change HTML Code in Multiple Files at OnceHTML Tips