¿Acabáis de concebir la maqueta gráfica o tenéis que integrar la de vuestro cliente, y no sabéis cómo hacerlo? ¿Por dónde se debe comenzar?
Hoy presentamos una introducción esquemática para el diseño de páginas web que retoma el camino de la integración y la interpretación de una web, una definición de los lenguajes HTML y CSS, así como las herramientas para desarrollarla correctamente, y la presentación de algunos navegadores web presentes en el mercado.
Para comenzar en la creación de una página web, es necesario establecer dos lenguajes: HTML y CSS que estarán redactados con ayuda de un programa llamado editor de código fuente y salvaguardado en forma de fichero que posee las extensiones: HTML y CSS.
Estos dos serán enviados a través de un programa FTP que permite publicar los ficheros desde el propio ordenador hacia el servidor web donde serán almacenados y puestos a disposición de los visitantes. Finalmente, para consultar la página habrá que utilizar el otro programa, que es el navegador web que interpreta los códigos fuente y hace de enlace entre los dos ficheros HTML y CSS.
Las herramientas para codificar
Antes de comenzar a integrar la maqueta, conviene tener a mano las buenas herramientas para desarrollar lo mejor posible una página web. Dos programas son indispensables: un editor HTML con el fin de codificar de forma limpia y legible, y un navegador web para presentar y probar la página web.
Editores de código fuente
Se trata de programas que generan automáticamente el código (HTML, CSS y JavaScript) cuando se manipulan los objetos gráficos en el seno de la interfaz del programa que permite así al usuario componer el resultado final de su página web, tal y como lo haría con ayuda de un programa gráfico como Photoshop.
Estos programas se deben manejar con prudencia, puesto que aparte de ser sencillos de usar y muy intuitivos, no proponen una versión puramente visual del documento, y a veces generan un código poco accesible. Por tanto conviene generalmente utilizar este tipo de programa con precaución.
Los editores de código
Estos programas ponen de color las diferentes partes del código para una mejor legibilidad, contrariamente a un editor de texto básico como Notepad o TextEdit con los cuales es totalmente posible codificar. Ofrecen una ayuda con diferentes términos para el usuario, añadiendo una tabulación a comienzo de cada línea con el fin de garantizar la claridad y la legibilidad del código.