viernes, 25 de junio de 2010

probando el invento

Quiero añadir el up tweet pero no me acaba de aparecer donde me gustaría. Esta plantilla de Blogger me está matando .... grrr

Finalmente añado ShareThis con la ayuda de Integrar Share This 2.0 a Blogger

Consejos para una buena vid@ social media

Do's and Don'ts of Social Media for Business
Via: The Steel Method

martes, 8 de junio de 2010

Diseñar tu web para móviles, en busca de estandares

Iniciativas para desarrollar estándares en la Web movil

Recomendaciones y buenas prácticas en el diseño de página web para dispositivos móviles.

Algunos simples consejos de usabilidad a considerar pensando en que nuestra web puede verse también en dispositivos móviles:

- diseñar una versión más sencilla para dispositivos móviles,
- ofrecer la posibilidad al usuario de elegir si desea ver esta versión simplificada o la web para ordenadores,
- utilizar nombres cortos para la dirección de la web,
- optimizar el tamaño de las imágenes para reducir al máximo los tiempos de descarga y pensando en el posible coste económico por ancho de banda consumido. No todos los usuarios disponen de tarifa plana para acceder a internet con su smartphone.

Dispositivos para ver tu web - Media types y Media Queries

En CSS 2.1, podemos especificar hasta 10 tipos de dispositivos posibles:

- all ... apto para todos los dispositivos, es el valor por defecto
- aural / speech ... para sintetizadores de habla
- braille ... dispositivos que reciben feedback táctil en braille
- embossed ... para impresoras braille
- handheld ... para ordenadores de bolsillo (PDA, pantallas pequeñas, ...)
- print ... para material imprimible
- projection ... para presentaciones en proyector (por páginas, sólo visual, interactivo)
- screen ... para pantallas de ordenador en color
- tty ... para teletipos y terminales, no usar pixels como unidad,
- tv ... para televisores ( baja resolución, en color, movimiento limitado por la pantalla, sonido disponible)

En HTML4, se definen:

<LINK REL="stylesheet" TYPE="text/css" MEDIA="print, handheld" HREF="estilo.css">

@media print { p { font-size: 14pt;}

@import url("otroestilo.css") screen;
(cuidado, los "media types" con @import son ignorados por IE5, IE6, IE7 e IE8)

En las recomendaciones para CSS3, se introduce el concepto Media Queries que amplía el control en el rendeado basado en algunas características más concretas de los dispositivos, por ejemplo el ancho de pantalla. La hoja de estilos CSS sólo será aplicable en el dispositivo especificado si la expresión es "verdadera".

<link rel="stylesheet" media="screen and (color)" href="example.css" />
<link rel="stylesheet" media="only screen and (color)" href="example.css" />
<link rel="stylesheet" media="screen and (device-height: 600px)" />


@import url(example.css) screen and (color), projection and (color);

<?xml-stylesheet media="all and (min-color-index: 256)"
href="http://www.example.com/..." ?>


@media screen and (color), projection and (color) { ... }

@media all and (orientation: portrait) { ... }
@media (orientation: portrait) { ... }
@media (min-width: 100px) { ... }
@media handheld and (min-width: 20em),
screen and (min-width: 20em) { ... }

@media screen and (device-aspect-ratio: 16/9) { ... }
@media screen and (device-aspect-ratio: 32/18) { ... }

@media tv and (scan: progressive) { ... }
@media tv and (scan: interlace) { ... }

jueves, 3 de junio de 2010