aNieto2K » Accesibilidad http://www.anieto2k.com Desarrollo web, Wordpress, y alguna cosilla más Wed, 17 Mar 2010 02:57:52 +0000 http://wordpress.org/?v=2.9.2 en hourly 1 10 razones para pasarse a WCAG 2.0 http://www.anieto2k.com/2009/10/09/10-razones-para-pasarse-a-wcag-2-0/ http://www.anieto2k.com/2009/10/09/10-razones-para-pasarse-a-wcag-2-0/#comments Fri, 09 Oct 2009 09:39:41 +0000 aNieto2k http://www.anieto2k.com/?p=9053 Olga Carreras nos deléita con un artículo en el que nos muestra 10 razones para pasarnos a WCAG 2.0.

Artículos relacionados

aNieto2k

]]> http://www.anieto2k.com/2009/10/09/10-razones-para-pasarse-a-wcag-2-0/feed/ 1 Adapta tu Wordpress a la tecnología móvil http://www.anieto2k.com/2009/09/08/adapta-tu-wordpress-a-la-tecnologia-movil/ http://www.anieto2k.com/2009/09/08/adapta-tu-wordpress-a-la-tecnologia-movil/#comments Tue, 08 Sep 2009 22:20:47 +0000 aNieto2k http://www.anieto2k.com/?p=8899 Congreso de Webmasters, disfruté con la charla de Roberto Martín, concretamente con la charla "Web para dispositivos móviles". Una charla que nos introducía de lleno en el futuro de los dispositivos móviles y su acceso a la red. En la charla, se hablaron de muchos números, sobretodo cifras de usuarios potenciales que como desarrolladores no podemos despreciar.
En el mundo hay 6.700.000.000 de personas, de los 4.000.000.000 son usuarios de dispositivos móviles (o al menos existen 4.000.000.000 de dispositivos). 1.400.000.000 millones son usuarios de internet en ordenadores y 550.000 de usuarios de internet a través del móvil, principalmente en países en vías de desarrollo (Rusia, China, Brasil e India, especialmente), donde los móviles son más asequibles. En el 2012 se prevé que los usuarios de internet móvil superen los 1.500.000.000 de usuarios
Este extracto que saco del blog del Congreso del año pasado, nos muestra una cifra que sin lugar a dudas debemos respetar o como mínimo tener en cuenta.

Adapta tu Wordpress

Los que usamos Wordpress lo tenemos realmente fácil, gracias a uno de los tantos plugins de los que podemos hacer uso, adaptar nuestro contenido es tan sencillo que instalar uno de estos plugins:
  1. Wordpress Mobile Plugin
  2. MobilePress
  3. Wordpress Mobile Edition (este es el que estoy usando ahora)
  4. Mowser Wordpress Mobile
  5. Mobilize bt Mippin Wordpress Plugin
  6. Wetomo Wordpress to Mobile
  7. Quick SMS
  8. WP-WAP

Cualquier otro desarrollo

Si por el contrario quieres adaptar el contenido de cualquier otra aplicación, ya sea propia o prefabricada esta serie de opciones te permitirá conseguir el mismo efecto:
  1. Diego Martín (Minid) desarrolló un framework para adaptar fácilmente aplicaciones al iPhone
  2. Recordamos algunos consejos para desarrollar para el iPhone
  3. Google Mobilizer, haz tu web móvil (y fea) con esta herramienta de Google.
  4. Ubik, más fácil no puede ser. 4 pasos y tu web para móviles.
  5. jQTouch, adaptación para iPhone con este plugin jQuery.
  6. Muchas más...

Documentación interesante

Os añado información útil al respecto:
  1. Cómo diseñar para la web móvil. Una aproximación práctica (Alzado.org).
  2. Tu sitio web en dispositivos móviles (Maestros del Web),
  3. Mi Web Móvil (interesantes artículos relacionados con la web móvil).
  4. Guía breve de Web Móvil (W3C).
  5. Recursos sobre web móvil (Sortega.com).
¿A que esperas para adaptar tu web?

Artículos relacionados

aNieto2k

]]> http://www.anieto2k.com/2009/09/08/adapta-tu-wordpress-a-la-tecnologia-movil/feed/ 10 Muestra los select cuando imprimas páginas http://www.anieto2k.com/2009/09/07/muestra-los-select-cuando-imprimas-paginas/ http://www.anieto2k.com/2009/09/07/muestra-los-select-cuando-imprimas-paginas/#comments Mon, 07 Sep 2009 14:12:14 +0000 aNieto2k http://www.anieto2k.com/?p=8870 CSS-Tricks.com descubro una técnica basada en Javascript que permite hacer que los elementos <select /> muestren su contenido desplegado y visible para la versión para imprimir.

select-printable (Ver Imagen)

Código

