Manual html - Consideraciones de diseño

14 - Consideraciones de diseño

[editar]
Apuntes creado por Mononeurona. Extraido de: http://www.mononeurona.org/index.php?idp=370
27 de Octubre de 2005
El desarrollo actual de páginas para el Web involucra la combinación de distintos y muy variados elementos para conformar uno solo. Como se ha visto en los capítulos anteriores, es fácil incluir elementos que enriquecen y resaltan los formatos de la información que se desea ofrecer por Internet. En resumen, los elementos técnicos ofrecen un conjunto de herramientas, especificaciones y nuevos atributos que día con día extienden las capacidades de despliegue visual de los navegadores.

Pero todo esto tiene un costo en tiempo de análisis, de producción y especialmente del diseño. Estas consideraciones van desde una página personal hasta la producción de un sitio completo.

En la presente sección se abordan distintos puntos para la producción de sitios Web con base en consideraciones de diseño y producción.

Recomendaciones para la elaboración de sitios Web

La capacidad del Web para publicar documentos a nivel mundial presenta varias problemáticas que se listan a continuación.

· Diferencias culturales.

· Contenido de una página.

· Distribución de la información en el sitio.

· Velocidad de transferencia.

Diferencias culturales

En el mundo existen una amplia variedad de personas de distintas sociedades, creencias y pensamiento que se encuentran en contacto por medio de Internet. Los documentos que se generan llegan hasta estos grupos y el mensaje del sitio o documento puede ser tomado de forma distinta por cada uno de ellos. Es un buen consejo tener en mente que una página tiene un significado distinto para cada uno de nosotros y por ello lo que se considera de buen gusto para uno no lo es para los demás.

Contenido de una página

Otro aspecto importante es el contenido y mensaje de un documento. No es igual elaborar el mensaje de una página para una empresa que vende computadoras, que para una institución de educación superior. Una vez que se ha definido el objetivo del sitio el proceso no concluye en este punto. Un documento Web siempre debe presentar alguna mejora o cambio en su contenido. Una buena referencia son las bitácoras de acceso al sitio, las cuales ofrecen información importante:

cuántas personas han visitado el sitio, desde dónde se ha visitado, qué páginas han visitado, entre otras.

Distribución de la información en el sitio

Cuando se ha definido la información que se pondrá a disposición por el Web, ésta se debe organizar para su fácil consulta y referencia en el sitio. Existe más de una forma de lograr un buena distribución de la información, y esto también depende de la naturaleza de la misma. Un error común es el de querer conjuntar la información en una sola página, generando con esto documentos que se extienden por más de una pantalla para su despliegue en el navegador. Estudios recientes indican que el 90% de los usuarios busca hasta un equivalente de dos pantallas para el despliegue de información por página Web que consulta, después de lo cual sale del documento en busca de otro.

Velocidad de transferencia

A pesar de las mejoras en el envío de información por Internet, muchos usuarios no cuentan con los elementos necesarios para ver el despliegue completo de un documento en un tiempo "razonable".

En general este tiempo varia en relación con varios factores: transito en la red, ancho de banda de transferencia, número de imágenes a transferir, etcétera.

El proceso de diseño

A medida que se van conociendo el funcionamiento y los elementos propios del HTML podemos darnos cuenta de la gran variedad de diseños que podemos incluir en los documentos Web. Aunada a la discusión anterior, se debe señalar que el proceso de creación de un sitio no concluye con su puesta en funcionamiento en un servidor. Esto es solamente el principio. El proceso de diseño es uno más de los que integran la producción del sitio en su totalidad. Para lograr que un diseño sea adecuado a los objetivos establecidos se deben considerar los siguientes puntos:

· Capacidades del navegador.

· Plataforma de despliegue.

· Imágenes y composición de las páginas.

· Imagen corporativa.

Capacidades del navegador

El lenguaje HTML se enriquece en la medida en que los navegadores progresan. Al final, si un documento se despliega, su apariencia se verá afectada por el navegador que se utilice.

Es importante señalar que en el desarrollo de un sitio se debe establecer desde el inicio los navegadores que se utilizarán para el diseño. Las soluciones para este problema están orientadas por la combinación de las siguientes características:

· Navegador que el usuario utiliza.

· Juego de etiquetas HTML para dichos navegadores.

