RSS
 

Archive for the ‘Interfases’ Category

¿Cómo hacer los textos más fáciles de leer?

22 Feb

Cuando se escribe, en ocasiones podemos tener la falsa creencia que las personas que leen nuestra información tienen conocimientos parecidos a los nuestros, y ésto no siempre es así, y sobre todo si lo que pretendemos es llegar al mayor número posible de lectores o usuarios (objetivo del 99.9% de los sitios web).

Esta claro que si nuestro Web trata de una temática específica es difícil hacer que la lectura sea fácil para cualquier persona. En mi caso concreto, ya no puedo tratar de explicar técnicamente como hacer una imagen accesible a una persona que no tiene conocimientos de html o de lenguajes de programación; pero si podría explicarle los beneficios que supone hacerlo y cual va a ser su resultado, porque quizás ésto si lo entienda todo el mundo.

Por tanto, la regla principal a la hora de redactar textos es que nos abstraigamos y nos pongamos en la piel de un usuario con los conocimientos más básicos posibles.

En nuestro ejemplo de la imagen accesible. Si yo fuera un usuario sin conocimientos de HTML no podría escribir algo así:

“Para hacer una imagen accesible debe usar el atributo alt de la etiqueta html img…”

No podría escribirlo porque sencillamente no tengo esos conocimientos. Pues eso es lo que nos vamos a encontrar si escribimos algo así, que sólo lo van a entender aquellas personas que tengan conocimientos HTML, el resto posiblemente se aburran y no vuelvan a visitar nuestro sitio Web porque se han dado cuenta de que no hay información que a ellos les interesa.

En cambio, si para tratar el tema de las imágenes accesibles escribo algo como ésto:

“Mediante la inserción de una breve descripción (alt) a la imagen conseguimos que cualquier persona pueda comprender la información transmitida por esa imagen…”

Un usuario con conocimientos en html, sabrá que existe una etiqueta img y que si usa su atributo alt para colocar la breve descripción está haciendo la imagen accesible. Por otra parte, otro usuario sin conocimientos html, sólo se va a quedar que es posible hacer una imagen accesible para cualquier persona, la forma de hacerlo no sabe cuál es, pero da igual si tampoco tiene conocimientos html, pero lo importante es que se le puede pasar una breve descripción a la imagen y de esta forma cualquier persona comprendería la información de esa imagen.

Según mi opinión, esta regla fundamental puede agrupar el conjunto de aspectos que hay que tener en cuenta a la hora de redactar textos. Algunos de esos aspectos pueden ser:

  1. Usar un lenguaje claro y conciso.
  2. Transmitir en cada párrafo una sola idea.
  3. No abusar de las sentencias en mayúscula.
  4. Usar un lenguaje familiar y cercano.
  5. No abusar de  palabras pertenecientes a una determinada jerga.
  6. Hay que usar listas cuando sea necesario.
  7. Y por supuesto, utilizar una ortografía y gramática correcta.

Además, no se nos puede olvidar, que las Guías de Accesibilidad del Contenido Web nos exigen que los textos de los sitios Web sean legibles.

¿Pero esto de la legibilidad de los textos puede resultar un tanto subjetivo?Pues puede ser, pero existen diferentes algoritmos que nos miden la legibilidad de nuestros textos. Por ejemplo, uno de los que más me gustan y es más conocido (para textos en español) es el de Huerta Reading Ease. Para usarlo existe una herramienta llamada TxReadability que nos calcula la legibilidad de nuestros textos. Su puntuación va de 0 a 100, y se estima que se necesitan valores por encima de 60 para considerar que un texto es suficientemente legible.

Por cierto, este texto completo tiene una puntuación de 80.39 (Fácil de leer)

fuente: http://www.mqaccesibilidad.com

SocialTwist Tell-a-Friend
 

Truco: amplia el máximo de pestañas abiertas en IE7

26 Oct

Si en nuestro trabajo o actividad habitual necesitamos de la apertura de un número alto de pestañas abiertas en Internet Explorer 7 es posible que hayamos experimentado algunos problemas en la gestión de estas mismas. ie7_logo.jpgEn este caso, para solucionar esto, tan solo deberemos hacer una modificación en el registro muy simple que nos permitirá ampliar el límite de estas sin que el programa acabe con un comportamiento no deseado.

