50 Mejores sitios en CSS del 2006
Via x-flash me entero que se publicó una lista de los los mejores sitios en CSS del 2006:
50 Beautiful CSS-Based Web-Designs in 2006
Muy buenos diseños, una excelente fuente de inspiración.. pera tener en cuenta.
Flex y Accesibilidad
Interesante informe esctito por Andrew Kirkpatrick y Bob Regan, dos desarrolladores expertos en accesibilidad de Adobe, sobre accesiblilidad de los componentes de Flex. Tema que me preocupa mucho en el momento de ponerme a trabajar con esta herramienta.
Link: Flex Component Accessibility
Via: onflex.org
Class para Manejo de accesibilidad
Para facilitar el otorgamiento de propiedades de accesibilidad a los Movieclips y botones en Falsh decidí crear esta class, espero que les sea útil ;):
* @class AccImplement
* @author Cristian Hernandez - www.cristianhenandez.org
* @version 0.2
* @description Otorga a un objeto (Movieclip o botón) propiedades de accesibilidad
* @usage <pre>var myAcc:AccObject = new AccObject (_mc[,_desc,_short])</pre>
* @param _mc (Movieclip) el movievlip
* @param _mc (Movieclip) el movievlip
* @param _desc (String) texto descriptivo (opcional en el momento de la instanciación, puede ser seteado desde
* @param _short (String) shortcut ej : Ctrl+1.
*/
import mx.accessibility.AccImpl;
class org.cristianhernandez.AccObject extends mx.accessibility.AccImpl{
/**
* @property tabPos (Number) Variable de clase que registra el taborder, esta se autoincrementa
* cada vez que se instancia la clase para que el tabIndex sea progresivo. Si se desea cambiar el tabindex
* solo basta con instanciar la clase en distinto orden
*/
private static var tabPos = 0;
var func:Function;
var _mc:Object;
var _desc:String;
var _short:String;
var trgt:Object
var EVENT_OBJECT_STATECHANGE:Number = 0x800a;
function AccObject(_mc:Object,_desc:String,_short:String){
this._mc = _mc;
this._desc = (_desc == undefined)? "":_desc
shortCut = (_short == undefined)? "":_short;
this._mc._accProps = new Object();
AccObject.tabPos++;
setProps()
}
/**
* @method set description
* @description setea la descripcion (name) del objeto, esto puede ser seteado en el momento
* de instanciar la clase.
* @usage <code>AccImplement.description = "Select to back"</code>
* @returns void
*/
public function set description (_desc:String){
this._desc = _desc;
setProps()
}
/**
* @method set description
* @description setea el atajo del tecledo (shortCut) del objeto, esto puede ser seteado en el momento
* de instanciar la clase
* @usage <code>AccImplement.shortCut = "Ctrl+1"</code>
* @returns void
*/
public function set shortCut (_short:String){
this._short = _short;
this._mc.obj = new Object();
this._mc.obj.trgt = this;
this._mc.obj.onKeyDown = myKeyDown;
Key.addListener(this._mc.obj);
setProps()
}
/**
* @method set keyHandler
* @description setea la funcion de que será llamada cuando se realice el atrajo del teclado, por defecto esta
* funcion es el onRelease del boton, es decir que si no se llama este metodo cuando se ejecute el shortcut se
* llamara el evento que tiene asignado en el onRelaese
* Como parametro de esa funcion se pasa el objeto al que se le realizó el shortcut<br />
* Ejemplo:<br />
* <code>function onClickBtn(btn){
* trace("Seleccion de boton nombre: "+btn._name)
* }
* </code>
* @param func (Function) funcion a ajecutar
* @usage <code>AccImplement.keyHandler = myFunction</code>
* @returns void
*/
public function set keyHandler(func:Function){
this.func = func;
}
/**
* @method set myKeyDown
* @description (private)
* @returns void
*/
private function myKeyDown():Void {
with(this.trgt){
var code_number:Number = Key.getCode();
var short_array = _short.split("+");
var cond1:Boolean = short_array[0] == "Ctrl" and Key.isDown(Key.CONTROL);
var cond2:Boolean = Key.getCode() == ord(short_array[1]);
if(cond1 and cond2){
Selection.setFocus(_mc);
Accessibility.sendEvent(_mc, 0, EVENT_OBJECT_STATECHANGE,true );
if(func == undefined){
//accion por defecto
_mc.onRelease();
}else{
// llamada a la function
func.call(_mc)
}
}
}
}
/**
* @method setProps
* @description (private) actualiza las propiedades de accesibilidad en el objeto
* @returns void
*/
private function setProps():Void{
this._mc._accProps.shortcut = this._short;
this._mc._accProps.forcesimple = true;
this._mc._accProps.silent = false;
this._mc.tabIndex = AccObject.tabPos;
this._mc._accProps.name = this._desc;
Accessibility.updateProperties();
}
}
Mal uso de Flash
Creo que hoy en día Flash es una de las mejores herramientas para el desarrollo de sitios web, en buenas manos por supuesto. Un buen ejemplo de como NO utilizar flash la Página web oficial sobre la gripe aviar de la Presidencia del Gobierno de España. Cualquiera se daría cuenta de los errores de ese sitio, de accesibilidad, usablilidad, diseño. Taipografías tam pequeñas que son imposibles de leer, una intro que no dice nada, mala disposición de los elementos gráficos.
En este momento me estoy inmaginando a Jakob Nielsen con su gastado discurso de "Flash 99% malo" orgulloso por ser un detractor de Flash. Bueno, para el también está El sitio de la policía de España otro espanto que no usa Flash pero es tan mala como la que nombré anteriormente.
Más allá de la tecnología que se use, si no hay ideas no se puede hacer nada.
The making of Flash 8
Interesante y divertido video de macromedia sobre la creación de Flash 8.
Pero lo que quería destacar de este video es el Closed Caption que tiene. Creo que es un buen ejemplo de lo que hablaba en mi post anterior ya que mi inglés oral es bastante malo, pero con la práctica que me dio leer tanto inglés en internet puedo decir que el inglés escrito lo entiendo muy bien. Es decir, la subtitulación me sirvió para poder entender que es lo que se decía ya que de otro modo hubiese entendido muy poco de ese video.
Accesibilidad no es solo para discapacitados
Los desarrollos pensados para personas con discapacidades no solo beneficia a estas personas. También son aprovechadas por personas que no sufren ningún tipo de discapacidad.
Para explicar mejor esto y basándome en un buen libro que he leído sobre XHTML voy a representarlo con ejemplos de la vida real.
Por ejemplo la rampa que tienen algunas esquinas sobre para que las personas en sillas de ruadas puedan acceder a la vereda, cuantas veces vimos a señoras subiendo sus los coches para pasear a su hijo por ahí, cuantas otras vimos al repartidor del supermercado utilizándolas para subir su pesado carro, con seguridad 9 de cada 10 veces que se utiliza esta rampa es usada por persona sin discapacidades.
Las películas subtituladas... cosa que aprecio mucho cuando viajo en un colectivo de larga distancia y quiero prestar atención en la película (pocas veces buena) y el volumen está en cero para que el resto de los pasajeros pueda dormir.
No me quiero extender mucho, pero como estos hay miles de ejemplos de cosas que hacen más fácil la vida de todos.
En los desarrollos Web pasa lo mismo, acá van algunos ejemplos:
Los alts de las imágenes, no solo sirven para que un Screen Reader interprete es imagen, sino también par personas que no desean ver imágenes configurando su navegador para eso, o cuando por algún motivo no se carga la imagen.
La trascripción de las locuciones de los videos: Hay personas que no tienen placa de sonido, incluso que están escuchando música (como me pasa a menudo a mi) y no desean detener su tema favorito para escuchar lo que dice el locutor de video que está viendo.
Contenido alternativo, solo texto No a todo el mundo le interesa lo bien que animamos en Flash o lo lindo que nos salió esa animación que aprendimos en un bien tutorial con 3D, hay personas que buscan solo en contenido de nuestros sitios, ¿Por que obligarlos a ver cubos en 3D volando?
Formularios:Cuando lleno un formulario no me gusta ir haciendo clic en cada campo que quiero llenar, prefiero moverme con la tecla TAB, si el tabindex no está bien declarado, esto puede ser un caos.
Estos son algunos de los motivos por los cuales los desarrolladores web tendríamos que tener más presente la accesibilidad en el momento de pensar en nuestro próximo sitio.