Nro 33 
[PROYECTOWEB]

ICQ# 160711232
La Habana. Cuba. Año 2 Nro 33
jueves. 27 de FEBRERO de 2003

Boletín Electrónico Quincenal Sobre Diseño, Usabilidad y Arquitectura Web
Comunidad Virtual PROYECTOWEB: http://www.proyectoweb.cubaweb.cu/
Correo-e: proyectoweb@cubaweb.cu - revistaproyectoweb@yahoo.com

Boletines Anteriores | PWlist | Foro | Enlaces

S  U  M  A  R  I  O
EL TEMA: Guía de Estilo Web: Sobre el Diseño de Interfaz
TECNOWEBUltima actualización o Modificación
además: PROPONEMOS - CORREO DE SUSCRIPTORES 

    EL TEMA 

Guía de Estilo Web
 Sobre el Diseño de Interfaz

No se dejen atrapar por lo novedoso de páginas Web que han tirado por la borda las normas básicas del diseño gráfico y editorial. La mejor estrategia de diseño al crear un sitio que sea fácil de usar y, a la vez, tenga un contenido muy completo y complejo será aplicar, de forma consistente, algunos principios básicos del diseño de documentos convencionales

Por Patrick J. Lynch  -
http://patricklynch.net/  
Traducido por: Roxana Castañeda

Los usuarios de documentos Web no sólo miran la información, sino que interactúan con ella de una manera totalmente nueva, sin precedentes en el tradicional sistema de consulta y aproximación a las publicaciones impresas. La Interfaz Gráfica del Usuario (GUI) de una computadora incluye metáforas de interacción, imágenes y conceptos que se utilizan para transmitir función y significado a la pantalla que tiene delante. Las características visuales detalladas de cada componente de la interfaz gráfica, y la sucesión funcional de interacciones, dan lugar a un producto final que tendrá la apariencia y sensación características de las páginas Web y de los vínculos propios de las relaciones hipertextuales. El propósito del diseño gráfico y la "firma" visual de los gráficos incluidos en una página Web no es tan sólo "animar" la página, sino que son una parte integral de la experiencia del usuario. En los documentos interactivos es imposible mantener separado el diseño gráfico de los asuntos relativos al diseño de la interfaz.

Diseño Web vs Diseño Convencional

La mayoría de nuestros conceptos actuales sobre cómo estructurar la información provienen de la organización de libros y revistas impresos, así como del método de indexación utilizado en las bibliotecas y otros sistemas para catalogar documentos de esa índole. La normas para la "interfaz estándar" de los libros han sido establecidas sobre una buena base y son aceptadas a nivel mundial. Cada aspecto de un libro, desde la tabla de contenido hasta el índice y las notas al pie de página, han evolucionado a lo largo de los siglos, y los lectores de los primeros textos enfrentaron algunos de los mismos problemas de organización que enfrentan hoy día los usuarios de documentos web. La Biblia de Gütemberg, de 1456, se cita a menudo como el primer libro moderno, y sin embargo, aún después del crecimiento explosivo del material impreso, tuvieron que pasar más de 100 años para que se convirtieran en rasgos rutinarios detalles tales como la enumeración de páginas, la elaboración de índices y tablas de contenido, e incluso las carátulas. Los documentos Web sufrirán una evolución y estandarización similares, en cuanto a la manera de organizar y presentar la información en un formato digital.

Precedentes en el diseño de impresión

Aún cuando es cierto que trabajar con documentos interactivos plantea algunos retos novedosos para los diseñadores, la mayor parte de la ayuda que estos necesitan para concebir, crear, ensamblar, editar y organizar variados formatos en la web no es diferente a la usada actualmente en el medio impreso. La mayoría de los documentos Web pueden ser elaborados siguiendo las convenciones de estilo editorial y organización del texto propuesta por el Manual de Estilo de Chicago (The Chicago Manual of Style). Asimismo, casi todo lo que una organización necesita saber sobre la creación de estándares de publicación internos claros, comprensivos y consistentes lo pueden encontrar, por ejemplo, en Las Normas Xerox para la Publicación: Un Manual de Estilo y Diseño (Xerox Publishing Standards: A Manual of Style and Design). No se dejen atrapar por lo novedoso de páginas Web que han tirado por la borda las normas básicas del diseño gráfico y editorial.

Cada página Web un documento completo

