comparte el articulo 

Como hacer buenas páginas en HTML

Actualizado el 04/10/2013 < > 2 Cometarios

Resumen: Algunas indicaciones sencillas para empezar a hacer buenas páginas web usando correctamente HTML.

No existen directivas definitivas para un “buen” HTML. Sin embargo existen normas sobre el aspecto que debe tener un documento HTML. En todo caso es recomendable orientarse lo más posible a las normas del lenguaje según el Consorcio(W3C). Entretanto, el Consorcio(W3C) ha reconocido que su tarea no sólo es la elaboración de prescripciones técnicas, sino también la mediación a los usuarios “comunes” que no poseen un estudio informático acabado. En caso de que se ocupe de la creación de páginas web de una manera intensiva y duradera, le recomendamos visitar regularmente las páginas del Consorcio(W3C) y ver las novedades, tendencias y directivas.

El Consorcio(W3C) ofrece además para autores de HTML un servicio, para examinar la exactitud sintáctica de archivos: el llamado validador. De esta forma puede examinar sus páginas en busca de errores para corregirlos.

Indicaciones generales para hacer buen HTML

No codificar para un determinado navegador

En caso de que desee publicar en Internet, entonces debe probar como se ven los archivos en los diferentes navegadores. Lo mejor es usar los productos más difundidos como Firefox e Internet Explorer, siendo muy recomendable ver las páginas tanto en varias versiones de los navegadores, como también en otros navegadores como Opera. Si tiene la posibilidad de hacer las pruebas en varios entornos (MS-Windows, Macintosh, Linux etc.), entonces no deje de hacerlo.

Nadie le puede prohibir que escriba sus archivos HTML para un navegador determinado, por ejemplo Netscape (como muchas personas lo hacen). En tal caso es recomendable informar en la página de entrada que las páginas han sido desarrolladas para un determinado navegador. Nosotros aconsejamos buscar un compromiso para que las páginas puedan ser visualizadas por todos los navegadores.

No codificar para determinadas resoluciones de pantalla

El forzamiento de anchuras fijas con el uso de tablas anidadas y “píxeles invisibles” se ha extendido tanto en la web, que muchos autores ya no saben que HTML simple general un texto corrido normal, que se adapta al tamaño de la ventana del navegador. No tiene sentido tampoco despreciar completamente el forzamiento de anchuras mínimas. Tablas con varias columnas y contenido correspondiente requieren de una cierta anchura y HTML tampoco es WML (un lenguaje especial para la creación de páginas para teléfonos móvil). Pero si tiene que decidir si sus páginas deben ser optimizadas para una resolución de pantalla de 1024 o de 800 píxeles- entonces se enfrenta a una mala decisión. Pues muchos usuarios navegan con varias instancias de navegador y abren enlaces a otras páginas muchas veces en otras ventanas del navegador. Esas ventanas a menudo no son visualizadas en el modo de pantalla entera o máxima. Existen también muchos programas para usuarios que se toman en principio una parte de la pantalla y siempre son visualizados – por ejemplo programas de mensajes instantáneos como ICQ. Todos estos usuarios no le dan el placer de agrandar la ventana del navegador solamente para ver su página. No se rompa la cabeza demasiado por los valores medios que hay me tomar para la dimensión de las pantallas. Un par de cientos de píxeles (o sea una indicación muy indeterminada) se pueden suponer para la anchura, pero eso es todo.

Utilice indicaciones de altura y anchura en porcentajes, para las tablas y marcos. Indicaciones absolutas de píxeles tienen un sentido allí, en donde la primera columna de una tabla invisible se debe encontrar sobre una imagen de fondo coloreada partida en dos. Por lo demás debe abandonar la idea de que por ejemplo una imagen o un párrafo deben comenzar exactamente 10,8 cm del borde izquierdo de cada navegador. Si la página se ve bien en su navegador, eso no significa que en los navegadores de los usuarios también se vea bien, en algunos casos es de esperar que la visualización sea realmente mala.

No utilizar los elementos HTML para otros fines

