Menú de navegaciónMenú
Categorías

La mejor forma de Aprender Programación online y en español www.campusmvp.es

Los 10 mejores editores gratuitos (o casi) de HTML, CSS y JavaScript

---

IMPORTANTE: este artículo es del año 2014 y las cosas han cambiado mucho desde entonces. Tenemos uno nuevo actualizado que deberías leer. Muchos de los editores reseñados abajo aún funcionan, pero otros ya no existen. Lo dejamos por que permanezca en el histórico, pero ¡lee el nuevo en vez de este!.

---

Lo único que necesitamos para crear páginas y aplicaciones web es un simple editor de texto plano y nuestra imaginación. 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 más 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 páginas que estamos creando, soporte de navegadores, validación de etiquetas, verificación de accesibilidad, y muchas otras cuestiones avanzadas.

Dentro de la miríada de herramientas disponibles voy a destacar algunas de las más conocidas e interesantes de carácter gratuito (o realmente baratas) y que he utilizado y conozco, si bien existen muchísimas más y no se trata de una lista exhaustiva.

Este es mi “top ten” de las mejores herramientas para crear aplicaciones y páginas web editando código HTML5, CSS3 y JavaScript.

Como buen ranking que se precie, comienzo del peor (dentro de los buenos) al mejor ;-)

---

IMPORTANTE: est artículo es del año 2014 y las cosas han cambiado mucho desde entonces. Tenemos uno nuevo actualizado que deberías leer. Muchos de los editores reseñados abajo aún funcionan, pero otros ya no existen. Lo dejamos por que permanezca en el histórico, pero ¡lee el nuevo en vez de este!.

---

10.- CoffeCup Free Editor

Un editor multiplataforma (Windows, Mac) y gratuito con soporte para multitud de características: ayuda contextual a la escritura de código, vista previa del resultado a medida que escribimos, etc..  La versión gratuita se ve recortada frente a la de pago, pero aún así es una buena opción también.

CoffeeCup_htmleditor_main

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

9.- TextWrangler

Editor gratuito para Mac especializado en escritura de código HTML, CSS y JavaScript. Se asemeja mucho a Notepad++ o a Sublime (ver más abajo en el ranking), pero es más limitado. Es uno de los más conocidos y utilizados en Mac.

TextWrangler

Bare Bones Software
http://www.barebones.com/products/textwrangler/

8.- TextMate

Editor especializado de código 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.

TextMate

MacroMates
http://macromates.com/

7.- Kompozer

Nota de actualización: Actualmente el proyecto Kompozer ha sido abandonado

Archiconocido editor de HTML y CSS que es gratuito y multiplataforma (Windows Mac y Linux). Ofrece vista previa de la página mientras se escribe código, múltiples pestañas, edición específica de CSS, etc...

Kompozer

Kompozer
http://www.kompozer.net/

6.- Aptana Studio

Otro editor multiplataforma de carácter gratuito. Ofrece una excelente ayuda contextual a la hora de escribir código HTML, que incluye también el soporte de los diferentes navegadores para cada característica. Sólo por esto ya merece la pena. Tiene características avanzadas para programación con JavaScript y soporta además múltiples 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_Studio

 

Aptana
http://www.aptana.com

5.- Notepad++

Es gratuito y además 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 más allá que el bloc de notas ya que ofrece sintaxis coloreada, estructuración de código (para poder plegar y desplegar zonas cubiertas por etiquetas), soporte de otros muchos lenguajes de programación, etc... Está bien tenerlo a mano para pruebas o ediciones rápidas. Es uno de mis favoritos.

NotepadPlusPlus

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

4.- BlueGriffon

Este excelente editor WYSIWYG utiliza por debajo el motor de renderizado de Firefox para visualizar las páginas a medida que las vamos editando. Cuenta con ayudas a la escritura de código (como las “miguitas de pan” de la parte de abajo o el acceso a la estructura jerárquica de la página), 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 Español entre otros muchos idiomas. La última versión es de hace casi un año, pero el proyecto sigue activo.

BlueGriffon

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 código. No ofrece muchas de las características de ayuda al programador web que sí ofrecen la mayoría de los otros entornos, por lo que es recomendable sobre todo si vamos a trabajar mucho directamente con código, 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.

SublimeText

Sublime Text
http://www.sublimetext.com/

2.- JetBrains WebStorm

Este es sin duda uno de los mejores editores de código 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 librerías de JavaScript, sistemas de control de código, 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 características es tan larga que mejor te enlazo a la misma en su página. 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_WebStorm

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

1.- Microsoft Visual Studio Express for Web

Está disponible en varios idiomas (incluyendo el Español) y su única limitación es que sólo funciona bajo Windows. Es decir, que si trabajas en Mac o Linux no podrás utilizarlo. Por lo demás es un entorno integrado de desarrollo (IDE) espectacular. Aunque, al igual que el anterior, es una herramienta técnica orientada a programadores y con muchas otras posibilidades avanzadas, ofrece un soporte estupendo para diseño de páginas Web, con editores avanzados de HTML, CSS y JavaScript, capacidad de depuración, ayuda contextual para todos los lenguajes, validadores de código, validadores de accesibilidad, visualización real de cómo van a quedar las páginas, etc... Echarás de menos muy pocas cosas (aunque algunas sí, sobre todo si usas Sublime). Es totalmente gratuito.

VSExpress4Web

Microsoft
https://visualstudio.microsoft.com/vs/community/

¡Espero que los encuentres útiles!

