Web design: What editor do you use for HTML?


Date: 28 January 2021

Close up of a woman's hands coding html and programming on a laptop. Web development web. Developer.

How things appear on your website are key to its overall look and feel but also impact how readable and easy to navigate your site is too. Using an intuitive and useful text editor can make all the difference to the speed and ease at which you apply ongoing changes to your site.

So, if you are looking for a HTML editor, there are a few options available and a few points to consider before you decide which you should use. To help you out, we have put together some useful facts, tips and a list of some of the best HTML editors.

What is HTML?

Firstly, let's define what HTML is. HTML - or Hypertext Markup Language - is the language or 'code' used to control website documents such as pages or presentation slides.

When using HTML code, your web browser is told what a part of your site you are looking at. For example, whether it's a paragraph, an image or a header.

What are the different types of HTML editor?

The two main editors are WYSIWYG (short for what you see is what you get) and plain text. Two of the more basic, plain text editors are Notepad++, which is best for Windows, and TextMate which is used for Mac operating systems. To use these kinds of editors, you will need to have some knowledge of HTML. Once you do, you will have access to more bespoke editing options.

However, HTML editing has developed over time and although 'HTML' remains the foundation, newer editing options bring about greater functionality, ease of use and accessibility. WYSIWYG editing displays the appearance of a page or document as it is being edited. It is ideal for creating pages quickly and doesn't require a deep understanding of HTML code.

Why is a WYSIWYG editor so useful?

More specifically, a WYSIWYG editor is useful if you're learning HTML coding for the first time, or do not have a lot of coding knowledge. It can prove an invaluable time-saving resource during the often-lengthy process of web design, as its use reduces errors you may not have seen in your code.

What HTML editor do you use?

If you're already using an HTML editor and want to make sure it contains all the features you needs, or are researching editors before embarking on a new web design, check whether they include the following features which are available with some editors:

  • Debugging features help to fix errors within your code by checking it and informing you of what needs to change. This is a handy time-saving feature.
  • Syntax highlighting displays text in different colours depending on which category they fit into. This visual support helps you track code more easily.
  • Code search function allows for certain code to be searched for and highlighted, enabling you to quickly find specific code.
  • Search and replace functions mean you can make a uniform edit, rather than manually searching for every instance you wish to change or correct.
  • Code validation functions are included in some editors. These check for syntax errors so they can be ironed out early on.
  • Auto-completion is a handy automated tool which inserts elements of code without you having to do so.

Popular HTML editors

When choosing the best text editor for your business, it's advisable to have a realistic handle on what your coding capabilities are, what you want to achieve with your site and how much time you have for editing. Below we have detailed a sample of some editing tools available:

  • Visual Studio Code is a free multi-platform editing program with a suite of different features available, including auto complete. It works with a range of programming languages such as Python and HTML.
  • Adobe Dreamweaver works with Windows and OS X on both front-end and back-end development. Coding is made simpler with plugins and special features. It supports both text and WYSIWYG approaches.
  • Atom is a free code editor that utilises a free software license and is itself customisable. It has a premium product feel to it and works on different operating systems.

Copyright 2021. Article was made possible by site supporter Paul Gordon of 720 Digital LTD.

What does the * mean?

If a link has a * this means it is an affiliate link. To find out more, see our FAQs.