Você está na página 1de 77

7 Reglas Para de Dar de Alta en Buscadores Tu

Sitio Web
http://marketingconexito.com/7-reglas-para-de-dar-de-alta-en-buscadores-tu-sitio-web/
¿Vas a dar de alta en buscadores tu sitio de la manera correcta o incorrecta? hazlo de modo correcto,
necesitas saber qué estas haciendo, y tu sitio necesita ser optimizado antes de pretender acercarlo a los
motores de búsqueda.
¿Cómo puedes saber si tu sitio está listo? puedes tomar en consideración lo siguiente antes de decidir
hacer el alta en buscadores. ¿Has incluido tus palabras clave en la etiqueta de título, descripción y
contenido? Asegúrate de que te has enfocado en solo una o dos palabras clave. También debes
verificar que no existan enlaces muertos, porque estos te pueden provocar problemas con los robots de
los motores de búsqueda.
Una vez que hayas hecho la petición de inclusión a los motores de búsqueda, necesitas esperar. Hay
probabilidad de que no seas añadido a la base de datos del motor de búsqueda antes de un mes.
Que Reglas Debo Seguir Para Dar De Alta En Buscadores Mi Sitio Web.
1. No hay necesidad de hacer esto más de una vez. A pesar de lo que muchas personas dicen, nunca
deberías presentar nuevamente tu sitio a menos que haya sido descartado completamente por ellos. Sin
embargo esto no aplica a las páginas nuevas. Si has creado varios cientos de páginas en el último mes
y no crees que ellas sean indexadas rápidamente mediante los enlaces que llevan a ellas, tal vez sea
buena idea darlas de alta en buscadores manualmente para que tu sitio sea indexado nuevamente. Si
estas usando los mapas de sitio de Google, sencillamente añade estas a ese documento para que sean
indexadas rápidamente.
2. Hazlo del modo correcto la primera vez: Se organizado cuando estés en el proceso de alta en
buscadores, especialmente con los directorios. Tómate el tiempo para investigar y encontrar la
categoría más adecuada para tus sitio. Si tu sitio puede ajustarse a varias categorías conoce cuál es la
política del directorio acerca de listados múltiples. Algunos directorios quieren que te presentes a todas
las categoría que sean relevantes a tu sitio, otros directorios no querrán que tu sitio aparezca en más de
una categoría y podrán rechazar tu petición. Otros querrán todas tus páginas, otros (la mayoría)
querrán tu página de inicio y nada más.
3. Se breve a la hora de describir tu sitio: ve al punto usando solo dos oraciones cortas. La mayoría
de los directorios restringirán el número de palabras que puedes usar. Aún si ellos no restringen, es
buena idea limitarse a veinticinco o treinta palabras. Esta es una de las diferencias más grande entre un
listado de directorios y una página de resultados de un motor de búsqueda. En el directorio solo
tendrás una pequeña línea de texto para atraer a tus visitantes; esto es constante para cada visitante.
4. Se tan preciso como puedas. No trates de engañar a las personas para que vayan y visiten tu sitio,
es contraproducente. La mayoría de los directorios son monitoreados por un equipo de editores. Estos
editores visitarán tu enlace y te pondrán en su lista negra si estas tratando de engañar a los visitantes de
una u otra forma. En lo que respecta a listados de directorio, hay menos campo para fraude en estos
que en los motores de búsqueda, debido a que ellos son vigilados por seres humanos.
5. Ten en cuenta que tu información debe ser relevante, además trata de hacerla atractiva a los
usuarios mediante el uso abundante de palabras clave. Los directorios no se fijan mucho en tus
palabras clave. Si tu sitio no es atractivo a los seres humanos será listado en una posición poco
prominente. Cuando los seres humanos son los que editan y posicionan, serán más objetivos a la hora
de decidir qué es lo que quiere.
6. Ten paciencia: Dar de alta en buscadores no es un proceso inmediato, vendrán buenas cosas a estos
que esperan. Dale tiempo a los motores de búsqueda.

7. No le presentes a los motores de búsqueda otras páginas aparte de la página de inicio. Sus
robots son capaces de navegar a través de tus enlaces e indexar tu sitio completo, empezando solo
desde la dirección de tu página de inicio.
Si sigues estas reglas, tendrás la seguridad de que tu sitio web será indexado por los motores de
búsqueda de la mejor forma.
No olvides dejar tu comentario.
Hasta el próximo post.
Federico Aura
When it comes to your web site, you should pay attention to every
detail. Cuando se trata de su sitio web, usted debe prestar atención a
cada detalle. You want to make sure it performs optimally to serve its
purpose. Usted quiere asegurarse de que funciona de manera óptima
para servir a su propósito. Here are 7 important rules of thumb to
observe when you engage a firm for small business website
development. Aquí hay siete importantes reglas de oro para observar al
contratar a una empresa de desarrollo de la pequeña sitio web de
negocios.
1. 1. Do not use splash pages No utilice páginas de bienvenida
Splash pages are the first pages you see when you arrive at a website.
Páginas de bienvenida son las primeras páginas que ve cuando se llega a
un sitio web. They normally have a very beautiful image with words
like "welcome" or "click here to enter". Normalmente tienen una
imagen muy bella con palabras como "bienvenido" o "haga clic aquí
para entrar". In fact, they are just that - beautiful images with no real purpose. De hecho, son sólo eso -
bellas imágenes sin ningún propósito real. Do not let your visitors have a reason to click on the back
button! No permita que sus visitantes tengan una razón para hacer clic en el botón de vuelta! Give them
the value of your site up front without the splash page. Dales el valor de su sitio en la delantera sin la
página de bienvenida.
2. 2. Do not use excessive banner advertisements No use la bandera publicidad excesiva
Even the least net savvy people have trained themselves to ignore banner advertisements so you will be
wasting valuable web site real estate. Incluso por lo menos la gente inteligente netos se han entrenado
para ignorar pancartas de publicidad por lo que estará malgastando espacio valioso sitio web real.
Instead, provide more valuable content and weave relevant affiliate links into your content, and let your
visitors feel that they want to buy instead of being pushed to buy. En su lugar, proporcionar un
contenido más valioso y tejer vínculos de afiliación pertinentes en su contenido, y deje que sus
visitantes sientan que quiere comprar en lugar de ser empujado a comprar.
3. 3. Have a simple and clear navigation Tener una clara y una navegación sencilla
You have to provide a simple and very straightforward navigation menu so that even a young child will
know how to use it. Usted tiene que proporcionar un menú de navegación muy sencilla y directa para
que incluso un niño pequeño sabe cómo usarlo. Stay away from complicated Flash based menus or
multi-tiered dropdown menus. Manténgase alejado de complicados menús basados en Flash o menús
desplegables de varios niveles. If your visitors don't know how to navigate, they will leave your site. Si
sus visitantes no saben cómo navegar, que dejará su sitio.
4. 4. Have a clear indication of where the user is Tener una indicación clara de que el usuario es
When visitors are deeply engrossed in browsing your site, you will want to make sure they know which
part of the site they are in at that moment. Cuando los visitantes están profundamente absorto en su
navegación por el sitio, usted querrá asegurarse de que saben qué parte del sitio que están en ese
momento. That way, they will be able to browse relevant information or navigate to any section of the
web site easily. De esa manera, será capaz de navegar por la información que sea pertinente o navegar a
cualquier sección del sitio web fácilmente. Don't confuse your visitors because confusion means your
visitors will leave your site! No confunda a sus visitantes debido a la confusión significa que los
visitantes salen de su sitio!
5. 5. Make it easy to read Que sea fácil de leer
Keep your text paragraphs at a reasonable length. Mantenga sus párrafos de texto en un plazo
razonable. If a paragraph is too long, you should split it into seperate paragraphs so that the text blocks
will not be too big. Si un párrafo es demasiado largo, debe dividirse en párrafos separados para que los
bloques de texto no será demasiado grande. This is important because a block of text that is too large
will deter visitors from reading your content. Esto es importante porque un bloque de texto que es
demasiado grande disuadirá a los visitantes de la lectura de su contenido.
6. 6. Avoid looping audio on your site Evite bucles de audio en su sitio
If your visitor is going to stay a long time at your site, reading your content, you will want to make sure
they're not annoyed by some audio looping on and on. Si el visitante se va a quedar mucho tiempo en
su sitio, la lectura de su contenido, usted querrá asegurarse de que no está molesto por algunos bucles
de audio una y otra vez. If you insist on adding audio, make sure your visitors have some control over it
-- volume or muting controls would work fine. Si usted insiste en añadir audio, asegúrese de que sus
visitantes tienen un cierto control sobre ella - el volumen o silenciar los controles que funcionan bien.
7. 7. Make sure you follow web standards Asegúrese de seguir los estándares web
Make sure your website complies to web standards and make sure they are cross-browser compatible.
Asegúrese de que su sitio web cumple con los estándares web y asegurarse de que son distintos
navegadores compatibles. If your website looks great in Internet Explorer but breaks horribly in Firefox
and Opera, you will lose out on a lot of prospective visitors. Si su sitio web se ve muy bien en Internet
Explorer, pero se rompe horriblemente en Firefox y Opera, que se pierden en una gran cantidad de
visitantes potenciales.
Remember to follow these 7 important rules when you engage a company for small business website
development and you will be on your way to having a website that is valuable to your visitors.
Recuerde seguir estas 7 reglas importantes al contratar una empresa de desarrollo de la pequeña Web
de la empresa y se le en su camino de tener un sitio web que es valiosa para sus visitantes.
entes creativas con espíritu meticulosa es un importante requisito previo para la elaboración de un
innovador diseño de sitios web. Aspirantes deben ser perseverante y realizar altas, a fin de aprender el
arte de diseño de páginas web. Incluso los principiantes ingenuos pueden subir la escalera con una
gestión adecuada y que se hayan habilidad en el largo plazo. Consejos que se indican a continuación
servirán de guía para comenzar una carrera como un exitoso diseñador de la tela.
1. Calidad de la paciencia: Un nuevo competidor en el mundo del diseño web debe tener paciencia.
No trate de verter en muchos detalles, ya que es muy desconcertante. Aprender de manera eficiente el
tema paso a paso con una fuerte determinación y poco a poco dominar el arte.
2. Adecuada Planificación: La planificación del proyecto es un factor primordial antes de diseñar un
sitio web.
o diseñador web debe organizar el plan teniendo en cuenta los posibles destinatarios de un sitio
web.
o Que sea un sitio personal o de negocios, un diseñador web debe tener conocimiento del lugar-
el tipo de industria, sus servicios y productos, sus clientes, socios comerciales, a corto plazo y objetivos
a largo plazo.
o El diseñador de la tela es un resumen de los gastos en la construcción de la web. Por ejemplo,
el registro del nombre de dominio, la búsqueda de un espacio para el sitio web en el servidor y así
sucesivamente.
3. Derecho de aprendizaje para el diseño de página web: Wannabe los diseñadores tienen que
aprender todo a partir del primer paso del diseño web a la última edición de la página web.
Adobe Photoshop o Photoshop-Uso (Graphics Software) diseño de una imagen que coincida
con el diseño del sitio web que se diseñará.
o el corte de la imagen en Photoshop-Tome el diseño original de la imagen y el tramo en
imágenes pequeñas.
Inserte el Photoshop o diseño en el HTML (Hyper Text Markup Language) el cuadro. Optar
por la hoja de estilo, CSS (Cascading Style Sheet).
Por último o editar las páginas web del sitio web utilizando Front Page, Dreamweaver,
CoffeeCup HTML Editor de la página y otros editores.
4. Orientación de Expertos: Las sugerencias de profesionales con experiencia para obtener ayuda de
diseño, que son más informativos, como la captura de los ojos y los expertos tienen un buen
conocimiento del mercado.
5. Aprende a Organizar Sitio web: Web de los diseñadores de sitios web deben organizarse con el
fin de garantizar que los visitantes puedan navegar fácilmente por las páginas de un sitio web. Reducir
el uso de gráficos que se presentan como un obstáculo en la comprensión del diseño de la portada del
sitio.
6. Crear diseños web sencillas: La iniciación en el comercio debe ceñirse a diseños simples que sean
fácilmente descifrado por los visitantes. El uso excesivo de gráficos da un aspecto desordenado a la
página web y no invitar a tráfico.
7. Decidir sobre los factores clave de Diseño Web: un diseñador web debe probar los factores clave:
o Seleccione un nombre de dominio que hablar del tipo de industria en su conjunto.
o Prueba de medidas para optimizar el diseño de sitios web de investigación de palabras clave-,
la colocación de las palabras clave adecuadas en una página web.
o Mantener un borrador del diseño web.
o Diseñar la página de índice para que se le da toda la información del sitio web.
o Crear un mapa del sitio de la web.
Enlace o estructura debe ser así construir de manera que el espectador puede navegar fácilmente
vaivén de una página a otra.
Impresionantes diseños hace un sitio web fácil en la mente de los visitantes. El diseño de la web es un
arte, que es dominado progresivamente en el tiempo con paciencia y perseverancia.
Retrieved from "http://www.articuloz.com/internet-articulos/reglas-de-oro-para-principiantes-en-
diseno-web-850187.html"
(Articuloz SC #850187)
5 Reglas Importantes en Diseno de Sitios web
Cuando llega el momento de diseñar su sitio web, debe prestar atención minuciosa a
cada detalle para asegurarse que funciona óptimamente para servir a su objetivo. Aquí
tiene siete reglas básicas importantes para asegurarse que su sitio web funciona bien.

1) No usar páginas Splash


Las páginas Splash son las primeras páginas que usted ve cuando llega a un sitio web.
Estas normalmente tienen una imagen muy hermosa con palabras como "bienvenido" " o
click aquí para entrar ". De hecho, estas son solamente - bonitos floreros sin verdadero
objetivo. ¡No permita que sus visitantes tengan una razón para pulsar el botón "atrás"!
Enseñe el valor de su sitio desde la primera página, sin páginas splash.

2) No use de forma excesiva publicidad con Banners.


La mayor parte de las personas que navegan por internet, se han habituado a ignorar los
banners entonces usted gastará espacios valiosos.
En cambio, proporcione mas contenido valioso y ubique enlaces de afiliados, relevantes
con el contenido de su web, deje sentir a sus visitantes que ellos quieren comprar en
lugar de sentirse empujados a comprar.

3) Tener una navegación simple y limpia


Usted tiene que proporcionar un menú de navegación simple y sin obstáculos de modo
que aún un chiquillo pueda usarlo. Evite complicados menús basados en flash o menús
desplegables multiescalonados. Si sus visitantes no saben navegar, abandonarán su sitio.

4) Tener una clara indicación de donde está el usuario


Cuando los visitantes son absorbidos profundamente al navegar por su sitio , usted debe
asegurarse que ellos saben(conocen) en que parte del sitio están en cada momento. Así,
ellos serán capaces de hojear la información relevante o navegarán a cualquier sección
del sitio fácilmente. ¡No confunda a sus visitantes porque la confusión quiere decir "
abandono el barco "!

5) El audio en su sitio, como herramienta opcional.


Si su visitante va a quedarse mucho tiempo en su sitio, leyendo su contenido, usted debe
asegurarse que no serán molestados por alguna reproducción de audio sin cesar en el
sitio web. Si desea añadir de audio, asegúrese que los visitantes tienen el control de ello -
el volumen o silenciar pueden trabajar muy bien.
What do these things have in common? ¿Qué tienen estas cosas tienen en
común?
• A Computer Mouse Un ratón de la computadora
• A Touch Screen Una pantalla táctil
• A program on your Mac or Windows machine that includes a trashcan, icons
of disk drives, and folders Un programa en tu Mac o Windows que incluye un
cubo de basura, los iconos de las unidades de disco y carpetas
• Pull-down menus Tire hacia abajo menús

Give up? Dejar de fumar? These are all examples of advances in human-computer
interface design which were designed to make it easier to accomplish things with
a computer. Todos estos son ejemplos de los avances en la interfaz de la
computadora de diseño humanos que fueron diseñados para que sea más fácil de
lograr las cosas con un ordenador. Do you remember the first days of desktop
computers? ¿Te acuerdas de los primeros días de computadoras de escritorio? I
do. Que hago. I remember when I had to remember long strings of commands in
order to do the simplest things like copy or format a disk or move to a new
directory. Recuerdo cuando tuve que recordar largas listas de comandos con el fin
de hacer las cosas más simples como copiar o formato de un disco o trasladarse a
un nuevo directorio. I don't miss those days! No echo de menos aquellos días!
Thank you, human-computer interface designers. Gracias, interfaz de la
computadora diseñadores humanos. (If you want to read about some of the
pioneers of human-computer interface design, check out information about
Douglas Englebart and Alan Kay .) (Si quiere leer sobre algunos de los pioneros de
la interfaz de la computadora de diseño humano, echa un vistazo a la información
sobre Douglas Englebart y Alan Kay .)
Human-Computer Interface Design seeks to discover the most efficient way to
design understandable electronic messages [ 1 , Human-Computer Interface de
diseño trata de descubrir la manera más eficiente para diseñar comprensible
mensajes electrónicos [ 1 , 2 ]. Research in this area is voluminous; a complete
branch of computer science is devoted to this topic, with recommendations for
the proper design of menus, icons, forms, as well as data display and entry
screens. 2 .] La investigación en esta área es voluminosa, una rama completa de
la informática se dedica a este tema, con recomendaciones para el adecuado
diseño de los menús, iconos, las formas, así como pantallas y la pantalla de
entrada de datos. This browser you are using now is a result of interface design -
the buttons and menus have been designed to make it easy for you to access the
web. Este navegador que está utilizando ahora es el resultado del diseño de la
interfaz - los botones y los menús se han diseñado para hacer más fácil para
acceder a la web. Some recommendations from this research are discussed
below. Algunas de las recomendaciones de esta investigación se analizan a
continuación.
Note: Many of these recommendations concern the design of computer interfaces
like Windows or the Mac Finder or how to make programs easier to use. Nota:
Muchas de estas recomendaciones se refieren al diseño de interfaces de
ordenador, como Windows o el Finder de Mac o cómo hacer que los programas
más fácil de usar. Some of these recommendations are not so relevant to web
design. Algunas de estas recomendaciones no son tan relevantes para el diseño
web. Still, it is an important area of research, and some of the recommendations
relate to any kind of communication between user and computer. Wherever
possible, I have included examples more directly related to web design. Sin
embargo, es un área importante de investigación, y algunas de las
recomendaciones se refieren a cualquier tipo de comunicación entre el usuario y
el ordenador. Siempre que sea posible, he incluido ejemplos más directamente
relacionados con el diseño web.

Shneiderman's Principles of Human-Computer Interface Design:


Shneiderman los Principios de la Computación Diseño de Interfaces
de seres humanos:
Recognize Diversity - In order to recognize diversity, you, the designer, must take into
account the type of user frequenting your system, ranging from novice user,
knowledgeable but intermittent user and expert frequent user. Reconocer la
diversidad - Con el fin de reconocer la diversidad, usted, el diseñador debe tener en
cuenta el tipo de usuarios que frecuentan el sistema, que van desde usuarios
principiantes, pero intermitentes de usuario bien informado y usuario frecuente de
expertos. Each type of user expects the screen layout to accommodate their desires,
novices needing extensive help, experts wanting to get where they want to go as quickly
as possible. Cada tipo de usuario espera que el diseño de la pantalla para dar cabida a
sus deseos, los principiantes que necesitan ayuda extensa, los expertos que quieren
llegar a donde quieren ir lo más rápido posible. Accommodating both styles on the same
page can be quite challenging. Con capacidad para dos estilos en la misma página puede
ser bastante difícil. You can address the differences in users by including both menu or
icon choices as well as commands (ie. Command or Control P for Print as well as an icon
or menu entry), or providing an option for both full descriptive menus and single letter
commands. Puede hacer frente a las diferencias de los usuarios mediante la inclusión de
ambos o icono de opciones de menú, así como comandos (es decir, comandos o P para el
control de impresión, así como un icono o el menú de entrada), o proporcionar una
opción para los menús y la carta descriptiva completa órdenes de una sola .
You Should Use the Eight Golden Rules of Interface Design : Usted debe
utilizar las ocho reglas de oro del diseño de interfaz:
1. Strive for consistency Luchar por la coherencia
○ consistent sequences of actions should be required in similar situations
secuencias coherente de acciones debe ser necesaria en situaciones
similares
○ identical terminology should be used in prompts, menus, and help screens
terminología idéntica se debe utilizar en avisos, menús y pantallas de ayuda
○ consistent color, layout, capitalization, fonts, and so on should be employed
throughout. color uniforme, el diseño, la capitalización, fuentes, y así
sucesivamente se debe emplear en todas partes.
2. Enable frequent users to use shortcuts Permitir que los usuarios frecuentes utilizar
accesos directos
○ to increase the pace of interaction use abbreviations, special keys, hidden
commands, and macros para aumentar el ritmo de abreviaturas uso
interacción, teclas especiales, los comandos ocultos, y macros
3. Offer informative feedback Oferta informativa comentarios
○ for every user action, the system should respond in some way (in web
design, this can be accomplished by DHTML - for example, a button will
make a clicking sound or change color when clicked to show the user
something has happened) por cada acción del usuario, el sistema debe
responder de alguna manera (en el diseño web, esto se puede lograr por
DHTML - por ejemplo, un botón hará un chasquido o un cambio de color
cuando se hace clic para mostrar al usuario algo que ha sucedido)
4. Design dialogs to yield closure Diseño de cuadros de diálogo para obtener el cierre
○ Sequences of actions should be organized into groups with a beginning,
middle, and end. Secuencias de acciones deben organizarse en grupos con
un principio, medio y final. The informative feedback at the completion of a
group of actions shows the user their activity has completed successfully La
retroalimentación informativa en la realización de un conjunto de acciones
muestra al usuario su actividad se ha realizado correctamente
5. Offer error prevention and simple error handling Oferta para la prevención de
errores y control de errores simples
○ design the form so that users cannot make a serious error; for example,
prefer menu selection to form fill-in and do not allow alphabetic characters
in numeric entry fields el diseño del formulario para que los usuarios no
pueden hacer un grave error, por ejemplo, prefieren la selección del menú
para formar relleno y no permita que los caracteres alfabéticos en los
campos de entrada numérica
○ if users make an error, instructions should be written to detect the error and
offer simple, constructive, and specific instructions for recovery si el usuario
comete un error, las instrucciones deben ser escritas para detectar el error y
ofrecer, constructiva, y las instrucciones específicas para la recuperación
simple
○ segment long forms and send sections separately so that the user is not
penalized by having to fill the form in again - but make sure you inform the
user that multiple sections are coming up segmento de larga formas y
secciones enviar por separado para que el usuario no esté penalizado por
tener que llenar el formulario de nuevo - pero asegúrese de informar al
usuario de que varias secciones se acercan
6. Permit easy reversal of actions Permiso de fácil reversión de las acciones
7. Support internal locus of control Apoyo interno locus de control
○ Experienced users want to be in charge. Los usuarios experimentados que
quieren estar a cargo. Surprising system actions, tedious sequences of data
entries, inability or difficulty in obtaining necessary information, and inability
to produce the action desired all build anxiety and dissatisfaction sistema de
acciones sorprendentes, secuencias tediosas de los datos de las entradas,
incapacidad o dificultad para obtener la información necesaria, y la
incapacidad para producir la acción deseada todos construir la ansiedad y la
insatisfacción
8. Reduce short-term memory load Reducir la memoria a corto plazo la carga
○ A famous study suggests that humans can store only 7 (plus or minus 2)
pieces of information in their short term memory. Un famoso estudio sugiere
que los seres humanos sólo puede almacenar 7 más o menos 2) piezas (de
la información en su memoria a corto plazo. You can reduce short term
memory load by designing screens where options are clearly visible, or using
pull-down menus and icons Usted puede reducir la memoria a corto plazo la
carga mediante el diseño de pantallas en las opciones son claramente
visibles, o usando los menús desplegables e iconos
Prevent Errors - The third principle is to prevent errors whenever possible.
Prevenir los errores - El tercer principio es evitar que los errores siempre
que sea posible. Steps can be taken to design so that errors are less likely
to occur, using methods such as organizing screens and menus functionally,
designing screens to be distinctive and making it difficult for users to
commit irreversible actions. Se pueden tomar medidas para diseñar de
manera que los errores son menos probable que ocurra, utilizando métodos
como la organización de las pantallas y menús funcional, el diseño de
pantallas para ser distintiva y lo que hace difícil para los usuarios a cometer
acciones irreversibles. Expect users to make errors, try to anticipate where
they will go wrong and design with those actions in mind. Espera que los
usuarios a cometer errores, tratar de anticipar dónde va a salir mal y el
diseño con las acciones en mente.

Norman's Research de Investigación de Norman


One researcher who has contributed extensively to the field of human-computer
interface design is Donald Norman. Un investigador que ha contribuido
ampliamente a la esfera de la interfaz de la computadora de diseño humano es
Donald Norman. This psychologist has taken insights from the field of industrial
product design and applied them to the design of user interfaces. Este psicólogo
ha tenido puntos de vista desde el campo del diseño de productos industriales y
los aplicó al diseño de interfaces de usuario. According to Norman, design should:
Según Norman, el diseño debe:
use both knowledge in the world and knowledge in the head. Knowledge in the world is
overt - we don't have to overload our short term memory by having to remember too
many things (icons, buttons and menus provide us with knowledge in the world - we don't
have to remember the command for printing, it's there in front of us). tanto el
conocimiento del mundo y el conocimiento en la cabeza. El uso del conocimiento en el
mundo es evidente - no tenemos a la sobrecarga de la memoria a corto plazo por tener
que recordar muchas cosas también (iconos, botones y menús nos proporcionan
conocimiento en el mundo - no tenemos que recordar el comando para la impresión, que
está ahí delante de nosotros). On the other hand, while knowledge in the head may be
harder to retrieve and involves learning, it is more efficient for tasks which are used over
and over again (providing a command key sequence like Control P for Print is an example
of this). Por otra parte, mientras que el conocimiento en la cabeza puede ser más difícil
de recuperar y aprendizaje implica, es más eficiente para las tareas que se utilizan una y
otra vez (siempre una secuencia de teclas comando como control P para imprimir es un
ejemplo de esto).
"make it easy to determine what actions are possible at any moment (make use
of constraints)" ([ 1 ] p. 188). "Hacen que sea fácil determinar qué acciones son
posibles en cualquier momento (hacer uso de las restricciones)" ([ 1 ] p. 188). For
example: Por ejemplo:
• well-designed things can only be put together certain ways (the trapezoidal SCSI
cable is an example of good design - I can only plug it in one way) Diseñado bien
las cosas sólo se pueden unir de cierta manera (la trapezoidal cable SCSI es un
ejemplo de buen diseño - que sólo puede conectar de alguna manera)
• menus only display the actions which can be carried out at that time (other options
are dimmed). menús sólo muestran las acciones que pueden llevarse a cabo en
ese momento (otras opciones están atenuadas).
"Make things visible, including the conceptual model of the system, the
alternative actions and the results of actions" ([ 1 ] p. 188). "Hacer las cosas
visibles, incluyendo el modelo conceptual del sistema, las acciones alternativas y
los resultados de las acciones" ([ 1 ] p. 188). You can provide an overview map of
your site so that your user can design their own mental map of how things work.
Se puede proporcionar un mapa general de su sitio para que el usuario puede
diseñar su propio mapa mental de cómo funcionan las cosas.
"Make it easy to evaluate the current state of the system" ([ 1 ] p. 188). "Que sea
fácil de evaluar el estado actual del sistema" ([ 1 ] p. 188). You can do that by
providing feedback in the form of messages or flashing buttons. Usted puede
hacer que al proporcionar retroalimentación en forma de mensajes o botones que
se encienden.
"Follow natural mappings between intentions and the required actions, between
actions and the resulting effect; and between the information that is visible and
the interpretation of the system state" ([ 1 ] p. 188). "Siga las asignaciones
naturales entre las intenciones y las acciones necesarias, entre las acciones y el
efecto resultante, y entre la información que es visible y la interpretación del
estado del sistema" ([ 1 ] p. 188). For example: Por ejemplo:
• It should be obvious what the function of a button or menu is - use conventions
already established for the web, don't try to design something which changes what
people are familiar with. Debería ser obvio que la función de un botón o un menú -
los convenios ya establecidos para el uso de la web, no trate de diseñar algo que
cambia lo que la gente se conoce.
• The underlined phrase on a web page is a well-known clue that a link is present. La
frase subrayada en una página web, es una conocida pista, así que el vínculo está
presente. From past experience, users understand that clicking on an underlined
phrase should take them somewhere else. De la experiencia pasada, los usuarios a
comprender que al hacer clic en una frase subrayada debe llevarlos a otra parte.
"In other words, make sure that (1) the user can figure out what to do, and (2) the
user can tell what is going on." ([ 1 ] p. 188) "En otras palabras, asegúrese de que
(1) el usuario puede decidir qué hacer, y (2) el usuario puede saber lo que está
pasando." ([ 1 ] p. 188)
Norman's information comes from a book called "The Design of Everyday Things."
de información de Norman viene de un libro llamado "El diseño de las cosas
cotidianas." There is a particularly interesting section on designing telephones
which is almost hilarious. Hay una sección interesante sobre todo en el diseño de
teléfonos que es casi hilarante. He has written a new book called "The Invisible
Computer". Él ha escrito un nuevo libro llamado "La Computadora Invisible". If you
want to read excerpts from this new book, go to:
http://www.jnd.org/cv.html#Invisible_Computer Si desea leer extractos de este
nuevo libro, vaya a: http://www.jnd.org/cv.html # Invisible_Computer
Summary Resumen
How can we relate the recommendations from human-computer interface design
research directly to web design? ¿Cómo nos relacionamos con las
recomendaciones de la interfaz de la computadora-la investigación del diseño
humano directamente al diseño de páginas web?
1. Recognize Diversity Reconocer la diversidad
○ make your main navigation area fast loading for repeat users hacer que su
navegación principal zona de carga rápida para los usuarios de repetir
○ provide a detailed explanation of your topics, symbols, and navigation
options for new users proporcionar una explicación detallada de sus temas,
símbolos y opciones de navegación para los nuevos usuarios
○ provide a text index for quick access to all pages of the site proporcionar un
índice de texto para un rápido acceso a todas las páginas del sitio
○ ensure your pages are readable in many formats, to accommodate users
who are blind or deaf, users with old versions of browsers, lynx users, users
on slow modems or those with graphics turned off asegurarse de que sus
páginas se pueden leer en muchos formatos, para dar cabida a los usuarios
que son ciegos o sordos, los usuarios con versiones antiguas de
navegadores, los usuarios de lince, los usuarios de módems lentos o con
gráficos desactivado
2. Strive for consistency in: Luchar por la coherencia en:
○ menus menús
○ help screens pantallas de ayuda
○ color color
○ layout diseño
○ capitalization capitalización
○ fonts Fuentes de la
○ sequences of actions secuencias de acciones
3. Offer informative feedback - rollover buttons, sounds when clicked
retroalimentación informativa Oferta - botones del rollover, sonidos al hacer clic en
4. Build in error prevention in online forms Construir en la prevención de errores en
los formularios en línea
5. Give users control as much as possible Dar control de los usuarios tanto como sea
posible
6. Reduce short term memory load by providing menus, buttons or icons. Reducir la
carga de la memoria a corto plazo al ofrecer menús, botones o iconos. If you use
icons, make sure you have a section which explains what they mean. Si utiliza
iconos, asegúrese de que tiene una sección que explica lo que significan. Make
things obvious by using constraints - grayed out items in menus for options not
available in that page Hacer cosas obvias utilizando restricciones - gris elementos
en los menús de opciones no están disponibles en la página
7. Make use of web conventions such as underlined links, color change in links for
visited pages, common terminology Hacer uso de las convenciones web, tales
como enlaces subrayados, cambio de color en los enlaces de las páginas visitadas,
una terminología común
8. Provide a conceptual model of your site using a site map or an index Proporcionar
un modelo conceptual de su sitio con un mapa del sitio o un índice
[ [ 1] Norman, D. (1988) The design of everyday things. New York, NY: Doubleday. 1]
Norman, D. (1988) El diseño de las cosas cotidianas:. Nueva York, NY, Doubleday.
[ [ 2] Shneiderman, B. (1998). Designing the user interface: Strategies for effective human-computer
interaction (3rd ed.) . 2] Shneiderman, B. (1998):. Diseño de la interfaz de usuario de Estrategias para
la interacción persona-ordenador efectiva (3 ª ed.). Reading, MA: Addison-Wesley Publishing. , MA
Reading: Addison-Wesley Publishing.

What is Hypertext or Hypermedia? ¿Qué es el hipertexto o hipermedia?


The name hypertext, or hypermedia, has been applied to networks of nodes (also called
articles, documents, files, cards, pages, frames, screens) containing information (in text,
graphics, video, sound, and so on) that are connected by links (also called pointers, cross-
references, citations). El hipertexto nombre, o hipermedia, se ha aplicado a las redes de
nodos (llamados también artículos, documentos, archivos, tarjetas, páginas, marcos,
pantallas) que contiene información (en texto, gráficos, video, sonido, etc) que están
conectados por enlaces (también llamado punteros, referencias cruzadas, citas).
Hypertext is more commonly applied to text-only applications whereas hypermedia is
used to convey the inclusion of other media, especially sound and video ([ 3 ], p. 553). El
hipertexto es más comúnmente aplicado sólo a las aplicaciones de texto hipermedia que
se utiliza para transmitir la inclusión de otros medios de comunicación, especialmente de
sonido y video ([ 3 ], p. 553).
The intrigue of hypertext is that it extends traditional linear text with the
opportunity for jumping to multiple related articles. La intriga del hipertexto es
que se extiende texto lineal tradicional con la oportunidad para saltar a varios
artículos relacionados. Convenient backtracking, clickable indexes and tables of
contents, string searching, bookmarks, and other navigation tools profoundly alter
the reader's experience....hypertext authors need to choose appropriate projects,
to organize their articles suitably, and to adjust their writing style to make the
best use of this new medium ([ 3 ], p. 556). retroceso conveniente, puede hacer
clic en los índices y tablas de contenidos, búsqueda de cadenas, marcadores y
otras herramientas de navegación alterar profundamente la experiencia del lector
.... autores de hipertexto que elegir los proyectos adecuados, para organizar sus
artículos adecuadamente, y para ajustar su estilo de escritura para hacer el mejor
uso de este nuevo medio ([ 3 ], p. 556).
The largest hypermedia experiment of all time is happening right in front of our
eyes. El mayor experimento hipermedia de todos los tiempos está ocurriendo
delante de nuestros ojos. Since the advent of the World Wide Web, many people
have been able to experience the relatedness of the internet, with its
accompanying problems of disorientation. Desde el advenimiento de la World
Wide Web, muchas personas han podido experimentar la relación de la Internet,
con sus consiguientes problemas de desorientación.
Research on Learning with Hypermedia La investigación sobre el aprendizaje
con hipermedia
In a review of hypermedia-based learning, Ayersman [ 1 ] discussed four strands
of research into learning and hypermedia: research based on perceptions or
attitudes about hypermedia; research based on individual differences or learning
styles; research based on system analyses (which examined the most effective
ways to structure hypermedia); and, research based on performance which
ranged from use of pre-made software to the construction of one's own software.
En una revisión de aprendizaje basado en hipermedia, Ayersman [ 1 ] discute
cuatro aspectos de la investigación sobre el aprendizaje y la hipermedia: la
investigación basada en las percepciones y actitudes acerca de hipermedia, la
investigación basada en las diferencias individuales o estilos de aprendizaje, la
investigación basada en análisis de sistemas (que examinó el formas más
eficaces de la estructura hipermedia), y, la investigación basada en el
rendimiento que van desde el uso de software pre-hechas a la construcción de un
propio software.
His conclusions: Sus conclusiones:
• positive attitude for hypermedia actitud positiva de hipermedia
• multimode hypermedia can address different learning styles more effectively than
single-mode teaching hipermedia multimodo puede abordar diferentes estilos de
aprendizaje más eficaz que la enseñanza de modo único
• hypermedia is at least as effective as lecture and especially effective with remedial
and learning-disabled students hipermedia es al menos tan eficaz como la
conferencia y eficaz sobre todo con recuperación y aprendizaje de los estudiantes
con discapacidad
• having students construct their own hypermedia had benefits which go much
further than the acquisition of content; one study reported increases in many
higher level cognitive processes such as "finding and interpreting information,
articulating and communicating knowledge, and using computers as cognitive
tools" (p. 516). que los alumnos construyen sus propios hipermedia había
beneficios que van mucho más allá de la adquisición de contenidos, un estudio
reportó aumentos en muchos procesos cognitivos de nivel superior, como "la
búsqueda e interpretación de información, articular y comunicar el conocimiento y
el uso de las computadoras como herramientas cognitivas" (p . 516).
As a counterbalance to this optimistic review of the potential of hypermedia for
learning, McKnight, Dillon & Richardson [ 2 ] provide a different viewpoint. Como
contrapeso a este comentario optimista de las posibilidades de hipermedia para el
aprendizaje, McKnight, Dillon y Richardson [ 2 ] proporcionan un punto de vista
diferente. After reviewing various studies on learning and hypermedia, they
conclude: Después de revisar varios estudios sobre el aprendizaje y la hipermedia,
concluyen:
• few significant differences between results for linear instruction and hypermedia
pocas diferencias significativas entre los resultados de la instrucción lineal e
hipermedia
• need to focus less on the process of learning and more on the outcomes (student
achievement) necesidad de centrarse menos en el proceso de aprendizaje y más
en los resultados (logros de los estudiantes)
• an evolutionary approach to design based on user-centered task-based design
should be taken. un enfoque evolutivo de diseño basado en el usuario basada en
tareas de diseño centrado deben ser tomadas.

Guidelines for Hypertext Creation Directrices para la creación de hipertexto


Shneiderman [ 3 ] provides the following guidelines for creating hypertexts:
Shneiderman [ 3 ], establece las siguientes pautas para la creación de
hipertextos:
• Know the user and their tasks. Conozca los usuarios y sus tareas.
• Ensure that meaningful structure comes first. Asegúrese de que la estructura
significativa que ocurra primero.
• Apply diverse skills (by including information specialists, content specialists and
technologists on the project team). Aplicar diversas habilidades (mediante la
inclusión de especialistas en información, especialistas en contenido y tecnólogos
en el equipo del proyecto).
• Respect chunking. Respeto fragmentación. Organize information into chunks that
deal with one topic, theme or idea. Organizar la información en fragmentos que,
con un tema, tratar el tema o idea.
• Show interrelationships (by using links to related articles). Mostrar las
interrelaciones (mediante enlaces a artículos relacionados).
• Ensure simplicity in traversal. Asegurar la simplicidad en el recorrido. Design the
link structure so that navigation is simple and consistent throughout the system
Diseño de la estructura de enlaces para que la navegación es simple y coherente
en todo el sistema
• Design each screen carefully. Diseño de cada pantalla con cuidado.
Reduce cognitive load by minimizing the burden on the user's short term memory.
Reducir la carga cognitiva, minimizando la carga de la memoria a corto plazo del
usuario. You can do this by providing on-screen prompts such as icons or menus
rather than requiring the user to memorize terms or codes. Usted puede hacer
esto proporcionando instrucciones en pantalla como iconos o menús en lugar de
obligar al usuario a memorizar términos o códigos. The goal is to enable users to
concentrate on the contents while the computer vanishes (p. 558-559). El objetivo
es permitir a los usuarios concentrarse en el contenido, mientras que el equipo
desaparece (p. 558 a 559).
Some new research into issues surrounding hypermedia can be found at the
Hypermedia Development Workshop Series Algunas nuevas investigaciones sobre
temas relacionados con hipermedia se puede encontrar en la hipermedia Taller de
Desarrollo de la serie
[ [ 1] Ayersman, D. (1996). 1 Ayersman], D. (1996). Reviewing the research on
hypermedia-based learning. Journal of Research on Computing in Education, 28 (4).
Revisión de la investigación sobre aprendizaje basado en hipermedia. Revista de
Investigación en Computación en Educación, 28 (4). 500-525 500-525
[ [ 2] McKnight, C., Dillon, A., & Richardson, J. (1966). 2] McKnight, C., Dillon, A., y Richardson, J.
(1966). User-centered design of hypertext/hypermedia for education. Centrado en el usuario de diseño
de hipertexto / hipermedia para la educación. In DH Jonassen (Ed.), Handbook of Research for
Educational Communications and Technology . En Jonassen DH (Ed.), Manual de Investigación de
Comunicaciones y Tecnología Educativa. New York: Simon and Schuster Macmillan. Nueva York:
Simon and Schuster Macmillan.
[ [ 3] Shneiderman, B. (1998). Designing the user interface: Strategies for effective human-computer
interaction (3rd ed.) . 3] Shneiderman, B. (1998):. Diseño de la interfaz de usuario de Estrategias para
la interacción persona-ordenador efectiva (3 ª ed.). Reading, MA: Addison-Wesley Publishing. , MA
Reading: Addison-Wesley Publishing.

One of the ways to make a web site understandable and easier to use involves
the use of metaphor. Una de las maneras de hacer un sitio web, comprensible y
fácil de usar incluye el uso de la metáfora. A good metaphor makes it much easier
to anticipate actions. Una buena metáfora hace que sea mucho más fácil de
anticipar las acciones. Two of the metaphors which have made the web
experience easier to understand involve the ideas of browsing and searching. Dos
de las metáforas que han hecho la experiencia en Internet más fácil de entender
implican las ideas de la navegación y búsqueda. Both of these metaphors have
been transferred from our understanding of how you find things in a library.
Ambas metáforas se han transferido de nuestra comprensión de cómo se
encuentran las cosas en una biblioteca. Browsing occurs when you wander around
looking for something interesting while searching involves designing an active
plan to find some information. Navegación se produce cuando se deambulan en
busca de algo interesante durante la búsqueda consiste en diseñar un plan activo
de encontrar alguna información.
Time spent in front-end analysis will be time well spent if a useful metaphor can
be developed to help navigation. El tiempo empleado en el análisis final frente
será un tiempo bien empleado si una metáfora útil puede ser desarrollado para
ayudar a la navegación. For example, many shopping sites use the metaphor of
the catalogue, with main navigation menus similar to the categories found in a
paper catalogue. Por ejemplo, ir de compras muchos sitios utilizan la metáfora del
catálogo, con menús de navegación principal similares a las categorías que se
encuentran en un catálogo de papel.
Examples of Sites with Strong Metaphors Ejemplos de sitios con metáforas
fuertes
Note: these links contain screenshots with graphic files ranging in size from 40k to
60k which may be slow loading on 28.8 modems. Nota: Estos enlaces contienen
imágenes de archivos gráficos que van en tamaño de 40k a 60k que pueden ser
de carga lenta de 28,8 módems.
• Metaphor - City: Geocities Metáfora - Ciudad: Geocities
• Metaphor - Treehouse: Klutz Metáfora - Cabaña: Klutz
• Metaphor - Online Art Gallery: Dennett's Dream Metáfora - Galería de Arte on-line:
El sueño de Dennett
• Metaphor - Online Museum: National Geographic's Xpeditions Metáfora - Online
Museo: Nacional Xpeditions Geográfica
• Metaphor - Rooms in a House: Mama's Cucina Metáfora - Habitaciones en Casa: la
Mama Cucina

Conceptual Models and Mental Models Modelos conceptuales y modelos


mentales
The designer analyzes the content to be taught, the task to be performed or the
information to be displayed, and defines its structure and functionality. El diseñador
analiza el contenido a enseñar, la tarea a realizar o la información que aparezca, y define
su estructura y funcionalidad. This structure in the designer's mind is called a conceptual
model ([ 1 ] p. 14) Esta estructura en la mente del diseñador se llama un modelo
conceptual ([ 1 ] p. 14)
The user also has a model, a mental model which he has built up according to his
experiences in a site. El usuario también tiene un modelo, un modelo mental que
ha construido de acuerdo a sus experiencias en un sitio. For example, a designer
may have in mind an online catalogue, with feature screens describing products
and an online ordering system (here again, we use the metaphor of the catalogue
to make things easier to understand). Por ejemplo, un diseñador puede tener en
cuenta un catálogo en línea, con pantallas de las funciones que describen los
productos y un sistema de pedidos en línea (una vez más, se utiliza la metáfora
del catálogo para hacer las cosas más fáciles de entender). The user may be
familiar with the paper version of a catalogue but may be unsure how the online
version corresponds to his understanding. El usuario puede estar familiarizado con
la versión impresa de un catálogo, pero puede ser seguro de cómo la versión en
línea corresponde a su entendimiento. After trying options, the user will begin to
develop his own mental map, based on his experiences. Después de probar las
opciones, el usuario empezará a desarrollar su propio mapa mental, basado en
sus experiencias. However, if his mental model is different from the designer's
conceptual model, errors will occur and the user will become confused or
frustrated. Sin embargo, si su modelo mental es diferente a la de modelo
conceptual del diseñador, se producirán errores y el usuario se confunde o se
frustra. In designing a conceptual model, the closer your design matches familiar
situations, the easier your system will be to use. En el diseño de un modelo
conceptual, más cerca de su diseño combina con situaciones familiares, más fácil
será su sistema a utilizar.
Here's an interesting article discussing the conception of metaphors for the net:
Metaphors and the Net (link active as of Jan.6/99) He aquí un artículo interesante
discutir la concepción de las metáforas de la red: Las metáforas e Internet (enlace
activo de Jan.6/99)
[ [ 1] Bielenberg, D. (1993). Interactive design and the mythical "intuitive user interface".
Journal of Interactive Instruction Development, 6 (2), 14-19. 1] Bielenberg, D. (1993).
Diseño interactivo y el mítico "interfaz de usuario intuitiva". Diario de Instrucción
Interactiva de Desarrollo, 6 (2), 14-19.

Design Theory
Teoría del Diseño
Site Design
Diseño del Sitio
Page Design
Diseño de página
MultiMedia
MultiMedia
Teacher
Resources
Recursos para
Maestros
Table of Contents
Tabla de
contenidos
Home Page
Home Page

Copyright © 1999 by Bonnie Skaalid Copyright © 1999 por Bonnie Skaalid

Research-Based Web Site Guidelines Basada en la Investigación del sitio Web


de Directrices
After surveying the internet for guidelines about web design, Boling, Bichelmeyer,
Squire and Kirkley [ 1 ] Después de encuestar a Internet para las directrices sobre
el diseño web, Boling, Bichelmeyer, Squire y Kirkley [ 1 ] identified the following
problems: identificado los siguientes problemas:
• guidelines are often derived from studies of paper-based materials, or they are not
based on research at all directrices se han derivado de los estudios de materiales a
base de papel, o que no se basan en la investigación a todos
• guidelines are inconsistently named and organized directrices de manera
incompatible con nombre y organizada
• guidelines tend to focus on single elements rather than integration of elements
directrices tienden a centrarse en los elementos individuales en lugar de
integración de los elementos
• standard guidelines are difficult to apply to the context of web page design
directrices estándar son difíciles de aplicar en el contexto del diseño de páginas
web
• guidelines often do not address cross-cultural & international diversity directrices
no suelen ocuparse de las culturas y la diversidad internacional de cruz
These researchers then proceeded to carry out research designed to organize
these guidelines into a meaningful framework. Focussing on the function of web
sites, they identified seven profiles for web sites based on a matrix of high
information, high motivation to low information, low motivation. Estos
investigadores procedieron a llevar a cabo investigaciones destinadas a organizar
estas directrices en un marco significativo. Centrándonos en la función de los
sitios web, identificaron siete perfiles de los sitios web, basado en una matriz de
información de alta, alta motivación a la información bajo, baja motivación. For
each profile, they provided guidelines for site design. Para cada perfil, que
establece las directrices para el diseño del sitio. A quick summary of their profiles
are as follows: Un resumen rápido de sus perfiles son los siguientes:
Profile 1: No Expectations Perfil 1: No hay expectativas - very low need to motivate users
or deliver content - eg. personal home pages (As an example, here's my personal home
page . I use it to tell others about myself and the projects I am working on. - Necesidad
muy bajo para motivar a los usuarios o entregar el contenido -. Por ejemplo, las páginas
personales en casa (Por ejemplo, aquí está mi personal página de inicio de. utilizo para
hablar a otros acerca de mí mismo y de los proyectos que estoy trabajando.
Profile 2: All Motivation - high need to motivate users to view site - eg.
promotional commercial sites (Here's a link to a movie site which demonstrates
this type of site - Meet Joe Black ) Perfil 2: Todos motivación alta a la necesidad de
motivar a los usuarios ver el sitio - por ejemplo. - promoción sitios comerciales
(Aquí hay un enlace a un sitio de la película que muestra este tipo de sitio -
¿Conoces a Joe Negro )
Profile 3: All Content - high need to deliver content where site may be the only
provider of this information or users are highly motivated to use site already- eg.
Perfil 3: Todo el contenido - alta necesidad para entregar el contenido en el sitio
puede ser el único proveedor de esta información o los usuarios están muy
motivados para usar el sitio ya, por ejemplo. search engines or research results (
Jakob Nielsen's Use-It.com Site is a good example of this type of site) motores de
búsqueda o resultados de la investigación ( uso It.com-Jakob Nielsen sitio es un
buen ejemplo de este tipo de sitio)
Profile 4: High Motivation - a need to provide some content along with motivating
factors, at same time users must be able to distinguish between content and glitz
- eg. Bill Nye, the Science Guy Perfil 4: Alta Motivación - la necesidad de ofrecer
algo de contenido, junto con factores de motivación, al mismo tiempo, los
usuarios deben ser capaces de distinguir entre el contenido y la ostentación - por
ejemplo. Bill Nye, the Science Guy
Profile 5: High Content - need for content outweighs the need for high
motivational factors but an attractive site is necessary - eg. government agencies,
universities (Check out our university - the University of Saskatchewan Perfil 5:
Contenido de alta - necesidad de que el contenido es mayor la necesidad de altos
factores de motivación, sino un sitio atractivo es necesario - por ejemplo, el
gobierno. agencias, universidades (Echa un vistazo a nuestra universidad - la
Universidad de Saskatchewan
Profile 6: Mixed Elements & Profile 7: Great Expectations - "in both these profiles
the need to deliver specific content and the need to motivate users to a specific
response are highly interdependent and interrelated" - eg. Perfil 6: Mezcla de
elementos y Perfil 7: Great Expectations - "en estos dos perfiles de la necesidad
de entregar el contenido específico y la necesidad de motivar a los usuarios una
respuesta específica son altamente interdependientes y están relacionados entre
sí" - por ejemplo. commercial catalogue sites, sites devoted to charitable or
political causes, or educational sites such as the Prince and I Catálogo de sitios
comerciales, sitios dedicados a causas benéficas o político, o de los sitios
educativos como el príncipe y yo
The authors also include some universal guidelines for web design which include
the need to eliminate distracting elements from a design, the need to follow web
conventions to ensure consistency, and the need to consider the low-bandwidth or
low-end system users when designing a site. Los autores también incluyen
algunas directrices universales para el diseño web, que incluyen la necesidad de
eliminar elementos de distracción de un diseño, la necesidad de seguir las
convenciones web para garantizar la coherencia y la necesidad de considerar el
poco ancho de banda o de gama baja sistema de usuarios en el diseño de un sitio.

Genres Géneros
Another method of categorizing web sites was developed by Shneiderman [ 4 ].
He used the literary categorization of genres to classify web sites. Otro método de
clasificación de sitios web fue desarrollado por Shneiderman [ 4 ]. Usó la
clasificación de los géneros literarios para clasificar los sitios web. This idea of
genres has also been used by other authors of web design texts. Esta idea de los
géneros también ha sido utilizado por otros autores de los textos de diseño web.
For example, the Web Design Wow! Por ejemplo, el diseño web Wow! Book [ 2 ]
classifies web sites according to whether they are for Libro [ 2 ] clasifica los sitios
web en función de si son para
• Marketing - Toyota Marketing - Toyota
• Entertainment - Discovery.com Entretenimiento - Discovery.com and
@Discovery.ca y @ Discovery.ca
• Education and Training - National Geographic's Fantastic Forest , Educación y
Formación - National Geographic Bosque Fantástico , Dinorama , or Dinorama , o
Discoveryschool.com Discoveryschool.com
• Sales - Sears Canada Ventas - Sears Canada
• Publishing - Ziff-Davis Publishing - ZDNet Editorial - Ziff-Davis Publishing - ZDNet
Fleming [ 3 ] classifies web sites as: Fleming [ 3 ] clasifica los sitios web como:
• Shopping Sites - FAO Schwarz Compras Sitios - FAO Schwarz
• Community Sites - Cafe UTNE Sitios de la Comunidad - Utne Cafe
• Entertainment Sites Star Wars: Crimson Empire Sitios de entretenimiento de Star
Wars: El Imperio Carmesí
• Identity Sites - Westworld by Fischer West Identidad Sitios - Westworld por West
Fischer
• Learning Sites - DigitalThink (Web Based Training) or the Annenberg CPB Projects
Exhibits Collection Sitios de aprendizaje - DigitalThink (Web Based Training) o la
Annenberg CPB Proyectos Colección Exposiciones
• Information Sites - CNET Computers.com or Sympatico Información de Sitios -
Computers.com CNET o Prodigy
and suggests the differences necessary to each type of site. y sugiere que las
diferencias necesarias para cada tipo de sitio.
[ [ 1] Boling, E., Bichelmeyer, B., Squire, K., & Kirkley, S. (1997). Visual design profiles:
Making sense of web site design guidelines. [Online]. Available:
http://www.indiana.edu/~iirg/ARTICLES/AMTEC/lit.html 1] Boling, E., Bichelmeyer, B.,
Squire, K., y Kirkley, S. (1997): Diseño visual. Perfiles del sitio web de directrices [. Diseño
Hacer]. Online sentido Disponible: http://www. indiana.edu / ~ iirg / ARTÍCULOS / AMTEC /
lit.html
[ [ 2] Davis, J. & Merritt, S. (1998). The web design wow! 2] Davis, J. & Merritt, S. (1998). El diseño
de páginas web wow! book: Showcasing the best of on-screen communication. Berkeley, CA: Peachpit
Press. libro: Presentando lo mejor de la pantalla de comunicación en:. Berkeley, CA Peachpit Press.
[ [ 3] Fleming, J. 3 Fleming], J. (1998). Web navigation: Designing the user experience. Sebastopol,
CA: O'Reilly & Associates, Inc. (1998): Web. Navegación Diseño de la experiencia del usuario.
Sebastopol, CA O'Reilly & Associates, Inc. Companion Web Site:
http://www.squarecircle.com/navigation/ Sitio Web de consulta:
http://www.squarecircle.com/navigation/
[ [ 4] Shneiderman, B. (1998). Designing the user interface: Strategies for effective human-computer
interaction (3rd ed.) . 4] Shneiderman, B. (1998):. Diseño de la interfaz de usuario de Estrategias para
la interacción persona-ordenador efectiva (3 ª ed.). Reading, MA: Addison-Wesley Publishing. , MA
Reading: Addison-Wesley Publishing.

Navigation in webspace is a crucial topic in web design. Navegación en el espacio


web es un tema crucial en el diseño web. Hypermedia can be liberating, allowing
the user to plot their own course through a body of information, or it can be
disorienting, when users get lost in hyperspace. Hipermedia puede ser liberador,
permitiendo al usuario para trazar su propio camino a través de un conjunto de
información, o puede ser desorientador, cuando los usuarios se pierden en el
hiperespacio. Giving users clear signposts about where they are in your site
(orientation) and paying attention to structure can make a site much easier to
traverse. Dando claras señales a los usuarios sobre dónde están en su sitio
(orientación) y atención a la estructura puede hacer un sitio mucho más fácil de
recorrer.

Structure Estructura
Lai and Waugh [ 4 ] conducted research on types of hypertext menu designs and
their effect on search tasks. Lai y Waugh [ 4 ] realizó una investigación sobre los
tipos de diseños de menús de hipertexto y su efecto en las tareas de búsqueda.
Their design featured these types of menu structures: Su diseño presenta los
siguientes tipos de estructuras de menú:

Option 1 Opción 1 Option 2 Opción 2 Option 3 Opción 3

• menus based • menus which • a system of embedded menus


solely on featured a mixture (which consisted entirely of
hierarchical of hierarchical and contextual links embedded in text)
structures embedded un sistema de menús integrados
menús basados structures (a (que consistía enteramente de
exclusivamente hierarchical enlaces contextuales integrados
en las overview with en el texto)
estructuras embedded links on
Here's a link to an article which is
jerárquicas the pages for
elaboration) menús
composed almost completely of
The Home Page embedded menus: Aquí hay un
que incluyó una
menu for this site is mezcla de enlace a un artículo que está
an example of a estructuras compuesto casi completamente de
hierarchical jerárquicas y los menús integrados:
structure. La página embebido (una http://www.useit.com/papers/heuristic
de menú de inicio visión jerárquica
/
de este sitio es un con enlaces
incrustados en las http://www.useit.com/papers/heuristic
ejemplo de una
páginas para su /
estructura
jerárquica. Each of elaboración)
the menu items is a Here's a link to a page
main topic in the which uses a mixture of
site, with the hierarchical menus and
exception of the embedded links: He
Table of Contents, aquí un enlace a una
which is an página que utiliza una
orienting device. mezcla de menús
Cada uno de los jerárquicos y los
elementos del enlaces incorporados:
menú es un tema http://www.useit.com/
principal en el sitio, http://www.useit.com/
con la excepción de
la tabla de
contenido, que es
un dispositivo de
orientación.

Lai and Waugh Conclusions : Lai y Waugh Conclusiones:


• network structured documents (Options 2 & 3) could improve search accuracy,
though not efficiency documentos estructurados de red (opciones 2 y 3) podría
mejorar la precisión de la búsqueda, aunque no la eficiencia
• the search task affected the type of menu used, with hierarchical menus (Option 1)
working better for straightforward tasks la tarea de búsqueda afecta el tipo de
menú utilizado, con menús jerárquicos (opción 1) que trabajan mejor para tareas
sencillas
• embedded menus (Options 2 & 3) may be used when search tasks are mostly
complex and not fully known and the designers wish to encourage in-depth
searching behavior" (p. 46-47) menús integrados (opciones 2 y 3) se puede utilizar
cuando las tareas de búsqueda son principalmente complejos y no totalmente
conocidos y los diseñadores desean alentar a profundidad el comportamiento de
búsqueda en "(p. 46-47)
Lynch and Horton [ 5 ] also recommend a hierarchical structure since "web sites
should always be organized as offshoots of a single home page." Lynch y Horton [
5 ] También te recomendamos una estructura jerárquica, ya que "los sitios web
siempre debe organizarse como vástagos de una sola página principal."

Orientation Orientación
Orientation information helps the user to identify where he(she) is in the site. la
información de orientación ayuda al usuario a identificar dónde él (ella) está en el
sitio. It is equivalent to page numbers and chapter headings in a book. Es
equivalente a los números de página y encabezados de los capítulos de un libro.
Orientation information is easiest to use if it is located in the same place on every
page. la información de orientación es más fácil de usar si se encuentra en el
mismo lugar en cada página. It is crucial in web design since users may jump into
your site at any level. Es crucial en el diseño web, ya que los usuarios pueden
saltar en su sitio a cualquier nivel. Lynch and Horton [ 5 ] recommend that the
following items should be present on every page of a site to aid in orientation:
Lynch y Horton [ 5 ] recomiendan que los siguientes elementos deben estar
presentes en cada página de un sitio para ayudar en la orientación:
• the title el título
• the author el autor
• the author's institutional affiliations institucional de las afiliaciones del autor de la
• the revision date la fecha de revisión
• links on each page which will move the user to the next or previous page of a
sequence enlaces en cada página que se trasladará al usuario a la página anterior
o siguiente de una secuencia
• a link to the local home page un enlace a la página de inicio local
Nielsen [ 6 ] suggests these ways a designer can aid their users with navigation:
Nielsen [ 6 ] sugiere que estas formas en que un diseñador puede ayudar a sus
usuarios con la navegación:
• include a site identifier on every page incluyen un identificador de sitio en cada
página
• make it easy to go to landmark pages such as the home page or the search page
hacen que sea fácil ir a las páginas de la marca como la página principal o la
página de búsqueda
• emphasize the structure of your site by making each page show which subsite it
belongs to hincapié en la estructura de su sitio, haciendo de cada espectáculo
página que pertenece a subsitio
• do not change the default colors for links and visited links no cambia los colores
predeterminados para los enlaces y los enlaces visitados
• keep underlines intact for monochrome viewers subraya mantener intacta para los
espectadores blanco y negro
• draw a sitemap or use some other orienting devices to illustrate the relationships
between main areas of your site dibujar un mapa o utilizar alguna orientación de
otros dispositivos para ilustrar las relaciones entre las áreas principales de su sitio
Orientation devices which can keep a user from becoming lost include:
dispositivos de orientación que puede mantener a un usuario de perderse son:
• the alphabetized site index - Rosenfeld [ 7 ] el índice de sitio por orden alfabético -
Rosenfeld [ 7 ]
• graphical browsers navegadores gráficos
• overview diagrams diagramas de resumen
• web views vistas web
• paths caminos
• trails senderos
• guided tours and tabletops visitas guiadas y mesas
• history lists listas de la historia
• timestamps marcas de tiempo
• footprints huellas
• bookmarks marcadores
• backtracks retrocede
• embedded menus menús integrados
• fisheye views puntos de vista de ojo de pez
• roam and zoom techniques - Balasubramanian [ 1 ] vagar y técnicas de captura -
Balasubramanian [ 1 ]
Shneiderman [ 8 ] suggests four different techniques to convey a site's
organization: Shneiderman [ 8 ] sugiere cuatro técnicas diferentes para transmitir
el sitio de una organización:
• use an executive summary which gives an overview of the site and contains links
to all the major concepts uso de un resumen ejecutivo que le da una visión general
del sitio y contiene enlaces a todos los conceptos principales
• adopt a hierarchical approach which links to major categories only adoptar un
enfoque jerárquico que une a las principales categorías sólo
• design the home page as a detailed table of contents el diseño de la página de
inicio como un cuadro detallado de los contenidos
• provide a search option as a first step proporcionar una opción de búsqueda, como
primer paso
A word of warning : using search engines may not be such a good idea - recent
research on within-site searching found that "users were 50 percent more likely to
find what they were looking for if they never hit the search button" ([ 2 ] p.1). Una
palabra de advertencia: el uso de motores de búsqueda no puede ser una buena
idea - la investigación reciente sobre el terreno dentro de la búsqueda encontró
que "los usuarios fueron un 50 por ciento más probabilidades de encontrar lo que
estás buscando si nunca se pulsa el botón de búsqueda" ([ 2 ] p. 1).
Breadth vs Depth in Menus Amplitud vs profundidad en los menús
When designing navigation throughout a site, the research suggests that several
large menus work better than a large number of menus with smaller amounts of
links. En el diseño de navegación a través de un sitio, la investigación sugiere que
los menús de varios grandes funcionan mejor que un gran número de menús con
cantidades más pequeñas de enlaces. Research which studies breadth vs depth in
menus suggests that "breadth should be preferred over depth...when the depth
goes to four or five [levels], there is a good chance of users becoming lost or
disoriented ([ 8 ], p. 249). Investigación que estudia frente a la amplitud de
profundidad en los menús sugiere que "la amplitud debe ser preferida sobre la
profundidad ... cuando la profundidad va a cuatro o cinco [niveles], no es una
buena oportunidad de convertirse en usuarios perdidos o desorientados ([ 8 ], p.
249).
Ways of grouping menus: Las formas de agrupación de los menús:
• create groups of logically similar items crear grupos de elementos similares
lógicamente
• form groups that cover all possibilities forman grupos que cubren todas las
posibilidades
• make sure the items are non overlapping - use familiar terminology, but ensure
that items are distinct from one another Compruebe que los artículos no son la
acumulación - la terminología de uso familiar, pero asegúrese de que los temas
son distintos el uno del otro
Based on web research conducted by Spool [ 9 ], Instone [ 3 ] suggests: Sobre la
base de la investigación llevada a cabo por Internet cola [ 9 ], Instone [ 3 ] sugiere:
The best-rated sites coupled their navigation and content tightly. Los mejores sitios de
clasificación junto su navegación y el contenido con fuerza. If you doubled the amount of
content, the navigation pages would have doubled in size. Si se duplicó la cantidad de
contenido, las páginas de navegación que se han duplicado en tamaño. The navigational
links tended to be textual, and descriptive, so that users knew what to expect even
before they jumped. Los enlaces de navegación tendían a ser textual, y descriptivo, de
modo que los usuarios sepan a qué atenerse, incluso antes de que se saltó.

Conclusions Conclusiones
Research indicates these guidelines: Las investigaciones indican las siguientes
pautas:
Structure Estructura
Hierarchical menus are useful for straightforward searching tasks, but the
additional clarification available from embedded, contextual menus will aid
complex search tasks. Therefore, designing menus to be more verbose, or adding
information in the form of textual indexes with clarification will help users to be
more successful in finding what they are looking for. menús jerárquicos son útiles
para las tareas de búsqueda directa, pero la aclaración adicional disponible
incrustados, los menús contextuales de ayuda de búsqueda de tareas complejas.
Por lo tanto, el diseño de menús para ser más detallado, o la adición de la
información en forma de índices de texto con una aclaración ayudará a los
usuarios que se más éxito en encontrar lo que busca.
Orientation Orientación
It is very important to include site information on every page of a site. Es muy
importante incluir la información del sitio en cada página de un sitio. It is also
essential to include links to the local home page on every page to accommodate
users who jump into your site. También es esencial para incluir enlaces a la
página de locales en todas las páginas para dar cabida a los usuarios que saltar
en su sitio. Links to other pages in a sequence are also useful. Enlaces a otras
páginas en una secuencia también son útiles.
Categorization of information into menus is a very difficult process as well as one
which needs careful attention. Categorización de la información en los menús es
un proceso muy difícil, así como uno que requiere especial atención. Menu items
need to be unique, non-overlapping and familiar. Los elementos del menú tienen
que ser únicos, no se solapan y familiar. It is better, when designing a structure,
to have breadth over depth (fewer long menus as opposed to many shorter
menus). Es mejor, en el diseño de una estructura, para tener más amplitud de
profundidad (menos menús largos a diferencia de muchos menús más cortos).
Orienting devices such as textual indexes, guided tours or overview diagrams are
useful to help users from becoming disoriented in a site. La orientación de los
dispositivos tales como los índices de texto, visitas guiadas o diagramas de vista
son útiles para ayudar a los usuarios de desorientarse en un sitio.
Navigation information is easiest to use if located in a similar location on every
page of a site. información de navegación es más fácil de usar si se encuentra en
una ubicación similar en todas las páginas de un sitio. This lowers cognitive load
since the user knows where things are located from page to page. Esto reduce la
carga cognitiva ya que el usuario sabe dónde están ubicadas las cosas de una
página a otra.
[ [ 1] Balasubramanian, V. (1993) A systematic approach to user interface design for a
hypertext framework. [Online]. 1] Balasubramanian, V. (1993) Un enfoque sistemático de
diseño de la interfaz de usuario para un marco de hipertexto en línea.] [. Available:
http://www.isg.sfu.ca/~duchier/misc/hypertext_review/chapter4.html Disponible:
http://www.isg.sfu.ca/ ~ duchier/misc/hypertext_review/chapter4.html
[ [ 2] Festa, P. (1998). Web design not what you pay for. [Online]. 2] Festa, P. (1998). Diseño de
páginas web no lo que usted paga en línea.] [. Available:
http://www.news.com/News/Item/0,4,21150,00.html Disponible: http://www.news.com/News/Item/0,
4,21150,00 html.
[ [ 3] Instone, K. Instone 3], K. (1997). A case for conducting user tests. [Online]. (1997). Un caso
para la realización de pruebas de usuario. [En línea]. Available:
http://webreview.com/97/07/25/feature/index.html Disponible:
http://webreview.com/97/07/25/feature/index.html
[ [ 4] Lai, Y, & Waugh, ML (1995). Lai 4], Y, y Waugh, ML (1995). Effects of three different
hypertextual menu designs on various information searching activities. Journal of Multimedia and
Hypermedia, 4 (1), 25-52. Efectos de tres hipertextual diseños de menú diferente en la búsqueda de
información diversas actividades. Diario de multimedia e hipermedia, 4 (1), 25-52.
[ [ 5] Lynch, P. & Horton, S. (1997). Web style manual, 2nd ed. Yale Center for Advanced
Instructional Media. [Online]. 5] Lynch, P. & Horton, S. (1997). Manual de Estilo Web, 2 ª ed. Yale
Center for Advanced Instructional Media. Línea] [. Available:
http://info.med.yale.edu/caim/manual/contents.html Disponible:
http://info.med.yale.edu/caim/manual/contents.html
[ [ 6] Nielsen, J. 6 Nielsen], J. (Nov. 1997). The tyranny of the page: Continued lack of decent
navigation support in version 4 browsers. [Online]. (Nov. 1997):. La tiranía de la página de la falta
continuada de apoyo a la navegación decente en la versión 4 navegadores]. [En línea. Available:
http://www.useit.com/alertbox/9711a.html Disponible: http://www.useit.com/alertbox/9711a.html
[ [ 7] Rosenfeld, L. (1997). Organizing your site from A to Z. [Online]. 7] Rosenfeld, L. (1997). La
organización de su sitio de la A a la Z. [en línea]. Available:
http://webreview.com/wr/pub/97/10/03/arch/index.html Disponible:
http://webreview.com/wr/pub/97/10/03/arch/index.html
[ [ 8] Shneiderman, B. (1998). Designing the user interface: Strategies for effective human-computer
interaction (3rd ed.) . 8] Shneiderman, B. (1998):. Diseño de la interfaz de usuario de Estrategias para
la interacción persona-ordenador efectiva (3 ª ed.). Reading, MA: Addison-Wesley Publishing. , MA
Reading: Addison-Wesley Publishing.
[ [ 9] Spool, J. Web Site Usability: A Designer's Guide. 9] Carrete, J. usabilidad del sitio web: diseño
de una guía. [Online]. Available: http://world.std.com/~uieweb/bookexpt.htm [En línea]. Disponible
http://world.std.com/ ~ uieweb / bookexpt.htm

Usability Research Methods Facilidad de uso Métodos de Investigación


It is very important that several types of evaluation occur early on in the design of
a web site. Es muy importante que los diversos tipos de evaluación se producen
desde el principio en el diseño de un sitio web. It is much easier to clarify
misunderstandings at an early stage, before expensive page layout has
commenced, than to redesign a working site. Es mucho más fácil para aclarar
malentendidos en una fase temprana, antes de diseño de página caros ha
comenzado, de volver a diseñar un sitio de trabajo.
Paper Mockups: One method of testing involves asking typical users to work through
paper mockups of screens, using talk-aloud protocols to show what they are thinking
about. Maquetas de papel: Un método de prueba consiste en pedir a los usuarios
típicos de trabajar a través de maquetas en papel de pantallas, con hablar en voz alta
protocolos para mostrar lo que están pensando. Unclear navigation options or
categorization problems can be identified. opciones de navegación poco clara o
problemas de categorización puede ser identificado.
Heuristics: A second method involves working through a design using heuristics.
[ 5 ] Nielsen has designed a checklist of items [ 4 ] to consider when developing
computer interfaces. Heurística: Un segundo método consiste en trabajar a
través de un diseño usando heurística [. 5 ] Nielsen ha diseñado una lista de
temas [ 4 ] a considerar en el desarrollo de interfaces de ordenador. These
checklist items, which are called heuristics, can help you look for things when
designing which you might not normally think about. Estos puntos de la lista, que
se denominan heurísticos, puede ayudarle a buscar cosas en el diseño que usted
normalmente no puede pensar. A really useful document which takes Nielsen's
heuristics and adapts them for the web is available from Instone [ 1 ]. Un
documento muy útil que tiene la heurística de Nielsen y las adapta para la web
está disponible de Instone [ 1 ].
Microsoft Network has also been conducting usability research and has also
produced a checklist which designers can use to ensure their web pages are
effective [ 2 ]. De red de Microsoft también ha estado llevando a cabo la
investigación y la facilidad de uso ha producido también una lista de control que
los diseñadores pueden utilizar para garantizar sus páginas web, son eficaces [ 2
].
Rapid Prototyping: A third method involves setting users down in front of a
rough prototype of a system and watching them as they work through the design
(this method utilizes the talk-aloud protocol as well as video-taping the user).
Rapid Prototyping: Un tercer método consiste en fijar los usuarios en el frente
de un prototipo en bruto de un sistema y ver como trabajan a través del diseño
(este método utiliza el protocolo de hablar en voz alta, así como vídeo, grabación
el usuario).
Here's an article by Jakob Nielsen about prototyping web sites . He aquí un artículo
de Jakob Nielsen sobre la creación de un prototipo sitios web .
Guidelines from Usability Research Directrices de Usabilidad de Investigación
Jakob Nielsen [ 3 ], who has been conducting web usability studies for several
years, has published a list of guidelines for web design based on results since
1994. Jakob Nielsen [ 3 ], que ha estado llevando a cabo estudios de usabilidad
web, desde hace varios años, ha publicado una lista de pautas para el diseño web
basado en resultados desde 1994. His findings: Sus resultados:
• most users don't read, they scan for information mayoría de los usuarios no leen,
que se escanean para obtener información
• the author's personality makes a site more attractive la personalidad del autor
hace que un sitio más atractivo
• web users are impatient, they don't want to be slowed down by cool features or
self-promotion usuarios de Internet son impacientes, no quiero ser frenado por
características frescas o autopromoción
• search capability is very important capacidad de búsqueda es muy importante
• download factors are critical descargar son factores críticos
• animation is almost always annoying la animación es casi siempre molestos
• frames are disliked marcos se disgustaba
• wild backgrounds disrupt a user's reading antecedentes silvestres interrumpir la
lectura de un usuario
• more users are scrolling (pages no longer than 3 screens are recommended) but
many still don't go beyond the first screen más usuarios son de desplazamiento
(páginas no más de 3 pantallas se recomienda), pero muchos todavía no ir más
allá de la primera pantalla
• image maps are more usable now, especially if they are broken up into smaller
sections that load more quickly than one large graphic mapas de imagen son más
útiles ahora, sobre todo si se dividen en secciones más pequeñas que se cargan
más rápido que un gráfico grande
• users want sites to work and are no longer tolerant of those that don't los usuarios
quieren sitios para trabajar y ya no son tolerantes con aquellos que no
[ [ 1] Instone, K. (1997). Usability Heuristics for the Web. [Online]. 1 Instone], K. (1997).
Heurística de Usabilidad de la Web. [] En línea. Available:
http://webreview.com/wr/pub/97/10/10/usability/sidebar.html Disponible:
http://webreview.com/wr/pub/97/10/10/usability/sidebar.html
[ [ 2] Keeker, K. Keeker 2], K. (1997). Improving web site usability and appeal. [Online]. (1997).
Mejora de la usabilidad del sitio web, y la apelación. [En línea]. Available:
http://www.microsoft.com/workshop/management/planning/improvingsiteusa.asp Disponible:
http://www.microsoft.com/workshop/management/planning/improvingsiteusa.asp
[ [ 3] Nielsen, J. Nielsen 3], J. (Dec. 1997). Changes in Web Usability Since 1994. [Online]. (Dic.
1997). Cambios en la usabilidad web desde 1994. [En línea]. Available :
http://www.useit.com/alertbox/9712a.html Disponible: http://www.useit.com/alertbox/9712a.html
[ [ 4] Nielsen, J. Ten Usability Heuristics. [Online]. Nielsen 4], J. Usabilidad Heurística Diez. [] En
línea. Available : http://www.useit.com/papers/heuristic/heuristic_list.html Disponible:
http://www.useit.com/papers/heuristic/heuristic_list.html
[ [ 5] Nielsen, J. How to Conduct a Heuristic Evaluation [Online]. Nielsen 5], J. Cómo llevar a cabo
una evaluación heurística [] en línea. Available :
http://www.useit.com/papers/heuristic/heuristic_evaluation.html Disponible:
http://www.useit.com/papers/heuristic/heuristic_evaluation.html

Although gaining attention is an important part of any communication act, it is


important to try to keep your message as simple as possible [ 1 ]. Aunque cada
vez más atención es una parte importante de cualquier acto de comunicación, es
importante tratar de mantener su mensaje tan simple como sea posible [ 1 ].
• Use only the amount of text and graphics as is absolutely necessary to get your
point across Use sólo la cantidad de texto y gráficos que sea absolutamente
necesario para obtener su punto a través
• Superfluous graphics can interfere with understanding [ 2 , 3 ] gráficos superfluos
pueden interferir con la comprensión [ 2 , 3 ]
• An overabundance of fonts or colors can distract rather than assist learning. Un
exceso de fuentes o colores pueden distraer en lugar de ayudar al aprendizaje.
Decisions Concerning Simplicity in this Site Decisiones en materia de
simplicidad en este sitio
There were several decisions which contribute to simplicity in this site. Hubo
varias decisiones que contribuyen a la simplicidad de este sitio. Pages for the
most part are made up mostly of text, with titles saved as gifs added for
decorative effect. The navigation boxes at the side and the bottom are text-based
rather than buttons in order to speed up loading and make the page readable to
those browsers with graphics turned off. Páginas en su mayor parte se componen
principalmente de texto, con los títulos guardados como gifs añadido para efecto
decorativo. Las cajas de navegación en el lado y la parte inferior están basados
en texto en lugar de botones con el fin de acelerar la carga y hacer que la página
legible los navegadores con los gráficos desactivados. Color is constant from page
to page and graphics only appear when they will clarify a point in the text. El color
es constante a partir de una página a otra y gráficos sólo aparecen cuando se va
a aclarar un punto en el texto.
[ [ 1] Schwier, R., & Misanchuk, E. (1993) Interactive multimedia instruction . 1] Schwier,
R., y Misanchuk, E. (1993) de instrucciones multimedia interactivo. Englewood Cliffs, NJ:
Educational Technology Publications, Inc. Englewood Cliffs, NJ: Publicaciones de la
tecnología para la Educación, Inc.
[ [ 2] Anglin, G., Towers, R., & Levie, H. (1996). 2] Anglada, G., Torres, R., y Levie, H. (1996).
Visual message design and learning: The role of static and dynamic illustrations. Diseño visual de
mensaje y el aprendizaje: El papel de las ilustraciones estáticas y dinámicas. In DH Jonassen (Ed.),
Handbook of Research for Educational Communications and Technology . En Jonassen DH (Ed.),
Manual de Investigación de Comunicaciones y Tecnología Educativa. New York: Simon and Schuster
Macmillan. Nueva York: Simon and Schuster Macmillan.
[ [ 3] Levie, WH & Lentz, R. (1982). 3] Levie, WH y Lentz, R. (1982). Effects of text illustrations: A
review of research. Educational Communications and Technology Journal, 30 (4), 195-232. Efectos de
las ilustraciones del texto: Una revisión de la investigación para la Educación 195-232.
Comunicaciones y Tecnología de Diario, 30 (4),.

Keep the layout of pages consistent - inconsistencies force people to spend extra
time trying to figure out how to navigate, or where to find the answers to
questions they have - it increases cognitive overhead [ 1 ]. Schwier and
Misanchuk [ 2 ] suggest that you should strive for consistency in: Mantenga el
diseño de las páginas coherente - obligar a la gente inconsistencias de pasar más
tiempo tratando de encontrar la manera de navegar, o dónde encontrar las
respuestas a las preguntas que tienen - que aumenta la sobrecarga cognitiva [
1 ]. Schwier y Misanchuk [ 2 ] sugieren que debe esforzarse para mantener la
coherencia en:
• style of presentation from one section of the sequence to another (don't use
formal language in one place and slang in another - your whole site should
sound as if the same person wrote it) estilo de la presentación de una
sección de la secuencia a otra (no usar lenguaje formal en un lugar y en
otro lenguaje popular - su sitio en su conjunto debe sonar como si la misma
persona que escribió)
• placement of items such as orientation information, navigation devices, user
input, feedback, or operating instructions colocación de elementos tales
como información de orientación, dispositivos de navegación, la entrada del
usuario, comentarios, o instrucciones de uso
• use of color (including "grays" in black and white) uso de los colores
(incluidos los "grises" en blanco y negro)
• access structures such as headings estructuras de acceso, como las
partidas
• use of cues (font, including size and style; bolding, italics, and color) uso de
claves (tipo de letra, incluyendo el tamaño y estilo, negrita, cursiva y color)
• style of graphics estilo de los gráficos
• terminology (directions, prompts, menus, and help screens) terminología
(direcciones, mensajes, menús y pantallas de ayuda)
• names of commands and manner of evoking them nombres de los
comandos y la manera de evocar los
• interaction behavior required in similar situations (don't require a learner to
click on a button one time and to type a character another time, if the
situations are highly similar). comportamiento de la interacción necesaria en
situaciones similares (no requieren de un alumno a hacer clic en un botón
una vez y para escribir un personaje en otro momento, si las situaciones son
muy similares). (page 214) (Página 214)
Grouping objects with similar functions together in one spot can make a page feel
more consistent. Agrupación de objetos con funciones similares en un solo lugar
puede hacer que una página sea más homogéneo. For example, this page and
every page in the site has its navigation options located in a similar location - off
to the side and below the text at the bottom. Por ejemplo, esta página y la página
en la cada sitio tiene sus opciones de navegación situado en una ubicación similar
- a un lado y por debajo del texto en la parte inferior. You know where to find the
navigation options on every page and this fosters consistency. ¿Sabes dónde
encontrar las opciones de navegación en todas las páginas y esto fomenta la
coherencia. Similarity in shape, style and color can also foster consistency. La
similitud en la forma, estilo y color también puede fomentar la coherencia. The
sidebar and bottom navigation boxes use the same color to tie the navigation
elements together. La barra lateral de navegación y cuadros de fondo usar el
mismo color para atar los elementos de navegación juntos.
[ [ 1]Norman, D. (1988) The design of everyday things. New York, NY: Doubleday. 1] Norman, D.
(1988) El diseño de las cosas cotidianas:. Nueva York, NY, Doubleday.
[ [ 2] Schwier, R., & Misanchuk, E. (1993) Interactive multimedia instruction . 2] Schwier, R., y
Misanchuk, E. (1993) de instrucciones multimedia interactivo. Englewood Cliffs, NJ: Educational
Technology Publications, Inc. Englewood Cliffs, NJ: Publicaciones de la tecnología para la Educación,
Inc.
Pare the message down to the absolute essentials the learner needs to know and
consider the following rules for improving clarity: Pare el mensaje a la esencia
absoluta del alumno debe conocer y considerar las siguientes normas para la
mejora de la claridad:
• Keep the instruction at a language level compatible with the intended
learners. Mantenga la instrucción a un nivel compatible con el lenguaje de
los alumnos previsto.
• Avoid jargon and overly-scholarly language. Evite la jerga y el lenguaje
demasiado académico. (editor's note: unless that is your audience) (Nota del
editor: a menos que su público)
• Present ideas succinctly; keep your prose lean. Presente las ideas de
manera sucinta, mantener su prosa magra.
• Keep sentences short. Mantenga las oraciones cortas.
• Use "point form" (bulleted lists, like this one) whenever possible. Utilice "la
forma punto" (listas con viñetas, como ésta) siempre que sea posible.
• Use the active, rather than the passive voice. Utilice el activo, en lugar de la
voz pasiva.
• Stay away from negative statements if possible; avoid double negatives
entirely Manténgase alejado de las declaraciones negativas, si es posible,
evitar dobles negaciones del todo
• Use informal language.... Use un lenguaje informal ....
• Use personal pronouns.... Utilice el pronombre personal ....
• Use examples that learners will find familiar. Use ejemplos que los
estudiantes se encuentran familiarizados. And do use lots of examples. Y
hacer un montón de ejemplos de uso.
• Use inclusive (ie, non-sexist, non-racial) language. [ 1 p. Incluye el uso (es
decir, no sexista, no racista) idioma. [ 1 p. 215] 215]
[ [ 1] Schwier, R., & Misanchuk, E. (1993) Interactive multimedia instruction . 1] Schwier, R., y
Misanchuk, E. (1993) de instrucciones multimedia interactivo. Englewood Cliffs, NJ: Educational
Technology Publications, Inc. Englewood Cliffs, NJ: Publicaciones de la tecnología para la Educación,
Inc.

To understand balance, think of the balance beam. Para entender el equilibrio,


pensar en la barra de equilibrio. When objects are of equal weight, they are in
balance. Cuando los objetos son de igual peso, están en equilibrio. If you have
several small items on one side, they can be balanced by a large object on the
other side. Si tiene varios objetos pequeños en un lado, pueden ser equilibradas
por un objeto grande en el otro lado. Screen balance works in much the same
way. balance de la pantalla funciona de la misma manera. It can be affected not
only by the size of objects, but also their value (ie. lightness or darkness, termed
visual weight). Puede ser afectado no sólo por el tamaño de los objetos, sino
también su valor (es decir, la ligereza o la oscuridad, denominado peso visual).
Formal or Informal Balance Formal o informal de Balance
Formal balance is symmetrical, with the items on one side of the screen being
similar in shape, size and color to the items on the other side of the screen. El
equilibrio formal es simétrica, con los elementos en un lado de la pantalla es
similar en forma, tamaño y color a los elementos en el otro lado de la pantalla.
Formal balance is usually much easier to design - Check the photograph below,
which is the Rotunda, Music Room , Halifax, 1794 from John Bland's Canadian
Architexture Collection . Notice the symmetry of the house - even the wings on
either end are balanced. El equilibrio formal suele ser mucho más fácil diseñar -
Verifica en el siguiente fotografía, que es la Rotonda, Sala de Música, de Halifax
de 1794 de John Bland Architexture Colección de Canadá -. Notificación de la
simetría de la casa, incluso las alas de los extremos se equilibran.

Informal balance is usually asymmetrical, with several smaller items on one side
being balanced by a large item on the other side, or smaller items being placed
further away from the center of the screen than larger items. El equilibrio
informal es generalmente asimétrica, con varios artículos más pequeños en un
lado está equilibrada por un artículo grande en el otro lado, o los artículos más
pequeños se colocan más lejos del centro de la pantalla de los artículos más
grandes. One darker item may need to be balanced by several lighter items. Uno
de los puntos más oscuros posible que tenga que ser equilibrado por varios
elementos más ligeros. (A more extensive description of ways to create informal
balance is found in the section on classic graphic design balance ) (Una
descripción más amplia de formas de crear equilibrio informal se encuentra en la
sección de gráfica equilibrio diseño clásico )
When a screen is not balanced, it creates a feeling of tension, as if the screen
might tip, or things might slide off the side, just as the unbalanced beam would tip
to one side. Cuando una pantalla no es equilibrado, se crea una sensación de
tensión, como si la pantalla podría inclinar la, o las cosas podrían caerse de la
parte, al igual que el rayo desequilibrada inclinaría hacia un lado. As Mullet and
Sano [ 1 ] discuss, many 20th Century typographic designers "discovered the
greater vitality and inherent visual interest provided by active, asymmetric
layouts"(p. 103). Como Mullet y Sano [ 1 ] hablar, muchos diseñadores tipográficos
vigésimo siglo ", descubrió el mayor vitalidad y visuales de interés inherentes
proporcionada por, diseños asimétricos activa" (p. 103). But they caution that
creating asymmetric layouts is much more difficult to do, and depends on careful
placement to compensate for the differences in size, position and value of the
major elements of a design. Pero advierten que la creación de diseños asimétricos
es mucho más difícil de hacer, y depende de la colocación cuidadosa para
compensar las diferencias de tamaño, posición y el valor de los elementos
principales de un diseño.
[ [ 1] Mullet, K. & Sano, D. (1995). Designing visual interfaces: Communication oriented
techniques. Englewood Cliffs, NJ: Prentice Hall. ] Salmonete, K. y Sano, D. (1995). Diseño
de una interfaz visual: orientada a las técnicas de comunicación: Englewood. Cliffs, NJ
Prentice Hall.

In order to create harmony and unity, you must design a page or site using
consistency and repetition. Con el fin de crear la armonía y la unidad, debe
diseñar una página o un sitio con la coherencia y la repetición.
Harmony is fostered by: La armonía se ve favorecida por:
• Similar fonts and colors fuentes y colores similares
• pictures which match the topic imágenes que coincidan con el tema
• graphics which are similar in tone gráficos que son similares en el tono
Unity can be fostered by: La unidad puede ser apoyado por:
• ensuring that all the items which are present on a page appear to belong together
garantizar que todos los elementos que están presentes en una página parece que
van de la mano
• different pages in the site are similar in content and design. distintas páginas del
sitio son similares en contenido y diseño.
Visual identity can be very important in a unified site design - similarity amongst
pages ties a site together and gives it a feeling of wholeness. Identidad visual
puede ser muy importante en un diseño del sitio unificado - similitud entre los
lazos de páginas de un sitio y le da una sensación de plenitud.
Visual Identity for this Site Identidad Visual para este sitio
This site has a number of elements which are used to promote harmony and
unity. Este sitio tiene una serie de elementos que se utilizan para promover la
armonía y la unidad. The left side navigation box is present on every page. El
cuadro de navegación de la izquierda está presente en cada página. The
identifying title "Web Design for Instruction" is always found in the top left corner,
the first location to be seen when a page loads. El título de la identificación de
"Diseño Web para la Instrucción" siempre se encuentra en la esquina superior
izquierda, el primer lugar para ser visto cuando se carga una página. The color
and style of font is similar from page to page. El color y el estilo de fuente es
similar a una página a otra. Within the sections, there is a navigation box at the
bottom of each page, and that box has a border the same color as the left side
navigation box to link them together. Dentro de las secciones, hay una caja de
navegación en la parte inferior de cada página, y que la caja tiene un borde del
mismo color que el cuadro de navegación de la izquierda para enlazar. The font
titles and colors are similar from page to page. Los títulos de la fuente y los
colores son similares de una página a otra.

Good screen design should fulfil the following expectations: buen diseño de
pantalla debe cumplir las siguientes expectativas:
• focus your attention on important information centrar su atención en la
información importante
• attract and maintain your interest atraer y mantener su interés
• promote the integration of new information with things you've learned
before promover la integración de nueva información con las cosas que has
aprendido antes
• help you find and organize information easily by making it easy to navigate
through the information [ 1 ]. ayudarle a encontrar y organizar la
información fácilmente por lo que es fácil navegar a través de la
información [ 1 ].
Some topics important to screen design include: Algunos de los temas
importantes a la pantalla de diseño incluyen:
• Screen Grid and Layout Pantalla de cuadrícula y Diseño
• Line Length Longitud de la línea
• Screen Density Densidad de pantalla
• Font Selection & Leading Selección de fuentes y principales
• Icons, Buttons, & Menus Los iconos, botones, menús y
• Color Color

The screen grid can be used as a way of ensuring consistency between pages in a
site [ 1 ]. The grid can be used to establish that certain areas of the screen are to
be used for specific purposes (eg. navigation buttons or hyperlinks are found on
the top,bottom or left side of the page, text information is placed in the center
half of the screen with white space found on either side). Since HTML makes no
allowances for margins or white space, other means such as tables with invisible
borders are used to provide designers with the means of implementing their ideas
[ 2 ]. Implementing a screen grid using tables can cause problems if the designer
is unaware of the limitations. La rejilla de la pantalla se puede utilizar como una
forma de asegurar la coherencia entre las páginas de un sitio [ 1 ]. La red se
puede utilizar para demostrar que ciertas áreas de la pantalla deben ser utilizados
con fines específicos (por ejemplo, botones de navegación, hipervínculos o links
se encuentran en la, parte inferior o el lado izquierdo superior de la página,
información de texto se coloca en el medio centro de la pantalla con el espacio en
blanco que se encuentran en cada lado). Desde HTML no tiene derechos de
emisión para márgenes o espacios en blanco, otros medios, tales como tablas con
invisibles las fronteras se utilizan para proporcionar a los diseñadores con los
medios para aplicar sus ideas [ 2 ]. La implementación de una rejilla de la pantalla
utilizando las tablas pueden causar problemas si el diseñador no es consciente de
las limitaciones.
Layout for this Site Diseño de este sitio
This web site is implemented using a table with 3 columns. Este sitio web se
implementa mediante una tabla con tres columnas. The first column contains the
top level navigation elements (the dark blue colored box to the left), the second
column is a spacer so that text does not overwrite the colored section of the
background graphic, and the third column is where the information from each
page is located. La primera columna contiene los elementos de navegación de
nivel superior (el de color oscuro cuadro azul a la izquierda), la segunda columna
es un separador para que el texto no sobrescribe la sección de color del gráfico de
fondo, y la tercera es la columna donde la información de cada la página se
encuentra. The navigation box with the colored edge at the bottom is another
table. El cuadro de navegación con el borde de color en el fondo es otra tabla. I
have made the borders for all the tables on this page visible so you can see the
page grid. He hecho las fronteras para todas las tablas en esta página visible para
que pueda ver la cuadrícula de la página.
[ [ 1] Lynch, P. & Horton, S. (1997). Web style manual, 2nd ed. Yale Center for Advanced
Instructional Media. [Online]. 1] Lynch, P. & Horton, S. (1997). Manual de Estilo Web, 2 ª
ed. Yale Center for Advanced Instructional Media. Línea] [. Available:
http://info.med.yale.edu/caim/manual/contents.html Disponible:
http://info.med.yale.edu/caim/manual/contents.html
[ [ 2] Siegel, D. Siegel 2], D. (1996) Creating killer web sites . (1996) Creación de sitios web, asesino.
IN: Hayden Books. Libros Hayden: EN.

According to Schwier & Misanchuk [ 5 ], research on line length is contradictory,


with recommendations (emanating from the print medium) ranging from 35 - 75
characters per line. Según Schwier y Misanchuk [ 5 ], la investigación sobre la
longitud de línea es contradictoria con las recomendaciones (procedentes del
medio impreso), que van desde 35 hasta 75 caracteres por línea.
35 character line: 35 carácter de línea:
12345678901234567890123456789012345
12345678901234567890123456789012345
75 character line: 75 carácter de línea:
12345678901234567890123456789012345678901234567890123456789012345
6789012345
12345678901234567890123456789012345678901234567890123456789012345
6789012345
In terms of CRT research, two studies reported that longer lines were better [ 1 , 3
] while another suggested that a rule of thumb is "text is read more efficiently
when presented in a dense manner" [ 2 , p. En términos de investigación de la
CRT, dos estudios informaron que las líneas más largas eran mejores [ 1 , 3 ]
mientras que otro sugirió que una regla de oro es "el texto se lee de manera más
eficiente cuando se presenta de una manera densa" [ 2 , p. 26]. 26]. Misanchuk,
Schwier & Boling [ 4 ] suggest that worrying about line length may be a moot
point in terms of the web since users have the opportunity themselves to regulate
the length of lines. Misanchuk, Schwier y Boling [ 4 ] sugieren que preocuparse por
la longitud de línea puede ser un punto discutible en cuanto a la web ya que los
usuarios tienen las mismas oportunidades para regular la longitud de las líneas.
[ [ 1] Grabinger, RS (1993). 1] Grabinger, RS (1993). Computer Screen Design: Viewer Judgments .
Equipo de diseño de la pantalla: Visor de resoluciones judiciales. Educational Technology, Research
and Development , 41(2), 35-73. Tecnología para la Educación, Investigación y Desarrollo, 41 (2), 35-
73.
[ [ 2] Hooper, S., and Hannafin, MJ (1986). 2] Hooper, S., y Hannafin, MJ (1986). Variables affecting
the legibility of computer generated text. Journal of Instructional Development, 9 , 22-29. Variables
que afectan a la legibilidad del texto generado por ordenador. Diario de Desarrollo Educativo, 9, 22-
29.
[ [ 3] Kolers, PA, Duchnicky, RL, & Ferguson, DC (1981). Kolers 3], PA, Duchnicky, RL, y Ferguson,
DC (1981). Eye movement measurement of readability of CRT displays. Human Factors, 23 , 517-527.
Ojo de medición movimiento de la legibilidad de las pantallas CRT. Factores Humanos, 23, 517-527.
[ [ 4] Misanchuk, E., Schwier, R. & Boling, E. (in press). Visual design for instructional multimedia. 4]
Misanchuk, E., Schwier, R. y Boling, E. (en prensa). Diseño visual de multimedia de enseñanza.
[ [ 5] Schwier, R., & Misanchuk, E. (1993) Interactive multimedia instruction . 5] Schwier, R., y
Misanchuk, E. (1993) de instrucciones multimedia interactivo. Englewood Cliffs, NJ: Educational
Technology Publications, Inc. Englewood Cliffs, NJ: Publicaciones de la tecnología para la Educación,
Inc.

Recommendations as to the amount of text to place on a computer screen are


very contradictory. Recomendaciones en cuanto a la cantidad de texto para
colocar en una pantalla de computadora son muy contradictorias. Most of the
research on text density was carried out previous to 1990. La mayoría de las
investigaciones sobre la densidad de texto se llevó a cabo antes de 1990. This
means that much of the research used computers with monochrome monitors or
monitors with 16 colors at most. Esto significa que gran parte de la investigación
utilizó las computadoras con monitores monocromáticos o monitores con 16
colores como máximo. Some of the research was even based on 40 column
screens. Algunas de las investigaciones se basa aún en 40 pantallas de la
columna. Some studies found subjects preferred high density screens [ 3 ] while
others recommended lower density [ 4 ]. Formats for testing screen density varied
widely; from screenfuls of X's and O's representing text, to nonsensical text, to
actual instruction - it is unclear whether these methodological differences have an
effect on the actual outcomes. Algunos estudios encontraron que los sujetos
preferidos densidad de pantallas de alta [ 3 ] mientras que otros se recomienda
una densidad más baja [ 4 ];. formatos de pantalla de las pruebas de densidad
varió mucho de pantallas completas de X y que representan el texto de O, a un
texto sin sentido, a la instrucción real - no está claro si estos diferencias
metodológicas tener un efecto sobre los resultados reales. Many experts in
computer-based instruction have recommended "minimal amounts of text with
lots of white space and double-spaced lines" [ 5 , p. Muchos expertos en la
instrucción basada en ordenador han recomendado "cantidades mínimas de texto
con una gran cantidad de espacio en blanco y espaciadas líneas dobles" [ 5 , p.
234] while others suggest that "text is read more efficiently when presented in a
dense manner" [ 2 , p. 234], mientras que otros sugieren que "el texto se lee de
manera más eficiente cuando se presenta de una manera densa" [ 2 , p. 26]. 26].
Since the environment for computers has changed dramatically since the majority
of these recommendations were made and no new research studies are
forthcoming, it is impossible to determine any instructionally based research
guidelines about screen density. Desde el entorno de las computadoras ha
cambiado dramáticamente desde que la mayoría de estas recomendaciones
fueron hechas y sin nuevos estudios de investigación son próximas, es imposible
determinar las directrices basadas en la investigación instructivos acerca de la
densidad de pantalla.
A conference presentation by Jared Spool profiling his recent internet research
found that users rated sites with large amounts of white space and sparse text as
"too complicated, over-detailed, visually confusing, unclear and "not enticing".
Mistrustful of the results, the researchers tested the effects of white space five
different ways, only to come up with similar results." A la conferencia de
presentación de Jared Spool su perfil de búsqueda en Internet reciente encontró
que los usuarios nominal sitios con grandes cantidades de espacio en blanco y el
texto escasa como "demasiado complicado, demasiado extensa, confusa visual,
claro y" no atractivo ". Desconfiar de los resultados, el los investigadores
probaron los efectos de los espacios en blanco de cinco maneras diferentes, sólo
para llegar a resultados similares. " [ 1 ] [ 1 ]
[ [ 1] Festa, P. (1998). Web design not what you pay for. [Online]. 1] Festa, P. (1998). Diseño de
páginas web no lo que usted paga en línea.] [. Available:
http://www.news.com/News/Item/0,4,21150,00.html Disponible: http://www.news.com/News/Item/0,
4,21150,00 html.
[ [ 2] Hooper, S., and Hannafin, MJ (1986). 2] Hooper, S., y Hannafin, MJ (1986). Variables affecting
the legibility of computer generated text. Journal of Instructional Development, 9 , 22-29. Variables
que afectan a la legibilidad del texto generado por ordenador. Diario de Desarrollo Educativo, 9, 22-
29.
[ [ 3] Morrison, G., Ross, S., Schultz, C., O'Dell, J. (1989). Morrison 3], G. Ross, S., Schultz, C.,
O'Dell, J. (1989). Learner preferences for varying screen densities using realistic stimulus materials
with single and multiple designs. Educational Technology, Research & Development, 37 (3), 53-60.
Aprendices de las preferencias de diferentes densidades de la pantalla utilizando estímulos materiales
realistas y con múltiples diseños individuales. Tecnología Educativa, Investigación y Desarrollo, 37
(3), 53-60.
[ [ 4] Ross, SM, Morrison, GR & Schultz, CW (1994). 4 Ross], SM, Morrison, GR & Schultz, CW
(1994). Preferences for Different CBI Text Screen Designs Based on the Density Level and Realism of
the Lesson Content Viewed. Computers in Human Behavio r, 10(4), 593-603 EJ493289 Preferencias
para la CBI de texto en pantalla diferentes diseños basados en el nivel de densidad y el realismo del
contenido de la lección vistos. Computadoras en r Behavio Humanos, 10 (4), 593-603 EJ493289
[ [ 5] Schwier, R., & Misanchuk, E. (1993) Interactive multimedia instruction . 5] Schwier, R., y
Misanchuk, E. (1993) de instrucciones multimedia interactivo. Englewood Cliffs, NJ: Educational
Technology Publications, Inc. Englewood Cliffs, NJ: Publicaciones de la tecnología para la Educación,
Inc.

Researchers who conducted research on the optimal font size for CBI using a
Macintosh Centris, 14 inch monitor and Times Truetype font discovered a
preference for 14 to 16 point font over 10 to 12 point font. Los investigadores que
llevaron a cabo investigaciones sobre el tamaño óptimo de la ICC con un
Macintosh Centris, 14 pulgadas de monitor y TrueType fuente Times descubrió
una preferencia de 14 a letra tamaño 16 puntos de la fuente de más de 12 a 10.
As this contravenes many findings from print-based research, they concluded
"font size recommendations based on print media are inadequate" [ 1 , p. Como
esto contraviene muchos hallazgos de investigación basada en la impresión, que
concluyó que "el tamaño de fuente recomendaciones basadas en los medios
impresos no son suficientes" [ 1 , p. 143]. 143].
Other researchers [ 2 ] offer the following guidelines for font selection: Otros
investigadores [ 2 ], ofrecemos las siguientes pautas para la selección de la
fuente:
For body text on-screen, you would do well to choose a font with these characteristics:
Para el texto en pantalla, usted haría bien para elegir una fuente con estas
características:
• minimum 12- or 14-point size (if the font has relatively small characters compared
to other fonts of that size (eg, Times), choose 14; if the characters are relatively
large (eg, Bookman), you can choose 12) punto de talla 12 a 14 o mínimo (si la
fuente tiene caracteres relativamente pequeños en comparación con otras fuentes
de ese tamaño (por ejemplo, Times), elija 14, si los personajes son relativamente
grandes (por ejemplo, Bookman), puede elegir 12)
• plain (roman) style, rather than bold, italic, outline, shadow, or other style sans-
serif or with serifs that are not too fine to render well on-screen simple (romano)
de estilo, en lugar de negrita, cursiva contorno, sombra, o cualquier otra forma-
sans serif o serifas que no son demasiado finas para rendir bien en la pantalla
• bitmap font rather than outline font fuente de mapa de bits en lugar de fuente de
contorno
• proportional font (unless it is necessary to choose a non-proportional font for some
reason) fuente proporcional (a menos que sea necesario elegir una fuente no
proporcional, por alguna razón)
• not anti-aliased No suavizado
• system-resident font (preferred but not mandatory) Residentes de fuentes del
sistema (preferido pero no obligatorio)
For headings and titles on-screen, you should generally choose a font with these
characteristics: Para las partidas y los títulos que aparecen en pantalla, por lo
general, debe elegir una fuente con estas características:
• 18-36 point size (assuming 12- or 14-point body text) 18 a 36 puntos de tamaño
(suponiendo 12 - o el punto de cuerpo de texto-14)
• plain (roman) or bold style is acceptable; italics may be used if the font size is
large enough to render well on-screen (Romano) o en negrita estilo sencillo es
aceptable; cursiva se puede utilizar si el tamaño de la fuente es lo suficientemente
grande como para hacer bien en la pantalla
• either sans-serif or serif font is acceptable (it often works well to have the opposite
of body text--ie, if body text is sans-serif, make titles/headings serif, and vice
versa) o sans-serif o serif fuente es aceptable (que a menudo funciona bien para
que el opuesto del texto del cuerpo - es decir, si el cuerpo del texto es sans-serif,
que los títulos / serif partidas, y viceversa)
• due to the size of titles/headings, outline fonts may render well enough on-screen
to be usable debido al tamaño de los títulos / encabezados, fuentes de contorno
pueden hacer lo suficiente en pantalla para ser utilizable
• proportional font fuente proporcional
• anti-aliased titles/headings generally look more pleasing Anti-alias títulos / partidas
generalmente se ven más agradables
• system-resident font (preferred but not mandatory) Misanchuk, et al. (in press)
Residentes de fuentes del sistema (preferido pero no obligatorio) Misanchuk, et al.
(En prensa)
Misanchuk [ 3 ] conducted research which seemed to indicate that subjects
preferred Geneva font on a Macintosh. Misanchuk [ 3 ] realizó una investigación
que parecía indicar que la fuente preferida de Ginebra sujetos en un Macintosh.
However, he also cautions against taking these previous results too seriously, as
many variables were not controlled. Sin embargo, también advierte en contra de
tomar estos resultados anteriores demasiado en serio, como muchas variables
que no fueron controlados. They further suggest: "rapid advances in technology
(new fonts; higher-resolution displays) may make the generalizability of the
existing research questionable." Asimismo, sugieren: "los rápidos avances en
tecnología (nuevas fuentes; resolución muestra superior) puede hacer que la
generalización de las investigaciones existentes cuestionable." Indeed, there are
typefaces being designed specifically for web use which are completely designed
to be used on a computer. De hecho, hay tipos de letra están diseñados
específicamente para uso en la web que son completamente diseñado para ser
utilizado en una computadora.
Web Fonts Web Fonts
Microsoft's home page includes a section on "Typography on the Web" which
includes several of these fonts which are freely distributed. de la página principal
de Microsoft incluye una sección sobre "Tipografía en la Web", que incluye varias
de estas fuentes que se distribuyen gratuitamente. With the advent of Cascading
Style Sheets, designers can specify that these fonts be used on web pages to
increase readability [ 6 ] Below are examples of fonts recommended for use on
web pages: Con la llegada de las Hojas de Estilo en Cascada, los diseñadores
pueden especificar que estas fuentes se utilizan en las páginas web para
aumentar la legibilidad [ 6 ] A continuación se presentan ejemplos de las fuentes
recomendadas para su uso en páginas web:
This is an example of Verdana and smaller Este es un ejemplo de Verdana y más pequeños
This is an example of Georgia Este es un ejemplo de Georgia
This is an example of Minion Web (installed with Internet Explorer) This is the font
used in this site. Este es un ejemplo de Minion Web (instalado con Internet
Explorer) Este es el tipo de letra utilizado en este sitio.
This is an example of @Home (installed with Shaw @Home browser) Este es un
ejemplo de @ Home (instalado con Shaw @ navegador Inicio)
These fonts are specifically designed to be legible in both small and large font
sizes on the screen. Estas fuentes están específicamente diseñados para ser
legibles en ambos tamaños de fuente grandes y pequeños en la pantalla. (you will
not see these fonts unless they are installed in your system - you can download
Verdana and Georgia from the following address: Microsoft Typography ) (No verá
estas fuentes, a menos que se instalan en su sistema - puede descargar Verdana
y Georgia en la siguiente dirección: tipografía de Microsoft )
Text Justification Justificación de texto
Typographic convention in magazines and newspapers usually requires that text
be full justified; however, research indicates that ragged right text justification is
the easiest to read [ 4 ]. Full justification requires that both margins be aligned -
methods to accomplish this alignment include leaving spaces between letters or
words, or hyphenating words. convenciones tipográficas en revistas y periódicos
por lo general requiere que el texto se justifica plenamente, sin embargo, la
investigación indica que el derecho de la justificación del texto irregular es el más
fácil de leer [ 4 ] entre Full. justificación requiere que tanto los márgenes de estar
alineados - métodos para lograr esto incluyen la alineación dejando espacios
letras o palabras, o palabras separación silábica. Hyphenation of words makes
decoding more difficult. Separación de sílabas de las palabras hace más difícil de
descifrar. For comprehension purposes, don't use full justification of text on the
screen. Para fines de comprensión, no utilice una justificación completa del texto
en la pantalla.
History of Fonts Historia de las Fuentes
Are you interested in the differences between fonts and some information about
font development? ¿Está interesado en las diferencias entre los tipos de letra y
alguna información sobre el desarrollo de fuentes? If you are, here's a site which
presents information of fonts in a very interesting way: typographic Si es así, aquí
hay un sitio que presenta información de fuentes en una forma muy interesante:
tipográficos
[ [ 1] Chen, M., Jackson, W., Parson, C., Sindt, K., Summerville, J., Tharp, D., Ullrich, R., &
Caffarella, E. (1996) The Effects of Font Size in a Hypertext Computer Based Instruction
Environment. (ERIC Document Reproduction Service No. ED 397 784) 1 Chen], M.
Jackson, W. Parsons, C., Sindt, K., Summerville, J., Tharp, D., Ullrich, R., y Caffarella, E.
(1996) Los efectos del tamaño de la fuente en un equipo basado en hipertexto de
instrucciones para el Medio Ambiente. (Servicio de Reproducción de documentos ERIC ED
N º 397 784)
[ [ 2] Misanchuk, E., Schwier, R. & Boling, E. (in press). Visual design for instructional multimedia. 2]
Misanchuk, E., Schwier, R. y Boling, E. (en prensa). Diseño visual de multimedia de enseñanza.
[ [ 3] Misanchuk, ER (1989). 3] Misanchuk, ER (1989). Learner/user preferences for fonts in
microcomputer screen displays. Canadian Journal of Educational Communication, 18 , 193-205.
Alumno / preferencias del usuario para las fuentes en pantalla microordenador. Canadian Journal de la
Comunicación Educativa, 18, 193-205.
[ [ 4] Muncer, SJ, Gorman, BS, Gorman, S., and Bibel, D. ,1986; Trollip, SR, & Sales, G., 1986, as
cited in Schwier and Misanchuk, 1993. 4] Muncer, SJ, Gorman, BS, Gorman, S., y Bibel, D., 1986;
Trollip, SR, y Ventas, G., 1986, citado en Schwier y Misanchuk de 1993.
[ [ 5] Schwier, R., & Misanchuk, E. (1993) Interactive multimedia instruction . 5] Schwier, R., y
Misanchuk, E. (1993) de instrucciones multimedia interactivo. Englewood Cliffs, NJ: Educational
Technology Publications, Inc. Englewood Cliffs, NJ: Publicaciones de la tecnología para la Educación,
Inc.
[ [ 6] Veen, J. (1998). Big minds on web design. [Online]. 6] Veen, J. (1998). Mentes Grande en diseño
de páginas web en línea.] [. Available:
http://www.hotwired.com/webmonkey/templates/print_template.htmit?
meta=/webmonkey/98/13/index0a_meta.html Disponible:
http://www.hotwired.com/webmonkey/templates/print_template.htmit?
meta=/webmonkey/98/13/index0a_meta.html

In both multimedia and web design, great attention is paid to the navigation
interface, the means by which users are able to navigate from one location to
another. En ambos multimedia y diseño web, se presta gran atención a la interfaz
de navegación, el medio por el cual los usuarios pueden navegar de un lugar a
otro. In many treatments, navigation is initiated by using icons, buttons or menus.
En muchos tratamientos, la navegación se inicia mediante el uso de iconos,
botones o los menús.
Rules for Buttons, Boxes and Menus: Reglas para los botones, cajas y de los
menús:
• Buttons, radio buttons, check boxes and menus should look like something you
would normally press, click, put x's in, or pull down [ 3 , 4 ]. HTML includes special
routines which draw radio buttons, check boxes and pull down menus for you.
Botones y botones de opción, casillas de verificación y menús debe verse como
algo que normalmente la prensa, haga clic en, ponga una X en, o tirar hacia abajo [
3 , 4 ]. HTML incluye rutinas especiales que atraen a los botones de opción, casillas
de verificación y menús desplegables para usted . The design of buttons is a bit
trickier, since you have to draw your own graphic and make it look like a button
(bevelled edges give the 3D effect which makes a graphic look like something you
would press). El diseño de los botones es un poco más complicado, ya que tienen
que sacar sus propios gráficos y hacer que se vea como un botón (bordes
biselados y dar el efecto 3D que hace que un aspecto gráfico como algo que sería
de prensa).
• Give the user some feedback that execution is occurring after a button is pressed.
Dar al usuario una retroalimentación que la ejecución se produce después de
pulsar un botón. This was much harder in the past, but with the addition of
Javascript to the newer web browsers, icons will flash or change color when
pressed, giving the user the sense that something may happen. Esto era mucho
más difícil en el pasado, pero con la adición de JavaScript para los navegadores
más recientes, iconos flash o cambio de color cuando se pulsa, dando al usuario la
sensación de que algo puede suceder.
There are many sources on the web for buttons which are already designed. Hay
muchas fuentes en la web para los botones que ya están diseñados. Here are
some suggestions: Aquí están algunas sugerencias:
• Jelane's Web Graphics de Gráficos Web Jelane
• Andy's Art Attack -Buttons Art Attack de Andy-Botones
• Reallybig.com Reallybig.com
• Netscape's Tool Chest - Buttons La herramienta de pecho Netscape - Botones

Icons Iconos
Icons can be very useful when designing navigation aids, but they also have their
pitfalls. Los iconos pueden ser muy útiles en el diseño de ayudas a la navegación,
pero también tienen sus inconvenientes. Advantages of icons include: Ventajas de
los iconos son:
• to help users work smarter by improving productivity and reliability (road signs can
read at twice the distance and half the time as word signs (Horton, 1994)) para
ayudar a los usuarios trabajar con más inteligencia por mejorar la productividad y
fiabilidad (señales de tráfico puede leer dos veces la distancia y la mitad del
tiempo como signos palabra (Horton, 1994))
• to represent visual and spatial concepts such as shape, color, position, angle, size,
texture, and pattern para representar conceptos visuales y espaciales, tales como
forma, color, posición, ángulo, tamaño, textura, y el patrón
• to save space in crowded screen displays para ahorrar espacio en pantalla llena
• to speed search (we can recognize icons much more quickly that reading a list of
words) a la velocidad de búsqueda (que pueden reconocer los iconos mucho más
rápidamente que la lectura de una lista de palabras)
• for better recall and immediate recognition (Both Braden and Horton cite studies
where graphic recall is close to 100% accurate[ 1 , p. 498; 2 , p.5); para un mejor
recuerdo y el reconocimiento inmediato (dos Braden y Horton citan estudios donde
recuerdo gráfico es cercana al 100% de precisión [ 1 , p. 498, 2 , p. 5);
• to allow illiterate or semi-literate users to function more easily para permitir o
semi-analfabetos a los usuarios leer y escribir la función con mayor facilidad
• to increase global access to your web page or multimedia product. para aumentar
el acceso mundial a la página web o productos multimedia.
On the downside, it is very challenging to design icons - the constraints of a very
small space make it difficult to convey a message (especially a concept as
opposed to a concrete operation). En el lado negativo, es muy difícil de diseño de
iconos - las limitaciones de un espacio muy pequeño que sea difícil transmitir un
mensaje (sobre todo un concepto en contraposición a una operación concreta). As
Horton states: "Obscure icons make computer screens look like the control panel
of an alien spaceship. Gaudy, garish icons make them look like a piece of
"refrigerator art." [ 2 , p. 15] Como Horton afirma: "oscuro iconos de la pantalla
del ordenador que se parecen el panel de control de una nave espacial
extraterrestre de. Llamativo chillón, los iconos que se vean como una pieza de"
arte refrigerador [. " 2 , p. 15]
Shneiderman includes the following guidelines for the use of icons: Shneiderman
incluye las siguientes pautas para el uso de iconos:
• represent the object or action in a familiar and recognizable manner representar el
objeto o la acción en una manera familiar y reconocible
• limit the number of different icons limitar el número de iconos diferentes
• make the icon stand out from its background hacer que el icono se destacan del
fondo
• consider three dimensional icons; they are eye-catching but also can be distracting
considerar tres dimensiones iconos, son llamativos, pero también pueden distraer
• ensure that a single selected icon is clearly visible when surrounded by unselected
icons asegurarse de que un icono seleccionado solo es visible cuando está rodeado
por los iconos seleccionados
• make each icon distinctive from every other icon que cada icono distintivo de cada
otro icono
• ensure the harmoniousness of each icon as a member of a family of icons.
asegurar la armonía de cada icono como miembro de una familia de iconos. [ 4 , p.
[ 4 , p. 208] 208]
Here's a link to some prepared icons: IconBazaar Aquí hay un enlace a algunos
iconos preparado: IconBazaar
[ [ 1] Braden, R. (1996). 1 Braden], R. (1996). Visual literacy. la alfabetización visual. In
DH Jonassen (Ed.), Handbook of Research for Educational Communications and
Technology . En Jonassen DH (Ed.), Manual de Investigación de Comunicaciones y
Tecnología Educativa. New York: Simon and Schuster Macmillan. Nueva York: Simon and
Schuster Macmillan.
[ [ 2] Horton, W. Horton 2], W. (1994 ). (1994). The icon book: Visual symbols for computer systems
and documentation . El icono de libro: símbolos visuales para los sistemas informáticos y
documentación. Toronto, ON: John Wiley & Sons. Toronto, ON: John Wiley & Sons.
[ [ 3] Norman, D. Norman 3], D. (1988) The design of everyday things. New York, NY: Doubleday.
(1988) El diseño de las cosas cotidianas:. Nueva York, NY, Doubleday.
[ [ 4] Shneiderman, B. (1998). Designing the user interface: Strategies for effective human-computer
interaction (3rd ed.) . 4] Shneiderman, B. (1998):. Diseño de la interfaz de usuario de Estrategias para
la interacción persona-ordenador efectiva (3 ª ed.). Reading, MA: Addison-Wesley Publishing. , MA
Reading: Addison-Wesley Publishing.
Materials should be designed in shades of gray, black and white first, with color
added later in a fashion which adds to instructional effectiveness. Los materiales
deben ser diseñados en tonos de gris, blanco y negro en primer lugar, con color
añadido más tarde en una moda que se suma a la eficacia educativa. Here are the
reasons why this is good advice: Aquí están las razones por las que este es un
buen consejo:
• many people suffer from some type of color deficiency ranging from weakness in
certain colors, mainly red and green, to full loss of color (it is estimated that 8% of
the population experience some type of color deficiency ). [ 4 ] muchas personas
sufren de algún tipo de deficiencia de color que van desde la debilidad de ciertos
colores, principalmente rojo y verde, a la pérdida total de color (se estima que el
8% de la experiencia de la población algún tipo de deficiencia cromática) [. 4 ]
• aging also affects the perception of colors envejecimiento también afecta a la
percepción de los colores
• users may be accessing your design via monochrome monitors - if important
distinctions are shown by varying colors, this information will not be available to
these users. los usuarios pueden acceder a su diseño a través de monitores
monocromáticos - si distinciones importantes están representados por diferentes
colores, esta información no estará disponible para estos usuarios.
Many researchers have cautioned about the use of color in instructional materials:
Muchos investigadores han advertido sobre el uso del color en los materiales de
instrucción:
• "...excessive or inappropriate use of color can inhibit performance and confuse the
user" [ 5 , p. "... O inadecuado uso excesivo de color pueden inhibir el rendimiento
y confundir al usuario" [ 5 , p. 265]. 265].
• "Unless used carefully and sparingly, color can make the tasks of reading text and
interpreting small objects slower, less accurate, and more painful...color reduces
legibility...color produces fuzzy edges...[and] color tires the eyes". "Menos que
sean utilizados con cuidado y moderación, el color puede hacer que las tareas de
lectura de textos e interpretación de los objetos pequeños más lento, menos
preciso y más doloroso ... reduce la legibilidad del color ... de color produce bordes
difusos ... [y] los neumáticos de color de los ojos ". Horton (1991, p. 164 cited in [ 2
]) Horton (1991, p. 164 citado en [ 2 ])
• "Color can be a powerful tool for communication if used correctly... use appropriate
highlighting and deemphasis techniques to convey meaningful semantic
distinctions" [ 1 , p. "El color puede ser una poderosa herramienta para la
comunicación si se utiliza correctamente ... uso apropiado y deénfasis técnicas
destacar transmitir significativas distinciones semánticas" [ 1 , p. 429]. 429]. If
used incorrectly, however, color can interfere with functionality. Si se utiliza de
forma incorrecta, sin embargo, el color puede interferir con la funcionalidad.

Guidelines Based on the Physiological Properties of Color Directrices basadas


en las propiedades fisiológicas de color
Murch [ 3 ] discussed screen color use based on the physiological properties of the
eye, discussing how the number and distribution of rods and cones in the eye
affected the perception of line and color. Murcia [ 3 ] discute el uso de colores de
pantalla basados en las propiedades fisiológicas de los ojos, hablando de cómo el
número y la distribución de los conos y bastones en el ojo afectado la percepción
de la línea y el color. His recommendations are on this page: Murch's Guidelines
for Color Sus recomendaciones están en esta página: Murcia Directrices para el
color
Uses of Color - Affective, Structural & Cognitive Usos del color - afectivo,
cognitivo y estructural
Schaeffer & Bateman [ 4 ] discuss color in terms of its affective role, its structural
uses and its cognitive uses. Schaeffer y Bateman [ 4 ] hablar del color en términos
de su función afectiva, sus usos estructurales y sus usos cognitivos.
The affective role of color concerns how color can be used to motivate or generate an
emotional response. La función afectiva de las preocupaciones de color como el color
puede ser utilizado para motivar o generar una respuesta emocional.
Structural uses for color involve assigning functional meanings to various colors -
menu items in one color, instructions in another color and error messages in a
third color so that color can help the user to differentiate between the functions of
various text messages. usos estructurales de color supone la asignación de
significados funcionales de varios colores - los elementos de menú de un solo
color, instrucciones en otro y mensajes de error de color en un tercer color, para
que el color puede ayudar al usuario a distinguir entre las funciones de mensajes
de texto diferentes. Color can also be used to attract the user's attention to
convey messages which must be addressed quickly. El color también se puede
utilizar para atraer la atención del usuario para transmitir mensajes que deben ser
tratadas rápidamente.
The cognitive uses of color involve: Los usos cognitivos de involucrar a color:
• highlighting salient features destacando las características sobresalientes
• color coding, which may help with retrieval of information código de colores, que
pueden ayudar con la recuperación de la información
• decreasing the cognitive load by using colors with accepted meanings - ie.
disminuyendo la carga cognitiva mediante el uso de colores con significados
aceptados - es decir. red - stop, yellow - caution, green - go) rojo - Parada, amarillo
- precaución, verde - ir)
• simplifying complex information - using color to organize information by
differences or relationships la simplificación de información complejos - color
utilizando para organizar la información por las diferencias o relaciones
Pett and Wilson (1996, p. 31) list the following suggested uses of color: Pett y
Wilson (1996, p. 31) sugiere una lista de los siguientes usos del color:
• Use color to add reality Utilice el color para agregar la realidad
• Use color to discriminate between elements of a visual Utilice el color para
discriminar entre los elementos de un elemento visual
• Use color to focus attention on relevant cues Utilice el color para centrar la
atención en las señales pertinentes
• Use colors to code and link logically related elements Utilice los colores para
codificar y vincular los elementos relacionados lógicamente
• Be consistent in general color choices throughout materials Sea constante en las
opciones de color en general de todo material
• Use colors such as highly saturated red and violet to attract attention and to create
an emotional response Utilice los colores saturados, como rojo y violeta en gran
medida a atraer la atención y crear una respuesta emocional
• Use highly saturated colors for materials intended for young children Utilice colores
muy saturados de materias primas destinadas a los niños pequeños
• Consider commonly accepted color meanings such as red and yellow are warm,
green and blue are cool, red means stop, green means go, etc. Considere
comúnmente aceptada significado de los colores como el rojo y el amarillo son
cálidos, verdes y azules son, rojo significa parar fresco, verde significa ir, etc
• When producing materials for persons from varied cultures consider the meanings
they attribute to colors. Cuando la producción de materiales para las personas de
diversas culturas en cuenta los significados que atribuyen a los colores.
An extensive list of guidelines for the use of color is available at: Una extensa lista
de directrices para el uso del color está disponible en:
PDF file [ 6 ]
http://www.extension.usask.ca/Papers/Misanchuk/AECT95/A&SPartI.pdf archivo
PDF [ 6 ] http://www.extension.usask.ca/Papers/Misanchuk/AECT95/A&SPartI.pdf
Here's an example of what not to do when picking background colors and text
colors. He aquí un ejemplo de lo que no debe hacer cuando los colores de fondo y
escoger los colores del texto. Can you read the ¿Se puede leer el blue text on the
blue background ? texto azul sobre el fondo azul ?
The bottom line on color: La línea de fondo en el color:
• design conservatively, possibly starting with black and white diseño conservador,
posiblemente a partir de negro y blanco
• do not make color the only way to discriminate between choices no que el color de
la única manera de discriminar entre las opciones
• use it appropriately to serve the purposes of clarity and functionality. utilizar de
manera apropiada para cumplir los fines de la claridad y funcionalidad.
[ [ 1] Marcus, A. (1995). 1 Marcus], A. (1995). Principles of effective visual communication
for graphical user interface design. Principios de la comunicación visual eficaz para el
diseño de interfaz gráfica de usuario. In Baecker, RM, Buxton, W., & J. Grudin (Eds.)
Readings in Human-Computer Interaction: Toward the Year 2000. San Francisco, CA:
Morgan Kaufmann. En Baecker, RM, Buxton, W., y J. Grudin (Eds.) Lecturas en-Computer
Interaction Humanos: el año 2000. Hacia San Francisco, CA: Morgan Kaufmann.
[ [ 2] Misanchuk, E., Schwier, R. & Boling, E. (in press). Visual design for instructional multimedia. 2]
Misanchuk, E., Schwier, R. y Boling, E. (en prensa). Diseño visual de multimedia de enseñanza.
[ [ 3] Murch, G. (1995). 3] Murcia, G. (1995). Color graphics - Blessing or Ballyhoo (Excerpt).
Gráficos en color - Bendición o Ballyhoo (Extracto). In Baecker, RM, Buxton, W., & J. Grudin (Eds.)
Readings in Human-Computer Interaction: Toward the Year 2000. San Francisco, CA: Morgan
Kaufmann. En Baecker, RM, Buxton, W., y J. Grudin (Eds.) Lecturas en-Computer Interaction
Humanos: el año 2000. Hacia San Francisco, CA: Morgan Kaufmann.
[ [ 4] Schaeffer, R. & Bateman, W. (1996). So many colors, so many choices: The use of color in
instructional multimedia products. (ERIC Document Reproduction Service No. ED 397 835) 4]
Schaeffer, R. & Bateman, W. (1996):. Tantos tantos colores, opciones de uso del color en la
instrucción. Los productos multimedia (ERIC Servicio de Reproducción de Documentos N ° ED 397
835)
[ [ 5]Shneiderman, B. Shneiderman 5], B. (1998). Designing the user interface: Strategies for effective
human-computer interaction (3rd ed.) . Reading, MA: Addison-Wesley Publishing. (1998):. Diseño de
la interfaz de usuario de Estrategias para la interacción persona-ordenador efectiva (3 ª ed.):.
Reading, MA Addison-Wesley Publishing.
[ [ 6] Schwier, RA, & Misanchuk, ER (1995). The art and science of color in multimedia screen
design, part I: Art, opinion, and tradition . 6] Schwier, RA, y Misanchuk, ER (1995):. El arte y la
ciencia del color de la pantalla multimedia en el diseño, la parte I de arte, opinión, y la tradición.
Paper presented at the Annual Conference of the Association for Educational Communications and
Technology, Anaheim, CA, February 8-12, 1995. Ponencia presentada en la Conferencia Anual de la
Asociación para las Comunicaciones y Tecnología para la Educación, Anaheim, CA, 8 a 12 febrero,
1995. (ERIC Document Reproduction Service No. ED 381 143) (Documento N º Servicio de
Reproducción ERIC ED 381 143)

Many of the recommendations for layout in the section on screen design research
pertain to fixed screen layout for CAI or multimedia. Muchas de las
recomendaciones para el diseño en la sección de investigación pertenecen diseño
de la pantalla a disposición de la pantalla fija para CAI o multimedia. The web
presents a unique challenge to designers for several reasons. La web presenta un
desafío único para los diseñadores por varias razones. Since the web can be used
on multiple platforms, with varying screen resolutions (from 640 x 480 up to 1048
x 760) and with color depths varying from black and white all the way to 32 bit
color, a designer needs to be very careful in the way they design their layout.
Desde la web se puede utilizar en múltiples plataformas, con diferentes
resoluciones de pantalla (de 640 x 480 hasta 1048 x 760) y con profundidades de
color que varía de blanco y negro hasta el final a color de 32 bits, un diseñador
tiene que ser muy cuidadosos en la forma de diseñar su trazado.
Recommendations: Recomendaciones:
1. Design for the smallest standard screen which is: Diseño de la pantalla más
pequeña norma que es:
○ Macintosh size (Macintosh screen area is smaller than Wintel
machines) 595 pixels wide by 295 pixels high Tamaño del Macintosh
(Macintosh área de la pantalla es más pequeña que las máquinas
Wintel) 595 píxeles de ancho por 295 píxeles de alto
○ 14 inch monitor (640- x 480 pixel area) Monitor de 14 pulgadas (640 -
x 480 píxeles de área)
○ 256 colors 256 colores
2. Start your design in black and white to ensure readability for persons with
color deficiency Inicie su diseño en blanco y negro para garantizar la
legibilidad de las personas con deficiencia de color
3. Include ALT tags on all image files to ensure that people using text-only
browsers or special readers (ie blind or sight deficient users) are still able to
access the information provided in your pages [ 2 ]. Incluya las etiquetas
ALT en todos los archivos de imagen para asegurar que las personas que
utilizan navegadores sólo-texto o lectores especiales (es decir, la vista
deficiente o usuarios ciegos) son todavía capaces de acceder a la
información proporcionada en las páginas [ 2 ].
Gillespie [ 1 ] has created a ruler which can be used to design pages which will fit
on all machines. Gillespie [ 1 ] ha creado una regla que se puede utilizar para
diseñar páginas que se ajuste en todos los equipos. Lynch and Horton [ 3 ] have
provided a graphic which shows the minimum width and depth which will show on
most monitors. Lynch y Horton [ 3 ], han proporcionado un gráfico que muestra la
anchura y la profundidad mínima que se muestran en la mayoría de los
monitores.
[ [ 1] Gillespie, J. 1 Gillespie], J. (1998). Web design for designers. [Online]. (1998). Diseño de
páginas web para los diseñadores. [En línea]. Available:
http://www.wpdfd.com/wpdtame.htm#webruler Disponible: http://www.wpdfd.com/wpdtame.htm #
webruler
[ [ 2] Lynch, P. & Horton, S. (1997). Web style manual, 2nd ed. Yale Center for Advanced
Instructional Media. [Online]. 2] Lynch, P. & Horton, S. (1997). Manual de Estilo Web, 2 ª ed. Yale
Center for Advanced Instructional Media. Línea] [. Available:
http://info.med.yale.edu/caim/manual/contents.html Disponible:
http://info.med.yale.edu/caim/manual/contents.html
[ [ 3] Lynch, P. & Horton, S. (1997). Web style manual, 2nd ed. Yale Center for Advanced
Instructional Media. [Online]. 3] Lynch, P. & Horton, S. (1997). Manual de estilo Web, 2 ª ed. Yale
Center for Advanced Instructional Media. Línea] [. Available:
http://info.med.yale.edu/caim/manual/pages/safe_area.html Disponible:
http://info.med.yale.edu/caim/manual/pages/safe_area.html

In 1997, En 1997, Morkes and Nielsen [ 1 ] conducted 3 studies which checked the
way people read things on the web. Morkes y Nielsen [ 1 ] llevado a cabo tres
estudios que comprueba la forma de leer cosas en la web. Their findings were:
Sus resultados fueron los siguientes:
• users like summaries and the inverted pyramid style used by journalists,
where the most important information is presented first in an article
usuarios como los resúmenes y la pirámide invertida estilo utilizado por los
periodistas, cuando el caso se presenta la información más por primera vez
en un artículo
• users appreciate headings which help them to scan and locate the
information they are interested in Los usuarios aprecian las partidas que les
ayudan a explorar y localizar la información que les interesa
• users do not appreciate flowery or "marketese" writing and want web pages
to be concise los usuarios no aprecian flores o marketese "escrito" y desea
que las páginas web para ser conciso
• simple and informal writing is preferred over formal writing styles e informal
por escrito simple es preferible a estilos de escritura formal
[ [ 1] Morkes, J. & Nielsen, J. (1997). Concise, SCANNABLE, and objective: How to write for the web.
[Online]. 1] Morkes, y J. Nielsen, J. (1997):. Conciso, escaneada, y el objetivo Cómo escribir para la
web] [En línea.. Available: http://www.useit.com/papers/webwriting/writing.html Disponible:
http://www.useit.com/papers/webwriting/writing.html
Shell Web Sites Shell de Sitios Web
Here are some shells for ready-made web sites. Éstos son algunos de los
depósitos realizados por los sitios web listos. All you have to do is change
the text. Todo lo que tienes que hacer es cambiar el texto. Instructions
Instrucciones
Netscape Resour ces for Creating Web Sites which include:
Netscape Resour ces para la creación de sitios Web que
incluyen:
Page Wizard , a Javascript program which asks you for background and
text colors, let's you fill in a form with the text you want on the page and
then creates the page for you. Asistente para páginas , un programa de
Javascript que le pide el texto y los colores de fondo, vamos a rellenar un
formulario con el texto que desee en la página y crea la página para
usted. Once you have created the page, which is very simple, you can
upload it to a server and make it available to others. Una vez creada la
página, que es muy sencillo, puedes subirlo a un servidor y ponerlo a
disposición de los demás.
Web page templates Página web de plantillas that you can use as a start
to create a web page. que se puede utilizar como punto de partida para
crear una página web. (these templates work only with Netscape
Composer) (Estas plantillas sólo funcionan con Netscape Composer)
Creating Web Sites Tool Chest Creación de Sitios Web en el pecho de
herramientas which gives you access to graphics and web templates
already completed que le da acceso a gráficos y plantillas web ya
terminados
Web Wizard Asistente Web
Web Wizard Asistente Web is a program for Windows 3.1 and Windows
95 which creates an instant page for you. es un programa para Windows
3.1 y Windows 95, que crea una página instantánea para usted. You
have to download the program first. Usted tiene que descargar el primer
programa.
Los Angeles County: Teams Distance Learning Condado de Los
Angeles: Equipos de Aprendizaje a Distancia
This Este resource de recursos includes numerous links to pages which
help you find graphics and author web pages. incluye numerosos enlaces
a páginas que te ayudarán a encontrar los gráficos y páginas web del
autor. Check out Echa un vistazo The Home Page Maker which will create
a page for you. La Casa Page Maker , que va a crear una página para ti.
Instant Home Page (MacUser) Página de inicio instantáneo
(MacUser)
This Este tutorial tutorial will give you a document written in HTML which
you can copy and modify, along with the instructions on how to do it. le
dará un documento escrito en HTML que puedes copiar y modificar, junto
con las instrucciones sobre la forma de hacerlo.
AOLPress Tutorial AOLpress Tutorial
The AOLPress tutorial will walk you through all the steps you need to
learn the program and create simple web pages with links and graphics.
El AOLpress tutorial le guiará a través de todos los pasos que necesita
para aprender el programa y crear páginas web con enlaces simples y
gráficos. It comes along with the program when you download it. Viene
junto con el programa cuando lo descargue. The tutorial is an interactive
one, you work through it to create different elements of a web page. El
tutorial es interactivo, se trabaja a través de él para crear diferentes
elementos de una página web. Once you have completed it, you have a
pretty good idea about how to make a web page. Una vez la haya
completado, usted tiene una idea bastante buena acerca de cómo hacer
una página web. AOLPress comes for Windows 3.1 and Windows 95 and
it's FREE! AOLpress viene para Windows 3.1 y Windows 95 y es GRATIS!
Download it at Descárgalo en http://www.aolpress.com/download.html
http://www.aolpress.com/download.html
Tools Herramientas
AOLPress AOLpress - a free page layout program which works with
Windows 3.1, Windows 95 and Macintosh - Una página gratuita programa
de diseño que funciona con Windows 3.1, Windows 95 y Macintosh
Netstudio Netstudio - a site which will allow you to produce banners,
buttons, photos and headings to download. - Un sitio que le permitirá
producir banners, botones, fotografías y títulos para descargar. Limited
choices but quite useful for someone without a program to make
graphics. opciones limitadas pero muy útil para alguien sin un programa
para hacer gráficos.
Web Page Design - Pixel Ruler Diseño de Páginas Web - píxeles de la
regla
web design tools gif/jpeg herramientas de diseño web gif / jpeg
Download Apple QuickTime Software Descargar Apple QuickTime
Software
Webmonkey: multimedia toolbox Webmonkey: caja de herramientas
multimedia
ZDNet Products: Browser Plugins ZDNet Productos: plugins del
navegador
Net Mechanic Net Mecánico - use this site to check for link rot, test your
loading times and optimize graphics - Utilizar este sitio para comprobar
la podredumbre enlace, prueba de los tiempos de carga y optimizar
gráficos
Microsoft Typography De tipografía de Microsoft web fonts Fuentes de la
web
Tucows Tucows - this site has just about every web tool known to man, in
Windows 3.x, 95, 98, NT, Mac or Linux format - Este sitio tiene casi todas
las herramientas web, conocida por el hombre, en Windows 3.x, 95, 98,
NT, Mac o Linux formato
Web Hosting Alojamiento Web
Need to find a home for your home page? Necesidad de encontrar un
hogar para su página de inicio? Try the following sites, which offer free
Web space for schools and individuals. Pruebe los siguientes sitios, que
ofrecen espacio web gratuito para las escuelas y particulares.
• GeoCities GeoCities
• NetSchool NetSchool
• Tripod Trípode
• Angelfire Communications Angelfire Comunicaciones
• Freeservers Freeservers
• Xoom Xoom

Graphics Gráficos
** Reallybig.com another site with free clipart. ** Reallybig.com otro lugar con el
clipart libre. You could wander around in this site forever Se puede pasear en este
sitio para siempre
Kitty's Page Works All I can say about this site is WOW! Página de Kitty Obras Todo
lo que puedo decir acerca de este sitio es WOW! Kids will love it. A los niños les
encanta.
ClipArt.com - their home page states they have over 30,000 free images available.
This is the free section of clipart.com ClipArt.com - su página de estados de origen
que tienen más de 30.000 imágenes gratuitas disponibles clipart.com. Se trata de
liberar a la sección de
** ArtToday - now also called ClipArt.com, this link takes you to the paying portion.
** ArtToday - ahora también llamado ClipArt.com, este enlace te lleva a la parte de
pago.
Access the Digital Saskatchewan Database this site contains copyright-free
resources for Saskatchewan teachers and students. Acceda a la base de datos digital
de Saskatchewan este sitio contiene recursos gratuitos-los derechos de autor para
profesores y estudiantes de Saskatchewan.
Themes - Coordinated Pages Temas - Coordinado Páginas
The following sites all have a number of coordinated backgrounds, rules, bullets
and buttons which can be used to make a web page. Los siguientes sitios tienen un
número de fondos coordinados, las normas, las balas y los botones que se pueden
utilizar para hacer una página web. You just have to download the graphics and use
them on your page. Sólo tienes que descargar los gráficos y los utilizan en su
página.
Jelane's Families of Graphics Jelane de las familias de los gráficos
BigNoseBird.com BigNoseBird.com
Silver's Place El lugar de plata
Sanddancr Studios nice nautical themes here Sanddancr Estudios agradable temas
náuticos aquí
Animation Animación
The MiningCo.com a site with links to lots of resources about animation El
MiningCo.com un sitio con enlaces a muchos recursos sobre la animación
Audio Audio
Sites with Audio Sitios con audio
Photoshop & Painter Photoshop y Painter
Fractal Design Painter Techniques Fractal Painter Técnicas de Diseño
Photoshop Filters and Plug-ins Online Filtros de Photoshop y complementos en
línea
Photoshop Web Reference Photoshop referencia Web
Multimedia Multimedia
Macromedia Canada Macromedia España
Multimedia/Instructional Technology Centers on the Internet Multimedia /
Centros de Tecnología Educativa en Internet
Webmonkey: multimedia Webmonkey: multimedia
Design Guidelines and Tutorials Instrucciones de diseño y tutoriales
**** Web / Design / tutorials - webreference.com **** Web / Diseño /
tutoriales - webreference.com an impressive list of most of the resources
you need to design good web sites... una impresionante lista de la
mayoría de los recursos que necesita para diseñar sitios web, bueno ...
**** WebMaster Resources **** Recursos WebMaster
** devhead Home page ** devhead Portada ZDNet's contribution to web
design La contribución de ZDNet al diseño web
** BUILDER.COM ** BUILDER.COM CNet's contribution to web design La
contribución de CNet para diseño web
** HotWired: Webmonkey ** HotWired: Webmonkey Wired magazine
Online's contribution to web design Revista en línea con conexión de
cable de la contribución al diseño web
** Web Developer's Virtual Library ** Biblioteca Virtual Web Developer
looking at this site, it appears to have just about every topic ever
discussed about the web buscando en este sitio, que parece haber
acerca de cada tema discutido alguna vez sobre la web
** Maricopa Center for Learning and Instruction ** Maricopa Centro de
Aprendizaje y la Enseñanza
** Project Cool: Anyone can build a great website! ** Proyecto "Cool:
Cualquiera puede construir un gran sitio web!
All Things Web Todas las Cosas Web
Web Review Web de Revisión sometimes a bit slow but lots of resources
a veces un poco lento, pero muchos de los recursos
MacUser: Web Guide MacUser: Guía Web includes columns and a tutorial:
Web Authoring 101 incluye columnas y un tutorial: Autoría de Web 101
Drawing and Animation Tutorials Dibujo y Animación Tutoriales
Never Underestimate the Power of Life Drawing Nunca subestime el
poder de la vida de dibujo
Vilppu Drawing Online: Gesture by Glenn Vilppu Vilppu dibujo en línea:
Gesto por Vilppu Glenn
Vilppu Drawing Online: Spherical Forms by Glenn Vilppu Vilppu dibujo en
línea: formas esféricas por Vilppu Glenn
Vilppu Drawing Online: The Box Vilppu Dibujo Online: The Box
Vilppu Drawing Online: Introducing Material and Proportion Vilppu dibujo
en línea: Presentación de material y proporción
Vilppu Drawing Online: Drawing Ellipses Vilppu dibujo en línea: elipses
Dibujo
3D Animation Workshop - webreference.com --3d animation tutorials and
resources 3D Animation Workshop - webreference.com - animación 3d
tutoriales y recursos
Human Computer Interface Design (concerns site navigation and design for
ease of use) Diseño de Interfaces Hombre-Computadora (se refiere a
navegación del sitio y el diseño para la facilidad de uso)
**** Web / Design / Usability- webreference.com **** Web / Diseño /
Usabilidad-webreference.com another very good list of web sites
discussing usability. Pay special attention to anything by Jakob Nielsen
otra buena lista de sitios web muy discutir la usabilidad. Preste especial
atención a cualquier cosa por Jakob Nielsen
**** Papers and Essays by Jakob Nielsen **** Artículos y ensayos de
Jakob Nielsen
** Web Review: Web Architect -- Blueprints ** Revisión Web: Arquitecto
Web - Planos
** Web Review -- Usability Matters ** Web Opinión - Cuestiones de
Usabilidad
Usable Web Usable Web
User Interface Engineering Interfaz de usuario de Ingeniería Jarod Spool
presents some interesting findings on web navigation Jarod cola presenta
algunas conclusiones interesantes sobre la navegación web,
Web Review - Web 98 East Web Opinión - Web 98 Oriente - conference
presentations and links to other good articles from the conference -
Presentaciones en congresos y enlaces a otros buenos artículos de la
conferencia
Web Review - Web Accessibility Revisión de la web - Accesibilidad Web
Ask Tog Home Page Pregunte Tog Página de inicio
All Things Web Todas las Cosas Web
Student HCI Online Research Experiments Estudiantes HCI experimentos
de investigación en línea (SHORE) experiments in user interface design
and web navigation (TIERRA) los experimentos en diseño de la interfaz
de usuario y la navegación web,
IJHCS 'Web Usability' Special Issue Edición Web "Usabilidad Especial
'IJHCS International Journal of Human-Computer Studies (1997) 47(1) 1-
222 Revista Internacional de Informática, Estudios Humanos (1997) 47
(1) 1 a 222
GVU's WWW Survey Results WWW Survey Resultados GVU Georgia
Institute of Technology has conducted user surveys of web usage
Georgia Institute of Technology ha realizado encuestas a los usuarios del
uso de la web
HTML HTML
** Builder.com - HTML for Beginners ** Builder.com - HTML para
principiantes
** Mariposa tutorials-HTML ** Mariposa tutoriales de HTML
HTML Tutorials - Webreference.com HTML Tutoriales - Webreference.com
and y Dynamic HTML Lab - webreference.com HTML dinámico Lab -
webreference.com
** Index Dot HTML: THE Advanced HTML Reference ** Índice de punto
HTML: Referencia avanzada del HTML
The Web Developers Virtual Library: Introduction to Web Design : HTML
Los desarrolladores Web Biblioteca Virtual: Introducción al Diseño web :
HTML
The Compendium of HTML Elements El Compendio de elementos HTML
NetscapeWorld - Reader performance tips - April, May 1997
NetscapeWorld - Lector de consejos de rendimiento - Abril, mayo de
1997
CNET features - how to - HTML tips and tricks CNET características -
como - HTML consejos y trucos
An interactive introduction to HTML and CGI scripts on the WWW
(courseware Netscape) Una introducción interactiva a HTML y scripts CGI
en la WWW (Netscape cursos)
U.of Sask Computing Services Online Courses U.of Servicios Informáticos
SASK Cursos en Línea
Databases on the Web Bases de datos en la Web
The WDVL: Introduction to Databases for the Web El WDVL: Introducción
a Bases de Datos para la Web Selena Sol - very extensive tutorial on
databases in general - moves into web interfaces for databases as well
Selena Sol - muy extenso tutorial sobre bases de datos en general - se
mueve en interfaces web para bases de datos, así
BUILDER.COM - Web programming - put your database on the Web
BUILDER.COM - programación web - poner la base de datos en la Web
Perl scripting-build a Web database with free software scripting Perl
construir una base de datos Web con software libre Unix based Basados
en Unix
Note: All sites listed below were available as of January 12/99. Nota:
Todos los sitios mencionados a continuación están disponibles a partir de
enero 12/99. I am sorry if you find the links broken at a later time. Lo
siento si usted encuentra los enlaces rotos en un momento posterior.
Education Educación
**** Canada's SchoolNet **** Canadá de SchoolNet
** Wired Learning in the Classroom & Library ** con conexión de cable de
Aprendizaje en el Aula y Biblioteca
** Kathy Schrock's Guide for Educators - over 800 resources are linked **
Guía de Kathy Schrock para Educadores - más de 800 recursos están
vinculados
** WebTeacher ** WebTeacher this resource includes an internet tutorial,
extensive browser tutorial, and information on image, sound and movie
formats. este recurso incluye un tutorial de Internet, el navegador
extenso tutorial, e información sobre la imagen, el sonido y los formatos
de película.
Advisor's Guide-K-12 educ. Asesor de la Guía-K-12 educ. web sites los
sitios web
Saskatchewan Education | Community | Evergreen Educación
Saskatchewan | Comunidad | Evergreen this is the website where all our
Saskatchewan curricula are listed este es el sitio web donde figuran los
programas de Saskatchewan son todos nuestros
Web 66 Web 66
** Judi Harris' Network-Based Educational Activity Collection these are
web-based activities that students can become involved with - a
marvellous collection of things students can do with the web ** basadas
en red Judi Harris Educación actividad de recolección de estos se basan
las actividades de tela que los estudiantes puedan participar en las - una
maravillosa colección de cosas que los estudiantes pueden hacer con la
web
Canadian Youth Page Página de la Juventud de Canadá
Sunburst SchoolHouse - Links for Educators an extensive list of
educational resources which is like taking the lid off Pandora's box (so
many things to see, places to go) Sunburst SchoolHouse - Enlaces para la
enseñanza de una extensa lista de recursos educativos, que es como
sacar la tapa de la caja de Pandora (muchas cosas para ver, lugares a
donde ir)
Welcome to the CRADLEBOARD Teaching Project Bienvenidos al Proyecto
de Enseñanza de Coche de
A. Pintura: Art Detective Pintura A.: Detective de Arte
Maricopa Center for Learning and Instruction Maricopa Centro de
Aprendizaje y la Enseñanza and y Teaching and Learning on the WWW
Enseñanza y aprendizaje en la WWW by the same group. por el mismo
grupo. Check out their Echa un vistazo a su More Links Más Enlaces page
as well. página también.
Study WEB Estudio WEB
** Teaching Ideas ** Las ideas Enseñanza from the University of
Saskatchewan, College of Education More education links de la
Universidad de Saskatchewan, Facultad de Educación de la educación
Más enlaces from the College of Education de la Facultad de Educación
Webbie Awards - check the education category: Webbie Awards -
comprobar la categoría de educación: http://www.webbieworld.com/ww/
http://www.webbieworld.com/ww/
1999 Webby nominations for Education 1999 Webby nominaciones para
la Educación - this is another awards site with many categories. - Este es
otro sitio de premios con muchas categorías.
NASA Online Educational Resources NASA Recursos en la Red para la
Educación
Bellsouth Education Gateway Bellsouth Portal de Educación
Teachnet.Com Resources and Links Teachnet.Com Recursos y Enlaces
Teacher/Pathfinder Schoolhouse Maestro / Pathfinder Escuela
School Site Builders Escuela de Constructores de la web this site is
developed by Canada's Schoolnet to profile the best school sites in
Canada. este sitio es desarrollado por la Schoolnet Canadá para el perfil
de la escuela de los mejores sitios en Canadá. You might want to check
here for ideas. Es posible que desee comprobar aquí si hay ideas.
Learning Disabilities Online Problemas de aprendizaje en línea
Engines for Education Motores para la Educación - this is a hyperbook
written by Roger Schank and Chip Cleary about educational reform and
the part educational technology has to play in reform. - Este es un
hyperbook escrito por Roger Schank y Cleary Chip sobre la reforma
educativa y la tecnología educativa parte tiene que desempeñar en la
reforma.
The Annenberg CPB Projects Exhibits Collection This is a wonderful
collection of exhibits on various topics. El Annenberg CPB Proyectos
Exposiciones Colección Esta es una maravillosa colección de
exposiciones sobre diversos temas. The exhibits all utilize interactivity to
a great degree. Los objetos expuestos todos utilizan la interactividad en
gran medida.
Discovery Channel School This site is a wonderful resource
accompanying the Discovery Channel. Discovery Channel Escuela Este
sitio es un recurso maravilloso que acompaña al Discovery Channel.
There are features, theme weeks, web links, discussions, and lesson
plans. Hay características, semanas temáticas, enlaces web, discusiones
y planes de lecciones.

Online Resources - WebQuests Recursos en la Red - WebQuests


¥Tom March's suggestions fo r WebQuest design ¥ Tom marzo de
sugerencias para r diseño de WebQuest and notes on " Why use a
WebQuest ". This is a 'must read' for all serious WebQuest Designers. y
notas sobre " ¿Por qué utilizar una WebQuest ". Se trata de un" debe leer
"para todos los diseñadores graves WebQuest.
¥ Working the Web for Education ¥ Trabajo de la Web para la Educación
a collection of essays and information about Web Quests and
Filamentality web projects and The WebQuest Page una colección de
ensayos e información sobre misiones web y proyectos web y
Filamentality La página WebQuest
¥ Kathy Schrock's Guide for Educators ¥ Kathy Schrock Guía para
educadores is one of the best starting points for a teacher who is looking
for Internet resources. es uno de los mejores puntos de partida para un
maestro que está buscando recursos de Internet.
¥The American Library Association has a Librarian's Guide to Cyberspace
for Parents and Kids ¥ La Asociación Americana de Bibliotecas cuenta
con una Guía del bibliotecario al ciberespacio para padres y niños that
features some neat sites in the Kid's section. que cuenta con algunos
sitios interesantes en la sección de los Niños. You will probably want to
follow some of these links to see if you can narrow the topic before using
the resources in your Quest. Usted probablemente querrá seguir algunos
de estos enlaces para ver si puede limitar el tema antes de utilizar los
recursos en su búsqueda.
¥ Middleweb.com ¥ Middleweb.com has a large number of links. tiene un
gran número de enlaces. Most of them are professional development
sites, although there is a General Resources section which is a rich
source of links for your lesson. La mayoría de ellos son el desarrollo de
sitios profesionales, aunque hay una sección de Recursos Generales, que
es una rica fuente de enlaces para su lección.
¥The Busy Teachers' Web site ¥ El 'Maestros del sitio Web de
disponibilidad also features a large number of resources. También cuenta
con un gran número de recursos.
¥ Links for K12 Teachers ¥ Enlaces para K12 Maestros on the Memphis
City Schools server has a large number of resources, including most of
those in this list of resources en el servidor de Escuelas de la Ciudad de
Memphis tiene una gran cantidad de recursos, incluyendo la mayoría de
los de esta lista de recursos
¥ A Catalog of a Catalog of Web Sites for teachers ¥ Un catálogo de un
catálogo de sitios web para docentes provides short list of starting points
for exploration broken down by subject matter discipline. proporciona
lista corta de puntos de partida para la exploración según las
asignaturas materia.
¥ Needle in A CyberStack ¥ Una aguja en un CyberStack contains There
are currently 83 interlinked pages including Safe Surfing Sites, Books &
Book Reviews, 24 alphabetized Business and Career Tools Pages, the
Best of Curriculum, 24 alphabetized Medical and Scholarly Research
Pages, Reference, Law & Justice, Cybrarians' Favorites, Intelligence &
Security, Law Enforcement, Exploring, What's Cool, Fun, People Finders,
News Sources, etc. contiene este momento hay 83 páginas
interconectadas incluyendo seguro Sitios de Surf, libros y reseñas de
libros, 24 en orden alfabético de Negocios y Herramientas Páginas
carrera, el mejor de Plan de Estudios, 24 por orden alfabético médicos y
de investigación académica páginas, de referencia, Ley y Justicia,
"Favoritos Cybrarians, Inteligencia y Seguridad, Aplicación de la ley,
Exploración, ¿Cuál es fresco, diversión, buscadores de personas, fuentes
de noticias, etc
¥ Filamentality ¥ Filamentality is a fill-in-the-blank interactive Web site
that guides you through picking a topic, searching the Web, gathering
good Internet sites, and turning Web resources into activities appropriate
for learners. es un relleno en el espacio en blanco el sitio Web interactivo
que le guía a través de escoger un tema, buscar en la web, la
recopilación de Internet de sitios buenos, y convertir los recursos de
Internet en las actividades apropiadas para los aprendices. So it helps
you combine the Filaments of the Web with a learner's mentality (get
it?). Por lo tanto, le ayuda a combinar los filamentos de la red con
alumnos de una mentalidad (lo entiendo?). Support is built in through
Mentality Tips, so you'll be guided right along the way and end up with a
Web-based activity you can share with others even if you don't know
anything about HTML, Web servers, or all that www-dot stuff. Apoyo se
construye a través de mentalidad Consejos, por lo que se le guiará a la
derecha por el camino y terminar con una actividad basada en Web que
puede compartir con otras personas, aunque no sé nada de HTML,
servidores Web, o que todas las www -dot cosas.
¥ Region 20 Education Service Center ¥ Región 20 Centro de Servicios
Educativos has examples of different projects created by participants in
Region. con ejemplos de diferentes proyectos creados por los
participantes en la Región. They are divided according to the approach
chosen. Se dividen de acuerdo con el enfoque elegido. For example,
webquests appear under "Activity Formats" while Collaborative Problem-
Solving projects appear under "Activity Structures." Por ejemplo,
encuestas en la red aparecen en "Formatos de actividad", mientras que
los problemas en colaboración proyectos de resolución de aparecer en
"Estructuras de la actividad."
¥ Spartenburg District 3 County Schools ¥ Distrito Spartenburg 3
Escuelas del Condado has lots of information on constructing WebQuests
and a listing of about 100 examples appropriate for K-5 classrooms. tiene
un montón de información sobre las WebQuests construcción y una lista
de cerca de 100 ejemplos apropiados para K-5 aulas.
¥ WebQuests in Earth Science is a collection of WebQuests, lesson plans
and many web-based resources. ¥ WebQuests en Ciencias de la Tierra es
una colección de WebQuests, planes de lecciones y muchos recursos,
basado en web.
¥A matrix ¥ Una matriz of examples. de ejemplos.
¥Some suggestions for ¥ Algunas sugerencias para evaluating
WebQuests . evaluar WebQuests .
¥Finally a ¥ Por último, un collection of WebQuests colección de
WebQuests created in various settings, mostly university courses and
workshops. creado en diversos ámbitos, sobre todo los cursos
universitarios y talleres.
¥Corrina Perrone, David Clark, and Alexander Repenning. ¥ Perrone
Corrina, David Clark, y Repenning Alexander. Substantiating Education
in Edutainment through Interactive Learning Games. Probatorias de la
Educación en Edutainment a través de juegos interactivos de
aprendizaje. This paper presents WebQuest, a system combining the
WWW with the notion of an interactive quest game. En este trabajo se
presenta la WebQuest, un sistema que combina la WWW con la idea de
un juego de búsqueda interactivo. Instead of just creating their own
homepages, that may be interesting to other students for only social
reasons, students turn into authors of their own interactive quest games.
En lugar de simplemente crear sus propias páginas web, que puede ser
interesante para los otros estudiantes por sólo razones sociales, los
estudiantes se convierten en autores de su propia búsqueda de juegos
interactivos.

Online testing Quiz tools Las pruebas en línea Quiz herramientas


Ed Tech Tools Ed Tecnología Herramientas
QuizPlease Home Page - Create quizzes and tests for the Internet -
Education - Software QuizPlease Inicio - Crear pruebas y exámenes para
Internet - Educación - Software
the NODE: web assessment el NODO: evaluación web
Distance Education Educación a Distancia
Digital Trainer Professional - CBT - Computer Based Training - Internet
Training - Multimedia Entrenador digital profesional - CBT - Computer
Based Training - Formación de Internet - Multimedia
Web Based Instruction Instrucción basada en la Web
Online Courses Cursos en Línea
Using Instructional Design Principles To Amplify Learning On The WWW
Uso de Principios de diseño instruccional para amplificar el aprendizaje
en la WWW
Instructional Development and Technology Sites Worldwide Desarrollo de
Instrucción y Tecnología Sitios en todo el mundo

Language Arts,English,Writing Artes del Lenguaje, Inglés, Escritura


Strunk, William. Strunk, William. 1918. 1918. The Elements of Style. Los
elementos del estilo.
Reference Referencia
The Internet Public Library La Internet Public Library
¥ This symbol preceding indicates that the resource was documented by
Dr. Len Proctor, Department of Curriculum Studies, College of Education,
University of Saskatchewan. ¥ Este símbolo anterior indica que el recurso
fue documentado por el Dr. Len Proctor, del Departamento de Estudios
Plan de Estudios de la Facultad de Educación de la Universidad de
Saskatchewan. I am grateful he was willing to share these resources with
me so I could pass them on to you. Estoy agradecido que estaba
dispuesto a compartir estos recursos con mí, así que podría pasar a
usted.
Movido / Nueva
Website Design Tips For Professional Sites Consejos de Diseño
Web para Sitios de profesionales
Webpage Design Rules from Professional Webmasters Diseño de página web
Reglas de Webmasters Profesionales
Sidebar: Valuable info from Axandra Newsletter 10 March 2009 - Issue #359 (copyright info at
bottom) Recuadro: Valiosa información de Axandra Boletín 10 de marzo 2009 - Edición N º 359
(información de copyright en la parte inferior)
Very important Tips IMHO ! Muy importante en mi humilde opinión Consejos!
If you do it correctly, your website will be attractive to both web surfers and search engine spiders. Si
lo haces correctamente, su sitio será atractivo para los internautas y los motores de búsqueda. The
following list shows nine factors that can improve the usability of your website as well as your search
engine rankings. La siguiente lista muestra los nueve factores que pueden mejorar la usabilidad de su
sitio web, así como su posicionamiento en los buscadores.
1. 1. You should have fast loading web pages Usted debe tener rápida carga de páginas
web
Usability: Web surfers don't want to wait for web pages. Usabilidad: los internautas no
quieren esperar a que las páginas web.

Search engine optimization: Search engines can index your web pages more easily.
optimización de motores de búsqueda: Los motores de búsqueda puede su índice de
páginas web con mayor facilidad.

2. 2. Your web pages should be easy to read Sus páginas web deben ser fáciles de leer
Usability: It's easier for web surfers to read your web pages. Usabilidad: Es más fácil para
los internautas a leer sus páginas web.

Search engine optimization: Near-white text on a white background and tiny text is
considered spam by most search engines. optimización de motores de búsqueda: Cerca
de texto en blanco sobre un fondo blanco y texto pequeño es considerado spam por los
motores de búsqueda más.

3. 3. The contents of your web pages should be clearly arranged El contenido de las
páginas web que usted debe estar claramente dispuestos
Usability: Clear headings, paragraphs and bullet lists make your web pages easier to
read. Usabilidad: líneas claras, párrafos y listas con viñetas que las páginas web más fácil
de leer.

Search engine optimization: Clear headings, paragraphs and bullet lists make it easier for
search engines to find the topic of your web pages. optimización de motores de
búsqueda: Borrar las partidas, párrafos y listas con viñetas que sea más fácil para los
motores de búsqueda para encontrar el tema de la web, sus páginas.

4. 4. Your web page images should use the IMG ALT attribute Sus imágenes de la página
web, debe utilizar el atributo ALT IMG
Usability: Web surfers with images turned off and visually impaired visitors will be able to
see the content of your images. Usabilidad: los internautas con las imágenes
desactivadas y visualmente a los visitantes afectada podrá ver el contenido de sus
imágenes.

Search engine optimization: Search engines cannot index the content of your images but
they can index the content of the IMG ALT attribute. optimización de motores de
búsqueda: Los motores de búsqueda no pueden indexar el contenido de sus imágenes,
sino que puede indexar el contenido del atributo ALT IMG.

5. 5. You should use custom 404 not found error pages Usted debe utilizar 404
personalizada que no se encuentran páginas de error
Usability: If your 404 not found page contains links to other pages of your website or a
search form then people might remain on your website. Usabilidad: Si el 404 que se
encuentran página no contiene enlaces a otras páginas de su sitio web o un formulario de
búsqueda entonces la gente podría permanecer en su sitio web.

Search engine optimization: Proper 404 error pages make sure that search engines index
the right pages of your website. optimización de motores de búsqueda: 404 páginas de
error apropiado asegurarse de que motores de búsqueda indexan las páginas de la
derecha de su sitio web.

6. 6. Your website should be easy to navigate Su sitio web debe ser fácil de navegar
Usability: Clear and concise navigation links that are easy to find help your website
visitors to find content on your site. Usabilidad: Claro y conciso de navegación que son
fáciles de encontrar ayuda a sus visitantes web para ver el contenido de su sitio.

Search engine optimization: Clear and concise navigation links that contain your
keywords make it easy for search engines to index all of your web pages. optimización de
motores de búsqueda: concisa de navegación y claro que contengan las palabras clave
que sea fácil para los motores de búsqueda para indexar todas las páginas web de su.

7. 7. Important content is above the fold Importante contenido está por encima de la tapa

Usability: Web surfers with small computer screens can quickly see what your web page
is about. Usabilidad: los internautas con pantallas de pequeño ordenador puede ver
rápidamente lo que su página web se trata.

Search engine optimization: The sooner your important content appears in the HTML
code of your web pages, the more likely it is that it will be indexed by search engines.
optimización de motores de búsqueda: Cuanto antes el contenido importante aparece en
el código HTML de las páginas web, tu, lo más probable es que será indexado por los
motores de búsqueda.

8. 8. Your web page titles are explanatory Los títulos de su página web se explica por
Usability: If web surfers bookmark your web pages, a clear web page title will help them
to find it again. Usabilidad: Si los internautas marcar sus páginas web, un título de la
página web, claro les ayudará a encontrar de nuevo.

Search engine optimization: The web page title is one of the most important SEO
elements. optimización de motores de búsqueda: El título de la página web, es uno de los
elementos más importantes de SEO. It should contain your keywords and it should look
attractive so that web surfers click on it when they see your web page title in the search
results. Debe contener las palabras clave y que deben de ser atractivas para que los
usuarios de Internet, haga clic en él cuando vea a su título de la página web en los
resultados de búsqueda.
9. 9. The URLs of your web pages are meaningful and self-explanatory La URL de las
páginas web son el sentido y explica por sí mismo
Usability: It's much easier to remember a web page like www.example.com/support than
a web page like www.example.com/123123-werwc.php?2342234. Usabilidad: Es mucho
más fácil de recordar una página web como www.example.com / apoyo de una página
web como www.example.com/123123-werwc.php?2342234.

Search engine optimization: If your URLs contain your keywords, this can have a positive
effect on your search engine rankings. optimización de motores de búsqueda: Si sus URL
contienen sus palabras clave, esto puede tener un efecto positivo en su motor de
búsqueda ranking. Dynamic URLs with many variables can lead to problems with search
engine spiders. URL dinámico con muchas variables puede conducir a problemas con los
motores de búsqueda.

Copyright Axandra.com - Web site promotion software Copyright Axandra.com - sitio web de
promoción de software
These are Design Rules for professional web sites and/or professional webmasters. Estas son las
normas de diseño de sitios web profesionales y / o webmasters profesionales. This questionnaire allows
the designer to grade / score / rate a web site - to check the webpage design against a 'subjective' set of
web design rules. Este cuestionario permite al diseñador de grado / puntuación / tasa de un sitio web -
para comprobar el diseño de páginas web en contra de una "subjetiva" conjunto de reglas de diseño
web. The questionnaire contains 'brief' tips / rules that are used by professional web page designers. El
cuestionario contiene "breves" consejos / reglas que son utilizados por profesionales diseñadores de
páginas web. Most of these design rules were found on webmaster design sites, educational sites and a
popular webmaster newsgroup (alt.www.webmaster). La mayoría de estas reglas de diseño se
encuentran en sitios de diseño webmaster, sitios educativos y un grupo de noticias para webmasters
populares (alt.www.webmaster). These are basic design rules for a Professional Business or
Organization web sites (NOT for Personal, Game, Entertainment sites). Estas son las reglas básicas de
diseño de un negocio profesional o de los sitios web de la Organización (NO de personal, juegos, sitios
de entretenimiento).
Good webmasters usually think a lot like a web developer and a little like a web designer. Buena
webmasters suelen pensar mucho a un desarrollador web, y algo como un diseñador de páginas web.
Therefore, these rules 'lean' a little more toward the web developer - than the web designer. Por lo
tanto, estas normas "magra" un poco más hacia el desarrollador web - que el diseñador de páginas web.
Most professional sites rate 'content' as main objections - and - 'looks' as secondary objective. La
mayoría de los sitios profesionales "contenido" índice de las objeciones principales - y - "mira", como
objetivo secundario. Refer to this write up about The Web Designer vs. Web Developer to better
understand the difference in web designer and web developer. Consulte este escribir sobre el Diseñador
de Web vs Web Developer para entender mejor la diferencia en el diseño web y desarrollo web.
For the 'design rules grade', either agree, disagree or ignore the tip/rule ie True, False, NA (No
Answer). To obtain an accurate score of your 'professional' design ability, supply an (True) or (no)
answer for all questions - even if the 'question' does not currently apply to the web site. Para el "diseño
de grado normas, ya sea de acuerdo, en desacuerdo o ignorar la punta / regla es decir, verdadero, falso,
NA (Sin respuesta). Para obtener una calificación exacta de su profesional de la 'capacidad de diseño,
suministro de un (verdadero) o no (no ) para responder todas las preguntas - incluso si el "asunto" no se
aplica actualmente al sitio web.
Basic Design Rules / Tips: Reglas básicas de diseño / Consejos:
You have about 10-15 seconds to make your first impression. Tiene alrededor de 10-15
segundos para hacer su primera impresión. Therefore, the first screen should display useful info in
about 10 seconds (at 56k). Por lo tanto, la primera pantalla debe mostrar información útil en unos 10
segundos (a 56k). (and all text must be loaded in less than 30 seconds at 28K) (Y todo el texto se debe
cargar en menos de 30 segundos a 28K)
True Verdadero False Falsos NA NA

KISS (Keep It Simple, Stupid). KISS (Keep It Simple Estúpido,). In other words,
content is much more important than a jazzy or fancy layout. En otras palabras, el contenido es mucho
más importante que un diseño de jazz o de lujo. Keep the design simple so the visitor is not distracted.
Mantenga el diseño simple para que el visitante no se distrae.
True Verdadero False Falsos NA NA
Footnote: The first two rules are often ignored by large companies because they know that people will
wait for their site to load. Nota al pie: Las dos primeras reglas son a menudo ignorados por las grandes
empresas porque saben que la gente espere a que su página se cargue. It is called 'Name Recognition'
and only sites like CBS, MSN, Disney, etc can get away with the slow 'fancy' sites. Se llama
"reconocimiento de nombre y sólo los sitios como CBS, MSN, Disney, etc pueden salirse con la lenta
'de lujo' los sitios. If you try it - then you better be famous or your visitors will leave before all your
'fancy stuff' loads :) Si usted lo intenta - entonces es mejor que ser famoso o sus visitantes dejarán antes
de todos los 'fantasía' carga el material:)

Clean, crisp professional looking graphics (less than 30k-50k per image ... total image
size for page should be less than 80k). Limpia y nítida de gráficos de aspecto profesional (menos de
30k-50k por imagen ... la imagen a tamaño total de la página debe ser inferior a 80k).
True Verdadero False Falsos NA NA

Simple and consistent navigation (on all pages). Simple y navegación consistente (en
todas las páginas).
True Verdadero False Falsos NA NA
No frames or fancy formatting tricks. No hay marcos o hacer algunos trucos de formato.
Use tables and CSS (However, limit the CSS to basic features until ALL browser provide better CSS
support). Usar tablas y CSS (sin embargo, limitar el CSS de las funciones básicas del navegador hasta
que TODOS ofrecer un mejor soporte CSS).
True Verdadero False Falsos NA NA

Text is visible while graphics are loading (VIP: use the height, width and alt attribute for
img tags). El texto es visible, mientras que los gráficos son de carga (VIP: el uso de la altura, anchura y
el atributo alt para las etiquetas img).
True Verdadero False Falsos NA NA

Search engine ready - Each page has proper meta keywords and meta description (Note:
SOME search engines still use keywords and ever link counts :) lista de motores de búsqueda - Cada
página tiene palabras clave adecuadas meta y la descripción del meta (Nota: algunos motores de
búsqueda siguen utilizando palabras clave y cada vez el conteo de enlaces:)
True Verdadero False Falsos NA NA

Visually appealing - uncluttered and professional looking. Visualmente atractivo -


ordenada y con aspecto profesional. A few examples are.... Algunos ejemplos son .... Do not use a large
number of bright colors. No utilice un gran número de colores brillantes. Do not vary the font size,
color, face, style from section to section. No variar el tamaño de fuente, color, tipo, estilo de una
sección a otra. Use professional artwork for a logo (not just common clip art). Uso profesional de obras
de arte de un logotipo (no sólo imágenes prediseñadas común).
True Verdadero False Falsos NA NA

Clear indication of site purpose, products and/or services (and opening section or
heading on each page must clearly indicate the page content and/or purpose). Indicación clara del
propósito del sitio, productos y / o servicios (y la sección de apertura o de la partida en cada página
debe indicar claramente el contenido de la página y / o finalidad).
True Verdadero False Falsos NA NA

No splash pages or excessive animation (They just distract from content). No hay
páginas de bienvenida o una animación excesiva (Sólo distraer la atención de contenido).
True Verdadero False Falsos NA NA
Additional Rules: Reglas adicionales:

Appropriate and meaningful domain name. Correcta y el nombre de dominio


significativo.
True Verdadero False Falsos NA NA

Important (critical) information is .. Importante (crítico) la información es .. above the


fold .. encima de la tapa .. (top 600). (Arriba 600).
True Verdadero False Falsos NA NA

Backgrounds should not be so loud and so busy that the text is difficult to read. Fondos
no debe ser tan fuerte y activa para que el texto es difícil de leer.
True Verdadero False Falsos NA NA

Associated background and foreground colors show good contrast. colores de fondo y
primer plano asociados muestran un buen contraste. However, Do NOT use dark background and light
colored text (because the page can not be printed). Sin embargo, NO utilice el fondo oscuro y texto de
color claro (porque la página no se puede imprimir). (dark background/light text is normally just for
personal pages). (Fondo oscuro / texto claro es normalmente sólo para páginas personales).
True Verdadero False Falsos NA NA
Web pages look acceptable in major browsers (ie, Internet Explorer, Netscape, AOL and
Opera). páginas Web de aspecto aceptable en los principales navegadores (Internet Explorer, Netscape,
AOL y Opera).
True Verdadero False Falsos NA NA

Web pages look acceptable in the two most common screen resolution (ie, 800x600 and
1024 x 768). páginas Web de aspecto aceptable en la resolución de pantalla dos más comunes (es decir,
800x600 y 1024 x 768).
True Verdadero False Falsos NA NA

Important pages are no more than 1 or 2 clicks from the homepage. Las páginas
importantes no son más que 1 o 2 clics de la página principal.
True Verdadero False Falsos NA NA

Images are optimized to minimize file size ie images are web page ready not printer
ready. Las imágenes se han optimizado para reducir al mínimo el tamaño de archivo de imágenes es
decir, son la página web no está listo impresora lista.
True Verdadero False Falsos NA NA

Verify all HTML with one of the HTML checkers. Compruebe todo el HTML con una
de las fichas HTML.
True Verdadero False Falsos NA NA
The site has contact info including company logo, name, address, phone, email, etc. El
sitio tiene información de contacto incluyendo logotipo de la empresa, nombre, dirección, teléfono,
correo electrónico, etc
True Verdadero False Falsos NA NA

Each page should contain the date that page was last updated. Cada página debe
contener la fecha en que la página fue actualizada por última vez.
True Verdadero False Falsos NA NA

Copyright information on each web page. Información sobre propiedad intelectual en


cada página web.
True Verdadero False Falsos NA NA

Do Not use pop-ups without warning visitor (BTW: most visitors close them
immediately). No utilice ventanas emergentes sin advertencia visitante (por cierto: la mayoría de los
visitantes a cerrar de inmediato).
True Verdadero False Falsos NA NA

Never indicate that the site is Under Construction (all good sites change constantly).
Nunca indican que el sitio está en construcción (todos los buenos sitios cambian constantemente).
True Verdadero False Falsos NA NA
Link colors and underline should be basic (underlined / blue text is typical). colores de
los enlaces y subrayar debe ser básico (subrayado / texto en azul es típico). And in all cases, the
underline tag should never be used where it may be mistaken for a link. Y en todos los casos, el
subrayado de etiquetas nunca deben usarse en las que puede confundirse con un vínculo.
True Verdadero False Falsos NA NA

Never use the MARQUEE or the Blink tags. Nunca utilice el recuadro o las etiquetas de
Blink.
True Verdadero False Falsos NA NA

Animated Cursors, trailing images (other fancy java, etc) are for personal pages - not
professional pages. Los cursores animados, imágenes finales (java de lujo otros, etc) son las páginas
personales - no en páginas de profesionales.
True Verdadero False Falsos NA NA

Do Not Hijack the status bar or display messages in the status bar. No Hijack los
mensajes de la barra de estado o mostrar en la barra de estado. It is rude and crashes some browsers. Es
de mala educación y los accidentes algunos navegadores.
True Verdadero False Falsos NA NA

Do Not use a page counter (tacky). No utilice un contador de páginas (pegajoso). Use an
invisible statistic script that provides details / info that is useful. Utilice una secuencia de comandos
invisibles estadística que proporciona los detalles / información que es útil.
True Verdadero False Falsos NA NA
Avoid Deceptive Advertising - This disturbing trend has arisen in recent years: banner
ads that try to deceive the user into clicking them .... Evite engañosas de publicidad - Esta inquietante
tendencia ha surgido en los últimos años: los anuncios de banner que intentan engañar al usuario a
hacer clic en ellos .... by appearing to be a part of the web site or operating system interface. dando la
impresión de ser una parte del sitio web o la interfaz del sistema operativo.
True Verdadero False Falsos NA NA
Rules for Some Sites (Please Answer): Reglas para algunos sitios de Internet (Por favor,
respuesta):

Site map is provided for larger site (more than 10-12 pages). Mapa de la web se
proporciona para mayor sitio (más de 10-12 páginas).
True Verdadero False Falsos NA NA

Site search tool is provided for larger site (more than 10-15 pages). herramienta de
búsqueda del sitio se proporcionan para los más grandes del sitio (más de 10-15 páginas).
True Verdadero False Falsos NA NA

Do Not use a Tell-A-Friend site JUST to promote your site. No use un Dile a un Amigo
sitio sólo para promover su sitio. Tell-A-Friend pages should allow visitors to share helpful information
with friends. Dile a páginas a un amigo debe permitir a los visitantes a compartir información útil con
los amigos. For example, a How-To-Page, a Recipe, a Support Site, etc, etc Por ejemplo, un How-To-
Page, una receta, un sitio de soporte, etc, etc
True Verdadero False Falsos NA NA

If site requires more than a few images, provide thumbnails that link to the large images.
Si el sitio requiere algo más que unas pocas imágenes, proporcionan imágenes en miniatura que
enlazan con las imágenes de gran tamaño. Do Not just resize an image with the width and height
attributes. No sólo el tamaño de una imagen con los atributos de anchura y altura. A real thumbnail is a
separate image that loads fast ... Una miniatura real es una imagen separada tan rápido carga ... It is
small in both physical size and small in file size (<5k). Es pequeño en tamaño físico y pequeños en
tamaño de archivo (<5k).
True Verdadero False Falsos NA NA

In some cases, site should have appropriate warning about the content (especially if it is
an adult site). En algunos casos, el sitio debe tener advertencia adecuada sobre el contenido (sobre todo
si se trata de un sitio para adultos).
True Verdadero False Falsos NA NA

Provide an explicit warning when linking to non-HTML files (or files that require a
plug-in). Advertir de forma explícita al vincular a los archivos no HTML (o archivos que requieren un
plug-in).
True Verdadero False Falsos NA NA

If you MUST use image maps they should be very small (load fast). Si tiene que usar los
mapas de imagen deben ser muy pequeños (carga rápida). And alternate links Must be provided. Y los
enlaces alternativos debe ser proporcionado.
True Verdadero False Falsos NA NA

If you MUST use music, do Not set background music or sound to auto-play. Si usted
debe usar la música, no ponga música de fondo o de sonido para auto-play. Give visitor the choice after
indicating the file size (or loading time), type of music (midi, real, etc), plug-in requirements (if
applicable), etc Dar visitante la elección después de que indica el tamaño del archivo (o tiempo de
carga), el tipo de música (midi, inmuebles, etc), plug-in de los requisitos (si procede), etc
True Verdadero False Falsos NA NA
Do not use a guest book or message board unless it is really essential. No utilice un libro
de visitas o de ésta a menos que sea realmente esencial. It looks bad to have an empty guest book. Se
ve mal tener un libro de visitas vacío.
True Verdadero False Falsos NA NA
Puntuación Restablecer

Você também pode gostar