José M. Alarcón Aguín Fundador de campusMVP, es ingeniero industrial y especialista en consultoría de empresa. Ha escrito diversos libros, habiendo publicado hasta la fecha cientos de artículos sobre informática e ingeniería en publicaciones especializadas. Microsoft lo ha reconocido como MVP (Most Valuable Professional) en desarrollo web desde el año 2004 hasta la actualidad. Puedes seguirlo en Twitter en @jm_alarcon o leer sus blog técnico o personal. Ver todos los posts de José M. Alarcón Aguín
Archivado en: Desarrollo Web

Boletín campusMVP.es

Solo cosas útiles. Una vez al mes.

🚀 Únete a miles de desarrolladores

DATE DE ALTA

x No me interesa | x Ya soy suscriptor

La mejor formación online para desarrolladores como tú

Comentarios (101) -

Te faltó Brackets, es muy bueno.

José M. Alarcón
Spain José M. Alarcón

Gracias por el comentario Mauricio.

Por faltar faltan muchos, pero estos son los que a mi me parecen más interesantes en general.

De hecho, sobre este editor, Brackets, escribí un post dedicado por completo a él en mi blog personal:

www.jasoft.org/.../...vaScript-muy-prometedor.aspx

Saludos!

Muy buen post! Y qué opinás sobre NetBeans? Saludos.

José M. Alarcón
Spain José M. Alarcón

Hola Wilson:

Yo personalmente no soy muy fan de Netbeans, si bien es cierto que es porque siemp re he usado Visual Studio y me he mantenido alejado de Netbeans por estar relacionado sobre todo con el mundo Java, del que no estoy muy próximo.

Ahora bien, sé que tiene un soporte muy bueno para HTML, CSS y JavaScript, por lo que seguramente es una herramienta que merecería también estar en la lista, al igual que unas cuantas más.

La lista refleja mis preferencias, aunque creo que están la mayor parte de los editores más interesantes.

Saludos.

Yo justamente, a nivel estudiantil nada más, he estado más vinculado con el mundo Java. Y siempre programé en NetBeans. NetBeans tiene muy buen soporte para HTML, CSS y JavaScript como tu decis. Mi mayor interrogante por estos días es respecto a qué IDE usar pensando en desarrollar un pequeño proyecto con HTML, CSS, JavaScript-jQuery, PHP y AJAX. Estoy entre NetBeans y Aptana, que lo vengo probando estos días y está excelente.

En fin, muchas gracias por tu aporte!
Saludos

Hola me parece interesante wilson tu enfoque puedes escribirme al 091266219
Necesito preguntarte un par de cosas con respecto a NetBeans
Quiero aprender a programar y no se como hacerlo
Mi código de país es de Uruguayo también

Roberto Garcia
Mexico Roberto Garcia

Yo apenas estoy empezando con NetBenas . ¡Y me encanto! Es como Visual Studio, pero para JAVA. Juro que es de los mejores productos de software libre que usado. Hace que JAVA, que es complicado, se vuelva sencillo. Su revisor sintáctico es genial, su código de colores, su entorno tan visual, casi podría decir que programa por ti. Había usado Eclipse, pero es demasiado complicado (quizá tiene mas cosas, pero eso mismo lo hace complejo).
NetBeans es sencillo, ágil y poderoso. A veces siento que estoy programando Visual Basic, así de sencillo lo hace.

miguel guayacan
miguel guayacan

hola...tienes un enlace para descarga segura del visual?

Y Atom editor??

Hola Luis:

A mi personalmente no me gusta mucho, pero...

En cualquier caso, y como ya he dicho en otros comentarios, editores hay cientos y había que escoger un número limitado, así que he elegido los que a mi mejor que parecían. Siempre van a quedar muchos fuera y alguna gente los adorará igualmente.

Tendré que hacer otra selección de editores añadiendo las sugerencias de los lectores.

Saludos!

Richard Martínez
Colombia Richard Martínez

Personalmente, me ha ido muy bien con Jedit, lo recomiendo bastante porque es multiplataforma, ya que es desarrollado en Java, me ha ahorrado tiempo cuando desarrollo en varios lenguajes incluso en bases de datos, lo más importante de este editor es el gran número de plug ins, en los cuales destaco estos importantes:
- JDiffPlugin, la comparación de dos códigos
- Console: para ejecutar comandos en beanShell (igual para depurar en java), javaScript, y consola de comandos en el sistema donde se haya instalado (Linux, windows, Mac).
- Highlight: marca las palabras iguales con respecto a la palabra donde esté ubicado el cursor.
-Sessions: si tienes más de un "proyecto" o perfil puedes tener un grupo de archivos abiertos.
-Subversion: plugin para administrar versiones de tus proyectos.

Además de eso tienes la posibilidad de desarrollar tus propias macros (en python o beanShell) o tus propios plug-ins, en Java, la documentación se encuentra en el mismo sitio de jEdit

http://www.jedit.org/

Hola Richard, muchas gracias por compartir tu experiencia y por toda la info que das sobre dicho editor.

Un saludo.

Dice gratuitos, el segundo puesto cuesta 44 euros. Genius!

Hola Ricardo, si lees el artículo con atención verás que ya en el propio título se indica "gratuitos (o casi)", lo cual ya da una pista de que NO todos van a ser gratuitos.
Por otro lado, el que ocupa el segundo puesto, se indica literalmente "No es gratuito, pero su precio (solamente 44€ para uso individual) es un regalo para todo lo que ofrece."
Por lo tanto, consideramos que el autor, José Manuel Alarcón, ha sido coherente a lo largo de todo el artículo.

Un saludo,
>>>El equipo de campusMVP

"...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)."

Fundamenta esas afirmaciones, ya que parece que vienen de alguien que tiene un rechazo hacía el lenguaje, ya que todos tienen ciertos problemas que se van corrigiendo a medida que se van revisando y actualizando.