No es recomendable utilizar los elementos lógico-semánticos de HTML, para lograr determinados efectos de formato. Algunas personas utilizan por ejemplo el elemento blockquote para lograr sangrías de párrafos, y esto tan sólo porque la mayoría de los navegadores interpretan el texto encerrado en <blockquote></blockquote> como un párrafo con sangría. El elemento blockquote existe sin embargo para especificar citas y debe ser usado sólo para eso.

Pero aun mucho peor es la utilización incorrecta de cabeceras. Las cabeceras no existen para hacer que los textos sean más grande y estén en negrita, sino para marcar las relaciones jerárquicas lógicas entre los diferente párrafos. Si desea hacer formatos sobresalientes, utilice para ello las hojas de estilo en cascada.

Utilizar textos de enlaces honestos y explícitos

Generalmente es válido lo siguiente: el fin de un enlace debe cumplir lo que promete. Eso significa que el texto del enlace no debe prometer mucho, ni tampoco muy poco. Si por ejemplo, se ofrece información sobre un programa determinado, sin ofrecer bajarlo, entonces no sería bueno poner un un enlace sugiriendo que el producto puede ser bajado en la página.

Enlaces pueden ser puestos en cualquier lugar del texto. Pero si lee un texto, en el cual cada segunda palabra es un enlace, entonces se podrá dar cuenta que eso molesta definitivamente la lectura. El motivo de esto, es que uno siempre pone atención a los enlaces, y eso nos molesta al leer. Por esta razón es de suma importancia que los enlaces en los textos no se conviertan en adivinanzas, sino al contrario, al leerlos, el usuario debe darse una idea de lo que se esconde detrás de ellos.

Utilice siempre un enlace dentro del texto, siempre y cuando el texto del enlace sea razonable. Formule oraciones, en donde aparezca el texto del enlace, de tal manera que se pueda comprender de lo que se trata.

No escriba por ejemplo:

Más información aquí.

sino:

Información adicional sobre el tema.

Utilizar imágenes correctamente

A menos que usted haya decidido publicar una exposición de arte en la red, es aconsejable mantener las imágenes web pequeñas. Tenga en cuenta al crear las imágenes, que muchos usuarios tienen una conexión a Internet que depende del volumen de transferencia de datos, o sea que ellos pagan por la cantidad de datos que son transferidos a sus ordenadores. Aunque la mayoría de los navegadores poseen una función que permite no cargar los gráficos, muchos usuarios no la utilizan y eso no significa que están dispuestos a recibir gráficos de un tamaño mayor a 1MB.

Por tal razón le aconsejamos que utilice imágenes web pequeñas bien posicionadas. Muchas veces basta tener imágenes con 16 colores en lugar de 256 o hasta de 16,7 millones. Esto hace que las imágenes sean más pequeñas y carguen más rápido las páginas web.

Por otro lado no hay que prescindir de gráficos. Leer sólo texto en la pantalla cansa mucho más que por ejemplo en un libro. Por tal razón es recomendable estructurar los textos largos. La utilización de imágenes también forma parte de ello.

Las imágenes pequeñas en forma de iconos son ideales. Ellos se cargan bien rápido y se pueden utilizar varias veces en un mismo archivo HTML.

Gráficos pequeños pueden también tomar determinadas funciones de identidad corporativa, o funciones de orientación. La ventaja de usar estos gráficos en varias lugares, es que la mayoría de los navegadores los cargan tan sólo una vez y luego los mantienen en la memoria.

Publicado el 04/10/2007, última actualización 04/10/2013.

Autor: Stefan Münz, Traducción: Virgilio Krumbacher

URL: la webera

Añadir Comentario (Subir al texto)

2 Cometarios

  1. Ejemplo de estructura de una página HTML

    […] Como hacer buenas páginas en HTML. […]

    Domingo, 3 de enero 2010

  2. Normas elementales en HTML

    […] del W3C (y II), donde la idea es utilizar CSS siempre que sea posible, pero seguir incluyendo HTML semántico para maximizar la compatibilidad con navegadores […]

    Domingo, 3 de enero 2010

(Subir al texto)

Añadir Comentario

* Campos obligatorios

Meneame Bitacoras