$(function(){
     // Todo los elementos <select />
     $("select").each(function(i){

        var $el = $(this);

        // Cogemos todos los elementos <option />
        var $options = $el.find("option");

        // Añadimos un <div /> y el listado de opciones en <ul />
        $el.after("<div class='print-select'>Options: <ul id=sel"+i+"></ul></div>");

        var $curPrintBox = $("#sel"+i);

        // Añadimos las opciones en forma de lista.
        $options.each(function() {
          $curPrintBox.append("<li>"+$(this).text()+"</li>");
        });
    });
 });
Este código, se encarga de generar un listado con las opciones del <select /> en forma de lista como podemos ver en la imagen superior. Podeis ver una demo funcionando.

Artículos relacionados

aNieto2k

]]> http://www.anieto2k.com/2009/09/07/muestra-los-select-cuando-imprimas-paginas/feed/ 2 CKEditor, la reencarnación de FCKEditor http://www.anieto2k.com/2009/08/29/ckeditor-la-reencarnacion-de-fckeditor/ http://www.anieto2k.com/2009/08/29/ckeditor-la-reencarnacion-de-fckeditor/#comments Sat, 29 Aug 2009 09:48:47 +0000 aNieto2k http://www.anieto2k.com/?p=8813 FCKEditor, aunque para mi gusto era un poco pesado pero eso si, muy completo. Ahora, tras 6 años desde tu aparición han decidido cambiarle el nombre y sobretodo la programación, consiguiendo un editor flexible, elegante, accesible y sobre todo Open Source.

CKEditor, la evolución de FCKEditor (Ver Imagen) CKEditor, ha sido desarrollado con la capacidad de no depender de ningún framework JS, por lo que podemos hacer uso de él desde cualquier aplicación web, sin preocuparnos del Javascript que tengamos en ella.

Instalación

La instalación es tan sencilla como casi todas las instalaciones de aplicaciones Javascript: 
<head>
	...
	<script type="text/javascript" src="/ckeditor/ckeditor.js"></script>
</head>
Una vez que incluimos la llamada al fichero JS que contiene el código necesario para convertir nuestro <textarea /> en un bonito editor. 
<textarea name="editor1">&lt;p&gt;Initial value.&lt;/p&gt;</textarea>
Una vez definido el contenedor de nuestro editor, tendremos que indicar mediante Javascript que CKEditor haga uso de él. 
<script type="text/javascript">
	window.onload = function()
	{
		CKEDITOR.replace( 'editor1' );
	};
</script>
Listo, si has seguido los pasos correctamente, ya deberías tener un bonito editor en lugar del soso <textarea />

Javascript API

Para los desarrolladores inquietos, nos han puesto a nuestra disposición una API en Javascript para extender funcionalidades e interactuar con el editor desde nuestros scripts.

Descargar y Demo

Puedes probarlo directamente desde la página oficial y descargarlo desde aqui.

Artículos relacionados

aNieto2k

]]> http://www.anieto2k.com/2009/08/29/ckeditor-la-reencarnacion-de-fckeditor/feed/ 32 10 errores comunes en el diseño web http://www.anieto2k.com/2009/08/05/10-errores-comunes-en-el-diseno-web/ http://www.anieto2k.com/2009/08/05/10-errores-comunes-en-el-diseno-web/#comments Wed, 05 Aug 2009 17:57:06 +0000 aNieto2k http://www.anieto2k.com/?p=8739 Via Bitacoras descubro un impresionante artículo de Kabytes en el que nos recuerdan 10 errores comunes del diseño web. No tienes desperdicio, altamente recomendable.

Artículos relacionados

aNieto2k

]]> http://www.anieto2k.com/2009/08/05/10-errores-comunes-en-el-diseno-web/feed/ 3 25 reglas para hacer CSS accesibles http://www.anieto2k.com/2009/07/09/25-reglas-para-hacer-css-accesibles/ http://www.anieto2k.com/2009/07/09/25-reglas-para-hacer-css-accesibles/#comments Thu, 09 Jul 2009 20:47:51 +0000 aNieto2k http://www.anieto2k.com/?p=8636 Olga Carreras publica un interesante artículo en el que nos muestra 25 reglas que deberíamos seguir para conseguir que nuestro CSS sea más accesible.

Artículos relacionados

aNieto2k

]]> http://www.anieto2k.com/2009/07/09/25-reglas-para-hacer-css-accesibles/feed/ 2 Creando Javascript Accesible http://www.anieto2k.com/2009/06/05/creando-javascript-accesible/ http://www.anieto2k.com/2009/06/05/creando-javascript-accesible/#comments Fri, 05 Jun 2009 09:03:59 +0000 aNieto2k http://www.anieto2k.com/?p=8379 SentidoWeb descubro este interesante tutorial con el que podemos ser conscientes de los problemas que debemos tener en cuenta y solventar a la hora de desarrollar nuestros scripts en Javascript.

