Manual y guías para la administración

y uso del sitio web.

2
Manual y guías
Bienvenidos al Manual para la administración y gestión del sitio. Este pretende ser una guía para el uso de la plataforma, su administración y gestión. Se trata de una serie
de documentos y presentaciones que buscan dar asistencia a las personas que utilizan el sistema. Estos documentos están redactados en un lenguaje “coloquial” sin des-
cuidar los conceptos técnicos explicados en la sección Glosario.

En este sentido, esta sección está dividida en 6 secciones donde en cada una se trata de forma específica las distintas funcionalidades de los sitios agregando al final un
glosario para aclarar algunos conceptos.

El mismo ha sido desarrollado por el equipo de Diseño y Desarrollo de la Unidad de Comunicación de la Universidad de la República (UCUR).
 Índice
3

Introducción - página 6

página 6 - Sistema de gestión de contenidos

página 6 - Por qué ese sistema
página 8 - Uso del manual
página 9 - En caso de problemas

Escritorio - página 10

página 10 - El Escritorio en partes

Administrar Noticias - página 11

página 11 - Publicar una noticia

página 12 - El editor de páginas y noticias
página 14 - Espacio noticias
página 15 - Estado y visibilidad de una página o noticia

Administrar Paginas - página 16

página 16 - Espacio de Páginas

página 17 - El editor de páginas y noticias
 página 17 - Crear una página
4 página 18 - Estado y visibilidad de una página o noticia

Editar textos - página 19

página 19 - Insertar Imagen

página 21 - Insertar Enlace
página 23 - Insertar Tabla
página 24 - Insertar un Video
página 25 - Pegar texto sin formato
página 26 - Insertar una cita
página 27 - Atajos de teclado

Administración y edición - página 29

página 29 - Administrar menús

página 31 - Administrar banners
página 33 - Librería Multimedia

Accesibilidad - página 34

página 34 - Por qué Accesibilidad

página 35 - Mitos sobre la accesibilidad
página 36 - Uso de imágenes
 página 37 - Audio y video
5 página 38 - Estructura de encabezados
página 39 - Navegación
página 39 - Buenas formas

página 40 - Crear PDFs accesibles

página 40 - Uso de tablas
página 40 - Web semántica
página 40 - Otros idiomas
página 41 - Abrir en ventana nueva
página 41 - Ventanas emergentes
página 41 - Uso de las mayúsculas sostenidas
página 42 - Texto justificado
página 42 - Menús desmenuzados
página 43 - Cómo se lee
página 43 - Animaciones
página 43 - Manténgalo actualizado
página 44 - Escribir para la web

Glosario - página 45
 índice

Introducción
6

Sistema de gestión de contenidos

El sistema de gestión de contenido o CMS (por sus siglas en inglés, Content Management System) que se utiliza es WordPress. Desarrollado
en PHP para entornos que ejecuten MySQL y Apache, bajo licencia GPL y código modificable. WordPress nació del deseo de construir un
sistema de publicación personal, elegante y con una buena arquitectura («Código es poesía»). Basado en PHP, MySQL y con licencia GPL,
WordPress pone especial atención a la estética, estándares web y usabilidad.

Por qué usamos WordPress

WordPress es una poderosa herramienta para crear y gestionar sitios en la web. Permite la publicación de contenidos de una
forma fácil a través de una serie de funcioalidades diseñadas para hacer tan fácil, placentera y atractiva como sea po-
sible la experiencia de publicar en Internet. De esta forma, se trata de un sistema de publicación personal
distribuido libremente, basado en estándares web, rápido, ligero y gratis; con una configuración y
características muy bien pensadas, y un núcleo extremadamente personalizable.

Las características más destacadas de WordPress son:

• Aplicación de Libre Distribución (GPL).

Se puede utilizar y modificar de forma gratuita.

• Creación de contenidos.

Admite proteger la lectura de un artículo con una contraseña; crear un artículo y que se pu-
blique al llegar una fecha; vista previa de artículos sin necesidad de publicarlo; subir e insertar
imágenes propias y miniaturas; subir y enlazar distintos tipos de archivos (pdf, zip, doc, etc);
organizar los artículos en categorías o secciones; gestionar borradores de artículos que se pueden
guardar para retomarlos más adelante y publicarlos cuando se estime conveniente, etcétera.
 índice

• Archivo histórico.
7 Muestra de forma organizada en el tiempo los artículos anteriores.

• El que busca encuentra.

Integra una herramienta de búsqueda que permite a los visitantes buscar en todo el sitio por un término que se introduce como dato.

• No importa dónde se instale.

WordPress fue diseñado para ser instalado en su servidor web (no importando si es dedicado o compartido), y le otorga poder absoluto de
su bitácora. A diferencia de los servicios de bitácora externos, puede estar seguro que será capaz de acceder y modificar cualquier aspecto
de su bitácora, en caso de que lo necesite. WordPress también puede ser instalado en su computador, o incluso en una Intranet.

• Núcleo Flexible.

Puede elegir tener el conjunto de archivos de WordPress, que es la trastienda de lo que muestra su bitácora, en el mismo directorio de éste
o en un directorio diferente. Por ejemplo, puede desear que su bitácora se muestre en http://ejemplo.com (o el directorio public_html cuan-
do se accede por FTP), y desea almacenar los archivos relacionados con WordPress en http://example.com/wordpress (public_html/word-
press).

• Todas las fechas son UTC.

Permite fijar la hora como diferencia del Tiempo Universal Coordinado, para que así todos los elementos relacionados con el tiempo (hora
y fecha de los comentarios, por ejemplo) sean guardados con la hora GMT, que es un estándar universal. Entre algunas ventajas, esto ayu-
da a mostrar la hora correcta en su bitácora, incluso si el servidor donde está su sitio se encuentra ubicado en otra zona horaria.

• Administración de usuarios.

Para limitar el acceso a partes sensibles, usa el sistema de niveles de usuario; por lo que puede restringir la capacidad de usuarios indivi-
duales de crear o modificar contenido de su bitácora, cambiando sus niveles de usuario.

• Perfiles de usuario.

Cada usuario registrado de su bitácora puede definir un perfil, con detalles como su dirección de correo electrónico, cuentas de mensajería
instantánea, etcétera, si ellos desean hacerlo público. Los usuarios también pueden controlar la forma en que su información es mostrada
en la bitácora.

• Fácil instalación y actualización.

La famosa instalación de WordPress, que dura 5 minutos, no puede ser derrotada por su simplicidad y facilidad de uso. Actualizar su bitá-
 índice

cora a la última versión también es sencillo, y debería tomarle menos tiempo que la instalación.
8 • Generación dinámica de páginas.

No es necesario reconstruir todas sus páginas cada vez que actualiza su bitácora, o cambia algún detalle de la misma. Todas las páginas son
generadas al utilizar la base de datos y las plantillas cada vez que su bitácora es solicitada por un visor. Esto significa que actualizar su bi-
tácora, o su diseño es tan rápido como sea posible, y el espacio de almacenamiento requerido en el servidor es mínimo.

• Links permanentes libres de estorbos.

Las direcciones para todas las páginas del sitio pueden estar de acuerdo a un estándar libre de estorbos; y todos los vínculos entre páginas
son cambiados automáticamente y de forma transparente, y de una forma entendible tanto para humanos como para máquinas (incluyendo
motores de búsqueda). Direcciones limpias son esenciales para la optimización de resultados en los motores de búsqueda, y para la como-
didad del lector.

• Carga de archivos/imágenes.

Puede cargar (subir) archivos e imágenes, y vincularlos a sus artículos o colocarlos en ellos.

Uso del manual

Cada sección de este manual abarca una temática diferente aunque en muchos casos las formas y métodos se repiten.

Dentro de cada sección nos encontraremos con una introducción y luego una serie de títulos seguidos por una flecha, estos son botones que al
hacerles clic se despliegan mostrado la información requerida.

Cada uno de estas subsecciones se encarga de presentar un punto específico: un procedimiento, una sección, etcétera.

La mayoría de estos se estructuran en una introducción y una imagen interactiva, para activar esta imagen debemos hacer clic en el botón
“Mostrar guías”, este mostrara una serie de marcas sobre la imagen que, cuando colocamos el puntero del mouse sobre ellas, despliegan una
explicación sobre la región de la imagen donde se ubica.
 índice

En caso de problemas que no están en este manual

9
Accedes como cada día a tu web y te encuentras con un minimalista, relajante, celestial y prístino blanco por toda la pantalla.

Tras unos segundos de relajación ante tanta pureza de estilo y contenido, sin logos ni colores estridentes, por supuesto sin faltas de ortografía,
empiezas a sentir cierta desazón, quizás desasosiego, hasta pánico…
“¿Donde está mi web, que ha pasado con mis colores y titulares impactantes? ¿por qué mi sitio no me ama?”
A lo que nosotros te contestaríamos ¿por qué no amas tu a tu sitio?

Luego simplemente contáctanos:

Portal - Unidad de Comunicación

Universidad de la República
Avenida 18 de Julio 1824, Subsuelo (sobre Eduardo Acevedo)
Tel.: (598) 2408 2906, 2408 5714
Correo electrónico: portal@universidad.edu.uy
Montevideo - Uruguay

Recomendamos leer este manual no sólo para aprender el funcionamiento del gestor de contenidos, sino porque en
este también se incluyen consejos, atajos, etcétera que hacen más funcional al sitio así como más dinámica
la gestión y administración de contenidos.
 índice

El Escritorio
10

En el escritorio (primera pantalla que se ve tras iniciar se-

sión) se muestra información acerca de la actividad reciente
en el sitio web, así como avisos de actualizaciones o informa-
ción relevante de la comunidad WordPress.

El menú para navegar en el panel de administración se en-

cuentra en la parte izquierda de la pantalla. Es un menú de u
navegación intuitivo y flexible, permitiendo llegar a todas las
funciones con pocos clics.
u

u
El Escritorio en partes
El Escritorio es un espacio para acceder rápidamente a las u
áreas más utilizadas de administración del sitio. Este espacio
presenta la información en bloques llamados módulos.

Cada usuario, en función de sus tareas y de las especificida- Permite gestionar las noticias del gestor de contenidos de UCUR.
des de su sitio, verá una serie de módulos parecidos a los de u
la imagen. Se encuentran todos los archivos que subidos y listados en la Librería
u Multimedia. Las subidas más recientes se encuentran listadas primero.

Las páginas son similares a los artículos en que tienen un título, cuer-
po y metadatos asociados. Son diferentes en que no son parte de la
corriente cronológica del blog, siendo una especie de artículos perma-
u nentes. Las páginas no están categorizadas o etiquetadas, pero pueden
tener jerarquía. Se puede anidar páginas bajo otras páginas haciendo
que una sea “Padre” de otra, creando así grupos de páginas.

Contiene información sobre ti (tu “cuenta”) así como algunas opciones

u personales relacionadas con el uso del sitio.
 índice

Administración de Noticias
11

Las entradas o noticias son objetos orientados en el tiempo. Se escriben en un tiempo específico, y ese tiempo define su contexto. Ejemplos de noticias
serían las actividades del mes que viene, boletín mensual o un hecho puntual que ocurrió o va a ocurrir e el corto plazo.

En este sentido, las noticias son un tipo de entrada de información que, como principales características, cuentan con fechas de publicación y despublica-
ción y una herramienta de categorización que cumple la función de mostrar la noticia en los espacios que uno quiera o haya planificado previamente.

Publicar una noticia

Publicar una noticia es tan sencillo como mandar un e-mail.
Con las imágenes podemos seguir las instrucciones.

1. Nos dirigimos a la pestaña Noticias en el panel de administración.

2. Hacemos clic en Agregar nueva.

3. Ingresamos al editor de la noticia de tipo WYSIWYG (en inglés:

What You See Is What You Get). Ahí, ingresa el título de la noticia
y en la caja de texto la información. Puedes añadir enlaces, negri-
tas, viñetas, entre otros.

4. Añadimos categorías que definen a esta entrada. En muchos casos

la categoría es útil para colocar un acceso a la noticia en espacios
previamente determinados; por ejemplo, a una noticia se le puede
asigna la categoría Portada para que esta se vea en el índex del si-
tio.

5. Seleccionamos una imagen destacada para cuando existe un listado

de noticias donde sólo se muestra título de la noticia, resumen e
imagen destacada.
 índice

6. Luego debemos considerar las fechas de la noticias: “Publicado