Existe un aspecto crucial en el que las páginas de Internet son diferentes de las de libros y otros documentos impresos: los enlaces hipertextuales le permiten al usuario llegar a un determinado destino sin necesidad de ninguna introducción. De ahí que se las considere más completas que sus predecesoras convencionales. Esto conduce, por ejemplo, a que sus encabezados y notas al pie deban ser más informativos y accesibles que los de las páginas impresas; en cada una de estas, ciertamente, sería absurdo repetir los datos sobre el nombre del autor, la fecha de publicación, etc., pero en un sitio Web, al cual el usuario puede llegar por cualquiera de sus páginas y probablemente sea esa la única que visite, es necesario que tal información esté siempre a su alcance.

No solo en la Web enfrentamos este problema de hacer de cada página un documento completo. Las publicaciones periódicas profesionales, las revistas y la mayoría de los periódicos suelen repetir la fecha, el número del ejemplar y el volumen tanto al principio como al final de cada página impresa, porque saben que sus lectores recortan o fotocopian a menudo aquellos trabajos que les interesan y dicha referencia les resulta indispensable para poder rastrear el origen del artículo.

Teniendo en cuenta estos posibles inconvenientes, la mejor estrategia de diseño al crear un sitio Web que sea fácil de usar y, a la vez, tenga un contenido muy completo y complejo será aplicar, de forma consistente, algunos principios básicos del diseño de documentos. Esto no es complicado ni tiene casi nada que ver con la tecnología de Internet; es similar a las clásicas clases de periodismo y responde a las siguiente interrogantes: quién, qué, cuándo y dónde.

Quién

¿Quién está hablando? La pregunta es tan básica que es común que los autores que escriben para la Web piensen que dicha información es obvia e innecesaria, olvidando así la pieza fundamental de información que cualquier lector necesita saber para asegurarse del origen de un documento: ¿quién me está diciendo ésto? Ya sea de un autor individual o de una organización, siempre díganle al lector quién escribió la página Web. La avalancha de sitios comentando el caso del accidente del vuelo 800 de las aerolíneas TWA en 1996 es un ejemplo claro de cómo una fuente desconocida puede propagar información incorrecta o incluso intencionalmente falsa, y controlar una investigación y discusión legítimas.

Qué

Todos los documentos necesitan títulos claros, que capturen la atención del lector, y por varias razones esto es especialmente importante en la Web. Este elemento editorial básico es a menudo lo primero que cualquier navegante ve al aparecer la página. Allí donde hay muchas imágenes, el título puede ser la única cosa que los usuarios vean durante varios segundos, hasta que los gráficos terminen de descargarse en la ventana de su navegador. Además, ese es el texto que aparecerá en los favoritos si el usuario decide añadir la página a su archivo de direcciones URL. Un título ambiguo o confuso, o que contiene basura tecnológica en vez de palabras claras, no ayudará a recordar por qué en un momento dado decidimos guardar tal o cual bookmark (Favoritos).

Cuándo

La vigencia de un documento es otro aspecto importante al estimar su valor. Prácticamente todos los de carácter impreso, tales como periódicos, revistas y la correspondencia, están fechados, lo que nos lleva a dar por sentada la referencia sobre su edad o período de existencia desde su surgimiento. Por eso, pon la fecha en todas tus páginas Web y cámbiala cada vez que las actualices. Este detalle resulta primordial cuando se trata de documentos en línea largos o complejos, que son actualizados con regularidad, pero cuyas diferencias pueden no ser notadas a simple vista por el visitante ocasional. La información de una empresa, la relativa a productos, manuales para el personal y cualquier otro documento técnico presentado en páginas Web debería siempre indicar la fecha en que fueron renovados.

Dónde

La gran Red de Redes es un lugar "extraño" que contiene una increíble cantidad de información, pero que muy pocas veces nos aclara la localización física del origen de un documento. Haz click en un enlace hipertextual y podrías conectarte a un servidor en Sydney, Chicago, o prácticamente cualquier rincón del mundo donde haya Internet. A no ser que seas un experto en analizar direcciones web (URLs) puede resultarte muy difícil averiguar de dónde procede aquello que estás viendo. Después de todo estamos hablando de la Red, donde la pregunta del "dónde" es a menudo inseparable del "quién" escribió el documento.

Siempre informa a tu lector de dónde eres, acompañado -si es relevante- por la caracterización de tu empresa u organización.