Abrimos el editor de registro regedit.exe desde el cuadro de búsqueda del menú inicio de Vista o desde el elemento de menú ejecutar y cuando tengamos el editor abierto, buscamos la siguiente rama:

HKEY_LOCAL_MACHINE\System\CurrentControlSet\Control\
SessionManager\SubSystems/

Del listado de ítems de registro que nos muestra, hacemos doble click sobre la línea con nombre Windows, donde nos saldrá una ristra de valores como estos:

SystemRoot\system32\csrss.exe ObjectDirectory=\Windows SharedSection=1024,3072,512 Windows=On SubSystemType=Windows ServerDll=basesrv,1 ServerDll=winsrv:UserServerDllInitialization,3 ServerDll=winsrv:ConServerDllInitialization,2 ProfileControl=Off MaxRequestThreads=16

Donde deberemos cambiar el valor 3072 por 4096 o 5120. Esto lo que nos hará es aumentar el “Desktop Heap” o lo que sería el límite que tiene el sistema operativo para gestionar nuestras ventanas, menús o hasta servicios corriendo en Windows.

Vía | Libro Tricks of the Microsoft Windows Vista Masters de J. Peter Bruzzese

fuente:genbeta.com

SocialTwist Tell-a-Friend
 

Crea redes sociales.

30 Sep

Elgg es una aplicación open source que permite crear redes sociales de forma sencilla y con bastantes características que completarán nuestra web.

elgg.png

Entre las características del administrador nos encontramos con administración de usuarios, objetos, ficheros y del sitio, gráficas con relaciones de los usuarios, múltiples sitios por instalación, internacionalización, sistema de etiquetas, ACL, vistas, eventos, plugins y API para widgets.

Además permite RSS, FOAF, XFN, OpenId, OpenSocial, OAuth, JSON, Ajax con jQuery, sistema de caché que permite memcached.

Lógicamente, el usuario final dispondrá de su perfil, panel, feeds de su actividad, preferencias, blog, aplicaicones OpenSocial, repositorio de ficheros, foros y mucho más.

Elgg necesita PHP 5.2+, Apache, GD, MySQL 5+ y mod_rewrite. A parte OpenSocial necesita Mcrypt y la librería PHP SOAP.

Elgg

Vía / WebAppers

SocialTwist Tell-a-Friend
 

Como cambiar o añadir un estilo a phpBB

03 Apr

phpBB viene con una plantilla por defecto, subsilver, pero hay disponibles muchísimas más. El proceso para cambiar la plantilla es muy fácil y podemos añadir cuantas plantillas queramos.

Elección de plantillas

Lo primero que tenemos que hacer, es elegir la plantilla que queremos añadir a nuestro foro. Para ello, nos vamos a ver las “demos” que phpBB pone a nuestra disposición en esta dirección: http://www.phpbb.com/styles/styles_demo/

Cómo podes ver, la página está dividida en dos partes, en el panel de la izquierda, tenéis un listado de todos los estilos disponibles, pinchando sobre cada uno de ellos, podréis ver su apariencia en el panel derecho. Apuntamos el nombre de la plantilla que nos gusta.

Descarga de la plantilla

Una vez que hemos elegido la plantilla que nos gusta nos vamos a la página de descarga de plantillas en esta dirección: http://www.phpbb.com/styles/downloads/.
La página de descarga de plantillas está dividida en categorías, sin embargo, en la demo, no nos dicen a que categoría pertenece la plantilla que nos gusta. Así que habrá que ir entrando en cada una de las categorías y Buscar la que nos interesa.

Preparación de la plantilla para instalarla

Cómo regla general, lo único que hay que hacer para instalar un nueva plantilla es descomprimirla y subirla al directorio phpBB2/templates, veréis que en el directorio templates, tenéis una carpeta subsilver, cada estilo tendrá su propia carpeta.

Añadir el estilo

En el panel de control, nos vamos al menú Administración de estilos, pulsamos sobre agregar. Ahí verás una lista de los estilos que están en el directorio templates y que todavía no han sido añadidos al foro. Al lado de cada uno de los estilos, verás un enlace que pone “instalar“.