12 desde” edita desde cuando se verá la noticia en la web, “Publi-
cado hasta” se trata de la fecha en la que la noticia desaparecerá
de los lugares donde se lista con las categorías aunque no des-
aparecerá del sitio (podrá ser encontrada por medio de busca-
dores o un historial), ”Fecha del evento” implica, en caso de
ser necesario, de evidenciar cuándo sucederá el evento, hecho,
etcétera de la noticia, es un dato que se uso sólo cuando la infor-
mación lo requiere.

7. Por último, podemos seleccionar si la noticia estará protegida

por contraseña, si es privada (solo el autor o personas admitidas
pueden verla) o si se publica. Así mismo, podemos seleccionar
la fecha en que aparecerá publicada por si se desea que aparezca
en el futuro, o si por el contrario se publica con algo de retraso.

En la mayoría de los casos sólo es necesario añadir el título y el texto de la noticia, seleccionar categorías, colocar una imagen destaca-
da y pulsar el botón Publicar, los demás campos pueden quedarse tal y como están.

El editor de páginas y noticias

La edición visual, también llamada WYSIWYG por What You See u
Is What You Get (en inglés, Lo Que Ves Es Lo Que Obtendrás), u Título
consiste en dar formato al texto a medida que lo escribes. El editor
u Insertar imagen,
visual va creando el código HTML tras las bambalinas mientras tú u u galería u otro
objeto
te centras en escribir.

Debemos tener en cuenta que no se puede mostrar el control de los u u Barra de herra-
mientas
elementos estructurales, lo que significa que, por ejemplo, la inser-
ción de varios saltos de línea después de un párrafo no da lugar a u Espacio de texto
espacios en blanco en la página web final, el sistema limpia el códi-
go y sólo deja un salto de línea al final del párrafo.
 índice

Cuando pegas contenido directamente de otra web, los resultados pueden ser inconsistentes y variables dependiendo de tu navegador y de la
13 página desde la que pegues. El editor intentará corregir los códigos HTML no válidos que pongas, pero para obtener un mejor resultado mira
Editar textos / Pegar texto sin formato.

Si sueles usar el editor, la mayoría de las combinaciones de teclas básicas funcionan como en cualquier otro editor de texto. Por ejemplo: Shi-
ft + Enter inserta un salto de línea, Ctrl + C = copiar, Ctrl + X = cortar, Ctrl + Z = deshacer, Ctrl + Y = rehacer, Ctrl + A = seleccionar todo,
etc (en Mac usar la tecla Comando en lugar de Ctrl). Puedes ver la lista de teclas rápidas para todos los atajos de teclado en Administración y
edición / Atajos de teclado.

Veamos de forma detallada las diferentes herramientas y funciones del editor de noticias, entradas y páginas.

ta
a ple
nad da ce om
s orde ordena l a c e n l a l l a c
it a s iv a a d e t a r en omper e esumen Panta
Neg r Cu r L ist L is
Cit a Crea R R ltar ntas
Ocurramie
he

Ayu
For Sub Bor Inse Des d a
mat raya rar r hac
o de do form tar car er/r
eha
l tex ato a ctér cer
to espe
cial

Menú de Formato
del texto

• Negrita: se escribe el texto con una variante del tipo de letra utilizado que tenga los rasgos más gruesos.
• Cursiva: estilo de escritura cuyas características más comunes son la inclinación de sus letras y la concatenación de las mismas
en una palabra.
• Lista: Las listas originalmente están pensadas para citar, numerar y definir cosas a través de características, o al menos así lo
hacemos en la escritura de textos.
• Cita: resalta cuando el texyo en cuestión es una cita textual.
• Enlace (o hipervínculo): es un elemento de un documento electrónico que hace referencia a otro recurso, por ejemplo, otro do-
cumento o un punto específico del mismo o de otro documento.
• Resumen: podemos seleccionar las frases del textos que queremos sea el resumen o copete.
• Formato del texto: despliega el menú donde señalamos que un texto determinado es un título, su nivel o un párrafo.
• Subrayado: se dibuja una linea bajo el texto seleccionado.
• Borrar formato: elimina el formato preestablecido de un texto.
• Insertar caractér especial: coloca caracteres específicos
• Deshacer/rehacer: herramientas que permiten dar un paso atrás en la realización de algo, o volver a realizar una acción.
• Ayuda: algunos tópicos guía.
 índice

Espacio noticias
14

Cuando accedemos a la sección de noticias (haciendo clic en

u
Noticias en el panel de administración) se nos despliega el u
historial completo; es decir, presentada por defecto en orden
u
cronológico, se listan absolutamente todoas las noticias crea- u
das en el sitio. Además se les agregan otros datos y enlaces a u u
espacios para, por ejemplo, editar la noticia, eliminarla, volver
a publicarla, buscar, etcétera.
u

Veamos de forma detallada este espacio. u

u Agregar noticia nueva. u Historial de noticias

u Estadísticas u Ordenar por fecha
u Buscador de noticias u Acceso a herramientas

u Seleccionar noticia para

“aplicaciones en lote”
u Edición rápida abierta

Estado y visibilidad de una página o noticia
15
En el recuadro “Publicar” podemos seleccionar una serie de opciones que determinarán la visibilidad de la página, entrada o noticia.
Podemos seleccionar si la entrada estará protegida por contraseña, que sea privada (solo personas autorizadas pueden verla), publicarla en el
futuro o simplemente publicarla. Así como también tener una vista preliminar de lo creado, mover a la papelera o actualizar una entrada ya
creada.
1u 1u Recuadro publicar
2u Clic para, una vez ter-
2u minado, hacer una vista
1u previa de los cambios
2u realizados.
1u
clic para, una vez finali-
1u 3u zada la edición, aplicar
los cambios.
4u 3u
Clic para enviar la noti-
4u cia, página, etcétera a la
papelera.
Clic en editar para
1u cambiar el Estado de la
noticia, página, etcétera.
Seccionar el estado de la
2u noticia, página, etcétera:
Publicada: el post se
publicará.
2u Esperando revisión: el
2u
post queda a espera que
otro administrado aprue-
be su publicación.
Borrador: el post queda
guardado pero sin
publicar.
índice
Clic en editar para cam-
1u biar la visibilidad de la
noticia, página, etcétera.
Visibilidad refiere a
quién y cómo se ve el
post.
Público: cualquier perso-
2u na podrá ver el post.
Protegida con contra-
seña: para poder ver el
post se deberá poseer
una contraseña que
quien crea el post deter-
minará.
Privada: se debe poseer
autorización para ver el
post.
Clic en editar para
1u cambiar la fecha de pu-
blicación de la noticia,
página, etcétera.
Programación de la
2u fecha y hora de publi-
cación de un post, ingre-
sando en los campos los
campos correspondien-
tes.
 índice

Administración de Páginas
16

Las páginas, al contrario que las noticias, se usan la mayor parte de las veces para presentar la información atemporal sobre la fecha o el sitio
web (información atemporal). Ejemplos de páginas a incluir serían “Acerca de”, “Contacto”, “copyright”, etcétera; es decir, información está-
tica.

Resumiendo, las páginas:

• Son para el contenido que es menos dependiente del tiempo que las Entradas.

• Pueden organizarse en páginas y subpáginas.

• Pueden usar diferentes Plantillas de Página que pueden incluir Archivos de Plantilla, Etiquetas de Plantilla y otro código PHP.

Espacio de Páginas
u

Cuando accedemos a la sección páginas (haciendo clic en Pági- u

nas en el panel de administración) se nos despliega el historial u
completo; es decir, presentada por defecto en orden cronológico,
u u u
se listan absolutamente todas las Páginas creadas en el sitio. u
Además se les agregan otros datos y enlaces a espacios para, por
ejemplo, editar la página, eliminarla, volver a publicarla, buscar,
etcétera.
Crear página nueva u
Luego de seleccionar las páginas haciendo clic en el check box de la izquierda, se podrán u
u
aplicar acciones en lote como editar o borrar.
Ordenar páginas por título, autor y fecha u
Edición Rápida abierta: presenta de forma ágil algunas opciones para editar la página u
Menú rápido de acceso a editar la página, eliminarla o verla. Este menú se abre cuando
pasamos el puntero del mouse por encima del nombre de la página o le damos foco u
Buscador de páginas. u
u
 índice

El editor de páginas y noticias

17

La edición visual, también llamada WYSIWYG por What You See Is What You Get (en inglés, Lo Que Ves Es Lo Que Obtendrás), consiste en dar
formato al texto a medida que lo escribes. El editor visual va creando el código HTML tras las bambalinas mientras tú te centras en escribir.

Debemos tener en cuenta que no se puede mostrar el control de los elementos estructurales, lo que significa que, por ejemplo, la inserción de varios
saltos de línea después de un párrafo no da lugar a espacios en blanco en la página web final, el sistema limpia el código y sólo deja un salto de lí-
nea al final del párrafo.
Cuando pegas contenido directamente de otra web, los resultados pueden ser inconsistentes y variables dependiendo de tu navegador y de la
página desde la que pegues. El editor intentará corregir los códigos HTML no válidos que pongas, pero para obtener un mejor resultado mira
Editar textos / Pegar texto sin formato.

Si sueles usar el editor, la mayoría de las combinaciones de teclas básicas funcionan como en cualquier otro editor de texto. Por ejemplo: Shi-
ft + Enter inserta un salto de línea, Ctrl + C = copiar, Ctrl + X = cortar, Ctrl + Z = deshacer, Ctrl + Y = rehacer, Ctrl + A = seleccionar todo,
etc (en Mac usar la tecla Comando en lugar de Ctrl). Puedes ver la lista de teclas rápidas para todos los atajos de teclado en Administración y
edición / Atajos de teclado.

Crear una página

Publicar una página es tan sencillo como mandar un e-mail siguiendo
los estos pasos:

1. Seleccionamos Páginas en el menú principal.

2. Clic en “Añadir nueva”, tenemos 2 lugares donde hacer clic,

los 2 hacen los mismo a así que es indiferente seleccionar uno u
otro.

3. Ingresamos la información: título y contenido.

4. Sólo de ser necesario, editamos los atributos de la página. En

 índice

estos se editan datos como la ubicación de la misma en función de

18 las demás páginas; por ejemplo si es hija o padre de otra. También
se edita la plantilla: esta sirve para determinar el formato de la pági-
na. Para cambiar esta consultar a los programadores de la UCUR.

5. Seleccionamos una imagen destacada. Esta imagen, Como su propio

nombre indica, es una imagen que eliges tú y que quieres que se des-
taque sobre el resto.El punto importante de esto es que puede ser una
de las imágenes que tiene tu post, o bien otra totalmente distinta que
no aparezca en el interior del mismo (ni siquiera tiene por qué apa-
recer en otra parte de la web), haciendo así que puedas jugar con las
impresiones del lector y usarla como foto de atracción.

6. Editar el estado de la página y/o publicarla.

Estado y visibilidad de una página o noticia

En el recuadro “Publicar” podemos seleccionar una serie de opciones que determinarán la visibilidad de la página, entrada o noticia.

Podemos seleccionar si la entrada estará protegida por contraseña, que sea privada (solo personas autorizadas pueden verla), publicarla en el
futuro o simplemente publicarla. Así como también tener una vista preliminar de lo creado, mover a la papelera o actualizar una entrada ya
creada.
 índice

19
Editar textos

Para ingresar información no hay necesidad de usar esas molestas etiquetas HTML en el editor WYSIWYG (What you see is what you get),
las imágenes pueden ser insertadas directamente y se cargan automáticamente e incluso la inserción de tablas y vídeos de Youtube es muy
simple. Entonces, ingresar información es simple, pero se vuelve complicado y requiere mucho tiempo.

En esta sección se podrán encontrar guías, consejos y buenas prácticas para el ingreso y edición del contenido de entradas, noticias, páginas,
etcétera.

Insertar Imagen
Insertar imágenes en las entradas es un proceso muy simple, para realizar
esta acción los pasos son los siguientes:

1. Lo primero a tener en cuenta es que la imagen se ubicará en el lugar

donde está ubicado el cursor. Una vez seleccionado el lugar hace-
mos clic en “Añadir objeto”.
Nota: se puede subir cualquier tipo de archivo, aunque es reco-
mendable tener en cuenta el tamaño del mismo, sobre todo si se
trata de imágenes que aparecerán en las entradas para no ralen-
tizar la carga del mismo. Asimismo, es importante que el archivo
tenga un nombre coherente una buena descripción ya que el re-
positorio es común para todos los administradores y sino se ges-
tiona adecuadamente puede resultar tedioso encontrar cualquier
archivo.

Ahora debemos seleccionar desde dónde voy a tomar la imagen

2. “Insertar Objeto”: se insertan imágenes desde la librería de medios del