José Manuel Alarcón
Spain José Manuel Alarcón

Hola Julio:

Gracias por comentar.

Lo de que todos tengan algún problema que otro (evidentemente nadie está libre), no quiere decir que todos sean igual de malos/buenos. Depende de muchos otros factores, como por ejemplo cómo gestione la empresa responsable esos problemas. Y Oracle no se ha caracterizado precisamente por la rapidez de respuesta o la transparencia. Al menos esa es mi opinión y creo que la de mucha otra gente del sector.

Pero en cualquier caso: sí, lo reconozco: tengo un cierto rechazo ancestral hacia la plataforma (que no hacia el lenguaje), porque lo he sufrido mucho desde hace 20 años. Pero ese no es el tema de este post, así que no me gustaría llevarlo hacia ese terreno.

Espero que las recomendaciones de editores HTML te hayan servido en cualquier caso  ;-)

Saludos!

Muy buen post brother, una pregunta qué framework me recomendarías usar para una página web tipo foro. Saludos

José Manuel Alarcón
Spain José Manuel Alarcón

Hola:

Yo no he montando nunca una página específicamente de foros, pero en esta página de la Wikipedia tienes una completa comparativa del principal software de foros que hay en el mercado:

en.wikipedia.org/.../Comparison_of_Internet_forum_software

Saludos.

Gracias por responder.
Una última pregunta: que utilizaste..
que editor web, Visual Studio?
lenguaje de programación?
usaste algún Framework y si es así, que framework?
Saludos.

José Manuel Alarcón
Spain José Manuel Alarcón

¿A qué te refieres? ¿Qué he utilizado para qué?
Yo generalmente trabajo siempre con Visual Studio Commuity Edition, para casi todo. Si son cosas muy sencillas utilizo Notepad++.

Saludos.

Quisiera saber si existe un editor para HTML5, sin hacer nada de codigo.

José Manuel Alarcón
Spain José Manuel Alarcón

Si te refieres a poder crear una página arrastrando cosas y sin tener que ver código hay muchas cosas por ahí, aunque nunca serán tan interesantes como poder crearlo tú mismo, conociendo bien el tema y usando código.

Por ejemplo, aquí:

http://www.silex.me/

tienes un editor estilo PowerPoint para crear diseños con HTML5.

Paola Trujillo
Spain Paola Trujillo

Personalmente me ha gustado el que mencionan <a href="jagonzalez.org/.../a>;, lo interesante es que con esto, se reafirma la intención de ganar a los usuarios del soft libre.

Por cierto, me quedo con kompozer y sublime, aptana me pareció también bueno, pero no me convenció del todo :S

José Manuel Alarcón
Spain José Manuel Alarcón

Hola Paola:

Ese editor que mencionas lo acaban de lanzar hace un par de semanas y nos hicimos eco del mismo en este blog. De hecho yo mismo hice un vídeo mostrando cómo ponerlo a andar en Linux y con un proyecto Git:

/recursos/post/VIDEO-Un-vistazo-a-Visual-Studio-Code-bajo-Linux-con-Git.aspx

Saludos

hola, me gustaria saber algun progama de diseño web sin necisidad de codigos , esta bien poder ver los codigos de la estructura pero se me da muy mal la programacion ... ya intente hacer una web de estas de online entras a la web te registras te haces tu plantilla pero luego no puedes exportar tu web.. tienes que pagarles a ellos e sus servidores.. yo quiero tener mi archivo guardado en mi pc y subirlo en el servidor que yo crea conveniente..
he visto este  programa muy bonito a simple vista ... xara designer pro x10.. pero tengo la duda de si al finalizar mi web.. me dejara exportar el archivo o solo puedo publicarlo en sus servidores.

gracias de antemano

Hola, creo que se a lo que te refieres, existe Dreamweaver de Adobe, puedes escribir código y también tiene una interfaz con herramientas para insertar lo que gustes (No es gratuito), puedes crear servidores de prueba y usarlos en una carpeta para visualizar el sitio y ver el progreso del mismo.
Suerte!

Hola, gracias por la información suministrada, tengo que realizar una página web para un proyecto y me interesó mucho tu conteo de programas editores de texto, me ayudó mucho

Remy LeBeau
Argentina Remy LeBeau

Yo pienso que todos debería usar BRACKETS al menos por unos días y se darán cuenta de que es impresionante la simplicidad que no ofrece y ademas de poder programar en tiempo real sincronizado con el navegador....  
RECOMEDADO Brackets!

Excelente tema, Saludos!

Hola José Manuel. Te cuento que soy un veterano y usuario de PC sin absolutamente ningún conocimiento de programación. Pero hace unos cuantos años me hice una página web de inicio que con pequeñas variantes he seguido utilizando y ha ido migrando en mis sucesivos pc y notebook. Ahora bien, con el Frontpage hacía las modificaciones que quisiera, pero ahora que no existe más, me las veo de perillas. ¿Qué editor me recomiendas para el cual no necesite saber absolutamente nada de programación? (te aclaro que las modificaciones que hago son sencillísimas, apenas agregar nuevos links y nada más)
Gracias desde ya. Saludos!

José Manuel Alarcón
Spain José Manuel Alarcón

Hola Fernando:

Pues si te tengo que recomendar uno sencillo de usar, muy en la onda de FrontPage pero bastante mejor y además gratuito sería Microsoft Expression Web:

www.microsoft.com/.../details.aspx?id=36179

