Siguenos en Twitter - tuProgramador.com
Contactanos por telefono - diseño web
tuProgramador.com empresa de diseño web en valencia
blog

Archivo de la categoría ‘Artículos’

« Entradas más antiguas

Chuleta (Cheat Sheet ) para CSS 2.1

Viernes, 16 de Octubre de 2009

Esta chuleta para CSS2 contiene todas las principales referencias para trabajar con CSS 2.

CSS2 se cimenta en CSS1 (véase [CSS1]) y, con muy pocas excepciones, todas las hojas de estilo CSS1 válidas son hojas de estilo CSS2 válidas. CSS2 brinda soporte a hojas de estilo específicas para cada medio, de modo que los autores puedan adaptar la presentación de sus documentos a los browsers visuales, a los dispositivos sonoros, a las impresoras, a los dispositivos braille, de mano, etc.

Esta especificación también soporta el posicionamiento de contenidos, fuentes descargables, disposición de la página, aspectos para la internacionalización, contadores y numeradores automáticos, y algunas características relacionadas con la interfaz del usuario.

El visual cheat sheet ofrecido por la página web woorkup.com está completo de descripciones detalladas y algunos ejemplos.

Podeis descargar la versión en PDF directamente desde aquí.

FUENTE:
http://woorkup.com/2009/10/02/css2-visual-cheat-sheet/



Publicado en Artículos, Recursos diseño web | 1 comentario »

tawdis.net: Validador de accesibilidad web WCAG 2.0

Miércoles, 14 de Octubre de 2009

En el portal TAW de la Fundación CTIC podemos encontrar un validador de accesibilidad web WCAG 2.0.

Esta versión del analizador de las pautas WGAG 2.0 está en versión BETA pública, sobre la que se irán implementando mejoras durante los próximos meses.

El Área de Tecnología que lo desarrolla, está abierto a las recomendaciones y propuestas de quienes deseen, en el correo info(arroba) fundacionctic (punto) org

Estas son las principales mejoras de este validador WCAG 2.0 con respecto al precedente validador:

  • Incorporación de la validación de la gramática html y css automáticamente en el análisis.
  • Incorporación de nuevas comprobaciones para las hojas de estilo.
  • Actualización del informe de resultados, para proporcionar una mayor información tanto para la detección como ayuda para la reparación de las incidencias encontradas y que esta información se presente de forma clara y precisa/concisa.
  • Nuevo motor de javascript que permite analizar no sólo el código html de la página si no también el código generado dinámicamente mediante este lenguaje.


Publicado en Artículos | 1 comentario »

Usabilidad: Reduciendo el esfuerzo del usuario

Martes, 13 de Octubre de 2009

En este post incluimos alguna de las ideas básicas sobre la usabilidad de una página web que todos deberíamos tener en cuenta.

Además, lo que consideramos especialmente interesante, incluimos tres tests para analizar si una determinada página cumple con nuestros objectivos de usabilidad.

Una de las frases que más representan cualquier estudio de usabilidad es “debemos construir interfaces que reduzcan el esfuerzo del usuario”.

Esta es una de las claves de una interfaz bien diseñada. Es la misma idea que plasmó muy eficazmente Steve Krug en su clásico libro “No me hagas pensar“. La propia apariencia de la interfaz sin observarla en detalle, sin detenerse demasiado para analizarla, debe transmitir el máximo de información posible.

Por ejemplo:

  • la propia apariencia y situación del menú de navegación de un sitio web debe indicar claramente que es el menú del sitio, no debería hacer falta leer sus distintas opciones para inferir que se trata de un menú.
  • debe claramente intuirse la opción activa del menú sin esfuerzo
  • debe identificarse rápido y sin dificultad cual es el logo identificador del sitio
  • qué es enlace y que no
  • cuál es el título de la página

Ejercicios interesantes para saber hasta que punto una determinada página de un sitio cumple este objetivo es la realización de alguno de los test siguientes:


Navigation Stress Test (Autor: Keith Instone)

Método:

  • Seleccionar aleatoriamente una página interna del sitio (no la página de inicio)
  • Imprimir la página en blanco y negro sin que aparezca el URL
  • Imaginando que se ha entrado al sitio por primera vez a través de esta página, se debe tratar de responder a las preguntas siguientes:
    • ¿sobre qué trata esta página?
    • ¿qué sitio es este?
    • ¿cuáles son las secciones principales del sitio?
    • ¿dentro de qué sección principal está la página?
    • ¿qué hay un nivel más arriba?
    • ¿cómo voy a la página de inicio?
    • ¿cómo voy a la página de inicio de la sección?
    • ¿qué representa cada grupo de vínculos?
    • ¿cómo llegas a esta página desde la página de inicio?
  • Marcar sobre el papel las respuestas
  • Tomar a personas que no tengan nada que ver con el sitio y repetir el test