sitio. Si la imagen que queremos está nuestra PC, usamos esta opción
para colocarla en la librería del sitio.
 índice

3. “Fijar imagen destacada”: podemos seleccionar esta imagen aquí.

20
4. Cuando la imagen se encuentra en la web, ingresamos acá y pegamos
las url de la imagen.

5. Cuando seleccionamos “Insertar Objeto” se carga la librería multime-

dia del sitio a la derecha. Si la imagen ya se encuentra en el sitio se-
guimos con el paso 7. Si la imagen no se encuentra en esta librería,
simplemente hacemos clic en Subir archivos; se abrirá el navegador
y ahí buscamos la imagen o las imágenes que queremos subir.
Nota: En este paso lo que se está haciendo es subir al sitio la o
las imágenes seleccionadas; es decir, una vez subida una imagen
no será necesario subirla de vuelta para colocarla en otra pági-
na o entrada.

6. 7 La imagen está en la galería, ahora sólo debemos encontrarla, si

no está a la vista, arriba a la derecha contamos con un buscador.

Nota: El buscado indaga en el nombre del archivo y en los me-

tadatos del mismo, entonces, en caso de tener muchas imágenes
el buscador se vuelve importante, por lo tanto el ingreso de los
metadatos (paso 10) es fundamental.

8. Seleccionamos la imagen o las imágenes que necesitemos haciendo

clic sobre ella. Las seleccionadas quedaran enmarcadas en color y
con un “tic” sobre ella.

Nota: A medida que se van seleccionando las imágenes se van

listado abajo a la izquierda donde haciendo clic en “borrar”
podemos deseleccionarlas.

9. Detalle de información de la imagen además de un acceso a una

edición simple de la misma o borrarla.

10. Metadatos: Es necesario completarlos siempre ya que con ellos los

motores de búsqueda funcionan mejor además de ser necesario para
 índice

cuestiones de accesibilidad y usabilidad.

21 ► Título: Esta etiqueta o atributo se debe utilizar tanto en
imágenes como en enlaces, y es la encargada de ofrecer una
descripción emergente (tooltip) de la imagen o enlace. (algunos
navegadores utilizan el atributo «alt» en lugar de «title» para
mostrar esta información)
► Leyenda: La leyenda es lo que comúnmente conocemos
como el “pie de foto”, o “caption”.
► Texto alternativo: Con el texto alternativo, cuando una ima-
gen no puede ser visualizada en el navegador, podemos hacer
que aparezca el texto que nosotros deseemos. Es también útil en
cuanto la accesibilidad; es decir, las herramientas asistivas leen
ese texto para comunicarle al usuario de qué trata la imagen. Al
mismo tiempo, es un poderoso metadato para los buscadores.
► Descripción: Texto breve que explica de qué se trata la ima-
gen, o “keywords” sobre la misma. Fundamental para los moto-
res de búsqueda.
11. Clic para insertar la imagen.

Insertar Enlace

Los enlaces puedes ser dirigidos a páginas, entradas y noticias del propio sitio, sitios externos o a archivos para descargar o ver online.
Para insertar un enlace, lo primero que debemos hacer es seleccionar el texto (1) que será enlazado; es decir, será el texto que al hacer clic
nos dirigirá al destino seleccionado. Luego hacemos clic en el ícono de enlace (2). Al hacer clic se abre una ventana (3) donde podemos in-
sertar o editar enlaces. En esta ventana tenemos varios campos:

URL (4): Espacio donde se coloca la dirección destino.

Título (5): Es el título del enlace. Es el texto que aparece sobre el enlace cuando colocamos el puntero del mouse sobre él.

Abrir en ventana nueva (6): Si está seleccionado, al hacer clic en el enlace, el mismo se abre en otra ventana o pestaña: debemos tener en
 índice

cuenta que de estar seleccionado se está forzando a que un vínculo se abra en una página diferente y rompa el flujo del botón Atrás. La nueva
22 ventana no retiene el historial del navegador de la ventana previa, así que el botón “Atrás” está deshabilitado. Esto es increíblemente confuso,
sobre todo para personas que utilizan herramientas asistivas, personas con baja visón o ciegas, etcétera.

Buscar (7): Herramienta de búsqueda para cuando se quiere enlazar hacia una página, notica, documento, etcétera del sitio.

Listado (8): Lista de todas las páginas, noticas, documentos, etcétera del sitio y espacio donde aparecerá el resultado de la búsqueda.

Añadir enlace (9).

Cancelar y cerrar la ventana (10).

Finalmente el texto enlazado (11) quedará resaltado con un color, subrayado o algún otro elemento.
 índice

Insertar Tabla
23
Las tablas son una poderosa herramienta a la hora de mostrar y relacionar cierto tipo de información. Aún
cuando muchos sitios son construidos (por su naturaleza) sin usar una simple tabla, existen algunas oca-
siones en que el valor de las tablas se vuelve esencial.
Las tablas NO fueron crea-
Para insertar una tabla sigamos los siguientes pasos: das.
1. Para insertar una tabla debemos hacer clic en el ícono correspondiente.
2. Debemos tener en cuenta es que la tabla se ubicará en el lugar donde está ubicado el cursor. NO fueron creadas para
darle forma al diseño de
3. Haciendo clic sobre el dibujo del ícono pasamos directamente al punto 4 ya que se abre la ventana
una página web.
que vemos en la imagen; haciendo clic en la flecha se despliegan una serie de opciones útiles para la
edición de la tabla (haciendo clic en mostrar guías veremos de qué trata cada una de esas opciones).
4. Ventana que debemos completar para insertar la tabla. Así que se debe usar tablas
5. Propiedades Generales: No todos los campos son obligatorios; es decir, los únicos que deben estar SOLO para mostrar datos
completos son Columns (columnas) y Rowos (filas) (haciendo clic en mostrar guías veremos de qué tabulares.
trata cada una de esas opciones).
6. Propiedades Avanzadas: Haciendo clic en mostrar guías veremos de qué trata cada una de esas op-
ciones.
7. Clic en “insertar”.
8. La tabla se inserta en el lugar determinado.
 índice

Insertar un Video
24

Para cuando se desea incluir un video en una entrada, noticia o página, se propone subir este a YouTube, y llamarlo desde ahí.

Si no se esta familiarizado con subir un video a YouTube, recurrir a este manual: Subir videos.

Incrustar vídeos de YouTube en entradas es sencillo y no cuenta con largas listas con etapas engorrosas a cumplir; es decir, se trata de 3 simples
pasos:

1. Una vez subido el video o encontrado uno que necesite insertar, nos dirigimos a la barra de direcciones, seleccionamos y copiamos la url.

2. Vamos al editor y en el lugar donde queremos que se vea el video pegamos la url antes copiada.

3. Clic en actualizar o publicar.

4. El video se ubica en el lugar elegido.

 índice

Pegar texto sin formato

25

Cuando se pega contenido directamente de otra web, los resultados pueden ser inconsistentes y variables dependiendo del navegador y de la
página desde la que se pegue. El editor intentará corregir los códigos HTML no válidos que se coloquen, pero para obtener un mejor resultado
existen funciones que evitan correr determinados “riesgos”.

En este sentido, usando los botones de pegar que hay en la segunda fila podemos insertar texto dependiendo del lugar donde se copió:

El primero de los 3 botones sirve para pegar sin formato, es decir, si el texto copiado contiene esa información que puede resultar incon-
Ø
sistente, cuando se pega usando esta herramienta, borra esos datos.

Si se pega contenido de otra aplicación, como Word o Excel, se hace mucho mejor con el botón “Pegar desde Word”.
Ø

Si se ha pegado un texto con un formato predefinido que no se va del modo predeterminado o deseado, con esta herramienta se puede bo-
Ø
rrar ese formato y dejar el texto plano. Para esto, debemos seleccionar la herramienta y pintar el texto que muestre este problema.

Pegar texto sin formato o texto plano.

u
Si quieres pegar contenido de otra
aplicación, como Word o Excel, se

u
u u u hace mucho mejor con este botón:
“Pegar desde Word”

Si se ha pegado un texto con un for-

mato predefinido, con esta herramien-

u
ta se puede borrar ese formato y dejar
el texto plano.
 índice

Insertar una cita

26

A las cosas hay que llamarlas por su nombre, por eso cuando citamos a alguien debemos evidenciar que es una cita, por lo tanto el texto que corres-
ponde a esa referencia debe estar marcado como tal. Para eso existe la herramienta “cite”.
En este sentido, cuando queremos señalar que un texto se trata de una cita o referencia, lo primero que debemos hacer es:

• seleccionar ese texto (1),

• luego nos dirigimos a la herramienta cita (2), ubicada en la parte superior de la barra de herramientas,

• hacemos clic sobre el ícono (3),

• inmediatamente el texto seleccionado cambiará su forma generando un margen a la izquierda y colocando la letra en cursiva (4).

• En la web se verá también de forma visualmente destacada (5).

 índice

Atajos de teclado
27

Si sueles usar editores de texto, seguramente ya conozcas la mayoría de las combinaciones de teclas básicas. Así, en lugar de mover el ratón para
hacer clic en la barra de herramientas, usas teclas de acceso rápido. Veamos una lista de teclas rápidas para atajos de teclado básicos y avanzados

Básicos:
Para Windows y Linux usa Ctrl+letra. En Macintosh usa Comando+letra.

Letra Acción Número Acción

c Copiar 1 Título 1
v Pegar 2 Título 2
x Cortar 3 Título 3
4 Título 4
b Negrita 5 Título 5
i Cursiva 6 Título 6
u Subrayado 9 Dirección

a Seleccionar todo
z Deshacer
y Rehacer

a Seleccionar todo
z Deshacer
y Rehacer
 índice

Avanzados:
28
Los siguientes atajos utilizan claves de acceso diferentes: Alt + Shift + letra.

Letra Acción

d Tachado
q Cita
n Comprobar ortografía

u Lista desordenada
o Lista ordenada

a Insertar enlace
s Borrar enlace

m Insertar imagen
p Insertar salto de página
 índice

Administración y edición
29

Existe toda una serie de configuraciones básicas de los sitios, desde cuestiones sobre la arquitectura web hasta la organización de los archivos
subidos, pasando por la creación y administración de banners o editar el perfil propio.

Así, en esta sección se encontrarán secciones que plantean guías, consejos y buenas prácticas en lo que refiere a la creación de menús y su
administración, la creación de grupos de banners, el espacio de la librería multimedia, etcétera.

Administrar menús
Los menús son el esqueleto del sitio, las rutas de navegación que debemos planificar y construir para que el usuario, a la hora de buscar algo
específico o de recorrer el sitio, no se pierda y abandone el mismo ofuscado por la poca amabilidad del mismo. Al mismo tiempo, estos ca-
minos deben ser sencillos y estables; es decir, no es aconsejable colocar más de 2 o 3 niveles de menús y es bueno no cambiar la estructura
de menú muy seguido, es más, cuanto menos se cambie, mejor es. En este sentido, es preciso tener en cuenta que estos menús que veremos
a continuación son de navegación interna; o sea, los vínculos son siempre a páginas del propio sitio, no son enlaces a páginas externas
(para eso usamos banners) ni son vínculos a archivos (para eso usamos los enlaces en los cuerpos de paginas y noticias).

Por lo tanto, los menús contienen enlaces a páginas.

Ø Para crear un menú primero debemos heces clic en el vínculo “crea un nuevo menú”.

Ø La ventana debajo (a la derecha) de este se recompone pidiéndonos en primer lugar el nombre del menú.

Ø Luego debemos centrarnos en la estructura del mismo, entonces lo que debemos hacer es encontrar las páginas que lo compondrán
en la caja expandible de la columna izquierda. Seleccionamos la o las páginas que integraran el menú en cuestión y luego hacemos
clic en el botón “Añadir menú”.

Ø Para crear submenús debemos arrastrar los bloques dentro de ”Estructura de menú” hacia la derecha.

Ø Seguidamente debemos dirigirnos al final de esta pantalla y seleccionar la ubicación del menú (“Ubicación del tema”). esta selección
es muy importante por que determina dónde se va a mostrar el menú. Los lugares disponibles son creados programáticamente, así
que por cualquier duda comunicarse con el equipo de desarrolladores de la UCUR.

Ø Finalmente clic en “Guardar menú”.

 índice

30 u u
u Ficha: Editar menú

u Ficha: Gestionar lugares. u