Era un producto comercial, el competidor de Microsoft contra Adobe Dreamweaver, pero como no pudieron competir lo acabaron por regalar. No lo recomendaría para hacer desarrollo web, pero para editar páginas, escribir, etc... que es lo que tú quieres, está muy bien, es sencillo y tiene muchas características interesantes.

Saludos.

Remy LeBeau
Argentina Remy LeBeau

Mira amigo, si tu quieres una herramienta que te sea simple para poder usar tu tiempo en cosas que tu quieras y no morir frente a nuevos editores te recomiendo que pruebes el Adobe Muse, es barbaro te hace todo solo, solo le das un par de ajustes y todo te saldrá super simple. Y si no sabes muchos de html o css, no importa porqué todo esa simplificado para que cualquiera lo pueda usar.
Ya despumes si te dieran ganas de aprender a programar te recomiendo algo mas simple como sublime text ó NotePad++.

Suerte!

José Manuel Alarcón
Spain José Manuel Alarcón

Hola Remy:

Muse no es exactamente lo mismo que planteaba Fernando, y además tampoco es gratuito, sino que forma parte de la subscripción Cloud de Adobe.

Muse es un producto interesante para diseñadores que no quieran aprender HTML pero poder crear webs (con limitaciones), pero no es un editor de HTML realmente, sino una herramienta que genera HTML.

Gracias por comentar!

Martin Odobo
Argentina Martin Odobo

Gracias por la info sobre Microsoft Expression Web.

Muy buena la información, hay donde elegir

Adrian Delgado
Spain Adrian Delgado

Muy buen post, estoy aun empezando con esto de la edicion y creacion de Webs con Codigo y bueno estoy aun por decidirme, uso SublimeText pero tengo tambien pendientes usar Brackets y Visual Studio pero claro todo esto de forma autodidacta... tambien he visto que hay uno que se llama HTML-Kit y no lo he usado aun... sabes algo de el?

Un saludo!

José Manuel Alarcón
Spain José Manuel Alarcón

Hola Adrián:

La verdad es que no he utilizado HTML-Kit, así que no puedo comentar de primera mano sobre él. Es que hay tantísimos que es imposible conocerlos y probarlos todos.

Me alegro de que te haya gustado el post.

saludos.

Buenas tardes
Necesito una recomendacion. Yo venia usando el Frontpage para editar mi pagina hecha en html. Ya tengo claro que es un programa muy viejo pero como no entiendo tanto del tema no me anime a cambiar por otro. Ahora que quiero pasar a un nuevo editor probe con el notepad++ pero no se como ver la vista previa de los cambios que voy haciendo. Cual editor me recomiendas que sea sencillo? Muchas gracias!

José Manuel Alarcón
Spain José Manuel Alarcón

Hola Félix:

Este post está pensado más bien para programación con HTML + CSS, no tanto para diseño visual. Hoy en día es muy complicado que diseñes visualmente una web ya que no se trata de diseños estáticos, sino que por regla general implican también que se adapten a distintos tamaños y resoluciones (Responsive), que tengan interactividad, etc.... En ese sentido es mucho más útil un editor NO visual (o sea, de código) y comprobar los diseños directamente en los navegadores, que además es la forma más segura de asegurarse de que funcionan bien. Para eso, claro, hay que meterse mucho más al código y dominar a fondo HTML, CSS y en cierta medida JavaScript (depende de lo que hagas).

No obstante si quieres un editor visual, de los de la lista tienes el:

10.- CoffeCup Free Editor
7.- Kompozer
4.- BlueGriffon

A mayores, uno de los que más usa la gente profesionalmente y que es de este estilo es DreamWeaver de Adobe, aunque no es gratuito.

Mi recomendación sería que si te dedicas profesionalmente a esto (o quieres hacerlo) que aprendas bien HTML y CSS y vayas con editores de código. Claro está te recomiendo mi curso sobre el tema, con el que acabarás por dominar ambas tecnologías:

/catalogo/Product-Creaci%C3%B3n-profesional-de-p%C3%A1ginas-web-con-HTML5-y-CSS3_185.aspx

Por otro lado, si lo que quieres es no complicarte demasiado y poder tener webs atractivas visualmente pero sin meterte a fondo, entonces no te recomiendo que uses editor alguno. Te recomiendo que montes un WordPress o similar, compres una plantilla atractiva (son muy baratas) y uses las herramientas que te brinda el gestor de contenidos. Pero claro, eso no es programar, así que depende mucho de lo que quieras hacer...

Saludos.

Joaquín Bresan
Argentina Joaquín Bresan

Muy buen post amigo, gracias por compartir.

gracias por el post, hace mucho estaba buscando mi editor que siempre usaba, hace un tiempo lo deje de usar, pero chingado! no me acordaba como se llamaba, bueno me refiero Notepad++ bueno gracias a ti lo encontré. saludos

Te falto hablar también de Komodoro Edit, en la cual tiene su versión de pago que es el IDE y el Edit que es la versión gratuita, multiplataforma, Linux, Windows y Mac y a su vez es Open Source.

José Manuel Alarcón
Spain José Manuel Alarcón

Me han faltado tantos...

Existen decenas o cientos. He metido los que yo conozco y que a mi me gustan.

De todos modos gracias por el comentario. Lo miraré y quizá en una próxima edición del post lo incluya si me gusta.

Saludos.

Hola, muy buen artículo.
Me gustaría saber que opinas de WebStorm.
Gracias y saludos.

José Manuel Alarcón
Spain José Manuel Alarcón

Hola!

Pues Webstorm me encanta, pero no está en esta lista por que no lo considero un editor de HTML (aunque pueda editarlo). Es un IDE especializado en programación web y especialmente bueno para JavaScript y NodeJS. De hecho tengo en mente hacer pronto un post similar a este con editores para JavaScript en el que tengo pensado poner muy alto a WebStorm :-)