Ensayo del maletero (autor: Steve Krug, aparece en su libro “No me hagas pensar”. A partir de la página 87).

Es similar al Navigation Stress Test pero añadiendo mayor dificultad de visibilidad.

Metodo:

  • Seleccionar aleatoriamente una página interna del sitio (no la página de inicio)
  • Imprimir la página en blanco y negro sin que aparezca el URL
  • Mantenerla a la distancia del brazo o entrecerrar los ojos de forma que no se pueda estudiar muy de cerca
  • Trazar un círculo, tan rápido como se pueda, en todos los elementos siguientes:>
  • Identificador del sitio
  • Nombre de la página
  • Secciones y subsecciones del sitio
  • Navegación local
  • Indicadores de situación
  • Búsqueda


Técnica de Thomas S. Tullis (Vicepresidente de Experiencia de Usuario de Fidelity)

Técnica similar a las anteriores pero añadiendo una nueva dificultad al usuario: los textos deben mostrarse sin significado, ilegibles o en otro idioma.

Todas estas técnicas tienen una ventaja común: se pueden realizar informalmente de formasencilla y detectar, con un coste muy bajo, problemas de usabilidad importantes en nuestras interfaces. Esperamos que os sean útiles en vuestro día a día.

FUENTE:
http://www.usolab.com/wl/2009/10/reduciendo-el-esfuerzo-del-usuario.php



Publicado en Artículos | 2 comentarios »

Como distribuir elementos horizontalmente con CSS

Jueves, 8 de Octubre de 2009

En este articulo vamos a explicar como distribuir horizontalmente varios elementos dentro de un contenedor utilizando CSS.

Suponemos de querer 3 elementos distribuidos horizontalmente dentro de una capa contenedora.

<div id="contenedor">
    <div class="seccion"></div>
    <div class="seccion"></div>
    <div class="seccion"></div>
</div>

Para distribuir los elementos "seccion", dentro de la capa contenedora,
se podría pensar de aplicar un  margin-left a la clase .seccion. 

En este caso pero, tendríamos el problema de la ultima capa a la derecha que no cabría
dentro del contenedor.

La solucion es utilizar el selector CSS :first-child para aplicar un estilo al primer elemento
dentro de la capa contenedora "contenedor".

Primero hay que definir un estilo a la capa contenedora:

#contenedor { width: 640px; height: 300px; }

luego hay que aplicar un estilo a la clase “seccion” de los tres elementos:

.seccion{
    float:left;
    height:300px;
    margin-left:10px;
    width:200px;
}

y entonces podremos sobrescribir el estilo del primer elemento dentro de la capa
contenedora:
#contenedor div:first-child{margin-left:0px;}

Atención: IE6 no soporta este selector.



Publicado en Artículos, Recursos diseño web | 1 comentario »

Todos los ultimos mejores plugins jQuery

Miércoles, 30 de Septiembre de 2009

jQuery es una libreria de JavaScript, pensada para interactuar con los elementos de una web por medio del DOM. Lo que la hace tan especial es su sencillez y su reducido tamaño.

La sencillez de su sintaxis y la poca extensión del código que necesitas escribir son las características más notables. Si hicieras lo que hace jQuery con getElementById y window.onload no solo tendrías que escribir mucho, si no que surgirían muchos errores si no eres un experto en JS.

Aquí teneis una colección de los mejores plugins de jquery.

FacyBox – jQuery Based Facebook/FancyBox Style Lightbox

Es un componente que permite la visualización de imágenes, divs o enteras páginas como si fuera una FancyBox o una ventana de Facebook.

FacyBox – jQuery Based Facebook/FancyBox Style Lightbox

(más…)



Publicado en Artículos, Recursos diseño web | No hay comentarios »

jQuery Visual Cheat Sheet una Chuleta de jQuery 1.3

Jueves, 24 de Septiembre de 2009

La página web de woork es un  recurso muy interesante y proporciona muchisimos recursos sea para diseñadores sea para programadores.

Una de sus ultimas aportaciones es una chuleta para jQuery 1.3. Esta chuleta (o Cheat Sheet ) de 6 páginas, contiene referencia a toda el API jQuery con una descripción detallada y algunos ejemplos de uso.

Podeis visualizar el PDF directamente desde Scribd pinchando aquí.

Podeis descargar el PDF completo desde este enlace.

FUENTE ORIGINAL:
http://woork.blogspot.com/2009/09/jquery-visual-cheat-sheet.html



Publicado en Artículos, Recursos diseño web | 1 comentario »

Papercut: Un sistema facil para testear el envio de correos

Jueves, 24 de Septiembre de 2009