Artículos relacionados

aNieto2k

]]> http://www.anieto2k.com/2009/06/05/creando-javascript-accesible/feed/ 1 Sexy Forms, el bueno, bonito y barato de los scripts para formularios http://www.anieto2k.com/2009/05/25/sexy-forms-el-bueno-bonito-y-barato-de-los-scripts-para-formularios/ http://www.anieto2k.com/2009/05/25/sexy-forms-el-bueno-bonito-y-barato-de-los-scripts-para-formularios/#comments Mon, 25 May 2009 08:23:41 +0000 aNieto2k http://www.anieto2k.com/?p=8276 Eduardo Sada, me avisa de que ya tiene lista una versión estable de Sexy Forms. Se trata de un script desarrollado como plugin de MooTools (está trabajando en la versión jQuery) con el que nos permite hacer formularios más estéticos sin perder la funcionalidad de los elementos del mismo.

sexyforms-example (Ver Imagen) Entre las ventajas que ofrece frente a scripts similares, nos encontramos mejoras estéticas como la posibilidad de usar templates y una integración perfecta en los principales navegadores. Y quizás lo más importante de todo, sin perder la accesibilidad necesaria para que nuestro formulario pueda ser usado por cualquiera y como quiera.

Demo

Eduardo, nos deja una página de ejemplo para que veamos el resultado y descargar el script directamente desde allí.

Artículos relacionados

aNieto2k

]]> http://www.anieto2k.com/2009/05/25/sexy-forms-el-bueno-bonito-y-barato-de-los-scripts-para-formularios/feed/ 10 Google cae y caemos todos http://www.anieto2k.com/2009/05/14/google-cae-y-caemos-todos/ http://www.anieto2k.com/2009/05/14/google-cae-y-caemos-todos/#comments Thu, 14 May 2009 17:01:31 +0000 aNieto2k http://www.anieto2k.com/?p=8199 <head /> de la aplicación, algo realmente lógico partiendo de que es lugar en el que meter la lógica de nuestra aplicación. Por desgracia, cuando el servicio está innaccesible o lento, esto produce un tiempo de espera considerablemente largo. Para ello, la solución es hacer un buen desarrollo que no dependa del Javascript de ese servicio y además, incluirlo en la parte inferior de la página, justo antes de </body>. Con la llegada de servicios como Ajax Libraries, este problema se acentúa ya que estamos delegando el framework JS a Google, y si este cae, todo lo que tenemos montado para él, dejará de funcionar. Importante recordar, que los scripts ajenos a la aplicación, osea ubicados en un servidor externo debería estar justo antes del cierre de <body> y así, nos ahorramos problemas de carga innecesarios como los de hoy. 
<script type="text/javascript" src="mi-script-en-google.js"></script>
</body>

Posible solución a un problema así

Bueno, se me ocurre una solución sencilla para comprobar si el servició está disponible y en caso de no estarlo, ofrecer una alternativa. 
var sc = document.createElement("script");
sc.type = "text/javascript";
// SRC de Google
sc.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1.2/jquery.min.js?rand=' + Math.random();
var timer = setTimeout(function(){
   if (typeof jQuery == 'function') return;
        var sc = document.createElement("script");
        sc.type = "text/javascript";
        // SRC local
        sc.src = 'http://www.anieto2k.com/wp-content/themes/anieto2k08/js/jquery-1.2.6.min.js';
        document.getElementsByTagName("head")[0].appendChild(sc);
   // Tiempo en milisegundos que estimamos pueda tardar.
}, 200);

sc.onload = sc.onreadystatechange =  function(e){
    clearTimeout(timer);
}
document.getElementsByTagName("head")[0].appendChild(sc);
Sin duda, la mejor opción siempre es tenerlo alojado en tu servidor. Pero si por algún motivo esto no es posible, quizás te pueda ayudar.

Artículos relacionados

aNieto2k

]]> http://www.anieto2k.com/2009/05/14/google-cae-y-caemos-todos/feed/ 21 Técnicas WCAG 2.0 por Olga Carreras http://www.anieto2k.com/2009/05/06/tecnicas-wcag-20-por-olga-carreras/ http://www.anieto2k.com/2009/05/06/tecnicas-wcag-20-por-olga-carreras/#comments Wed, 06 May 2009 06:56:50 +0000 aNieto2k http://www.anieto2k.com/?p=8148 Olga Carreras responde a 10 de las dudas más habituales sobre accesibilidad. Y es que este año Olga se ha volcado en hacernos mejores desarrolladores web, a las pruebas me remito.

Artículos relacionados

aNieto2k

]]> http://www.anieto2k.com/2009/05/06/tecnicas-wcag-20-por-olga-carreras/feed/ 1