Saludos.

José Manuel Alarcón
Spain José Manuel Alarcón

Corrijo lo que he dicho: sí que lo metí en esta lista, lo cabo de ver, no me acordaba. Ya ves que lo pongo de segundo, además :-)

En cualquier caso lo que he dicho lo reitero: me parece más apropiado meterlo en un "ranking" de editores de JavaScript, por ejemplo, ya que es algo mucho más completo que un simple editor de HTML.

Saludos!

Mario Lozano
Peru Mario Lozano

Sublime text es de pago

Hola Mario,

Sublime Text es de pago si lo vas a usar habitualmente y de manera continuada, pero lo puedes descargar gratis y sin limitaciones para evaluarlo desde http://www.sublimetext.com/2 (la versión 2).

Aunque también está disponible la beta de Sublime Text 3 en http://www.sublimetext.com/3


Me ha servido mucho
sobre todo que casi termino el colegio
y me ha sido de gran ayuda para mi
y mis tareas de informática
gracias

El artículo es muy útil, sobre todo porque soy nuevo en este mundo, sin embargo tengo una duda, me descargué el Visual Studio Community, pero la descarga demoró muchísimo, y una vez que quise emplearlo, se relentizó mi pc, además de colgarse varias veces, y me pedía reiniciar el programa, supongo que esto no es normal, pero sabes a que se puede deber este prolema.

Igual mil gracias!

José M. Alarcón
Spain José M. Alarcón

Hola Jorge:

Ni idea, pero desde luego no es normal. Lo cierto es que Visual Studio no es el entorno más ligero del mundo (¡trae muchas cosas!) pero en cualquier ordenador más o menos moderno debería ir muy ágil. Yo lo tengo en 2 equipos y va fenomenal. Uno de ellos es nuevo pero el otro tiene ya 4 años y sin problema. En una máquina virtual en donde lo tengo le cuesta más, sobre todo al cargar por primera vez elementos, y no es tan fácil usarlo. Yo no lo usaría como máquina principal en es caso, pero vamos, aún así se va moviendo...

Siento no poder ayudarte más.

Saludos.

Hola Jose:

Al parecer tienes una basta experiencia en esto, tengo poca experiencia en esto del desarrollo web.. y me encanta!! he tenido algunos problemas con el codigo html.
Bueno al grano!! que editor HTML puede facilitarme el diseño y despues pasarlo a visual studio y crear una pagina web ??


José Manuel Alarcón
Spain José Manuel Alarcón

Hola Williams:

Te remito a mi respuesta a una pregunta similar en este mismo post, el 29 de septiembre:

/recursos/post/Los-10-mejores-editores-gratuitos-de-HTML-CSS-y-JavaScript.aspx#id_4a7bb498-f088-42d5-b586-51339576cef5

Espero que te sirva.

Saludos.

Genial este artículo, estoy empezando en esto de las páginas web y me patrece muy interesante. Gracias por compartirlo.

Daniel Alberto
Colombia Daniel Alberto

Es un articulo increíble te felicito amigo, me has ayudado muchísimo y eso contándote que soy nuevo en el arte de la programación :)

Soy nuevo y estoy aprendiendo HTML mi pregunta es ¿puedo usar una app en mi IPad , que me permita probar este lenguaje; es decir una app que funcione como editor de texto plano  en IOS para trabajar html? Si existe ¿me podrías recomendar alguna? Repito soy nuevo en esto

Muchas gracias!

José Manuel Alarcón
José Manuel Alarcón

Hola:

Probablemente el iPad no sea la mejor opción para editar código, pero quizá para cosas pequeñas o pruebas...

Aquí tienes 15 opciones: blog.smartbear.com/.../

y también tienes Nitro HTML, que es sencillo y gratuito: itunes.apple.com/.../id474415862?mt=8

Saludos.

holaaa... pero cualquiera que sea el editor, php es gratuito igual que html????? soy practicante y en la empresa con la que estoy realizando mis practicas les gusto mi pagina y quieren implementarla pero no quiero tener problemas ya que si les dejo algo sin licencia cuando si se require me puede ir muy maal! y es por eso que quiero asegurarme de que no se paga ninguna licencia .. agradeceria sus comentarios, igual si saben de MySQL estaria super bien que pudieran ayudarme u orientarme, ya que es una pagina vinculada a una base de datos en MySQL .......porfavor ayudenme!!!!

José Manuel Alarcón
José Manuel Alarcón

Hola Camila:

PHP es completamente gratuito.
MySQL es gratuito para uso en proyectos Open Source, pero no para uso comercial, teniendo que pagar una licencia si quieres estar totalmente legal, Míralo aquí: http://www.mysql.com/about/legal/licensing/oem/

Una opción alternativa a MySQl es usar MariaDB (https://mariadb.com). Es un "fork" de MySQL de cuando lo compró Oracle, y tiene una licencia GPL menos restrictiva. Puedes usarlo de manera gratuita mientras no lo distribuyas como parte de otro software a terceras empresas: https://mariadb.com/kb/en/mariadb/licensing-faq/

Es totalmente compatible con MySQL por lo que no deberías tener problemas para usarla.

Saludos.

Hola Jose Manuel.

Te ha faltado este   http://bluefish.openoffice.nl/index.html
Es libre, muy completo y actualizado. Es el que yo uso.
Saludos

José Manuel Alarcón
José Manuel Alarcón

Buff, hay tantos que es difícil elegirlos y siempre hay quien se queja de que he dejado el suyo fuera ;-)