Asegúrate de que la carpeta tiene exactamente el mismo nombre que el archivo cfg y css.

Configurar el estilo

Ahora que ya tenemos el estilo añadido a nuestro foro, podemos configurarlo para que sea el estilo por defecto del foro. Para ello, en el panel de control nos vamos al menú Administración general y pulsamos sobre configuración. En ” Configuración General del Foro ” vamos al campo “estilo por defecto” y elegimos el nuevo estilo que acabamos de añadir. En el siguiente campo puedes elegir si quieres que tus usuarios puedan decidir qué estilo prefieren o que no puedan hacerlo. Si seleccionas la opción “ignorar el estilo del usuario”, éste verá siempre el que tu tengas definido por defecto, independientemente del que tenga seleccionado en su panel de control.

Nota final:

Si dispones de varias plantillas, tienes que tener en cuenta que al instalar modificaciones o hacks, que impliquen cambios en las plantillas, tendrás que realizar los cambios en todas y cada una de las plantillas que tengas instaladas.

Autor: tomatoma.ws
Via: http://www.webtaller.com/construccion/lenguajes/php/lecciones/cambiar-anadir-estilo-phpbb.php?bol0308-5

SocialTwist Tell-a-Friend
 

Pogo, navegador con interfase 3D

29 Mar

pogo interface 3d

Pogo es un navegador que implementa un interfaz 3D y que ha sido desarrollado por Vizible y AT&T. Este navegador está basado en Firefox y quiere que podamos manejar las páginas de una forma más visual, sustituyendo las pestañas por miniaturas de las páginas.

Dispone, además, de un modo de visualización de nuestros favoritos, en el que podremos movernos de forma similar a Coverflow, con la posibilidad de crear colecciones en ellos. También nuestro historial de navegación puede verse de forma visual.

Aunque este interfaz funcione muy bien, Pogo tiene varias contrapartidas: está basado en Firefox pero solo funciona en Windows, incluye publicidad y solo se puede utilizar el buscador de Google y el de AT&T.

Articulo relacionado en webtodoweb.com : SpaceTime – Navegador web en 3D
Fuente: genbeta.com

SocialTwist Tell-a-Friend
 

10 errores en el diseño de aplicaciones

25 Feb

Un articulo en el que se nos explica diez errores que se cometen cuando se diseña una aplicación, un resumen sería el siguiente:

  • Controles no estándares: los enlaces, botones, radio buttons y demás controles tienen una utilidad específica y estándar. Cambiar el comportamiento no es lo correcto y no hace más que confundir al usuario.
  • Inconsistencia: diferentes cosas para una misma utilidad, usa lo mismo en el mismo lugar para la misma acción.
  • Acciones no perceptibles: se debe saber qué acción realiza un control a simple vista. Si hay que investigar para qué sirve algo no cumple su cometido.
  • Controles sin reacción: cada control debe indicar 3 cosas: mostrar a los usuarios el estado actual, cómo se interpretan los comandos y qué está pasando.
  • Malos mensajes de error: no basta con decir que hay un error, sino que es lo que ha pasado y que se puede hacer para solucionarlo.
  • Preguntar por lo mismo dos veces
  • No hay valores por defecto: os valores por defecto sirven para que haya más rapidez en las respuestas, para enseñar mediante el ejemplo y para dirigir a usuarios novatos.
  • No explicar cómo funciona la aplicación: en aplicaciones estándar eso no es muy problemático, pero en otras aplicaciones hay que explicar qué se puede conseguir y cómo y no únicamente acceder a la aplicación.
  • No indicar qué se hace con la información
  • Mostrar características internas: al usuario no le importa y no llegará a entender cosas internas de la aplicación, por lo que no es necesario que el usuario lea.

Top-10 Application-Design Mistakes

via: sentidoweb.com

SocialTwist Tell-a-Friend
 

Importancia de los espacios en blanco en el diseño

11 Feb

El espacio que rodea a este bloque de texto es tan importante como otros factores, como el uso apropiado del color, el tipo y gráficos.

El espacio que rodea a este bloque de texto es tan importante como otros factores, como el uso apropiado del color, el tipo y gráficos. Lo sé, hay una tendencia, especialmente en la web, de rellenar todos y cada uno de los rincones con texto. “El espacio en blanco está mal”, parece ser el eslogan, “¡debe ser eliminado!” “¡Abajo con espacios en blanco!”

