Estructura HTML5

Tomado de: Planeta FLATA.org el 13-04-2018.

Hemos visto el revuelo que ha causado el inicio del módulo, sobre todo por la expectativa hacia el código para crear páginas web. Tenemos compañeros que dominan el tema, otros que conocieron las formas anteriores de diseñarlas y algunos que no hemos traveseado en esta área; así que lo primero es estandarizar nuestra concepción grupal.

¿Por qué usar código?
Si ahora hay tantos programas que nos permiten generarlo, ¿por qué escribirlo nosotros mismo? Porque no estamos en un curso de diseño de páginas web, estamos en un programa de experto en su administración, y debemos dominar la base sobre la cual funciona la world wide web, el código HTML. Por eso nuestra dinámica de la Matrix, en la que vemos todo por fuera: bonito, funcional, atractivo, pero ¿qué hay detrás? Vamos a descubrirlo.

HTML5 es la última colección de estándares para el diseño y desarrollo de páginas web. No es un lenguaje de programación, así que no debes preocuparte o temerle, al contrario, este lenguaje se basa en una colección que nos muestra la manera en que se presenta la información en un navegador web y la manera de interactuar con ella.

Como todo lenguaje, debemos aprender a conocerlo, usarlo y entenderlo y para ello iniciaremos con la estructura básica de una página HTML5:

Las palabras en inglés mostradas en color amarillo y expuestas entre los símbolos <> son parte del lenguaje HTML5 y se las denomina etiquetas, ya que marcan secciones, partes o elementos de una página web y que tendrán una característica específica según el diseño. Por ello en lugar de programar una página web, se la maqueta o etiqueta.

No importa el dispositivo que uses: un ordenador de escritorio, un equipo portátil, una pantalla gigante o una muy pequeña, una tableta o un teléfono inteligente; el HTML5 te permite crear una página totalmente compatible y los elementos de la estructura que acabas de conocer son considerados como el estándar en la actualidad.

HERRAMIENTAS DIGITALES NECESARIAS

Para iniciar el trabajo como webmaster con HTML5 necesitamos ciertas herramientas de trabajo en línea o e-work, que describimos a continuación: 

Navegadores web
Existe una discusión muy grande con respecto a cuál es el mejor navegador, pero para un webmaster no hay un mejor o un peor, todos son necesarios tomando en cuenta los utilizados por los usuarios en la red. Para ello te sugerimos los que vienen instalados de forma predeterminada en los ordenadores y que son usados por los usuarios novatos o con menor experiencia, luego suma uno que tenga una acogida estadística fuerte, pero que no pertenezca al grupo anterior y por último algún navegador preferido por ti a manera personal. A continuación te mostramos los que usamos nosotros, ubicados en el mismo orden:

• Sistema Windows - Microsoft Edge
• Sistema Mac OSX & iOS - Safari
• Sistema Linux - Mozilla
• Sistema Android - Chrome
• Estadística fuerte - Firefox
• Uso personal - Opera

Editor HTML
Dependiendo del sistema operativo que uses en tu ordenador, instala un editor HTML para que puedas escribir tus códigos con la mayor eficiencia posible. Te sugiero:

• Sistema Windows - Notepad Plus++ // Kompozer es una herramienta que de primera entrada me parece muuuucho más práctica y accesible para estudiantes que inician.
• Sistema Mac OSX - TextMate
• Sistema Android - HTML Editor
• Sistema Linux - Blue Griffon

Área digital de trabajo
Ubica un directorio en tu ordenador que uses específicamente como tu área de trabajo como webmaster y mantenlo ordenado a un nivel de paranoia, esto es demasiado importante. El nombre del directorio debe cumplir con las reglas de los 5 sin:

• sin espacios
• sin tildes o acentos
• sin eñes (enies)
• sin símbolos especiales como ,;/&%$"@#+*?}, etc
• sin mayúsculas

Crea subdirectorios que te permitan ordenar los archivos que almacenarás en este espacio, por ejemplo:

• Recursos
• Software
• Plantillas
• Proyectos
• etc.

Crea todos los necesarios para evitar el caos y que dicha organización se convierta en un aliado y no en una muralla.

Software actualizado
Verifica que tu ordenador tenga la última versión disponible para su sistema operativo, comprobando primero la compatibilidad necesaria para evitar problemas de funcionamiento. Un webmaster está en el tope de los usuarios de Internet, no puede quedarse rezagado en versiones antiguas.

Selecciona y actualiza un programa antivirus, máximo uno adicional al que venga predeterminado en tu sistema. Instalar más de un antivirus, lejos de protegerlo, ocasiona una mayor debilidad a tu entorno.

La última versión de Java, que es un lenguaje de programación usado por miles de gurús, webmasters y diseñadores, desde sitios web, juegos en línea, efectos digitales, hasta el funcionamiento de multimedia y compatibilidad de dispositivos periféricos, móviles o wearables. Descárgala y actualízala desde www.java.com

Bitácora web u offline
Nuestra carpeta offline debe ser una reproducción exacta, a forma de respaldo, del sitio tal y como será publicado en Internet. Eso indica que su peso, tamaño físico, número de archivos, etc., deben ser estrictamente aquellos que se encuentran usados en el diseño dentro de la estructura web de nuestro sitio.

Muy importante
El detalle de estas herramientas o recursos están determinados para aquellas personas que quieren empezar desde cero, pero apuntando a los estándares internacionales de la W3C, World Wide Web Consorcium, la máxima entidad en la red, presidida por Tim Bernes Lee, el padre de la Web, creador del código HTML. Si ya tienes experiencia y te acomodas con otras distintas a las expuestas, puedes usarlas sin problema alguno, además eres libre de compartir tu experiencia con tus compañeros en los espacios del aula determinados para ello.