u
u Lista de menús ya creados. u u
u
u Botón para crear un nuevo menú.
Selección de los ítem de menú. Pue-
den ser páginas, enlaces, categorías, u
u formato...
u u
u
u Enumeración las páginas del sitio
Luego de seleccionar las páginas u
u que se incluirán en el menú, clic
en “Añadir al menú”.

u Nombre del menú.

u
Ítems de menú ya seleccionados y u
u añadidos.
Arrastrando los bloques, podemos
u cambiar el orden de los mismos así
como crear submenús. Nota 1: El orden de las páginas dentro de la “Estructura del menú” los podemos cambiar simplemente
arrastrando los bloques de arriba hacia abajo.
Abriendo el menú se puede cambiar el
u nombre del ítem y el título. Nota 2: Haciendo clic en la flecha de la derecha de los bloques, se despliegan una serie de opciones
donde se puede cambiar el nombre del ítem y el título.
Cada menú está relacionado a un lugar,
u esos lugares ya fueron determinados
programaticamente.
Nota 3: en la pestaña “Gestionar lugares” podemos hacer lo mismo que en la sección de la ventana
“Ubicación del tema” pero con la diferencia que se muestran todos los menús y lugares disponibles
para insertarlos.
u No olvides guardar el menú. Nota 4: Podemos eliminar el menú seleccionando “Eliminar menú”.
 índice

Administrar banners
31
Entendemos por banner a un botón o enlace en forma de botón que al seleccionarlo redirige al usuario a un sitio web previamente determi-
nado. En este sentido, el uso del banner se reduce a enlaces a sitios externos al que estamos navegando. No usamos los banners para creer un
vínculo interno en el sitio (para eso están los menús).

Insertar y administrar banners consiste en una serie de pasos básicos:

1. Seleccionar en el panel de administración “Banners dinámicos”.

2. En la ventana que se despliega, seleccionamos “Agregar nuevo”.

3. De existir banners creados se listan en orden cronológico y plausibles de ser editados.

Nota: Se agregará un conjunto de banners, aunque si es necesario se puede agregar uno sólo.

4. Se abre una nueva ventana (“Agregar nuevo ítem”) donde lo primero que nos pide es el título del grupo de banners.
 índice

5. Nos pide el slug de este grupo de banners: slug (babosa en inglés) es un término adaptado del periodismo anglosajón y hace referencia
32 al título del grupo de banners en el que se han sustituido los espacios en blanco por guiones y se han eliminado todos los caracteres que
no sean letras o números. Este slug determinará en qué lugar se colocarán los banners de este grupo, los lugares disponibles son creados
programáticamente, así que por cualquier duda comunicarse con el equipo de desarrolladores de la UCUR.

6. Luego debemos comenzar a crear los banners, se hacen de a uno a la vez. Comenzando en la zona de carga de la imagen del banner des-
de la PC (si la imagen del banner ya está en el sitio, pasar al punto 7). Para subir la imagen, primero colocarle un título y luego subir la
imagen correspondiente desde el botón examinar. Para que la imagen suba se debe dar clic en publicar (aunque hasta no llegar al paso 9
los banners no se verán).

7. Si las imágenes a utilizar se encuentran en la librería del sitio, usamos el campo de búsqueda para encontrarlo.

8. Cuando las imágenes son seleccionadas

y subidas aparecerán listadas donde se
pueden eliminar de la selección, marcar
como imagen fija, agregarle url, etcétera.

Nota: la imagen que tenga seleccio-

nada “marcar como imagen fija” no
rotará y se mostrará siempre.

Nota: Podremos colocarle una url, es

decir un vínculo, sólo cuando en el
paso 9 está seleccionado “habilitar
enlaces en los banners”.

9. Seguidamente debemos configurar el área

de banners donde debemos definir si los
banners tendrán enlaces, el número de
banners que se mostrarán (se trata de la
cantidad de banenrs que se ven más allá
de los que se hallan subido), si rotarán y
el tamaño de los mismos.

10. Finalmente, clic en publicar.

 índice

Librería Multimedia
33
Todos los archivos subidos están listados en la Librería Multimedia, con las subidas más recientes listadas primero.

Utilizando la pestaña de Opciones de Pantalla puedes personalizar la visualización de esta pantalla.

Para reducir el listado se puede depurar por tipo o estado usando los filtros en la parte superior de la pantalla.

Al mismo tiempo, se puede refinar la búsqueda por fecha usando el menú desplegable junto a la tabla de multimedia.

Por otro lado, pasar con el puntero del mouse sobre una fila revela los enlaces de acción: Editar, Borrar Permanentemente y Ver. Haciendo clic
en Editar o en los nombres de los archivos multimedia se mostrará una pantalla simple para editar los metadatos de ese archivo. Haciendo clic
en Borrar Permanentemente se borrará el archivo de la librería multimedia, así como de todos los artículos en los que estuviera adjuntada. Ver
te llevará a la página de visualización de ese archivo.

Casilla para seleccionar el medio. Haciendo clic u u

u en la de arriba se seleccionan todos. u
u Previsualización del medio. u u
u Estadísticas. u
Ordenar los medios por tipo de archivo y nombre,
u
u autor, fecha, ubicación... u
u Nombre del archivo.
u Cantidad de medios que existen en el sitio.
u Buscador de Medios. u
u Fecha en que fue subido el archivo.
Menú rápido de acceso a editar el medio, eliminarlo o verlo.
Este menú se abre cuando pasamos el puntero del mouse por
u encima del nombre del archivo o cuando el damos foco con el
teclado.
 índice

34
Accesibilidad y usabilidad
La accesibilidad web tiene como objetivo lograr que los sitios web sean utilizables por el máximo número de personas, independientemente de sus
conocimientos o capacidades personales e independientemente de las características técnicas del equipo utilizado para acceder a la Web.

La necesidad de que la Web sea universal y accesible por cualquier persona está presente desde el principio de la Web, ya que era un requisito
contemplado en su diseño por su creador Tim Berners-Lee: “El poder de la Web está en su universalidad. El acceso por cualquier persona,
independientemente de la discapacidad que presente es un aspecto esencial.” Tim Berners-Lee, Director del W3C e inventor de la World Wide
Web.

Por qué Accesibilidad

No todos los usuarios acceden a la Web con los mismos medios técnicos
y no todos percibimos los contenidos de la misma forma.
Las personas con discapacidades motoras que no pueden sostener un perió-
dico o girar sus páginas pueden tener acceso a medios informativos en lí-
nea, usando ciertas ayudas técnicas que adaptan la interfaz del ordenador a
sus discapacidades. Algunas veces las adaptaciones son simples, como que
la persona se coloque un palo en la boca y lo utilice para manejar el tecla-
do. En otros casos, las adaptaciones son más sofisticadas, como en el uso
de teclados especiales o software de seguimiento del ojo (eye-tracking) que
permite a la gente a usar un ordenador con simplemente el movimiento de
los ojos. Las personas sordas siempre han tenido la posibilidad de leer los
periódicos por su cuenta, por lo que puede parecer que Internet no ofrece
el mismo tipo de emancipación que para los que son ciegos o para aquellos
con discapacidades motoras, pero pueden leer en línea transcripciones de
discursos importantes o ver el contenido multimedia que ha sido totalmente
subtitulado. Muchas personas con discapacidades cognitivas también se
pueden beneficiar en gran medida de la estructura y la flexibilidad de los
contenidos web.

En este sentido, las personas con diferentes tipos de discapacidad pueden experimentar dificultades para utilizar la web debido a la combina-
ción de barreras en la información de las páginas, con las barreras de las “aplicaciones de usuario” ( navegadores, dispositivos multimedia o
ayudas técnicas). Estas pautas tienen relación específicamente con la reducción de barreras en las páginas web.
 índice

Entonces, con el fin de que quienes están encargados de subir información a la web y administrar sitios, y los desarrolladores web sepan cómo
35 diseñar y construir sitios web accesibles, diferentes conjuntos de pautas o guías de accesibilidad han sido desarrolladas por diversos organis-
mos. En la actualidad, las pautas más importantes son las pautas de accesibilidad al contenido web desarrolladas por el W3C (WCAG 1.0 y
WCAG 2.0)

El equipo de la Unidad de Comunicación de la Universidad de la república (UCUR) promueve la accesibilidad universal en todos sus desa-
rrollos y propone a los administradores de los sitios se incorporen a esta iniciativa. Para esto, desde la unidad se han desarrollado una serie de
pautas (basadas estrictamente en las de la W3C - WCAG 1.0 y WCAG 2.0 ) que cumplen con los estándares de accesibilidad y por lo tanto
garantizarán que el contenido pueda ser accedido por TODOS los que quieran.

Por más información:

World Wide Web Consortium (W3C)
Pautas de Accesibilidad de Contenido Web 2.0
Introducción a Comprender las WCAG 2.0 (“Web Content Accessibility Guidelines”)
Estándares especificaciones técnicas y directrices
Accesibilidad Web - Universidad de Alicante
Accesibilidad en la Web: El camino para construir sitios accesibles

Mitos sobre la accesibilidad

Fomentado por una falta de información, desde el comienzo de la accesibilidad web existen una serie de mitos sobre este tema que en muchos
casos persisten.

Ø El mito principal es creer que la accesibilidad de un sitio web se resuelve creando una versión alternativa de “sólo texto”, sin imágenes
ni colores y que, por tanto, si quieres tener una única versión de un sitio web y que sea accesible, tendremos que renunciar al empleo
de imágenes y colores y el sitio web será “feo y aburrido”. Este argumento es totalmente falso.

Ø Del mismo modo, otro mito gira en torno a la creencia en que los sitios web accesibles matan la creatividad. Trabajar en función de
una web accesible no limita en ninguna forma el espacio para las ideas nuevas.

Ø Otro mito dice que las personas con discapacidad no utilizan la Web. Es exactamente lo contrario, ya que las nuevas tecnologías e In-
ternet ha permitido a un gran número de personas con discapacidad llevar una vida autónoma e independiente.

Ø Por otro lado, se dice que las páginas web con solo texto son accesibles: falso. Las páginas web que sólo contienen texto pueden ser
 índice

difíciles de entender por personas con discapacidad cognitiva o con dificultades con el lenguaje como las personas sordomudas.
36
Ø En este sentido, otro mito dice que la accesibilidad es sólo para ciegos. Es falso ya que existen usuarios con diferentes tipos de disca-
pacidad que pueden experimentar distintos problemas de acceso y uso del contenido de las páginas web.

Ø La accesibilidad es cara y costosa: falso. Evidentemente, el proceso de aprendizaje y la posterior adaptación a los sitios web ya exis-
tentes suponen un coste, pero igual que aprender una nueva tecnología y adaptar los sitios web a la nueva tecnología.

Ø Finalmente, la accesibilidad es sólo para las personas con discapacidad: totalmente falso. Aunque las personas con discapacidad pue-
den ser los usuarios que más se beneficien al aplicar la accesibilidad web, en realidad se beneficia todo el mundo, ya que también ayu-
da a cualquier usuario que se encuentre en circunstancias especiales como puede ser entornos con baja iluminación, ambientes ruido-
sos, acceso a Internet con conexiones y equipos con capacidades limitadas, etcétera.

En muchas situaciones no se crean sitios web debido a estos mitos. Sin embargo, en muchas otras situaciones es simplemente por un rechazo
directo y frontal o por negarse a aprender a hacer las cosas de forma diferente a la que las hacen.

Uso de imágenes
Veamos 3 cuestiones fundamentales a tener en cuenta:
Ø Los contenidos no textuales (Cualquier contenido que no está formado por una secuencia de caracteres) deben tener alternativas en
texto que comuniquen el propósito que tienen esos elementos no-textuales: ejemplo, imágenes, vídeos, flashs. Se trata del texto alter-
nativo de una imagen (atributo alt).
El atributo alt se emplea para proporcionar un texto alternativo que sustituya a una imagen en aquellos casos que la imagen no pueda
ser empleada por ciertos usuarios, como por ejemplo los usuarios ciegos que utilizan un lector de pantallas. Se recomienda que el texto
alternativo no supere los 100 caracteres y que no contenga información compleja como tablas o listas.

Ø Imágenes de texto: hace años, era muy normal encontrar páginas web donde el texto se ponía en imágenes, porque por aquel enton-
ces no se disponía de la tecnología necesaria para modificar la tipografía del texto al gusto del diseñador. En este sentido, usar texto
en imágenes, más allá de usar texto alternativo, es un gran error, ya que ocasionaría muchos problemas de accesibilidad y usabilidad.
Existen excepciones como son los logos, afiches o casos donde el administrador considere que no existe otra posibilidad; siempre co-
locando el texto alternativo correspondiente.
 índice

