Saturday, 5 October 2013

10 HTML5 text editors for web developers and designers

Text editors are the essential tools for web developers.  In fact, it is also not uncommon for designers to know a bit of code editing as we... thumbnail 1 summary
Text editors are the essential tools for web developers.  In fact, it is also not uncommon for designers to know a bit of code editing as well include HTML, CSS etc. The past text editors used to be downloadable versions where we need to install. This makes them limiting as revisions are slow to come by. With HTML5 technology, we are seeing a current new batch of HTML5 text editors that are completely written for the web. The good thing is that version changes can be fast and the capabilities of these text editors can be extended via plugins or other extensions.
Below is a roundup of some of the best and free HTML5 text editors for designers and web developers.

#1: Brackets: Adobe’s opensource text editor

text editors for designers 1

Brackets was launched last year by Adobe as an open source text editor whose capability can be extended via their bracket extensions.  The entire editor was built on HTML, CSS etc which means it is very easy to work with for those who are familiar with these languages. Extensions can also be easily built based on these common web language.

#2: Popline

text editors for designers 2
Popline is a pure HTML5 editor toolbar. It floats on the things that you want to edit so it is rather cool to use. Function wise, it does not have all the bells and whistle of traditional text editor but for designers, it is definitely sufficient.

#3: Bootstrap-wysiwyg

text editors for designers 3
This is a simple but functional editor for bootstrap.  The plugin turns any DIV into WYSIWYG rich-content editor. You can see how it looks from the screenshot above.

#4: Mercury editor

html5 text editors for designers 4
One of the most powerful HTML5 editor is the mercury editor. It has a full fledged editor with support for almost all web naive language including HTML,  elements sybnax and even Javascript APIs. There is even a drag and drop function for all file uploading. Very cool.

#5: Aloha editor

html 5 text editors 1
The distinct feature of aloha editor is that it can be embedded within a CMS like wordpress. This makes page editing much faster, especially if you liked to play with your page formatting and layout.

#6: jResponse – A text editor for responsive web design

html 5 text editors 2
jResponse is an interesting text editor as it focuses on supporting responsive design within its framework. It is a bit rough right now as the program is still in beta but it is worth signing up and taking it for a test drive to see if it can improve our productivity when it comes to developing websites for mobile.

#7: WebMatrix3

html 5 text editors 3
I think most will be familiar WebMatrix3 from Microsoft. It is nice HTML5 web development tool and comes with a lot of cool features such as code completion for  jQuery Mobile and supporting a range of language include ASP.NET, PHP and HTML5 templates.

#8: Webstorm

html 5 text editors 4
Webstorm is a cool editor that comes with loads of functions. People who have tried it will know what I am talking about. It supports a wide range of web language including HTML5.  It also has a nice debugging interface that will make it faster for you to spot and repair all the bugs in your code.

#9: Raptor Editor

html 5 text editors 5
Raptor editor is one of the most beautiful html5 text editor that I have seen. Not only is it nice to look at, the editor itself is entirely modular in nature so that everything is extensible. It is literally a modern editor that is suited for both developers and designers.

#10:  TopStyle 5

html 5 text editors 6
TopStyle 5 is a very modern html5 editor that has a nice preview function for you to see real time changes. This improves the productivity of your code writing quite significantly and is one of the feature I liked best.

No comments

Post a Comment