HTML Editors and Browsers

Where should I write my HTML code??

Well, that’s really simple. Any normal text editors like Notepad or TextEdit can be used to write HTML code. But to develop a website that would hardly be convenient.

So there are many HTML editors available which make writing the HTML code comfortable and easy. Mainly what an HTML editor does is

1. Highlighting the syntax i.e. coloring of the code
2. Auto-completion i.e. adding the ending tag automatically when you type the starting tag.

It not only makes the code look prettier but also mitigates the fatigue while writing a long code. There are many HTML editors available, some of which are

• Notepad++
• Brackets
• EditPlus
• Espresso
• TextPad
• UltraEdit

And much more which provide an extra feature or two which increase our productivity.

Also, most recently we have WYSIWYG editors. WYSIWYG stands for “What You See Is What You Get”.

While in WYSIWYG mode the HTML page is rendered as though it is being viewed with a web browser. The only difference is that the web developer can edit the page at the same time.

To list a few advantages of this editor:

• Page elements can be moved by simply “clicking and dragging” them around the page.
• Formatting of the text with a WYSIWYG editor is very simple. For example, if you want to highlight the text, then clicking the “Bold” button would do it for you; just like in a word processing program like Microsoft Word.
• Allows you to see what the page will look like while you’re editing it? It’s kind of like editing a preview of your web page.

Although usually referred to as “WYSIWYG editors”, these are better described as an HTML editor with WYSIWYG mode. The user can switch between “Code view” and “WYSIWYG view”.  Adobe Dreamweaver is an example of WYSIWYG editor

But it is recommended that while in the learning phase uses the basic text editors because it will help you create clean code and really dig into web development. Having the ability to look at the page with a text-based HTML editor is essential!

How will you create a webpage using text editor??

Step 1: Open any text editor and write the HTML code. For example:

Step 2: Save the file on your computer.

• Select File > Save as in the Notepad menu. Just remember to add the extension “.htm”.

For example, name your file as “Firstprogram.htm”.

• Then change “Save as type” to “All Files”.
• Lastly, select encoding UTF-8(recommended standard).

HTML BROWSERS

How do I view my program in the browser??

For that, you have to open the saved HTML file in any browser.

Step 1: double click on the file or right-click on the html document and choose “Open with”.

Your program will look like this:

Thus, we have learned how to edit and view the HTML web page.

PS: For any questions, queries, and feedback, feel free to write us at amruta@qatechhub.com or support@qatechhub.com. Happy Learning 🙂