Una manera sencilla de decirle al usuario dónde se origina una página es poner un vínculo al "home" -tu página de inicio- en, por lo menos, todas tus páginas principales. Sin embargo, es posible que este enlace se pierda una vez que el interesado imprima o archive en formato de texto todo lo que estaba buscando. Aunque la mayoría de las últimas versiones de los navegadores de Internet permiten incluir automáticamente la dirección del sitio Web en cualquier cosa que imprimas, hay muchas personas que no aprovechan esta facilidad adicional. Demasiados de nosotros tenemos montañas de hojas Web impresas por ahí sin ninguna señal que nos permita volver a encontrar la página de donde salieron.

Recuerda incluir de manera consistente el título, el autor, la organización a la que pertenece el autor, la fecha de actualización y por lo menos un vínculo a tu portada (home) en todas las páginas que componen tu sitio Web. Utiliza estos elementos básicos y habrás recorrido el 90% del camino para brindar a tus lectores una interfaz de fácil comprensión.


COMENTAR este material en EL FORO




 PROYECTOWEB 2002 en formato PDF  
40 artículos en 87 páginas - 778 Kb

Por razones de índoles tecnológicas fue imposible cumplir con los cientos de suscriptores que pidieron descargar PW2002, ponemos a disposición de toda la Comunidad Virtual PW

Para descargar pw2002.pdf - 778 KB
http://www.proyectoweb.cubaweb.cu/pw2002.pdf

NOTA: Recuerde que para Visualizar e Imprimir documentos PDF
debe tener instalado en su sistema Acrobat Reader o cualquier otro visualizador. Descargar Acrobat Reader 5 (8.608 Kb)
http://www.latinamerica.adobe.com/products/acrobat/readstep2.html





Lista de Correo PWlist  
Espacio de discusión profesional en el mundo hispano. Se creó sobre la base de la necesidad de un lugar de discusión inteligente entre personas con intereses comunes. TEMAS: 1. Diseño Web  2. Usabilidad Web y 3. Arquitectura de Información   Para Suscribirme

    Proponemos

Ainda.info - en español
URL: http://www.ainda.info
Ainda es uno de esos sitios didácticos al que se regresa una y otra vez, con un alto nivel profesional, este sitio administrado por Eduardo Manchon está enfocado a la Usabilidad, y el Diseño Web fácil de usar. Aquí encontrará entre otras temáticas: Diseño de la navegación y contenidos, Evaluación de usabilidad de sitios web y Planificación y desarrollo de sitios web. 

Sevloid Guide to Web Design - en inglés
URL: http://www.sev.com.au/webzone/design.asp
La Sevloid Guide to Web Design es una colección de más de 100 consejos y trucos sobre aspectos relacionados al diseño de páginas web. La organización en categorías generales como Navegación, Contenido y Gráficos hace que sea fácil obtener la información que buscamos.

    TECNOWEB
Ultima actualización o Modificación

A Cargo de Alberto J. Rdguez Piñeiro. Dpto Gráfica de Ingeniería de la CUJAE. Cuba

A muchos diseñadores les agrada insertar en su sitio la fecha de última modificación y que esta se actualice automáticamente. He recorrido la WWW buscando un código que realmente cumpliera con estas características y siempre los que he hallado toman la fecha de carga del sitio con la hora incluida en el navegador. Ello se debe a que el código insertado se ejecuta en el navegador del usuario, no se muestra la fecha de modificada en el servidor, por ello considera la última actualización como la última vez que la cargo el navegador. Aquí les propongo 2 códigos con 2 formatos distintos que si se actualizan en el servidor, por supuesto la página que se actualiza es donde esté ubicado el código generalmente la página principal.


Primer código

<!--webbot bot="Timestamp" S-Type="EDITED" S-Format="%d/%m/%y" -->


Segundo código

<SCRIPT LANGUAGE="JavaScript">
var days = new Array(8);
days[1] = "Domingo";
days[2] = "Lunes";
days[3] = "Martes";
days[4] = "Miercoles";
days[5] = "Jueves";
days[6] = "Viernes";
days[7] = "Sabado";
var months = new Array(13);
months[1] = "Enero";
months[2] = "Febrero";
months[3] = "Marzo";
months[4] = "Abril";
months[5] = "Mayo";
months[6] = "Junio";
months[7] = "Julio";
months[8] = "Agosto";
months[9] = "Septiembre";
months[10] = "Octubre";
months[11] = "Noviembre";
months[12] = "Diciembre";
var dateObj = new Date(document.lastModified);
var wday = days[dateObj.getDay() + 1];
var lmonth = months[dateObj.getMonth() + 1];
var date = dateObj.getDate();
var fyear = dateObj.getYear();
if (fyear < 2000)
fyear = fyear + 1900
document.write(wday + ", " + lmonth + " " + date + ", " + fyear)
</SCRIPT>

 
   Correo de Suscriptores