De todos modos este no lo conocía. Me lo apunto para verlo y quizá meterlo en una nueva versión de este post.

Gracias!

Saludos.

I use Codelobster: http://www.codelobster.com

Hola hay alguno en español

Es increíble que estén hablando de las mejores aplicaciones para editar paginas web y no mencionen a Dreamweaver que es la mejor de todas... sirve para novatos y para avanzados

José Manuel Alarcón
José Manuel Alarcón

Hola Jose:

No sé si te has fijado en un pequeño detalle: pone "gratuitas", y Dreamweaver no solo no lo es, sino que tradicionalmente ha sido de las más caras. Ahora con la suscripción de Adobe ya es más asequible, pero aún así no cumple el criterio del título del post.

Existen decenas de aplicaciones, y seguro que me he dejado alguna fuera (de hecho este post tiene ya mucho tiempo y tendré que actualizarlo en algún momento), pero he puesto las que me han parecido más interesantes de entre las gratuitas.

Gracias por comentar.

Saludos.

Muy bien

Hay alguna persona coherente que entienda los que es GNU/GPL ? El autor de este tema NO. Gratis no es lo mismo que "casi gratis", y "libre" no tiene porque ser gratis. Cuando pienso que millones alrededor del mundoo hacen las cosas de manera desinteresada, y veo esto, me dan ganas de vomitar.

Buenas! estoy empezando con todo este tema de edición de páginas web y estoy un poco perdida, podrías recomendarme el editor más simple para utilizar con filezilla?
Muchas gracias de antemano!

José Manuel Alarcón
José Manuel Alarcón

Hola Marina:

Hoy en día dada la complejidad de los diseños HTML un editor visual, en mi opinión, es menos útil que nunca, por lo que yo me inclinaría por un editor de código "puro". En ese sentido a mi los dos que más me gustan son Visual Studio Code y Brackets (si lo que vas a editar es sobre todo HTML y CSS, no tanto para JavaScript).

Tengo que decidirme y actualizar este post pronto :-S

Saludos.

Hola José.

Desde hace mucho tiempo estoy entre que me animo y no a incursionar en editar mi primera página web. Me gustaría saber, para alguien que no sabe programación, cual ves más recomendado.

Te cuento que tengo W10 y me invlino, según tu informe, por el Visual Estudio.... (o lo ves muy complicado?)

Gracias por tu atención.

José Manuel Alarcón
José Manuel Alarcón

Hola:

Es sobre todo cuestión de gustos, pero hoy en día mi recomendación sería que usaras un editor de código, no uno visual. Los editores visuales hace mucho que dejaron de tener sentido dada la complejidad de los diseños web, el hecho de que suelan ser Responsive, etc...

Este post tiene ya dos años y medio, tengo que actualizarlo. Hoy en día a mi los que más me gustan son Visual Studio Code (https://code.visualstudio.com/) y Brackets ( http://brackets.io/, solo para HTML y CSS). Este último me parece muy útil para principiantes.

Lo dicho, a ver si actualizo este post en breve, que también tengo ganas.

Saludos!

Lola Martinez
Lola Martinez

Hola Jose Manuel, gracias por tu artículo. Hace unos 4 años compré el programa de Microsoft expression Web para hacer mi página Web y me gustó bastante. El problema es que ahora quiero que mi página sea responsive y me siento incapaz de hacerlo con este programa. Finalmente he migrado el contenido a una página de Wordpress y aunque es increiblemente fácil de usar, echo de menos el poder controlar los detalles como antes con Expression. Ademas no tiene CSS3 y creo que tampoco el HTML5 (que en realidad no se si son necesarios para hacer una página responsive). Me puedes dar alguna solución para poder seguir con Expression Web? o mejor lo tiro a la basura :-) Gracias de nuevo

José Manuel Alarcón
José Manuel Alarcón

Hola Lola:

Definitivamente tengo que actualizar este artículo, que tiene mucho tiempo.

Creo que hoy en día cada vez tiene menos sentido utilizar un editor visual para páginas HTML. Lo suyo es editar directamente el código, precisamente porque en la actualidad hace mucho que se terminó lo de hacer una página para una resolución y listo, sino que lo diseños son complejos, dinámicos, adaptables, etc...

Por eso es importante dominar además HTML, pero sobre todo CSS. Se acabaron los tiempos de usar una herramienta sencilla, hacer el diseño ahí y ya está. La otra opción es usar una plantilla que ya tenga todo hecho, sea responsiva, etc... y meter el contenido con Word Press o similar, para lo cual no te hace falta realmente un editor.

Saludos.

zenon gallardo
zenon gallardo

hola tengo ganas de aprender c++ no se mucho de codigos asi que gracias por las recomendaciones de los compiladores asi que habra que sudar la gota gorda para aprender c++
un saludo y nuevamente gracias

Pablo Garcia
Pablo Garcia

Hola Jose Manuel. Me encantan tus posts,son muy útiles,enhorabuena!

Tengo una pregunta...

Soy programador novato de html 4 y 5,y necesito un editor en español para escribir codigo de forma sencilla,rápida y eficiente. ¿Cual me recomendarías?

Muchas gracias y un saludo!

José Manuel Alarcón
José Manuel Alarcón

Hola:

Gracias.

A mi los que más me gustan hoy en día son Visual Studio Code y Brackets.

Saludos.

P.D.: Por cierto, los comentarios del blog son moderados por lo que pueden pasar 24 horas hasta que se aprueben manualmente y se publiquen. Lo digo porque has enviado lo anterior 10 veces :-S

Pablo Garcia
Pablo Garcia

Hola

