Herramientas Básicas para el Diseño Web

No necesitas mucho software para empezar como desarrollador web

Tabla de contenidoExpandir

Además de una computadora y una conexión a Internet, la mayoría de las herramientas que necesita para crear un sitio web son Programas de software , algunos de los cuales ya pueden estar en su computadora. Necesita un editor de texto o HTML, un editor de gráficos, navegadores web y un cliente FTP para cargar archivos en su servidor web.





Elegir un editor de texto básico o HTML

Puede escribir HTML en un editor de texto plano como Bloc en Windows 10, TextoEditar y Sublime Text en una Mac, o Vi o Emacs en Linux. Usted crea la codificación HTML para la página, guarda el documento como un archivo web y lo abre en un navegador para asegurarse de que se ve como se supone que debe ser.

Si desea más funciones que las que ofrece un editor de texto sin formato, utilice un editor de HTML en su lugar. Los editores de HTML reconocen el código y pueden identificar errores de codificación antes de iniciar el archivo. También pueden agregar etiquetas de cierre que olvide y resaltar roto Enlaces . Reconocen y se adaptan a otros lenguajes de codificación como CSS, PHP y JavaScript.



Los muchos editores de HTML en el mercado varían desde niveles básicos a profesionales. Si eres nuevo en escribir páginas web, uno de los WYSIWYG (Lo que ves es lo que obtienes) los editores pueden funcionar mejor para ti. Algunos editores muestran solo el código, pero otros le permiten alternar entre vistas de codificación y vistas visuales. Estos son algunos de los muchos editores web HTML disponibles:

    IDEA de Komodoy su interfaz fácil de usar son adecuados tanto para desarrolladores web principiantes como avanzados. La función de autocompletar de Komodo IDE es particularmente útil cuando escribe código para elementos comunes como enlaces. El software admite la codificación por colores de diferentes lenguajes de codificación, como HTML, CSS y muchos otros. Komodo IDE se ejecuta en Windows, Mac y linux .
IDEA de Komodo

cable de vida



    Editor HTML de la taza de cafées especialmente útil para los nuevos desarrolladores que están más interesados ​​en aprender a codificar que en una interfaz visual. Este robusto editor viene con plantillas y cuenta con verificadores de validación para ayudar a mantener su código libre de errores. Incluye finalización de código y admite otros lenguajes de codificación puede usar junto con HTML. El software destaca los errores, explica por qué aparecieron y le dice cómo solucionarlos. CoffeeCup HTML Editor se ejecuta en Windows.
Editor HTML de la taza de café

cable de vida

    Mobirisees un editor de HTML para personas que no quieren involucrarse con el código. Se trata de elegir un tema y luego arrastrar y soltar elementos en la página. Agregue texto tal como lo haría en un editor de texto normal e inserte imágenes, videos o íconos, todo sin escribir ningún código; Mobirise hace esa parte por ti. Mobirise está disponible para Windows y Mac, y es gratis.
Mobirise editor HTML

cable de vida

Navegadores web

Los sitios web pueden verse diferentes de un navegador a otro, por lo que es crucial probar sus páginas web para asegurarse de que se vean y funcionen según lo previsto. Chrome, Firefox, Safari (Mac), Ópera y Edge (Windows) son los navegadores más populares.

También debe probar la apariencia y el funcionamiento de sus páginas en navegadores móviles. La mayoría de los navegadores de escritorio ofrecen la posibilidad de ver sitios web en ventanas de varios tamaños. Por ejemplo, una gran cantidad de herramientas de prueba está disponible en Google Chrome en Vista > Desarrollador > Herramientas de desarrollo . Seleccione el ícono del teléfono inteligente en la esquina superior izquierda de la ventana del desarrollador para ver cualquier página en ventanas de diferentes tamaños y sistemas operativos móviles.



Menús que muestran Chrome

cable de vida

Editor de gráficos

El tipo de editor de gráficos que necesita depende de su sitio web. Adobe Photoshop es el estándar de oro, pero es posible que no necesite tanta potencia; además, es posible que necesite un programa de gráficos vectoriales para trabajos de logotipo e ilustración. Algunos editores de gráficos a tener en cuenta para el desarrollo web básico incluyen:



    CAÑUTILLOes un programa gratuito de edición de fotos de código abierto que ofrece muchas de las características de sus competidores más caros. Como software de código abierto , está disponible para Windows, Mac y Linux.
Programa de manipulación de imágenes GIMP

cable de vida

    Elementos de Photoshoppara Mac y PC es una versión ligera de su homónimo pero tiene muchas funciones.Corel PaintShop Propara PC tiene casi todas las herramientas que encuentra en Photoshop en una interfaz fácil de usar.paisaje de tintapara Windows, Mac y Linux es un editor de gráficos vectoriales gratuito. Esta alternativa al Adobe Illustrator más caro tiene capacidades más que suficientes para trabajos de diseño simple y gráficos web.

Cliente FTP

Necesita un cliente FTP (protocolo de transferencia de archivos) para transferir sus archivos HTML e imágenes y gráficos de soporte a su servidor web. FTP está disponible a través de la línea de comandos en Windows, Macintosh y Linux, pero un cliente FTP dedicado es mucho más fácil de usar. La parte superior Clientes FTP incluir:



    ArchivoZilla(gratis) está disponible para Windows, Mac y Linux. Admite transferencias de archivos de arrastrar y soltar y tiene una función de pausa y reanudación para cargar archivos grandes.
ArchivoZilla

Cable de vida / Richard Saville

    Cyberduckes un software gratuito, de código abierto y multiplataforma conocido por su perfecta integración con editores externos y su atractiva interfaz de usuario.FTP gratuitoy FTP directo son fabricados por la misma empresa. Free FTP es un cliente minimalista que satisface las necesidades básicas de transferencia de archivos. Direct FTP es una versión premium que ofrece funciones avanzadas. Ambas versiones son compatibles con Windows 7, 8 y Vista, pero solo Direct FTP es adecuado para Windows 10.
FTP gratuito

cable de vida



    Transmitires un cliente FTP exclusivo para Mac. Facilita transferencias inusualmente rápidas y es compatible con Amazon CloudFront.Lindo FTPes un potente cliente FTP premium que puede utilizar para realizar hasta 100 transferencias al mismo tiempo. Se considera uno de los clientes FTP más seguros disponibles.