HTML EDITOR
Thursday, June 30, 2011
EDITOR
This page provides an explanation of HTML editors and discusses the features that make them different to a normal text editor. There's also an overview of WYSIWYG editors, which are included in some of the better HTML editors.
So anyway, what is an HTML Editor?
An HTML editor is a specialized piece of software that assists in the creation of HTML code. Similar to text editors such as Notepad and TextEdit, HTML editors allow users to enter raw text.
Most (if not all) professional web developers use an HTML editor to create and maintain their websites. This is because a good HTML editor can boost productivity enormously.
HTML Editor vs Text Editor
The main difference between an HTML editor and a simple text editor, is that the HTML editor has more functionality - functionality that assists in creating web pages quickly and easily.
While it's true that you can code HTML using a basic text editor, an HTML editor will make your life much easier. For example, an HTML editor will detect when you write an opening HTML tag, so it will automatically insert the closing tag for you, thus reducing the amount of typing required.
Some HTML editors are a "WYSIWYG editor", allowing you to edit in WYSIWYG mode. This can make it extremely easy to create a website.
What is a WYSIWYG Editor?
Perhaps the question should be "What is an HTML editor with WYSIWYG mode?". WYSIWYG stands for "What You See Is What You Get". When an HTML editor is 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.
Most WYSIWYG editors allow the developer to move page elements by "clicking and dragging" them around the page. Formatting text with a WYSIWYG editor is a simple as highlighting the text, then clicking the "Bold" button (or whichever button you need). Just like in a wordprocessing program like Microsoft Word, or a desktop publishing application, such as QuarkXpress. which 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".
HTML Editors - Features
Like any software, different HTML editors have different features. However, there are some features that are inherent in most HTML editors. For example, one would expect that even the most basic of HTML editors would include the "autocomplete" feature (where the editor automatically inserts closing tags, double quotes for attributes etc).
Here are some of the more common features seen in HTML editors:
* HTML and CSS autocomplete. Sometimes called "code completion", the autocomplete feature detects when you begin to type HTML or CSS. It will then automatically insert the rest of the HTML/CSS code for you (for example, closing tags).
* HTML entities library. This feature allows you to insert HTML entities with a click of the mouse. (What are HTML entities?)
* Site Explorer. This feature allows you to navigate the files in your website using a hierarchical menu (similar to Windows Explorer).
* Built in FTP client. Some HTML editors enable you to FTP to your web server straight from the HTML editor. In other words, you can publish your changes without having to fire up a separate FTP client. This makes publishing much quicker and easier.
* Search and Replace. Most HTML editors have a search and replace of some kind. Some of the better ones will have advanced features, such as being able to search through a whole website project and searching only certain file types (eg, only files with an .html extension).
* Split-Screen View. This is where you can set up the screen to show half code, half preview.
These are only some of the many features that you're likely to encounter when searching for an HTML editor. Some features can really make your life much easier, so it's often better to pay a bit extra and get a full-featured editor.
Advanced HTML Editors
If you intend to code using more than just HTML and CSS, you may find a basic HTML editor very limiting. That's because, many basic editors don't support scripting languages such as JavaScript, PHP and ColdFusion.
Most web developers use more than just HTML and CSS and it can become laborious having to switch between different editors for different languages.
That's why more advanced HTML editors like Dreamweaver are so popular with professional web developers. DreamWeaver supports all sorts of languages and technologies including HTML, XHTML, CSS, XML, JavaScript, Ajax, PHP, ColdFusion, and ASP. Plus it enables database connections, FTP connections and more.
Example HTML Editors
Adobe DreamWeaver
Adobe Dreamweaver is the industry leader when it comes to HTML editors. In fact, DreamWeaver is more than just an HTML editor. It's a full-blown web development application. DreamWeaver supports most leading web technologies, including HTML, XHTML, CSS, XML, JavaScript, Ajax, PHP, ColdFusion, and ASP.
DreamWeaver simplifies some of the more complex tasks of website creation. For example, connecting to a database is a breeze, writing AJAX solutions are a breeze.
But DreamWeaver isn't just suitable for professional web developers. In fact, if you're just a beginner, DreamWeaver is probably one of the best pieces of software you could get your hands on. Partly because it's easy to use. But also because you'll find that once you start using DreamWeaver, you'll learn so much more. For example, you can use a wizard to do something complex, then you can look at the source code to see the code that was generated. Also, DreamWeaver includes "intelligent coding assistance" which can help you code HTML, JavaScript, and AJAX frameworks such as Spry, jQuery, and Prototype. It also provides code hinting for PHP, and a bunch of good-practice CSS templates for your use.
*
CoffeeCup HTML Editor
CoffeeCup HTML Editor is a well known HTML editor that includes HTML and CSS support, split screen view, HTML entities library, built-in FTP client and more.
CoffeeCup contains all the features you'd expect from a basic HTML editor and more. However, if you need to do more than HTML/CSS coding, you may find yourself forking out for extra software.
But don't get me wrong, this editor is great if you only intend to code in HTML and CSS. But if you need an HTML editor that supports more advanced features (like PHP or AJAX support, connecting to a database etc), then try DreamWeaver.
Subscribe to:
Posts (Atom)