Lo siento mucho,cuando lo publicaba no me aparecía a si que le di varias veces...

Muchas gracias los buscare haber...

Un saludo

José Manuel Alarcón
José Manuel Alarcón

Nada: es que como entraron tantos, el sistema los mandó directamente al spam 😖

Aquí te dejo los enlaces:
- Code: http://code.visualstudio.com/
- Brackets: http://brackets.io/ (prueba lo de CTRL+E: te encantará)

Saludos!

Ángel Fuensalida
Ángel Fuensalida

Hola José soy un jubilado que me dediqué a estudiar HTML y CSS conozco varios códigos, quiero hacer una página web  y quisiera  que me digas que editor me conviene para un principiante y  que sea gratuito y  en  español y además no  muy complicado. Un saludo cordial y muy bueno lo que compartes. Muchas gracias

José Manuel Alarcón
José Manuel Alarcón

Hola Ángel:

Gracias.

La verdad es que mi recomendación, si no quieres meterte al código HTML mucho, sería que usases directamente algún gestor de contenidos como WordPress para crear las webs, en lugar de editar el HTML directamente.

Si quieres escribir el código directamente y estás empezando, un editor visual de los que se mencionan en el artículo quizá sería lo mejor, ya que te ayudaría al principio y te evitaría escribir mucho código a mano.

Para escritura de código a mi me gusta Brackets (brackets.io) para principiantes porque ayuda bastante a centrarse y permite ver los estilos que afectan a un elemento HTML cuando pulsas CTRL+E. Mi favorito últimamente es, de todos modos, Visual Studio Code, que tampoco esta en la lista (tengo que actualizar este contenido), pero está muy bien.

Saludos.

Hola Jose, disculpa que opinas del HTML pad2007pro, la verdad no se si existan verciones mas nuevas compatible con w10

José Manuel Alarcón
José Manuel Alarcón

Pues la verdad es que no lo conozco. Lo miraré si hago una review de este artículo, que ya le hace falta una buena actualización...
Gracias..

entonces cual es el mejor programa gratuito para programar sitios web y cuales son los mejores editores pero que se pagan por comprarlos

Hola yo que estoy empezando desde cero, cuál me recomendarías ?

José Manuel Alarcón
José Manuel Alarcón

Hola:

Decididamente tengo que actualizar este post cuanto antes. A ver si saco tiempo en breve...

Al contrario que hace unos años, cuando te podías permitir el lujo de usar un diseñador visual y tener los conocimientos justos de HTML y CSS y ver el código lo menos posible, en la actualidad es indispensable tener un conocimiento bueno de todo lo que subyace a una página web, y no queda más remedio que "tocar" código todo el tiempo. El motivo es que ahora los diseños son más complejos, debiendo funcionar además en varios dispositivos al mismo tiempo, requiriendo muchos ajustes detallados para cada circunstancia, etc... Por lo que es necesario, como digo, tocar el código directamente y no usar un diseñador visual.

Por lo tanto, mi consejo para alquien que esté empezando es que el editor es lo de menos. Lo importante es dominar bien no tanto las etiquetas HTML y propiedades CSS existentes, sino los conceptos que subyacen a muchas cosas que se hacen con estos lenguajes, que es algo en lo que mucha gente "flojea". Más allá de eso, el editor que utilices es casi lo de menos. Yo solo me fijaría en lo cómodo que sea, las ayudas contextuales que te de para algunas cosas, capacidades de edición concretas (como simultaneidad de escritura en varios sitios, transformaciones y búsquedas, etc...) así como plugins para ampliarlo.

Como digo, atendiendo a estos criterios tengo que acrtualizar el post y ampliarlo para que incluya JavaScript ya que hoy en día van indisolublemente unidos y no deberíamos hablar de HTML/CSS sin incluir este lenguaje también.

Dicho esto, y por darte algo inmediato, si estás empezando te recomiendo que le eches un vistazo a Brackets (brackets.io).

Saludos.

César Zavala
César Zavala

Muchas gracias tenia exactamente la misma pregunte tomare en cuenta tu respuesta con brackets.io. Excelente contenido Felicidades PEPE !!

Yacoobs Cort Mart
Yacoobs Cort Mart

Yo empeze usando el Eclipse, haciendo programación en java. Finalmente por el tiempo me pase a Netbeans con el que estoy muy contento ya haciendo programacion Css, php, html y JavaScript... Pero he visto tu articulo y voy a probar con el Visual Studio, espero que actualices el post e incluyas nuevas y mejoradas plataformas como el NetBeans :) Saludos cordiales desde españa Valencia.

Kenneth Urbina
Kenneth Urbina

Sr. Alarcon :

Le agradezco que tome tiempo para compartir su conocimiento con el projimo. Muchas gracias.
Yo estoy metido en programacion relacionada con ASP. NET, PHP, y JavaScript.
Tengo unas dudas que quisiera que me aclare por favor:

ASP .NET tiene por IDE por defecto a Visual Studio. Pero PHP y JavaScript no tienen IDE por defecto
Cual seria el mejor IDE para PHP ?
Muchos me han dicho que WebStorm es muy bueno para hacer trabajos en JavaScript, y me imagino que debe ser porque usted lo puso en puesto numero 2. Pero se puede hacer todo tipo de trababjo de JavaScript en WebStorm, hasta aplicaciones moviles ?
Esperare su respuesta, y muchas gracias de antemano



José Manuel Alarcón
José Manuel Alarcón

Hola:

Yo no programo en PHP, por lo que no puedo darte una recomendación de primera mano, pero conociendo los otros productos e la empresa, estoy seguro de que PHPStorm de Jetbrains es de lo mejor si no el mejor (https://www.jetbrains.com/phpstorm/).

En cuanto a Webstorm: soporta desarrollo web móvil.

Saludos.

Kenneth Urbina
Kenneth Urbina

Sr. Alarcon:

Muchas gracias por responder mi mensaje.
Tengo mis ideas mas claras sobre que IDE usar ahora para JavaScript. Usar WebStorm.
Tenia duda sobre el IDE para PHP porque escuche en conferencias que Zend Studio perteneciente a Zend Technologies era mejor que PHPStorm. Lo malo es que se paga por ambos.
Por favor digame, Visual Studio Express es mejor que WebStorm?.
Si no para ver como puedo pagar por ambos : PHPStorm y WebStorm.
Esperare su respuesta, y muchas gracias de antemano


José Manuel Alarcón
José Manuel Alarcón

No, VS Community (Express no merece la pena ya teniendo Community) no es mejor que WebStorm para desarrollo fornt-end ya que WebStorm está especializado en eso. No obstante si estás empezando (e intuyo que así es) no creo que te merezca la pena toda la potencia que te va a dar WebStorm. Cualquier entorno como VSCode, Atom o incluso (si estás empezando) Brackets, será más que suficiente.

Saludos.

Solo quería agradecerte la información.
Hice alguna página web hace ya bastantes años y ahora e intentado volver a hacer una. Ha cambiado todo un poco y creo que para mejor, pero tengo un problema que parece no tener nadie. Estaba acostumbrado a Dreamweaver pero ya no me va. Cierto que es completo pero super pesado y poco ágil  así que probé con notepad. Me encantó su ligereza y rapidez... peeero hay algo que a nadie parece molestar y para mi es imprescindible: no tiene paleta de colores. Al menos yo no la veo. Ya se que saliendo del programa puedo ver código de colores y demás... pero así no es.
¿Soy el único que lo echa en falta?

José Manuel Alarcón
José Manuel Alarcón

Hola Chema:

Este artículo está muy anticuado. Tengo que hacer uno nuevo con editores modernos. Ya te adelanto que los editores visuales se han dejado de utilizar hace tiempo porque ya no tienen mucho sentido, la verdad. Elaboraré el tema en la nueva versión de este artículo en cuanto pueda hacerla.

Saludos!

Estoy comenzando en esto y quisiera saber que es lo mejor que puedo utilizar para comenzar?

Hola, Quiero comentar que WebStorm y en general los productos de JetBrains no son gratuitos, son pagos y sólo permiten usar sus programas como pruebas en 30 días, yo en lugar de WebStorm hubiera puesto NetBeans y/o Eclipse, que a pesar de que su uso original es Java, tienen soporte para otros lenguajes de programación, en especial el dedicado en este espacio, el de web, aunque puede que WebStorm tenga uso de tecnologías más actualizadas, pero por desgracia no tengo los recursos económicos para comprarlo, y es por eso que a veces voy a estas páginas.

José Manuel Alarcón
José Manuel Alarcón

Hola Nicolás:

Como pone el propio título, no todos so gratuitos. Algunos como Webstorm no lo son pero son tan buenos que merece la pena pagar por ellos y el precio es razonable. Desde que escribí este post hace 4 años es más caro que en aquel momento, pero son 59€ al año, que si eres un profesional es un regalo, y si no eres un profesional (estudiante, estás en un proyecto Open Source o en un ONG, etc...) te sale gratis o tiene descuentos muy elevados por lo que cuesta casi nada: www.jetbrains.com/webstorm/buy/#edition=discounts

Si aún así no puedes pagarlo o acceder a el existen infinidad de opciones gratuitas o/y Open Source por ahí, algunas de las cuales menciono en el artículo  a pesar de que es muy antiguo, y otras en los comentarios.

Saludos.

Francisco R
Francisco R

Gracias por el post.
No obstante, creo que el link de Microsoft Visual Studio Express for Web es incorrecto.
Saludos
Fran

José Manuel Alarcón
José Manuel Alarcón

Hola Fran:

Habida cuenta que han pasado 4 años y medio, lo raro es que el post entero no sea incorrecto :-S

Corrijo el enlace pero verdaderamente tengo que sacar tiempo para hacer un post nuevo por completo para sustituir a este. Gracias.

Saludos!

Francisco Naranjo
Francisco Naranjo

Estimado José Manuel,
Me gustaría saber si ya actualizaste el post.
He descarcagado Atom, Brackets y Visual Studio y estoy probandolos.
Mi favorito era Notepad++ y digo era porque me ha dado ya varios problemas al usar la herramienta buscar, hay veces que se me cierran todos los archivos abiertos. Es por ello que me he decidido ha cambiar de editor.
Muchas gracias por tu post y por favor actulizalo si lo vas a hacer y no digas mas que lo tienes que hacer.

Un cordial saludo.

Francisco.

José Manuel Alarcón
José Manuel Alarcón

Jo, qué presión.... ;-)  Sí, lo haré. venga, voy a intentar tenerlo en Abril.

Cuando lo actualice o bien cambio este o bien meto un enlace desde este al nuevo, por supuesto.

Y ya te adelanto que, hoy por hoy, mi elección sería, sin duda, Visual Studio Code, tanto en Windows como en macOS o o Linux.

Saludos.

Gracias por la recomendación de editores gratuitos, estaba buscando algo para mi web.

Hola:

Por si te interesa, por fin, hemos lanzado una nueva versión de este artículo actualizada a 2019. Léela aquí:

www.campusmvp.es/.../...HTML-CSS-y-JavaScript.aspx

¡Saludos!

No se aceptan más comentarios