Lo gracioso es que, a la mayoría de nosotros nos han enseñado desde la escuela primaria a utilizar los espacios en blanco. Recuerdo como mis maestros siempre insistian en que pusieramos un margen de 2cm en el lado izquierdo de cada página. Nos lo metieron tanto en la cabeza, hasta que se convirtió en un hábito que no he podido romper, incluso hasta el día de hoy. Lo cual es en realidad un gran hábito.

Entonces, ¿por qué es tan importante el espacio en blanco? Parte de la razón es psicológica y parte física: el texto necesita espacio para respirar. Cuando grandes cantidades de texto cruzan de lado a lado los bordes de la página, nos dan la sensacion de multitud y de que algo esta rebosando. Largos pasajes de texto, escritos de lado a lado, cansan a los ojos.

Pruébalo. Coje hoja de papel normal, y escribe varias líneas de texto de un borde de la página al otro, sin dejar ningún espacio en la parte superior o margen izquierdo y derecho. Ahora coje otra hoja de papel y justo en el medio, escribe unas líneas de texto, dejando una generosa cantidad de espacio en blanco en todos los lados (por ejemplo 2.5 cm en cada lado y 3 en la parte superior.) Ahora compara las dos páginas. ¿Cuál es más fácil de leer?

Por cierto, los espacios en blanco no tienen porque ser en blanco. Pueden ser de cualquier otro color. Con espacio en blanco nos referimos a cualquier área vacía (de color o blanco, opaco o transparente) que carece de texto.
En esta columna por ejemplo, te habrás dado cuenta que está rodeada de una generosa cantidad de espacio en blanco. Esto combinado con un menor ancho de columna, mejora la legibilidad del texto y que hace que sea mucho más fácil de leer.

Otra razón para el uso de espacio en blanco se relaciona con un tema que voy a revisar con más detalle en una próxima columna: contraste. Una gran cantidad de espacio en blanco alrededor de un bloque de texto llama mucho la atención del lector, especialmente en un medio donde hay mucho texto, como un periódico, donde cada rincón está lleno de lineas de información.

Al igual que este texto, por ejemplo.

Puedes comprobar que leyendo esta columna de un vistazo, escaneándola, te pararás a ver que pone en esa linea que está tan solitaria, y no prestarás atencion a todos los demas párrafos. Ese es el poder de un espacio en blanco. Muchas veces, en los periódicos como el Wall Street Journal o el New York Times, verás anuncios de página completa, con casi nada más en la página excepto una solitaria frase del texto. Podrias pensar que están tontos o algo, que una empresa paga miles de euros por este anuncio de página completa, y luego no se aprovechan de él llenándolo de texto, mensajes, etc. Y, sin embargo, puede que no puedas evitar saltarte el anuncio. Ese es el poder de los espacios en blanco (y el contraste.).

Así que la próxima vez que te encuentres preparando un informe, un boletín de noticias, o un anuncio de una venta de una casa, piensa en el espacio en blanco. La primera vez que lo haces conscientemente, puede resultar difícil (lo sé) Pero con el tiempo te acostumbrarás a él, y me pregunto cómo hacia las cosas sin el.

Autor: Design matters
http://www.sheriftariq.org/design/whitespace/index.html

SocialTwist Tell-a-Friend
 

Utilidad online para medir la carga de una página

01 Feb

A la hora de realizar una página es importante tener en cuenta el tiempo de carga de una página. Existen aplicaciones muy buenas como jmeter con las que podemos hacer tests de estrés para saber los tiempos de carga de las páginas, pero en algunas ocasiones algo sencillo es lo mejor y lo más cómodo.

El Full Page Test de Pingdom nos ofrece el tiempo de carga del HTML, imágenes, CSS, JavaScripts, RSS, Flash y frames/iframes. A parte nos muestra el momento de inicio de petición, el tiempo hasta el primer bit (TTFB) y el tiempo hasta el último bit (TTLB. Todo esto en una gráfica muy sencilla y aclaratoria.
Vinculo a la aplicacion: http://tools.pingdom.com/fpt/
Fuente: sentidoweb.com

SocialTwist Tell-a-Friend