Ø La presentación visual del texto y las imágenes de texto tienen una relación de contraste de al menos 4.5:1, es decir, deben presentar
37 un contraste “correcto”. deben tener un tamaño prudente para el espacio destinado en el diseño de la página.

Audio y video

Veamos 5 cuestiones fundamentales a tener en cuenta:

Ø Complementando multimedia: cuando se colocan audios y videos es buena práctica colocar una alternativa textual a ellos; se trata
de un documento de texto que presenta la transcripción del diálogo y todo sonido de fondo relevante a la información comunicada. Se
insertará un enlace a dicho documento en inmediatamente después del reproductor.
Al mismo tiempo, es recomendable colocar antes de cada contenido multimedia una introducción a este, explicando que es audio o
video y haciendo una pequeña descripción del mismo.

Ø Problemas con flash: para que un sitio cumpla condiciones básicas de accesibilidad debe poder ser navegado sólo con el teclado, uti-
lizando lo que se llama el foco del teclado.
En este sentido, las presentaciones en formato flash generan las llamadas trampa de teclado; es decir, cuando el foco cae dentro del
flash no sale más, imposibilitando la navegación.
Entonces, se recomienda evitar el uso del flash o, en caso que sea necesario usarlo, introducirlo aclarando esa cuestión.

Ø Pausar videos: para cualquier información que se mueva, parpadee o se desplace, y que comience automáticamente, dure más de
cinco segundos, y se presente paralelamente a otro contenido, existe un mecanismo que permite al usuario pausar, detener u ocultar la
información, a menos que ese movimiento, parpadeo o desplazamiento sea esencial para la actividad.
Igualmente, no es recomendable que videos, audios, etcétera comiencen automáticamente (existen excepciones como los slides, siem-
pre que tengan la posibilidad de pausa)

Ø 3 destellos sobre el umbral: las páginas web no contienen nada que destelle más de tres veces en cualquier periodo de un segundo, o
el destello está por debajo de los umbrales de destello general y de destello rojo. (Nivel A)
Este criterio se orienta a un tipo particular de epilepsia, que la epilepsia fotosensitiva. Ocasionada por parpadeos o destellos regular-
mente de la luz roja con frecuencia mayores a 5 por segundo.
Sobre todo en videos. Si se duda de un video con este problema se puede testear con UW Trance Center Photosensitive Epilepsy Tool
(PEAT). Software libre y descargable acá
 índice

Estructura de encabezados
38
Las páginas web, desde un punto de vista programático, conceptual y visual (para el usuario) deben mantener una estructura lógica para trans-
mitir un orden jerárquico en la estructura del documento.

Ese es el caso de los encabezados, cuando ingresamos título y subtítulos, debemos evidenciar y respetar el orden jerárquico de estos. Para esto
usamos en el editor de textos el menú formato, donde seleccionaremos “título 1” a “título 6” dependiendo de su estructura.

u
1
u 1 Este título es siempre “Título 1” ya que está confi-
gurado programáticamente para que así sea. u
2

u
2 Estructura de la entrada.
u
3
u
3 Seleccionamos/Pintamos el título.

u
4 En el menú desplegable seleccionamos “Título 2”

u
5 Inmediatamente cambia el formato.

Notas:

Ø nunca deberá aparecer “título 2” antes que “título 1”.

Ø se debe mantener el orden consecutivo.

u
4
Ø no se puede pasar de “título 1” a “título 6” y viceversa

Ø debe existir contenido textual entre encabezados consecutivos (“título 1”

a “título 6”) del mismo nivel, entre encabezados consecutivos (“título 1” a
“título 6”) cuando el segundo sea de mayor nivel que el primero; y entre el
último encabezado y el final de página.
u
5
 índice

Navegación
39

Veamos 3 cuestiones fundamentales a tener en cuenta:

Ø Términos espaciales: no referirse a la navegación en la página con términos espaciales, como por ejemplo: “el menú de la derecha”,
“abajo”. En ese sentido, no debemos hacer referencia a un mecanismo de interacción para la activación de los mismos. Por ejemplo,
“hacer clic aquí”.

Ø Medios visuales: el color no se emplea como el único medio visual para transmitir una información, indicar una acción, provocar una
respuesta o distinguir visualmente un elemento; es decir, la referencia al color no debe ser la única indicación para cumplir con cierto
objetivo o para proponer interactuar con los elementos de una página.

Ø Propósito de un vínculo (en su contexto): el propósito de cada vínculo puede determinarse con el texto del vínculo descontextuali-
zado, excepto donde el propósito del vínculo puede ser ambiguo para los usuarios en general; es decir, cuando leemos el texto de un
enlace deberíamos tener una idea del lugar al que nos está llevando ese link. En este sentido, cuando agregamos un enlace, debemos
colocarle un título que evidencie el destino del enlace o la razón del mismo en no más de 100 caracteres.

Buenas formas
Existen normas de convencía que no son leyes, que no están escritas… son formas voluntarias de actuar establecidas y aceptadas por la
mayoría. La web también tiene estas normas: la Netiqueta (Netiquetate - Netiqueta) facilita la connivencia en la red.

Internet es un medio de comunicación, el más extendido y en constante proyección, un poderoso medio de edición y de relación interpersonal,
una herramienta de trabajo grupal, y un medio de comunicación de masas. Como tal, existe la necesidad sobre la creación de requerimientos
que regulen la comunicación y su lenguaje, como los tienen otros medios. Pensemos en los libros de estilo en la prensa escrita o audiovisual,
o con carácter más general pensemos en la sintaxis, la ortografía, etcétera para los medios escritos y hablados.

Pero además, Internet, por su carácter, tiene necesidades de regular la comunicación interindivudal y grupal, derivadas no del hecho de ser un
fenómeno en la comunicación sino de su propia naturaleza, de sus rasgos tecnológicos y de la especificidad con que se realiza la comunica-
ción sea ésta la que sea.

Estas necesidades, simplificando mucho, se han agrupado en algunas recomendaciones de “buen uso” basadas en manuales de Netiqueta o
convenciones sobre Las buenas maneras en Internet.
 índice

Crear PDFs accesibles

40 Un fichero PDF no es simplemente lo que vemos en pantalla, sino que detrás del documento existe una estructura lógica que incluye etiquetas
similares a las html, el correcto uso de estas etiquetas, en ambos casos, permite que, por ejemplo, a la hora de utilizar un lector de pantalla o
cualquier herramienta asistida, éste leerá el documento respetando sus etiquetas y evidenciando cuando se encuentra con un título, con una
cita, con una lista, etcétera.

Nota: guía para la creación de documentos PDFs accesibles a partir de un procesador de texto.

Uso de tablas
Cuando tenemos datos tabulares a mostrar debemos presentarlos en una tabla. Esta no sólo constará de filas y columnas, sino que también de-
berá colocarse anteriormente una descripción de la misma y, de ser compleja, una pequeña guía o manual de cómo se lee. Asimismo, cuando
se crea la misma, en la herramienta de edición debemos recordar ponerle un título.

Por otro lado, es importante recordar que las tablas no se usan con fines de maquetación o estructuración de la web; es decir, no son usadas
para darle forma al diseño de una página web.

Web semántica
Cuando se ingresa un texto se colocan citas, listas ordenadas, listas desordenadas, etcétera. Entonces, para respetar los principios de una web
semántica, cada vez que colocamos una lista, una cita, etcétera, debemos colocarlo como tal; es decir, si es una cita usar el ícono que corres-
ponde (ver Editar textos/Insertar una cita), lo mismo con las listas.

Otros idiomas
Cuando es necesario ingresar texto en otro idioma, o graficas, imágenes, adjuntos que estén en un idioma que no sea el español, debemos
aclararlo en un texto o introducción previo.
 índice

Abrir en ventana nueva

41 La única cosa que podemos decir todos los usuarios de Internet entienden a plenitud es el botón “Atrás”. Es parte integral de la navegación:
sigue un vínculo, vuelve atrás; explora el resultado de un buscador, vuelve atrás.

Entonces, cada una las páginas internas del sitio debe permitir al usuario navegar hacia cualquier otra ubicación y regresar a pasos previos con
el botón de “Atrás”. Para esto es aconsejable evitar “abrir en ventana nueva” ya que al hacerlo así, no se podrá usar el botón atrás; al mismo
tiempo, una persona con problemas de visión no notará que se abre una nueva ventana y para ellos es fundamental el botón “Atrás”.

Tomemos en cuenta que si alguien quiere abrir algo en una nueva ventana lo hará por su cuenta, no es aconsejable obligarlo a eso.

Si es necesario que el vínculo abra en una nueva ventana, evidéncielo en el texto del enlace o en un párrafo previo.

Ventanas emergentes
En la misma línea que “abrir en ventana nueva”, esta forma de proceder desconcierta a muchos usuarios.

Las personas que no ven su pantalla y están navegando mediante un lector de pantalla o navegador por voz no saben que acaban de abrir una
nueva ventana y si tratan de regresar, mediante el botón “Atrás” de su navegador, descubren que han perdido el hilo de su navegación y lo de-
berán encontrar entre las páginas abiertas en su ordenador. También las personas con problemas cognitivos o aquellas que tienen poco hábito
de navegar por la Web pueden encontrar sorprendente que no puedan regresar a la página de origen que les llevó a la página que visualizan en
ese momento.

Uso de las mayúsculas sostenidas

Muchos piensan que la mejor manera de hacer sobresalir un párrafo, o una palabra en su contenido escrito es usar las mayúsculas sostenidas,
que según estos, podrían darle una mayor importancia a “esa” palabra.

La realidad es que se equivocan, en la Web (y por lo general en cualquier medio) la lectura, si se utiliza esta mal llamada “estrategia”, dificul-
ta la comprensión del texto para el visitante.

Asimismo, las normas de “etiqueta” de la web indican que el uso de mayúsculas tiene como significado “GRITAR LO QUE UNO DICE”,
enfatizando el mensaje, el uso de minúsculas significa una charla normal.

En este sentido, en el caso de los títulos, si se quiere usar mayúsculas sostenidas, se deberá llegar al un conceso entre todos los administrado-
res del sitio en el cual todos se comprometen a crear todos los títulos con mayúsculas sostenidas.
 índice

Texto justificado
42 El texto justificado se utiliza en libros, boletines, periódicos y revistas en papel, para crear un ritmo horizontal que guía a los ojos por la pági-
na. Pero una buena justificación requiere una cuidada elección de elementos que ofrecen las herramientas profesionales con las que se crean
estas publicaciones: tipo y tamaño de letra, ancho de la página, longitud del bloque de texto, separación de sílabas, idioma, el propio texto del
contenido, etcétera.

Desafortunadamente, en una página web no se puede controlar ninguno de estos elementos, por lo que las justificaciones de texto rara vez
están justificadas, ya que es más fácil que el resultado sea peor de lo esperado. Los navegadores no están preparados para justificar textos, no
pueden partir palabras y crean unos ríos de espacios en blanco (efecto conocido como “rivers of white”).

Aquí no hablamos sólo de razones estéticas, sino de accesibilidad. En este sentido, la mayoría de los usuarios con dificultades de lectura,
encuentran problemas con el texto justificado. El irregular espacio en blanco que se produce entre palabras, causa los mencionados ‘ríos de
espacios blancos’ hacia abajo, provocando una lectura difícil y en algunos casos imposible para algunos lectores. Igualmente, un estudio reali-
zado por la Universidad del Estado de Wichita (EE.UU.) sobre dos grupos de usuarios a los que se dio a leer un texto por pantalla justificado a
ambos lados, y otro justificado sólo a la izquierda; demostró que la justificación de texto a ambos lados dificultaba la lectura en la mayoría de
los casos.

Menús desmenuzados
Una óptima arquitectura web logra un buen posicionamiento y generan visitas, algo fundamental para cualquier página web.

En este sentido, cuanto más sencilla sea la navegación, más fácil va a ser para el usuario y, por lo tanto, se generará más fidelidad con la web.
Así, existen una serie de buenas formas para tomar en cuenta a la hora de construí, por ejemplo, un menú:

Ø no saturar los menús con innumerables opciones.

Ø no generar menús con más de 2 o 3 niveles.

Ø no variar la estructura del menú de forma seguida.

En definitiva, se trata de generar menús simples, lo más estáticos posibles, amigables y que faciliten la exploración más que la compliquen;
recordemos que, fundamentalmente, los menús son el esqueleto de los sitios.

Dependiendo del contenido y la información, Limite la navegación de su web a 6 y 8 páginas como mucho. Mantenga una navegación cons-
tante. No fuerce a los visitantes a aprender diversos caminos o esquemas para la navegación en diversas partes de su sitio.
 índice

