multimedia digital: CONCEPTOS BÁSICOS 1ª PARTE

lunes, 21 de noviembre de 2011

CONCEPTOS BÁSICOS 1ª PARTE

CREAR Y GUARDAR UN DOCUMENTO

En el tutorial anterior, ya vimos cómo crear documento HTML de forma sencilla y rápida, en este tutorial, nos centraremos en la creación de documentos desde plantillas, con estructuras y CSS.

Antes de empezar, tenemos que tener una cosa en cuenta, cuando creamos un documento, partiendo de una plantilla, el CSS puede integrarse en la cabecera del código (<HEAD>) o puede crearse un documento aparte. Para la mejor lectura y comprensión del código, personalmente siempre prefiero tener el CSS en un documento aparte, separando así la estructura y el diseño del contenido. En este apartado veremos las diferencias, para que cada cual elija la mejor forma de trabajar, para él.

Veremos las siguientes formas para crear un documento:

· Desde la ventana de bienvenida.

· Desde menú archivo.

DESDE LA VENTANA DE BIENVENIDA

Para crear un documento desde la ventana de bienvenida, pulsamos en “Más…”, se no abrirá la ventana que verémos en la imagen siguiente. En esta serie de tutorial, solo verémos documentos HTML y CSS, por lo que iremos a “HTML”. Observamos que hay plantillas con columnas de ancho fijo o flexible, ¿Cuál es la diferencia entre una y otra?, la diferencia es que la fija, no variará el ancho de las columnas, según la resolución de nuestro monitor, y el flexible, si variará, pero podemos poner un ancho mínimo y máximo para que solo sea flexible entre esos rangos. Sabiendo esto, tan solo tenemos que tener muy clara la estructura de nuestro sitio web, y elegir la opción que más nos interese. El diseño CSS, es modificable, por lo que los colores y los anchos, podremos modificarlos a nuestro antojo, pero del CSS ya hablaremos en los siguientes tutoriales.

Otro tipo de plantilla que podemos encontrar, lo vemos en la pestaña “Página de muestra”, encontramos otro tipo de estructura diferente.

Importante, seleccionar “Hojas de estilo CSS”, no “Conjunto de marcos” ya que los marcos están obsoletos, es un tipo de diseño que no se utiliza y el hecho de utilizarlo, os podría perjudicar en la indexación de nuestro sitio en los buscadores.

DESDE EL MENÚ ARCHIVO

Aquí solo veremos cómo llegar a la ventana para seleccionar la plantilla, ya que el proceso de elección ya lo vimos en el apartado anterior.

Pulsamos “Archivo” en el menú, después “Nuevo” y llegamos a la ventana de selección de la plantilla.

DIFERENCIAS DE LOCALIZACIÓN DEL CSS EN LA CREACIÓN DEL DOCUMENTO

En el documento que hemos creado con CSS en un documento aparte, vemos que no genera una línea de código vinculando el CSS al documento, indicando la localización del mismo.

En el documento generado con el CSS en el HEAD, vemos que el código CSS se encuentra entre las etiquetas HEAD, lo que nos hace tener muchas líneas de código en un solo documento, siendo, a mi parecer, más complicado detectar errores ya que deberemos mirar línea por línea.

Si trabajamos tan solo desde la vista de diseño, esto no nos afecta, y pasa a ser una simple forma de organizar el código del sitio.

En sitio simples, no es muy importante, pero en proyectos más grandes, pasa a ser algo primordial, he incluso llegaremos a trabajar con diferentes archivos CSS para diferenciar los CSS según su utilidad.