¿Cuantas veces nos hemos encontrado con el problema de testear un envió de correos y no poder instalar un servidor SMTP?

Papercut puede ser una buena solución por lo menos para quien utiliza Windows como sistema operativo para desarrollar.

Esta pequeña aplicación no requiere instalación y proporciona en pocos minutos un servidor SMTP que no envía nada, simplemente te consiente de visualizar todo lo que ha sido enviado.

Podeis descargar Papercut desde este enlace:

DOWNLOAD PAPERCUT

Papercut necesita .NET Framework v3.5 instalado.



Publicado en Artículos | 1 comentario »

Los aspectos legales del marketing en redes sociales

Viernes, 14 de Agosto de 2009

logo IAB-research

La Asociación Interactive Advertising Bureau ha desarrollado junto con Riestra Abogados un estudio sobre los aspectos legales del Web 2.0.

Este documento, elaborado por el despacho jurídico de la Asociación Riestra Abogados,  trata sobre las redes sociales, ya que en ellas confluyen la mayor parte de las acciones de marketing del web 2.0, por lo que es también de interés para todos aquellos que esté diseñando estrategias basadas en este nuevo concepto.

Se tratan los aspectos legales, de acuerdo a la normativa nacional y comunitaria, poniendo énfasis en las obligaciones legales de las partes, tratando aspectos como la legalidad en las acciones de marketing en las redes sociales, las aplicaciones que ofrecen a los usuarios, la aplicación de la LSSI y la LOPD en estos entornos, las condiciones de uso de las aplicaciones basadas en Web 2.0, las políticas de registro de usuario y sus códigos de conducta, temas relativos a la propiedad intelectual, y otro muchos temas de interés.

Podéis descargar la versión PDF y contar con uno de los mejores y más completos documentos sobre los aspectos legales en acciones de marketing en redes sociales de la red.



Publicado en Artículos, Noticias | 2 comentarios »

Symfony 2 será 7 veces mas rapido de symfony 1

Viernes, 5 de Junio de 2009

Dando un vistazo a la presentación de Symfony 2 en la PHPQuebec Conference 2009 en Montreal, se puede comprender un poco más cómo este framework evolucionará y cuáles serán las principales novedades respecto a la versión anterior.

Symfony 2 será una evolución de Symfony 1,  pero tendrá una diferente implementación del controlador, verdadero corazón de un framework MVC.

Los principales objectivos de la Symfony 2, serán la flexibilidad, la velocidad y la elegancia.

Dando un vistazo a la nueva plataforma de Symfony y leyendo la presentación de Fabien, nos damos cuenta que Symfony 2 no será un simple framework MVC, sino que tendrá las clases necesarias para contruir cualquier tipo de framework.

El núcleo( core ) de Symfony 2 será muy ligero y flexible. A diferencia de symfony 1, el núcleo de este nuevo framework será ligero por defecto, no será necesario optimizar los filtros, la cache u otros parámetros avanzados para obtener prestaciones RAW impresionantes.

Fabien asegura que un Hello World en Symfony 2, será 7 veces más rápido que la versión anterior. También precisa que en una implementación real no se apreciará esta diferencia porque el factor que limita las prestaciones no es el framework sino otros factores.

En cualquier caso, unas prestaciones tan altas, demuestran que el “kernel” de Symfony 2 es muy ligero y flexible hasta el punto de permitir por ejemplo el uso de 2 diferentes Symfony frameworks dentro de una única aplicación, con el mismo  comportamiento pero con parámetros de optimización diferentes.

(más…)



Publicado en Artículos | 1 comentario »

Componentes Symfony: Classes Php independientes

Domingo, 17 de Mayo de 2009

Hace casi un mes, en el blog de Symfony se habló de un nuevo proyecto llamado “Symfony Components“.

En este proyecto algunas de las librerias mas importantes desarrolladas para el symfony framework, como por ejemplo sfYaml, se transformarán en componentes independientes.

Desde hoy, estos componentes tendrán una pagina web dedicada en la dirección http://components.symfony-project.org/ en la cual cada componente tiene su propria documentación, API y guias de instalación.

Estos componentes están alojados en el repositorio Subversion de Symfony: http://svn.symfony-project.com/components/.

Por ahora solo está el componente sfYaml, una libreria en PHP puro (sin dependecias con el framework) que se encarga de transformar una cadena YML en un array o un array en una cadena YML.

Los proximos componentes serán Dependency Injection y Event Dispatcher que como ya sabeis, formarán parte de los puntos fuertes de Symfony 2 junto con el nuevo “templating framework” que empezará a ser desarrollado en las proximas semanas.

Muy pronto os contaremos que novedades nos esperan en la segunda version de este fantastico framework php.



Publicado en Artículos | 2 comentarios »
« Entradas más antiguas