Cómo se lee
43 Las páginas web fáciles de leer juegan un papel importante para conseguir la lealtad de los visitantes, para mantenerlos en tu sitio y para leer
tus contenidos. Las pruebas de usabilidad del diseño web muestran que la mayoría de los usuarios no leen las páginas web, las “exploran”
buscando los títulos, negritas, textos resaltados o listas.

Los estudios de seguimiento del ojo realizados por Jakob Nielsen, muestran que los usuarios leen el contenido de un diseño web en una forma
semejante a la “F”, lo que significa que inician la lectura en la parte superior izquierda de la página web, se mueven un poco de lado hacia
abajo, y terminan del lado izquierda nuevamente y señala las implicaciones de este patrón de lectura:

Ø Los usuarios no leen el contenido de una página web palabra por palabra, ellos van a extraer los párrafos importantes, el texto en ne-
grita, etcétera.

Ø Los dos primeros párrafos son esenciales en una página web y deben contener la información más importante que tus visitantes están
buscando.

Ø Los subtítulos y las listas se destacan de los párrafos normales. Utilízalos para notificarle a los usuarios la información más impor-
tante.

Animaciones
No abuse de la utilización de la animación, esto puede abrumar y cansar a la vista. En este sentido, debemos permitir al usuario detener o pau-
sar las animaciones.

Las animaciones pueden retrasar la carga de la página; a los que utilizamos Internet de manera habitual no nos gusta esperar por una página
web, a no ser que por la razón que sea nos interese muchísimo acceder a su información. Lo habitual es que nos vayamos pulsando el botón
“Atrás” de nuestro navegador (y es un hecho demostrado). Si hay que escoger entre una web cargada de imágenes grandes, animaciones flash,
efectos visuales, etcétera. y una web más sobria y con menos ornamentos: el consejo es buscar un equilibrio razonable.

Manténgalo actualizado
La manera más rápida para que un web pierda credibilidad es contener información anticuada o desfasada. Del mismo modo, cuando el usua-
rio accede a información incompleta tiende a abandonar el sitio, es por eso que si una sección no está completa, no la publiques.
 índice

Escribir para la web

44 Escribir para web no es lo mismo que para otros soportes, los textos largos no son bienvenidos, por eso se recomienda que, en la medida de
lo posible, los textos sean lo más concisos posible, y si no se puede, crear introducciones a estos. Al mismo tiempo, las listas y las tablas con
bulleted o numeradas se pueden hojear mucho más rápidamente que si alineamos el texto tradicional. En la misma línea, atomizar el texto en
secciones con subtítulos dándole una estructura lógica al documento dinamiza y facilita la lectura.

Es importante lo que se haga para mejorar la accesibilidad del texto identificando los elementos ya que, por ejemplo, los navegadores de voz
exploran el Web buscando títulos y referencias para ayudar al usuario a orientarse y a ganar una sinopsis del contenido de la página. Otra ayu-
da a la accesibilidad es utilizar texto en vez de imágenes donde sea posible.
 índice

Glosario
45
En este glosario encontrarás definiciones de algunos términos técnicos y no tanto, lo más sencillas que resulte humanamente posible, tanto de lo que
refiere a la administración de tu sitio como de la navegación en la Web.

Si consideras que este glosario debería ampliarse con determinados conceptos, no dudes en comunicarte y hacernos llegar la propuesta.

Navega por…

A B C D E

F G H I J

L M N P R

S T U V W
 índice
glosario

46
A

Accesibilidad
La accesibilidad o accesibilidad universal es el grado en el que todas las personas pueden utilizar un objeto, visitar un lugar o acceder a un
servicio, independientemente de sus capacidades técnicas, cognitivas o físicas. Es indispensable e imprescindible, ya que se trata de una
condición necesaria para la participación de todas las personas independientemente de las posibles limitaciones funcionales que puedan
tener.

Mas información: Accesibilidad

Accesibilidad web
En la actualidad, no existe una definición formal y totalmente aceptada del concepto de accesibilidad web, igualmente podemos acercarnos
a una definición definitiva diciendo que la accesibilidad web tiene como objetivo lograr que las páginas web sean utilizables por el máximo
número de personas, independientemente de sus conocimientos o capacidades personales e independientemente de las características técni-
cas del equipo utilizado para acceder a la Web.

Mas información:

Ø Accesibilidad Web - Universidad de Alicante

Ø Accesibilidad Web - Agesic

Ø Web Accessibility Initiative - WAI (en inglés)

Ø Accesibilidad Web

Alt
El atributo alt proporciona información alternativa para una imagen u objeto si un usuario por alguna razón no puede verlo (a causa de co-
nexión lenta, un error en el atributo src, o si el usuario utiliza una herramienta asistiva). Es conocido también como el texto alternativo de
un objeto.

Arquitectura web
Se utiliza el término Arquitectura web para definir un área que se especializa en el desarrollo y aplicación de conocimientos técnicos de
 índice
glosario

construcción, funciónales y de diseño para sitios o páginas web. En este sentido, trabaja en torno a la estructura de la web, la organización
47 de la información, el esqueleto del sitio, en definitiva, la arquitectura de la información.

Audiovisual
El concepto audiovisual significa la integración e interrelación plena entre lo auditivo y lo visual para producir una nueva realidad o len-
guaje. La percepción es simultánea. Se crean así nuevas realidades sensoriales mediante mecanismos como la armonía (a cada sonido le
corresponde una imagen), complementariedad (lo que no aporta lo visual lo aporta lo auditivo), refuerzo (se refuerzan los significados entre
sí) y contraste (el significado nace del contraste entre ambos).
 índice
glosario

48
B

Banner
Un Banner es un gráfico, generalmente usado para incluir una pieza publicitaria o un enlace externo dentro de una página web. En efecto,
la característica principal de los banners es que nos redirigen a otros sitios. También se le llama banners a las imágenes que en distintos si-
tios se usan como encabezados o simplemente tienen el objetivo de llamar la atención, resaltar notorios y comunicar un mensaje deseado.

Borrador
Uno de los estados de publicación de una entrada que, en vez de publicarla en el momento prefieres dejar para mejorar o ampliar más ade-
lante.

Breadcrumbs, Migas de pan o Guía de navegación

Es una guía en texto y enlaces que indica dónde te encuentras de acuerdo a la distribución del contenido en la web. En los sitios diseñados
por la UCUR, las breadcrumbs se encuentran en la parte superior del sitio.
 índice
glosario

49
C

Caption
Closed Caption (abreviado CC, subtitulado oculto o subtitulado no incrustado1 ) es el nombre en inglés del sistema de tipo subtítulo de
programas de televisión y video destinado a permitir que las personas sordas o con dificultades para captar la señal de audio, puedan com-
prender lo que se dice. La diferencia, el subtítulo se utiliza para entender otro idioma y el Closed Caption describen los diálogos en el mis-
mo idioma, además incluyendo música de fondo y efectos de sonido mediante palabras y símbolos.

No sólo lo usan personas con problemas de audición, sino también personas que están aprendiendo un idioma, que están en un entorno de-
masiado ruidoso como para oír el programa o en lugares donde es conveniente que haya silencio.

CMS
Acrónimo de la palabra en inglés “Content Management System” que, en español significaría “Sistema de Gestión de Contenidos“.
También nos podemos referir a él como SGC. En definitiva, es un software que permite administrar una página web de manera sen-
cilla, gestionando por áreas las distintas funcionalidades de la misma: contenidos, diseño, utilidades, administración, usuarios, etcé-
tera.

Lista de sistemas de gestión de contenidos (en inglés).

Contenido no textual
Cualquier contenido que no está formado por una secuencia de caracteres que puede ser determinado por software o donde la se-
cuencia no expresa nada en ningún idioma. Esto incluye el arte ASCII (que es un patrón de caracteres), los emoticones, imágenes
que representan texto, mapas de imagen, animaciones (Por ejemplo, GIFs animados), “applets” y objetos programados, marcos,
scripts, imágenes usadas como viñetas en las listas, espaciadores, botones gráficos, sonidos (ejecutados con o sin interacción del
usuario), archivos exclusivamente auditivos, banda sonora del vídeo y vídeos.

Recordemos que a este tipo de contenido Siempre se debe proveer una alternativa textual, por ejemplo, a través del atributo “alt”,
en una descripción previa o en el contenido del elemento.

Contraste
El contraste se define como la diferencia relativa en la intensidad entre un punto de una imagen y sus alrededores. Un ejemplo sim-
 índice
glosario

ple es el contraste entre un objeto de brillo constante sobre un fondo de un brillo constante. Si ambas superficies tienen el mismo
50 brillo, el contraste será nulo y si el conjunto está en tonos de gris, el objeto será tanto física como perceptiblemente indistinguible
del fondo. Según se incrementa la diferencia en brillo el objeto será perceptiblemente distinguible del fondo una vez alcanzado el
umbral de contraste, que se sitúa alrededor del 0,3 % de diferencia.

Descarga aquí el Colour Contrast Analyser 2.2 for Web Pages (Licencia Creative Commons), herramienta para el control de las com-
binaciones de primer plano y color de fondo para determinar si ofrecen una buena visibilidad de color. También contiene la funcio-
nalidad para crear simulaciones de ciertas condiciones visuales como la ceguera al color.
 índice
glosario

51
D

Datos tabulares
Son datos presentados en recopilaciones bien estructuradas y fáciles de interpretar, de las que nos valemos para sintetizar la información
obtenida con el fin de hacer un uso sencillo de ella o bien para darla a conocer de forma comprensible.

Es una ordenación de datos, los cuales se representan en una tabla, en donde se colocan las variables de acuerdo a intervalos por medio de
los cuales se analizan los datos.

Descripción de imagen
Utilizada en la subida de imágenes, se usa en el caso que se quiera dar una descripción más extensa y detallada que la que se da con el atri-
buto “alt” de la imagen. Lo ideal sería que de alguna manera se presentase información en este campo con metadatos como puede ser el
autor de la imagen, ubicación, etcétera.

Determinado programáticamente
Algo que ha sido determinado programáticamente es un elemento que se a creado, configurado o desarrollado por medio de programación.

Dominio
Un dominio de Internet es una red de identificación asociada a un grupo de dispositivos o equipos conectados a la red Internet.

El propósito principal de los nombres de dominio en Internet y del sistema de nombres de dominio (DNS), es traducir las direcciones IP de
cada nodo activo en la red, a términos memorizables y fáciles de encontrar. Esta abstracción hace posible que cualquier servicio (de red)
pueda moverse de un lugar geográfico a otro en la red Internet, aún cuando el cambio implique que tendrá una dirección IP diferente.