· Equipo y sistema operativo que el usuario utiliza (Windows, Macintosh, UNIX, etcétera).

Plataforma de despliegue

Al igual que el punto anterior es necesario considerar la plataforma desde la cual se accede el documento, ya que varía la calidad de un equipo a otro, por ejemplo Windows y Mac. Estas diferencias en resolución y calidad limitan el proceso de desarrollo y la calidad del mismo.

Aún dentro una misma plataforma, la calidad de las imágenes desplegadas, el tipo de letra que se utiliza y los efectos especiales que se utilizan pueden variar de una a otra.

Existen páginas cuyo nivel de despliegue óptimo se establecen desde el inicio, por ejemplo: 800 x 600 a 256 colores.

La solución es solo una: evaluar los documentos en estas plataformas y establecer el mínimo de calidad de todas ellas, o bien, crear un sitio para cada plataforma.

Imágenes y composición de las páginas

Como se mencionó en el uso de la etiqueta <IMG>, cada vez que se le utiliza el navegador establece una petición para dicha imagen. En otras palabras, para cada imagen que se haga referencia desde una página se trae cada una al mismo tiempo, lo cual repercute en el tiempo de despliegue.

En este sentido se recomiendan varias alternativas para la integración de imágenes:

· Para fotografías e imágenes digitalizadas utilizar el formato JPEG tratando de establecer un promedio de 70 Kb para su tamaño.

· Los fondos, botones, imágenes animadas y cualquier otro elemento artístico producirlos en GIF, con un promedio de 40 Kb de tamaño.

· Los fondos no deben estorbar a la lectura del documento y si resaltarlos.

En cualquiera de los formatos de las imágenes, es importante definir una paleta de colores, ya que las resoluciones varían de un equipo a otro. Por lo general la paleta de colores utilizada es la de 256 colores, pero resulta en exceso pobre para los efectos artísticos la página, por lo que es frecuente encontrar paletas de colores de 16 bits o más, además de que se recomienda el uso de una paleta lo más ligera posible a fin de que el depliegue sea de la misma calidad en todos los equipos posibles.

Imagen corporativa

Para sitios profesionales es importante mantener un aspecto corporativo en todos los documentos que se desarrollan. Una técnica efectiva en este sentido es el establecimiento de plantillas para las distintas páginas del mismo. La base se toma en la página principal y de ahí se definen los diseños del segundo nivel y sucesivos. Las plantillas deben establecer con claridad los elementos que identificarán al sitio durante la navegación del mismo, procurando generar fórmulas y patrones que pueden ser reproducidos fácilmente.

Estas plantillas ayudan a organizar la forma de navegación y distribución de la información del sitio de forma gráfica y más accesible a los desarrolladores. En la Figura 3 se observa un ejemplo de plantilla con la correspondiente distribución de información en un sitio.

Una vez definida la imagen institucional, los documentos permiten en su conjunto establecer un sitio bajo el mismo diseño e ideas de desarrollo.

Se debe señalar que el uso de las mismas no es una regla rígida, sino más bien flexible, pero mantienen la identidad de un sitio en su totalidad.

Logotipo

Encabezado

Pie de página.
[editar]

16 opiniones

huy

no me cirbe para nada y no pongan babasadas
porno

chupa pinga
herramientas de produccion

conchatumare
por favor

a eso llamas avanzado mejor ponle html para idiotas como tu por ejemplo
NO PONGAN BASURAS

PONGAN COSAS INTERESANTES NO HUEVADAS PS
1 2 3 4 | siguiente >

Apuntes relacionados con 'Manual html'

Este manual ha sido elaborado por profesores de la Dirección General de Servicios de Cómputo... Más »
Recursos, vínculos de interés y más apuntes para hacer una web accesible.

Autor y licencia de 'Manual html'


Apuntes de Mononeurona. Extraido de: http://www.mononeurona.org/index.php?idp=370 CopyLeft
Este trabajo está licenciado bajo la Creative Commons License. 1999-2005 © :: MonoNeurona.org ::
Este contenido ha sido recopilado por el equipo de Wikilearning. Todo el contenido recopilado se ha obtenido respetando y comunicando en nuestro site la licencia de cada fuente.
Wikilearning tiene permiso expreso por escrito de los autores para publicar los contenidos que ha extraído de otras webs, incluyendo su uso comercial.