Los diseñadores y desarrolladores web a menudo necesitan un editor visual que les ayude a visualizar y crear páginas web HTML.
Bueno, eso era así hace años, ahora el proceso tomó un cariz diferente. Sin embargo, muchos diseñadores y desarrolladores web todavía utilizan editores HTML y CSS para diseñar sus páginas estáticas.
Hoy en día, los diseñadores web necesitan herramientas de maquetación, wireframing y creación de prototipos, que cubrimos en varios temas de este sitio. Muchos diseñadores de aplicaciones para el usuario utilizan editores de código y servidores de recarga en vivo para el diseño web.
Sin embargo, este artículo trata sobre los editores HTML de páginas web clásicos de la vieja escuela.
En este artículo te ofrecemos una lista de los mejores editores de páginas web gratuitos de código abierto que puedes instalar como aplicaciones independientes en tu computadora.
Aquí están nuestras mejores opciones:
1- Sílex
Sílex es un creador de sitios web y un editor HTML5 gratuito y de código abierto en la nube. Cree sitios web directamente en el navegador sin escribir código. Y es adecuado para que los diseñadores profesionales produzcan excelentes sitios web sin limitaciones.
Viene con un rico editor WYSIWYG con soporte completo para arrastrar y soltar, funcionalidades de exportación y compatibilidad con todos los navegadores modernos.
Silex también se puede instalar en la máquina local, pero requiere la instalación de Node.js.
Sílex se lanza bajo una licencia compuesta que es la licencia GPL-3.0 y MPL-2.0, y muchos desarrolladores lo actualizan continuamente.
2- Pescado azul
Pescado azul es un editor web sencillo y ligero para desarrolladores web, además es un programa totalmente gratuito y de código abierto que funciona en Windows, Linux y macOS.
Bluefish admite la edición de múltiples documentos HTML, la publicación remota a través de FTP, SFTP, FTPS, HTTP y WebDAV, viene con una biblioteca de fragmentos enriquecidos, soporte de codificación múltiple y modo de edición de pantalla completa.
Característica destacada del Bluefish
- Soporte multiproceso para archivos remotos usando gvfs, compatible con FTP, SFTP, HTTP, HTTPS, WebDAV, CIFS y más1
- Interfaz de múltiples documentos, abre fácilmente más de 500 documentos (probado >10000 documentos simultáneamente)
- El soporte de proyectos le permite trabajar de manera eficiente en múltiples proyectos y restaura automáticamente la configuración para cada proyecto.
Revise todas las demás funciones aquí.
3- Aprendizaje eXe
editor EXE y aprendizaje eXe es un editor gratuito de código abierto para HTML4 y HTML5. Se puede utilizar para crear materiales educativos interactivos en forma de contenido web.
Admite imágenes, vídeos, archivos de audio, galerías de imágenes y texto interactivo.
eXe permite a los usuarios exportar varios formatos a un sistema de gestión de aprendizaje basado en web como Moodle.
Si su objetivo es crear materiales educativos para plataformas de páginas web educativas, entonces eXe es su elección.
eXe admite la exportación de archivos en los siguientes formatos:
- ePub3
- XLIFF
- Catálogos con diferentes modelos de metadatos: Dublin Core, LOM, LOM-ES.
- IMS o SCORM (estándares educativos utilizados para publicar contenidos interactivos en plataformas o herramientas de eLearning como Moodle o cualquier otro repositorio REA (Recursos Educativos Abiertos).
El proyecto se publica bajo la licencia GPL-2.
4- Publicos
Publii es un generador de sitios web estáticos y un editor de páginas web gratuito y de código abierto para crear CMS, portafolios, galerías de fotos y sitios web de revistas.
Con Publii, puedes editar los proyectos de tu sitio web usando 3 editores diferentes: un editor de bloques, un editor WYSIWYG y un editor de páginas Markdown.
Publio lanzado como un proyecto de código abierto bajo la licencia GPL-3.0. y funciona en Windows, macOS y Linux.
Puede llevar su sitio web directamente desde el entorno de desarrollo al entorno de ensayo o producción, ya sea utilizando GitHub, GitLab, FTP, SFTP, páginas de GitHub, Netlify, AmazonWS,
Publii organiza tus proyectos de sitios web estáticos con etiquetas para páginas y publicaciones, y también te permite cambiar los temas fácilmente. Además, los diseñadores pueden personalizar sus temas fácilmente o comprar cualquiera de los temas premium en el mercado.
También puede ampliar su funcionalidad instalando y utilizando complementos oficiales como: copias de seguridad, CSS personalizado, HTML personalizado, importador de WP, visor de registros y generador de miniaturas.
5- KompoZer
Kompozer es un editor web WYSIWYG para páginas HTML. Originalmente se basa en el código base de Mozilla Composer como editor web nvu el desarrollo se ha detenido.
Es una solución ideal y liviana para que los desarrolladores web creen sitios HTML estáticos.
Características del Kimpozer
- Una solución de software gratuita y de código abierto
- Funciona en todas las plataformas principales
- Una interfaz de usuario sencilla para todo tipo de usuarios.
- Viene con un administrador de sitio FTP.
- Incluye un selector de color incorporado.
- La interfaz permite a los usuarios personalizar las barras de herramientas.
- Viene con un corrector ortográfico automatizado incorporado.
- Admite HTML, xHTML, XML, CSS y XUL.
- Resaltado de código y sintaxis.
- UI con pestañas que permite al usuario editar muchas páginas.
- Administrador del sitio que permite explorar y editar páginas del sitio.
- Una potente herramienta de búsqueda que busca en archivos.
- Herramienta de publicación (implementación) con un clic.
- Ofrece un potente editor visual CSS.
6- Editor web Amaya
Amaya editora web es un editor de páginas web gratuito lanzado por el W3C en 1996 como escaparate para el cliente de desarrollo web.
Ofrece soporte integrado para la edición de HTML y CSS, pero también se puede utilizar como editor XML, XHTML, MathML y SVG.
Amaya es gratuito y de código abierto creado con el lenguaje de programación C para funcionar en todas las plataformas conocidas como sistemas Windows, macOS y Unix/Linux.
Características destacadas de Amaya
- Un lienzo de representación visual de una página web.
- Interfaz con pestañas que admite la edición de varias páginas.
- Navegador HTML/XHTML Elements que admite arrastrar y soltar en el lienzo.
- Editor de estilos para clases de CSS.
- Navegador de estilo para la página actual que ayuda a los desarrolladores a revisar las clases CSS de la página.
- Navegador y editor de atributos CSS.
- Funcionalidad de búsqueda y reemplazo.
- Interfaz personalizable que permite al usuario cambiar de barra lateral, personalizar barras de herramientas y elementos de la interfaz de usuario.
- Viene con un navegador de archivos enriquecido integrado para la edición de sitios web que admite vista previa de árbol para archivos.
- Ofrece un naveg
ador de caracteres especiales. - Conmutador de soporte de temas CSS.
- Lista de todos los archivos CSS/estilo del proyecto.
- Visor de componentes del árbol de páginas web.
- Vista previa dividida para contenido
- Visor y editor de SVG
7- Maqeta
maqeta es un proyecto de código abierto que proporciona creación visual WYSIWYG de interfaces de usuario HTML5 y sitios web móviles.
El programa Maqetta en sí está escrito en HTML y, por lo tanto, se ejecuta en el navegador sin requerir complementos ni descargas adicionales.
A pesar de su popularidad entre los diseñadores web, el desarrollo de la aplicación Maqetta se detuvo en 2013, pero muchos usuarios de todo el mundo todavía la descargan.
Características destacadas de Maqetta
- Un editor de páginas visual sencillo con soporte inteligente para arrastrar y soltar.
- Conjunto de herramientas de edición HTML enriquecido.
- un editor de páginas visual WYSIWYG para dibujar interfaces de usuario
- Herramienta de notas adhesivas para ayudar a los desarrolladores en las siguientes tareas.
- Múltiples modos de visualización de documentos: ver código fuente, ver HTML y visor CSS.
- Un modo de vista dividida.
- Una rica biblioteca de elementos HTML y widgets.
- Visualización de la jerarquía de páginas.
- Reordenamiento de widgets.
- Paleta de escenas: cree y administre estados de aplicaciones.
- Paleta de propiedades: Interactividad de la aplicación sin programación.
- Los programadores y desarrolladores pueden agregar notas de revisión y comentarios.
- Viene con un editor de temas incorporado.
- Herramienta de estructuración de alambres en la aplicación.
- Una rica biblioteca de fragmentos de JavaScript.
- Un rico ecosistema de temas y widgets.
- Editor de diseño móvil y responsivo.
- Edición simultánea en vistas de diseño o de origen
- Opciones de exportación que permiten una transferencia fluida de las maquetas de la interfaz de usuario a herramientas de desarrollo líderes como Eclipse.
- un mecanismo para organizar un prototipo de interfaz de usuario en una serie de “estados de aplicación” (también conocidos como “pantallas” o “paneles”) que permite que un diseño de interfaz de usuario defina la interactividad sin programación
8- Grifo Azul
grifo azul No es un editor de páginas web típico, también es un editor y editor de libros electrónicos/EPUB basado en Firefox.
Admite edición HTML4.0 y HTML5, editor CSS 3, viene con OCR incorporado y más.
El programa es gratuito, pero algunas funciones requieren licencia para su uso, como las funciones de edición de EPUB, el modo de pantalla completa y más. Pero es bueno para la edición básica de HTML.
Resaltado de características
- Rico editor visual WYSIWYG
- Admite edición HTML4,5 XML y CSS
- Viene con un panel explorador DOM
- editor de guiones
- Visor de doble panel para la fuente de la página y el HTML renderizado
- Ofrece un administrador de fuentes de Google integrado
- Soporte de edición de rebajas
- Administrador de hojas de estilo (CSS)
- Interfaz de usuario multilingüe
- Conjunto de etiquetas de internacionalización (ITS) 2.0
- Cuadrículas CSS
- Editor y visor de CSV
- Admite elementos multimedia HTML5, audio, vídeo y formularios
9- Pingrow Nosotros Editor
El editor web pingrow es un editor web y creador de sitios web gratuito y rico en funciones.
Es nuestra primera elección, en primer lugar porque funciona en todos los sistemas principales como Linux, macOS y Windows, y en segundo lugar porque viene con funciones avanzadas para desarrolladores profesionales como soporte SaaS.
Pingrow también admite el editor de cuadrícula CSS para el marco Bootstrap, compatibilidad con Tailwind CSS y desarrollo de temas de WordPress listo para usar.
Tiene una interfaz sencilla y fácil de usar, con arrastrar y soltar, modo repetidor para repetir elementos, editor en línea para contenido y explorador de árbol para el contenido de la página web.
El editor web Pingrow admite CSS, SASS y LESS, con los que puedes revisar visualmente tus efectos en vivo.
Además, admite diseño responsivo, temas personalizados, vistas múltiples y consultas de medios.
Recomendamos encarecidamente el editor Pingrow a diseñadores web, diseñadores frontend y desarrolladores profesionales.
10- mono marino
Si vienes de los albores de Internet, seguro que recuerdas la mono marinoque es una suite de Internet completa que le permite navegar por sitios web, chatear con amigos a través de IRC, administrador de fuentes RSS, grupos de noticias y editar sus páginas HTML.
SeaMonkey Composor es el editor integrado predeterminado dentro de la suite y ofrece una alternativa similar para Micrsoft Frontpage y Adobe Dreamweaver (formalmente Macromedia Dreamweaver).
También viene con un potente inspector DOM y un depurador de JavaScript (Venkman). Más allá de eso, también puedes descargar e instalar varios complementos y extensiones para facilitar las tareas de creación de páginas web.
11- Código VS
Código VS es sin duda el editor de código e IDE de mayor tendencia para los desarrolladores hoy en día. Tiene un vasto y rico ecosistema de temas y extensiones. Puede agregar fácilmente más funciones de desarrollo web, como ver la página web dentro de un visor con pestañas, inspectores web avanzados y más.
Las extensiones también se pueden configurar para facilitar su flujo de trabajo.
Aquí hay una lista rápida de las extensiones de diseño web y front-end mejor probadas:
- Servidor en vivo: le permite ejecutar sus páginas HTML dentro de un servidor web local en vivo con una opción de recarga en caliente. Es ideal para el desarrollo de sitios web estáticos.
- mas bonita: Le ayuda a formatear automáticamente su código para que sea más legible, claro y limpio.
- CSS Peek: extensiones útiles que permiten una vista previa de un código CSS mientras se desplaza sobre cualquier elemento DIV o HTML dentro de su código.
- Corrector ortográfico de código: subraya las palabras que no coinciden en su diccionario de archivos.
12- Herramientas de contenido
ContenidoHerramientas es una biblioteca de edición WYSIWYG rica, avanzada y súper liviana que se puede instalar o agregar a cualquier página web para permitir la edición en línea de páginas web y proyectos.
Lo enumeramos aquí porque se puede utilizar como base para crear un IDE enriquecido basado en web para proyectos web.
ContentTools admite tablas, inserción de imágenes con varios formatos, inserción de archivos multimedia, modo papelera y permite a los desarrolladores agregar más funcionalidades a través de su potente API.
Otras características incluyen: historial, administrador de atributos y una API fácil de usar para desarrolladores que se puede integrar con cualquier bibli
oteca o marco.
13- NVU
NVU es un completo Sistema de creación web para usuarios de Linux Desktop, Microsoft Windows y Macintosh a programas rivales como FrontPage y Dreamweaver. Nvu (pronunciado N-view, para “nueva vista”) hace que administrar un sitio web sea muy sencillo. Ahora cualquiera puede crear páginas web y administrar un sitio web sin experiencia técnica ni conocimientos de HTML.
NVU es una comunidad respaldada por el editor web KompoZer.
Pensamiento final
Los editores HTML de páginas web son herramientas esenciales para que los diseñadores y desarrolladores web creen hermosos sitios web visuales. A pesar de que el concepto ha cambiado a lo largo de los años y muchos de estos programas no son utilizados por los desarrolladores actuales, excepto VSCode, por supuesto, proporcionan un buen punto de partida para usuarios novatos y estudiantes.
Si conoce algún otro editor de páginas web gratuito o de código abierto que se nos haya escapado, háganoslo saber.
Etiquetas
Desarrollo web de código abierto Programación basada en web Herramientas para desarrolladores Lista de editores de desarrollo