Sin la ayuda del sistema de nombres de dominio, los usuarios de Internet tendrían que acceder a cada servicio web utilizando la dirección
IP del nodo (por ejemplo, sería necesario utilizar http://192.0.32.10 en vez de http://example.com). Además, reduciría el número de webs
posibles, ya que actualmente es habitual que una misma dirección IP sea compartida por varios dominios.
 índice
glosario

52
E

Enlace permanente
Es la URL que archivará un contenido y por el que se podrá acceder al mismo desde cualquier otra web. Pueden ser de varios tipos; semán-
ticas, numéricas, feas, etcétera. También se le conoce como permalink.

Enlace
Los enlaces son también contenido, pues son texto que enlazan a una dirección web, por lo que son semánticamente completos.

Entrada
Es el modo en que en WordPress se denomina a las publicaciones, artículos, posts, noticias o como los quieras llamar. Es la base funda-
mental del contenido de los sitios.

Escritorio
La pantalla de inicio de la zona de administración del sitio, la primera que se accede nada más ingresar desde donde se puede empezar a
crear, organizar, personalizar el sitio.

Etiquetas de plantilla
O en inglés “template tags“. Son funciones PHP que recuperan información de la base de datos MySQL para crear código resultante en
HTML que se mostrará en tu web.

Metadatos
Son elementos relacionados con las entradas, que ofrecen información relativa a las mismas, como por ejemplo el autor, la fecha en que se
publicó, etc. La mayoría de los temas WordPress muestran metadatos de entrada antes o después del loop.

Extracto – resumen
Parte de contenido que puedes elegir mostrar en el loop en vez del contenido completo de una entrada o página.
 índice
glosario

53
F

Flash
Es un formato de archivo de gráficos vectoriales que también incorporan audio y vídeo (en diferentes formatos Flash Video) y multitud de
formas diferentes de interacción con el usuario, creado por la empresa Macromedia (actualmente Adobe Systems).

Si bien es muy popular, el flash es altamente cuestionado, entre las principales críticas destacamos:

• Es un software 100% propietario, es decir, cerrado a los aportes de terceros.

• Hay un formato más moderno, H.264.

• Tiene un antiguo historial de problemas de seguridad no resueltos.

• Requiere decodificación por hardware, lo que puede aumentar hasta en un 100% el uso de la batería de dispositivos móviles.

• Descuida cuestiones básicas de accesibilidad y usabilidad.

FTP
Acrónimo de “File Transfer Protocol” o “Protocolo de transferencia de ficheros“. Es un protocolo de red utilizado para transferir archivos
desde tu ordenador a un servidor web. Es el método habitual para subir archivos a tu alojamiento, instalar WordPress, etcétera. El proceso
se realiza con software especializado, llamados “Clientes FTP“, muy similares al Explorador de Windows o el Finder de Mac OSX, en los
que dispones de ventanas donde se muestran tus carpetas y las del servidor remoto, pudiendo “arrastrar y soltar” archivos de un sitio a otro.
 índice
glosario

54
G

Galería
Las galerías de archivos son una gran manera de compartir fotos, documentos, audios, etcétera con los usuarios. En una galería se mostrará
una serie de pequeñas imágenes y archivos adjuntos en una determinada entrada o en una página. Los lectores pueden hacer usar un carru-
sel que les permite desplazarse a través de la galería, abrir las imágenes en tamaño completo o descargar los documentos disponibles.

GPL
Licencia Pública General de GNU o más conocida por su nombre en inglés GNU General Public License (o simplemente sus siglas del in-
glés GNU GPL) es la licencia más ampliamente usada1 en el mundo del software y garantiza a los usuarios finales (personas, organizacio-
nes, compañías) la libertad de usar, estudiar, compartir (copiar) y modificar el software. Su propósito es declarar que el software cubierto
por esta licencia es software libre y protegerlo de intentos de apropiación que restrinjan esas libertades a los usuarios.

Mas información:

• Varias licencias y comentarios acerca de las mismas

• The GNU General Public License (en inglés)

• Creative Commons (en inglés)

• Software libre
 índice
glosario

55
H

Herramientas asistivas
Para poder llevar a cabo algunas tareas, las Personas en situación de Discapacidad pueden recurrir a Tecnologías Asistivas, las cuales co-
rresponden a todo tipo de objetos, equipos, sistemas, máquinas, herramientas, productos, instrumentos, programas y/o servicios que puede
ser usado para aumentar, mantener, compensar, mejorar o reemplazar las capacidades funcionales de personas con alguna dificultad en su
desempeño o Discapacidad (de cualquier tipo).

Más información:

• Tecnologías asistivas y estrategias adaptativas

Hipertexto
Una o varias palabras de un texto que se presentan en forma de enlace y al hacer clic en ella(s) te llevan a otra página web donde puedes
encontrar información complementaria. Estas palabras a menudo aparecen subrayadas, muchas veces en color azul, pero siempre en un co-
lor diferente al resto del texto.

Hoja de estilos
Archivo denominado style.css, donde usando el lenguaje de programación CSS se definen los estilos visuales del tema elegido. Los sitios
tienen al meno 1 hoja de estilos.

HTML
Es la sigla del nombre del “idioma” que se utiliza para crear páginas web y otro tipo de publicaciones en Internet (como blogs, comentarios
en foros, etc.) El nombre de este lenguaje es “Lenguaje de Etiquetado de Hipertexto”, que en inglés es HyperText Markup Language, de
ahí la sigla. El HTML funciona en base a instrucciones en un código especial compuesto por las llamdas “tags” (etiquetas) que se le da al
navegador y éste, al interpretar estas instrucciones, presenta al lector la página web como la vemos normalmente.
 índice
glosario

56
I

Imagen de texto
El texto que ha sido presentado en forma no textual (por ejemplo, una imagen) para conseguir un efecto visual determinado. Esto no inclu-
ye el texto que forma parte de una imagen que contiene otros elementos visuales significativos. Por ejemplo: La etiqueta con el nombre de
la persona que aparece en una fotografía.

Imagen destacada
Una imagen destacada es la foto de inicio de algunas de la entradas o paginas, al mismo tiempo, es una imagen en miniatura que normal-
mente se usa en paginas que visualizan listas de entradas.

Internet
Es una red mundial compuesta por cientos de miles de redes que interconectan millones de computadoras mediante procedimientos llama-
dos protocolos. Contrario a lo que se piensa comúnmente, Internet no es sinónimo de World Wide Web, también llamada “la Web”.

La World Wide Web (un sistema de publicación y navegación de documentos y páginas web) es uno de los muchos servicios que ofrece
Internet, como el correo electrónico, los boletines electrónicos, las conversaciones en línea, la mensajería instantánea, e incluso los juegos
en línea.

El término Internet viene del inglés interconnected networks: redes interconectadas.

 índice
glosario

57
J

Jakob Nielsen
“El rey de la Usabilidad”, Jakob Nielsen es asociado con el término de Usabilidad en la web, tiene un Ph.D en la carrera de Interacción de
los humanos y las computadoras, escribió el libro Homepage Usability en el cual realiza críticas de la usabilidad y diseño de 50 páginas
web, es fundador de Nielsen Norman Group y ha sido nombrado como el rey y guru de la usabilidad.

Más información:

• Jakob Nielsen

• Jakob Nielsen “El rey de la Usabilidad”

 índice
glosario

58
L

Leyenda de imagen
Una leyenda es un texto conciso, breve y descriptivo ubicado debajo o al lado de una fotografía que se usa a manera de etiqueta, título o
explicación de la imagen que aparece en la misma. A menudo, una leyenda incluirá fechas, nombres, títulos, ubicaciones e información
acerca de la ocasión o la importancia de la imagen.

Link
Es una herramienta de navegación que permite a un usuario ir de una locación web a otro haciendo clic sobre él. Generalmente están subra-
yados o aparecen con otro color.
 índice
glosario

59
M

Menú de navegación
Los menús de navegación son elemento esencial en un sitio web. De su buen diseño y organización dependerá en buena medida que nues-
tros visitantes encuentren fácilmente la información que buscan en nuestro sitio y que tengan una buena experiencia como usuarios. En este
sentido, a través de un menú de navegación se estructuran las diferentes subpáginas de un sitio.

Los menús se organizan siguiendo el principio de los árboles, esto quiere decir que un menú puede tener menús hijos y menús padres.

Metadatos
Son datos que describen otros datos. En general, un grupo de metadatos se refiere a un grupo de datos, llamado recurso. El concepto de
metadatos es análogo al uso de índices para localizar objetos en vez de datos. Por ejemplo, en una biblioteca se usan fichas que especifican
autores, títulos, casas editoriales y lugares para buscar libros. Así, los metadatos ayudan a ubicar datos.

Para varios campos de la informática, como la recuperación de información o la web semántica, los metadatos en etiquetas son un enfoque
importante para construir un puente sobre el intervalo semántico.

También hay muchas otras definiciones como «informaciones sobre datos», «datos sobre informaciones», «informaciones sobre infor-
maciones», «descripciones estructuradas y opcionales que están disponibles de forma pública para ayudar a localizar objetos» o «datos
estructurados y codificados que describen características de instancias conteniendo informaciones para ayudar a identificar, descubrir,
valorar y administrar las instancias descritas».

Motor de búsqueda
También llamado “buscador”, es una inmensa base de datos con información sobre el contenido de los sitios que integran la web. Por ejem-
plo, el buscador más popular actualmente, Google, tiene información sobre más de 3 mil millones de sitios web. Cuando tú introduces una
frase o palabra, el motor buscará en su base de datos y te devolverá los resultados en un orden determinado. Los motores de búsqueda em-
plean arañas (del inglés spiders) para recopilar la información. Las arañas están continuamente rastreando los sitios web, recopilando datos
y siguiendo los enlaces de las páginas para mantener sus resultados al día. Los motores de búsqueda enfatizan diferentes componentes de
un sitio web. De esta manera, determinan el orden en el que los sitios web deben aparecer en los resultados de una búsqueda.
 índice
glosario

Multimedia
60 El término multimedia se utiliza para referirse a cualquier objeto o sistema que utiliza múltiples medios de expresión físicos o digitales
para presentar o comunicar información. Los medios pueden ser variados, desde texto e imágenes, hasta animación, sonido, video, etc.
También se puede calificar como multimedia a los medios electrónicos u otros medios que permiten almacenar y presentar contenido multi-
media. Multimedia es similar al empleo tradicional de medios mixtos en las artes plásticas, pero con un alcance más amplio.
 índice
glosario

61
N

Navegador
Es un programa para los usuarios puedan visualizar, en forma de páginas web, documentos escritos en códigos especiales para Internet.
Algunos de los navegadores más conocidos son Firefox, Chrome, Internet Explorer, Safari y Opera. Los navegadores permiten visualizar y
ejecutar gráficos, videos, sonido y animaciones, además de los textos y los enlaces.

Netiqueta
Es el nombre que recibe el conjunto de convenciones que ordenan el comportamiento en espacios virtuales.

Más información:

• Netiqueta

• Netiquetate
 índice
glosario

62
P

Página
Es otro tipo de publicación que se puede crear en WordPress para enlazarlo desde los menús o enlaces personalizados. Están pensadas para
contener información que no suele variar habitualmente.

Panel de administración
Esta es la pantalla que verás cuando inicies sesión en tu sitio, que te da acceso a todas las funciones de gestión de tu sitio.

PDF accesible
Los archivos en formato PDF también deben ser compatibles con los lectores de pantalla y requieren unas características muy similares a
las que requieren las páginas web (texto alternativo para imágenes, enlaces que describan su destino, lenguaje sencillo, buen contraste de
colores, etcétera).

Además de estas cuestiones, hay algunas específicas para documentos PDF. La más importante, es organizar la información usando etique-
tas. El contenido ordenado de forma jerárquica, dividido, por ejemplo, en capítulos o temas, facilita mucho la comprensión y lectura del
texto. Usaremos por tanto, las funciones del procesador de textos que permiten insertar, títulos, cabeceras, pies de página, viñetas, etc., así
como los estilos.

Más información:

• Guía para la creación de documentos PDFs accesibles a partir de un procesador de texto.

• Creating Accesible Adobe PDF files (en inglés)

• Lectura de documentos PDF con reflujo y funciones de accesibilidad

Pendiente de revisión
Otro estado de publicación, similar al borrador pero que queda marcado para que lo revise otro usuario responsable del contenido. Es el
estado de publicación por defecto para el usuario con rol de Colaborador, pues requiere la revisión de un usuario con rol de Editor o Admi-
nistrador.
 índice
glosario

PHP
63 Lenguaje de programación de uso general de código del lado del servidor originalmente diseñado para el desarrollo web de contenido diná-
mico.

PHP es un acrónimo recursivo que significa PHP Hypertext Pre-processor (inicialmente PHP Tools, o, Personal Home Page Tools). Fue
creado originalmente por Rasmus Lerdorf; sin embargo la implementación principal de PHP es producida ahora por The PHP Group y sirve
como el estándar de facto para PHP al no haber una especificación formal. Publicado bajo la PHP License, la Free Software Foundation
considera esta licencia como software libre.

Puede ser desplegado en la mayoría de los servidores web y en casi todos los sistemas operativos y plataformas sin costo alguno. El len-
guaje PHP se encuentra instalado en más de 20 millones de sitios web y en un millón de servidores. El enorme número de sitios en PHP ha
visto reducida su cantidad a favor de otros nuevos lenguajes no tan poderosos desde agosto de 2005.

Más información:

• The PHP Group (en inglés).

pixel - píxel - px
Es el nombre que se le ha dado a la unidad más pequeña de una imagen digital. El nombre proviene del inglés Picture Element (elemento
de la imagen). Ampliando cualquier imagen lo suficiente, finalmente se verá que está formada por cientos de miles de pequeños cuadrados
alineados, cada uno de un diferente color. Cada uno de estos cuadraditos es un pixel. En una imagen los pixeles pueden ser más grandes o
más pequeños. Mientras más grandes son, la imagen es más borrosa, mientras más pequeños, es más nítida y tiene más detalles.

Plantillas de página
Distintas distribuciones de diseño que puede tener una página creada con WordPress.

Plugin
Pequeña aplicación que puedes instalar para mejorar, cambiar o añadir funcionalidades a WordPress.

Popup window
El término denomina a las ventanas que emergen automáticamente (generalmente sin que el usuario lo solicite). A menudo, las ventanas
emergentes se utilizan con el objeto de mostrar un aviso publicitario de manera intrusiva. Una técnica relacionada a esta es la denominada
pop-under (que consiste en abrir de manera intempestiva nuevas ventanas que se sitúan detrás de la ventana en uso).
 índice
glosario

Programáticamente determinado
64 Algo que ha sido programáticamente determinado es un elemento que se a creado, configurado o desarrollado por medio de programación.
 índice
glosario

65
R

Ríos Blancos
Habitualmente, cuando la columna de texto justificado es estrecha en relación al tamaño del mismo, el navegador no parte las palabras, así
que se limitará a igualar los espacios blancos entre palabras sin más control. Es posible que quede bien, pero en la mayoría de los casos se
producirán esos ríos blancos que estropearán el diseño.

La mayoría de los usuarios con dificultades de lectura, encuentran problemas con el texto justificado a ambos lados, y justificado a la de-
recha. El irregular espacio en blanco que se produce entre palabras, puede causar ‘ríos de espacios blancos’ hacia abajo, provocando una
lectura difícil y en algunos casos imposible para algunos lectores.

Más información:

• River - typography (en inglés).

Rol de usuario
WordPress es un CMS multiusuario, y cada usuario puede tener un perfil y capacidades distintas. Los roles de usuario estándar de Word-
Press son, en orden descendente de capacidades: Administrador – Editor – Autor – Colaborador – Suscriptor. En este sentido, el equipo de
desarrollo de la UCUR construye los roles de los usuarios en función de las necesidades de los distintos sitios.
 índice
glosario

66
S

Shortcode
Códigos cortos utilizados en el editor de texto para “invocar” funciones previamente definidas en plugins u otras funciones.

Sistema de Gestión de Contenidos

También llamado “gestor de contenidos”. Es un sistema que permite crear y administrar contenidos principalmente en páginas web. Este
tipo de sistema permite manejar de modo independiente el contenido y el diseño. Así, es posible editar el contenido y darle en cualquier
momento un diseño distinto al sitio sin tener que volver a construírlo. Además, permite que varios editores publiquen, de manera fácil y
controlada. El propio WordPress es uno de los Sistemas de Gestión de Contenido más conocidos y usados. (Abreviatura: CMS, del inglés
Content Management System.)

Sitio web
Es un conjunto de páginas colocadas en Internet. Forman un todo coherente en cuanto a tema y, generalmente, a diseño. Se accede a ellas a
través de un mismo dominio en Internet. De acuerdo a Netcraft, en febrero de 2012 había más de 612 millones de sitios web en el mundo.
Todos los sitios web públicamente accesibles constituyen una gigantesca “World Wide Web” (red mundial, abreviado www) de informa-
ción.

Slug
Es la parte única de una dirección web o URL. Por ejemplo, en la URL http://ayuda.com/ayuda-slug/ el slug es la parte ayuda-slug.

Software libre
El software libre (en inglés “free software”, aunque esta denominación a veces se confunde con “gratis” por la ambigüedad del término
“free” en el idioma inglés, por lo que también se usa “libre software”) es la denominación del software que respeta la libertad de todos los
usuarios que adquirieron el producto y, por tanto, una vez obtenido el mismo puede ser usado, copiado, estudiado, modificado, y redistri-
buido libremente de varias formas. Según la Free Software Foundation, el software libre se refiere a la libertad de los usuarios para ejecu-
tar, copiar, distribuir, y estudiar el mismo, e incluso modificar el software y distribuirlo modificado.

El software libre suele estar disponible gratuitamente, o al precio de costo de la distribución a través de otros medios; sin embargo no es
obligatorio que sea así, por lo tanto no hay que asociar software libre a “software gratuito” (denominado usualmente freeware), ya que,
 índice
glosario

conservando su carácter de libre, puede ser distribuido comercialmente (“software comercial”). Análogamente, el “software gratis” o “gra-
67 tuito” incluye en ocasiones el código fuente; no obstante, este tipo de software no es libre en el mismo sentido que el software libre, a me-
nos que se garanticen los derechos de modificación y redistribución de dichas versiones modificadas del programa.

Más información:

• The Open Source Initiative (en inglés).

• Mapa conceptual del software libre (imagen).

• Categorías de software libre y software que no es libre.

• Varias licencias y comentarios acerca de las mismas.

• Fundación Software Libre América Latina.

• Guía práctica sobre software libre: su selección y aplicación local en América Latina y el Caribe.
 índice
glosario

68
T

Texto alternativo
El texto alternativo (atributo alt) proporciona información alternativa para una imagen u objeto si un usuario por alguna razón no puede
verlo (a causa de conexión lenta, un error en el atributo src, o si el usuario utiliza una herramienta asistiva).

Texto sin formato

Es sólo texto. Es un formato que crea un mensaje sólo con texto, es decir, sólo caracteres. Es lo opuesto al formato enriquecido: este for-
mato permite aplicar formato al texto y mostrar imágenes; entonces, por ejemplo, cuando se pega en un editor de textos un párrafo con
formato enriquecido, se pegará en el mismo al tamaño de la tipografía, colores, imágenes, etcétera. Si queremos que ese párrafo se coloque
manteniendo el formato que está en el editó de texto, debemos pegarlo sin formato; es decir, sólo texto, sin estilos.

Título de imagen
Prácticamente todos los elementos de un sitio pueden llevar titulo. Se usa para describir enlaces, imágenes, tablas y otros elementos HTML
estructurales. Son más versátil que el atributo ALT y muchos motores de búsqueda lean el texto del título atributos como contenido regular
de las páginas.

Título de enlace
Prácticamente todos los elementos de un sitio pueden llevar titulo. Se usa para describir enlaces, imágenes, tablas y otros elementos HTML
estructurales.

El titulo permite introducir una descripción que se muestra cuando se coloca el puntero del mouse sobre el enlace. Es importante colocarlo
cuando el enlace en sí o su contexto no da cuenta de su destino o uso.
 índice
glosario

69
U

URL
Un localizador de recursos uniforme, más comúnmente denominado URL (sigla en inglés de uniform resource locator), es una secuencia de
caracteres, de acuerdo a un formato modélico y estándar, que se usa para nombrar recursos en Internet para su localización o identificación,
como por ejemplo documentos textuales, imágenes, vídeos, presentaciones digitales, etc. Los localizadores uniformes de recursos fueron
una innovación en la historia de la Internet. Fueron usadas por primera vez por Tim Berners-Lee en 1991, para permitir a los autores de do-
cumentos establecer hiperenlaces en la World Wide Web. Desde 1994, en los estándares de la Internet, el concepto de URL ha sido incorpo-
rado dentro del más general de URI (Uniform Resource Identifier, en español identificador uniforme de recurso), pero el término URL aún
se utiliza ampliamente para que los usuarios que entren en ella tengan una buena visión para ellos.

Usabilidad
Facilidad con que las personas pueden utilizar una herramienta particular o cualquier otro objeto fabricado por humanos con el fin de alcan-
zar un objetivo concreto. El modelo conceptual de la usabilidad, proveniente del diseño centrado en el usuario, no está completo sin la idea
utilidad. En inglés, utilidad + usabilidad es lo que se conoce como usefulness.

Jakob Nielsen definió la usabilidad como el atributo de calidad que mide lo fáciles que son de usar las interfaces Web. El autor señana que
existen 5 reglas principales que adaptadas a una web, se les puede considerar como un web “usable”:

1. Rápido - Las páginas deben cargarse en una media de 4 segundos. En promedio, no se espera más de 10 segundos para ver el contenido
de una página web. La mayoría de los usuarios disponen de módem para su acceso a Internet, por lo que nuestras páginas deben de ser
lo menos pesadas posibles con el fin de que los usuarios no esperen mucho tiempo, porque de lo contrario cancelarán la visita.

2. Simple - Mantenga una navegación constante. No fuerce a los visitantes a aprender diversos caminos o esquemas para la navegación en
diversas partes de su site. - No abuse de la utilización de la animación, esto puede abrumar y cansar la vista.

3. Investigable - Los motores de búsqueda buscan el texto real. No prestan ninguna atención a los gráficos y al código de programación
(como el Javascript). Evite estas situaciones si desea que su web esté bien posicionada en los buscadores.

4. Para la mayoría - Los Sitios Web necesitan ser compatibles con todos los navegadores y ordenadores para su fácil usabilidad. - Utilice
HTML simple y llano siempre que sea posible, es el código más compatible con todos los navegadores.

5. Manténgalo actualizado - La manera más rápida para que una web pierda credibilidad es contener la información anticuada.
 índice
glosario

70
V

Ventana emergente
Son ventanas que emergen automáticamente (generalmente sin que el usuario lo solicite). A menudo, las ventanas emergentes se utilizan
con el objeto de mostrar un aviso publicitario de manera intrusiva. Son llamadas también Popup Windows. Una técnica relacionada a esta
es la denominada pop-under, que consiste en abrir de manera intempestiva nuevas ventanas que se sitúan detrás de la ventana en uso.
 índice
glosario

71
W

W3C
World Wide Web Consortium, abreviado W3C, es un consorcio internacional que produce recomendaciones para la World Wide Web. es
una comunidad internacional donde las organizaciones Miembro, personal a tiempo completo y el público en general trabajan conjunta-
mente para desarrollar estándares Web.

Más información:

• Página oficial de la W3C en español.

WCAG
En español: pautas de accesibilidad del contenido web y móvil. Se componen de un conjunto de directrices para hacer el contenido web
accesible para todos los usuarios pero, sobre todo para los usuarios con discapacidad. La versión actual, 2.0, también es una norma ISO,
ISO / IEC 40500:2012.

Más información:

• Web Content Accessibility Guidelines (WCAG) 2.0 (en inglés).

• Web Content Accessibility Guidelines (WCAG) Overview (en inglés).

• Web Content Accessibility Guidelines (WCAG) 2.0 - W3C Recommendation (en inglés).

• SO/IEC 40500:2012 - Information technology - W3C Web Content Accessibility Guidelines (WCAG) 2.0 (en inglés).

Web semántica
La Web semántica es un conjunto de actividades desarrolladas en el seno de World Wide Web Consortium tendente a la creación de tecno-
logías para publicar datos legibles por aplicaciones informáticas (máquinas en la terminología de la Web semántica). Se basa en la idea de
añadir metadatos semánticos y ontológicos a la World Wide Web. Esas informaciones adicionales (que describen el contenido, el significa-
do y la relación de los datos) se deben proporcionar de manera formal, para que así sea posible evaluarlas automáticamente por máquinas
de procesamiento. El objetivo es mejorar Internet ampliando la interoperabilidad entre los sistemas informáticos usando “agentes inteligen-
 índice
glosario

tes”. Agentes inteligentes son programas en las computadoras que buscan información sin operadores humanos.
72 Más información:

• Entendiendo La web semántica.

• The Semantic Web: An Introduction (en inglés).

• Biblioteca Digital y Web Semántica.

• Procedimiento para transformar la web en web semántica.

WordPress
WordPress es un sistema de gestión de contenido o CMS (por sus siglas en inglés, Content Management System). Ha sido desarrollado en
PHP para entornos que ejecuten MySQL y Apache, bajo licencia GPL y código modificable. WordPress se ha convertido junto a Movable
Type en el CMS más popular con respecto a cualquier otro CMS de aplicación general. Las causas de su enorme crecimiento son, entre
otras, su licencia, su facilidad de uso y sus características como gestor de contenidos.

Otro motivo a considerar sobre su éxito y extensión es la enorme comunidad de desarrolladores y diseñadores, encargados de desarrollarlo
en general o crear complementos y temas para la comunidad. En agosto de 2011 era usado por el 14,7 % de todos los sitios existentes en
internet.

Más información:

• WordPress.org (en inglés).

• WordPress.com.

WYSIWYG
WYSIWYG es el acrónimo de What You See Is What You Get (en español, “lo que ves es lo que obtienes”). Se aplica a los procesadores
de texto y otros editores de texto con formato (como los editores de HTML) que permiten escribir un documento viendo directamente el
resultado final.

En el área de diseño web existen también herramientas WYSIWYG, dentro de los llamados CMS (Content Management System); aunque
un CMS no tiene porqué ser WYSIWYG, es decir puede ser un gestor de contenidos cuyo panel de gestión no se corresponda con el diseño
final, sino que en este caso se utiliza un back-end o panel de gestión para crear-modificar los contenidos, que serán reflejados en el front-
end o parte final que ven los usuarios. En el grupo de los CMS WYSIWYG hay varias aplicaciones, incluso alguna de ellas con tecnología
flash, como por ejemplo Easy Site Manager.
 índice

73