Está en la página 1de 11

Los 10 mejores editores gratuitos

(o casi) de HTML, CSS y


JavaScript
Escrito por Jos Manuel Alarcn el 28 mayo 2014 09:00

Problemas con interfaces web? Necesitas nuestro Curso Online


de HTML5 y CSS3. Haz clic aqu!
Lo nico que necesitamos para crear pginas y aplicaciones web es un
simple editor de texto plano y nuestra imaginacin. El propio Bloc de notas
o

similar

que

viene

con

Windows

nos

sirve

perfectamente.

No

obstante siempre viene bien contar con el soporte que nos brindan
ciertas herramientas especializadas.
Las ms potentes nos ofrecen todo tipo de ayuda contextual para no tener
que recordar cada detalle de los cientos de atributos de CSS y etiquetas HTML
disponibles, vista previa de las pginas que estamos creando, soporte de
navegadores, validacin de etiquetas, verificacin de accesibilidad, y muchas
otras cuestiones avanzadas.
Dentro de la mirada de herramientas disponibles voy a destacar algunas de
las ms conocidas e interesantes de carcter gratuito (o realmente
baratas) y que he utilizado y conozco, si bien existen muchsimas ms y no se
trata de una lista exhaustiva.
Este es mi top ten de las mejores herramientas para crear aplicaciones
y pginas web editando cdigo HTML5, CSS3 y JavaScript.
Como buen ranking que se precie, comienzo del peor (dentro de los buenos) al
mejor ;-)

10.- CoffeCup Free Editor


Un editor multiplataforma (Windows, Mac) y gratuito con soporte para multitud
de caractersticas: ayuda contextual a la escritura de cdigo, vista previa del
resultado a medida que escribimos, etc.. La versin gratuita se ve recortada
frente a la de pago, pero an as es una buena opcin tambin.

CoffeCup
http://www.coffeecup.com/free-editor/

9.- TextWrangler
Editor gratuito para Mac especializado en escritura de cdigo HTML, CSS y
JavaScript. Se asemeja mucho a Notepad++ o a Sublime (ver ms abajo en el
ranking), pero es ms limitado. Es uno de los ms conocidos y utilizados en
Mac.

Bare

Bones

Software

http://www.barebones.com/products/textwrangler/

8.- TextMate
Editor especializado de cdigo para Mac. Es similar a Notepad++ y a Sublime.
Al igual que el anterior es muy utilizado por programadores en el sistema de la
manzana.

MacroMates
http://macromates.com/

7.- Kompozer
Archiconocido editor de HTML y CSS que es gratuito y multiplataforma
(Windows Mac y Linux). Ofrece vista previa de la pgina mientras se escribe
cdigo, mltiples pestaas, edicin especfica de CSS, etc...

Kompozer
http://www.kompozer.net/

6.- Aptana Studio


Otro editor multiplataforma de carcter gratuito. Ofrece una excelente ayuda
contextual a la hora de escribir cdigo HTML, que incluye tambin el soporte de
los diferentes navegadores para cada caracterstica. Slo por esto ya merece la
pena. Tiene caractersticas avanzadas para programacin con JavaScript y
soporta adems mltiples lenguajes de servidor, como PHP, Python y Ruby on
Rails. Est basado en Eclipse, y por lo tanto en Java, por lo que tenlo en cuenta
si no te gusta instalar esa plataforma en tu equipo (por sus muchos problemas
de seguridad y lentitud).

Aptana
http://www.aptana.org/products/studio3

BONUS: Quieres ser mejor programador? Evita "Las 10


meteduras de pata ms comunes"

5.- Notepad++
Es gratuito y adems Open Source aunque solo funciona bajo Windows. Dispone
de multitud de plugins para extender su funcionalidad, y como es muy popular
hay muchos donde elegir. Va mucho ms all que el bloc de notas ya que ofrece
sintaxis coloreada, estructuracin de cdigo (para poder plegar y desplegar
zonas cubiertas por etiquetas), soporte de otros muchos lenguajes de
programacin, etc... Est bien tenerlo a mano para pruebas o ediciones rpidas.
Es uno de mis favoritos.

Notepad++
http://notepad-plus-plus.org/

4.- BlueGriffon
Este excelente editor WYSIWYG utiliza por debajo el motor de renderizado de
Firefox para visualizar las pginas a medida que las vamos editando. Cuenta
con ayudas a la escritura de cdigo (como las miguitas de pan de la parte de
abajo o el acceso a la estructura jerrquica de la pgina), y ofrece incluso la
posibilidad de probar en tiempo real transformaciones 3D de CSS3 sin
abandonar el editor (ventajas de utilizar el motor Gecko de Mozilla). Es gratuito,
Open Source y multiplataforma (Windows, Mac y Linux) y est disponible en
Espaol entre otros muchos idiomas. La ltima versin es de hace casi un ao,
pero el proyecto sigue activo.

BlueGriffon
http://bluegriffon.org/

3.- Sublime Text


Un editor de texto avanzado para programadores, multiplataforma. Aunque es
bastante espartano lo cierto es que todo el que invierte tiempo en aprender a
dominarlo luego no lo quiere dejar, ya que aumenta mucho la productividad a la
hora de escribir cdigo. No ofrece muchas de las caractersticas de ayuda al
programador web que s ofrecen la mayora de los otros entornos, por lo que es
recomendable sobre todo si vamos a trabajar mucho directamente con cdigo,
especialmente JavaScript. Lo podemos descargar y utilizar gratuitamente, pero
si lo vamos a usar a menudo para trabajar sus creadores nos solicitan que les
paguemos una licencia (es lo justo). sta tiene un precio muy razonable.

Sublime

Text

http://www.sublimetext.com/

2.- JetBrains WebStorm


Este es sin duda uno de los mejores editores de cdigo del mercado, y no solo
para el trinomio HTML/CSS/JavaScript. De hecho soporta otros lenguajes como
CoffeeScript, TypeScript y Node.js, y multitud de libreras de JavaScript,
sistemas de control de cdigo, testeo unitario, etc.... Es muy espectacular la
capacidad de editar y ver en tiempo real los cambios en un Chrome, incluso en
aplicaciones de tipo SPA/AJAX. La lista de caractersticas es tan larga que
mejor te enlazo a la misma en su pgina. Lleva un rato aprender todas sus
posibilidades, pero merece la pena.

Es multiplataforma. No es gratuito, pero su precio (solamente 44 para uso


individual) es un regalo para todo lo que ofrece. Muy recomendable.

JetBrains
http://www.jetbrains.com/webstorm/

1.- Microsoft Visual Studio Express for Web


Est disponible en varios idiomas (incluyendo el Espaol) y su nica limitacin
es que slo funciona bajo Windows. Es decir, que si trabajas en Mac o Linux no
podrs utilizarlo. Por lo dems es un entorno integrado de desarrollo (IDE)
espectacular. Aunque, al igual que el anterior, es una herramienta tcnica
orientada a programadores y con muchas otras posibilidades avanzadas, ofrece
un soporte estupendo para diseo de pginas Web, con editores avanzados de
HTML, CSS y JavaScript, capacidad de depuracin, ayuda contextual para todos
los lenguajes, validadores de cdigo, validadores de accesibilidad, visualizacin
real de cmo van a quedar las pginas, etc... Echars de menos muy pocas
cosas (aunque algunas s, sobre todo si usas Sublime). Es totalmente gratuito.

Microsoft
http://www.microsoft.com/express
Espero que los encuentres tiles!