DESDE LA HERMANA PARAGUAY. Osvaldo Olivera, diseñador, graduado en la Universidad Católica de Asunción, y profesor de Tratamiento digital de la Imagen en la carrera de diseño Gráfico nos dice que "Desde hace aproximadamente unos 6 meses que recibo en mi correo electrónico el boletín ProyectoWeb, desde aquí mis más sinceras felicitaciones por tan buen material, me ha servido en muchas ocasiones como material de consulta obligada para mi y para mis alumnos en lo que se refiere a Usabilidad y Arquitectura de la Información. No he encontrado tan buen compendio con tan apropiado uso de la semiótica como lo han hecho ustedes. Más adelante en su reconfortable correo, Olivera nos sugiere "establecer contacto de manera que puedan utilizarlo mis alumnos durante el semestre para contactar con el equipo de ProyectoWeb e intercambiar información e investigación entre la partes, de manera que la relación sea un poco más sincera (hasta ahora yo estoy utilizando material de ustedes como un apoyo didáctico) y también forjar una suerte interacción entre partes tan lejanas fisicamente, pero tan cercanas dentro del contexto digital". Osvaldo agradecemos sus elogios con respecto al boletín y nos gustaría recibir vuestra colaboración como hermanos latinoamericanos que somos.


PAGINAS WEB DOCENTES. Olga Ortega recién se ha suscrito al boletín y "estoy realmente fascinada... solo quisiera que publicaran un poco más sobre el diseño de páginas web  pero a partir de sus requerimientos didácticos, indispensables para una web docente, creo que coinciden conmigo en que  contar con todos los requerimientos técnicos no es suficiente para lograr el aprendizaje a través de un entorno web. ¿pudieran ayudarme a establecer contactos con especialistas en producción y diseño de páginas web docentes? Les estaría muy agradecida. Saludos y Felicitaciones por el trabajo que realizan". Olga nos gustan los correos que traen sugerencias, te comento que en próximas semanas tendremos disponible un curso de Diseño Gráfico orientado al ambiente Web, es sólo el inicio de un ambicioso programa de curso a través del boletín. Incluyo tu dirección de correo para que alguien interesado en el Diseño y Producción de páginas web docentes pueda contactarte:  olgaklr@yahoo.es

    COMUNIDAD   VIRTUAL   PROYECTOWEB


NÚMEROS ANTERIORES EN:
http://www.proyectoweb.cubaweb.cu/
PARA SUSCRIBIRSE: proyectoweb-subscribe@domeus.es  mensaje en blanco
Para CANCELAR la suscripción: proyectoweb-unsubscribe@domeus.es

Editado por Comunidad Virtual PROYECTOWEB  
©Copyright [PROYECTOWEB]. 2001-2003
Boletín Electrónico Quincenal Sobre Diseño, Usabilidad y Arquitectura Web

La Habana. Cuba  
ICQ# 160711232

COORDINADOR:
Orlando I. Romero Fernández
CONSEJO EDITORIAL:
Orestes González Quintana -CIP
Víctor Fernández González
-CubaWeb, Amaury E. del Valle -Juventud Rebelde
Adrián Coutin Domínguez
-InfoMed, Alberto J. Rdguez Piñeiro -CUJAE
WEBMASTER:
Libia B. Miranda Camellón
CORRECCION:
Odalys Cimadevilla Valdés

Comunidad Virtual ProyectoWeb: http://www.proyectoweb.cubaweb.cu/
Correo-e: proyectoweb@cubaweb.cu

Mención I Concurso de Páginas Web ICub@2002

Boletines Anteriores
 | PWlist | Foro | Enlaces 

Programa de Afiliados. AYUDANOS¡¡¡¡  Click Aquí
Envio de dinero a Cuba | Envio de remesas a Cuba | Cash2cuba

-------------------------------------------------------------------------------- 
Se puede redistribuir, reenviar, copiar o citar este BOLETIN-E.
La distribución de este Boletín NO se considera un CORREO SPAM,
ya que
incluye una forma de ser CANCELADO
y se distribuye únicamente a quienes se han suscrito voluntariamente. PROYECTOWEB NO admite la comercialización de los datos de sus suscriptores
Para CANCELAR la suscripción: mailto:proyectoweb-unsubscribe@domeus.es

fn [PROYECTOWEB] Nro 33