Categorías
Herramientas

Optimiza el peso de tus CSS con CSS Tweak, CSS Optimiser ó CSS Formatter and Optimiser

Una aplicación interesante para reducir el peso de las hojas de estilo, y por tanto ganar en velocidad de descarga: CSS tweak.
Puedes elegir entre las opciones de reducir fuentes, bordes, fondos, listas, comentarios y valores cero. Tiene una opción bastante agresiva, que es quitar los espacios en blanco Remove White-Space y el resultado es una hoja de estilos con una sóla línea… muy eficiente con respecto al peso, pero podemos tener problemas si en nuestra hoja de estilo tenemos algún que otro hack.
Actualización 2006/03/29
Nada como un comentario constructivo para mejorar esta pequeña reseña, y añadir un par de herramientas más que nos sirven para optimizar nuestras hojas de estilos (y de paso cambiar el título de éste breve artículo):

CSS Optimiser
Una simple pero efectiva herramienta para optimizar el peso de las hojas de estilo, pero no tiene opciones.
CSS Formatter and Optimiser
Desde mi punto de vista, la mejor herramienta. ¿Por qué? Tiene muchas opciones, y lo más importante: te enseña en qué puntos optimiza o reduce el código de la hoja de estilos.

Si alguien conoce alguna otra herramienta, que avise y la añadimos a esta lista.

Categorías
accesibilidad Herramientas

GrayBit otra buena herramienta para comprobar el contraste de un sitio web

Ya conocemos que una de las Pautas de Accesibilidad al Contenido Web 1.0 (concretamente la número 2), nos dice que no hay que basarse sólo en el color. ¿Porqué? Por que no todos tenemos los mismos dispositivos, monitores, navegadores,… y también hay personas que no distinguen bien los colores: yo entre otros, me he dado que los colores pardos no los distingo muy bien (no es ninguna excusa para ocultar el pésimo gusto que tengo para el diseño web).
Citemos, literalmente, la pauta en cuestión:

Asegúrese de que los textos y gráficos son comprensibles cuando se vean sin color.
Si el color por sí mismo se usa para transmitir información, las personas que no puedan diferenciar ciertos colores, y los usuarios que no tengan pantallas en color o utilicen dispositivos de salida no visuales, no recibirán la información. Cuando los colores de primer plano y de fondo tienen un tono similar, pueden no proporcionar suficiente contraste en las pantallas monocromáticas, así como a las personas con diferentes tipos de deficiencias de percepción de los colores.
Puntos de verificación:

2.1 Asegúrese de que toda la información transmitida a través de los colores también esté disponible sin color, por ejemplo mediante el contexto o por marcadores [Prioridad 1]
Técnicas para el punto de verificación 2.1
2.2 Asegúrese de que las combinaciones de los colores de fondo y primer plano tengan suficiente contraste para que sean percibidas por personas con deficiencias de percepción de color o en pantallas en blanco y negro [Prioridad 2 para las imágenes. Prioridad 3 para texto].
Técnicas para el punto de verificación 2.2

Pautas de Accesibilidad al Contenido en la Web 1.0 Pauta 2: No se base sólo en el color.
En la primera pauta nos indica que no hay que usar sólo el color para transmitir información (por ejemplo «pulsa el icono verde para continuar y el rojo para cancelar» Pero si tengo un monitor en blanco y negro, ¿qué botón pulso?), y en la segunda nos indica que hay que tener un suficiente contraste entre el texto y el fondo. Hace poco en úsalo, publicaron una interesante reseña sobre una extensión de Firefox llamada Colour Contrast Analyser Firefox Extension (de la buena gente de juicystudio),… esto… que la reseña, a lo que iba, llevaba por título La Colour Contrast Analyser Firefox Extension nos saca los colores (por cierto, a webposible, también nos lo saca, je je). Y la herramienta a la que hacemos mención hoy, tiene la misma función aunque emplea otra técnica.
Tachán… hablamos de graybit, un sitio web en el que tras introducir la dirección de una página web, nos la muestra en escala de grises. ¿Y éso para que sirve? Muy sencillo, para ver si los colores empleados tienen suficiente contraste… para casi todos. Una de las formas de comprobar la pauta 2.2 que antes hemos mencionado, era imprimir un documento en blanco y negro, o mejor dicho, en blanco, grises y negro. Ésta aplicación web tiene la misma filosofía. No es una herramienta definitiva, pero ayuda bastante: es más que digna de estar incluida en nuestra caja de herramientas de la accesibilidad web (humm, es un buen título para un laargo post, me lo anoto en mi PDA, je je).
Como curiosidad, reto a los sufridos lectores de esta bitácora a comprobar esta página web en esta aplicación (además de en las suyas, por supuesto).
Me he enterado de esta aplicación en la bitácora de Arnau, en su artículo titulado Eines per testejar el contrast.

Categorías
Herramientas

El navegador Opera, ahora sin publicidad

Vaya notición, ¿no? Estábamos acostumbrados al banner publicitario de Opera, un navegador de pago, pero que se podía descargar de forma gratuita, siempre y cuando aceptásemos tener publicidad: ya sea en forma de addsense de Google, o con banners.
A mí personalmente me gusta mucho este navegador, no me acabo de acostumbrar a la nueva interface, pero con un enorme potencial para facilitar la accesibilidad a sitios webs que no lo son tanto. Y también servía para comprobar la accesibilidad con sus muchas utilidades. Aquí está la nota de prensa:

Opera Software today permanently removed the ad banner and licensing fee from its award-winning Web browser.
The ad-free, full-featured Opera browser is now available for download – completely free of charge – at http://www.opera.com.
«Today we invite the entire Internet community to use Opera and experience Web browsing as it should be,» said Jon S. von Tetzchner, CEO, Opera Software. «Removing the ad banner and licensing fee will encourage many new users to discover the speed, security and unmatched usability of the Opera browser.»
Opera was previously available free of charge with an ad banner. Users had the option of paying a licensing fee to remove the ad banner and receive premium support.

Una buena noticia, que podemos leer de forma integra en Feel Free: Opera Eliminates Ad Banner and Licensing Fee. Por supuesto, sigue siendo código propietario, no como todos los navegadores basados en Mozilla, y la libertad que mencionan no es la que propone Richard Stallman, pero hay que reconocer los méritos a este excelente navegador.

Categorías
Herramientas

Linkvendor: análisis SEO de un sitio web

En la bitácora Nuhuati (el nombre viene de una palabra en el idioma nahuatl que significa hablar fuerte), me encuentro con un interesante artículo titulado Un dúo de Herramientas para Conocer más de tu blog, donde habla sobre un par de herramientas que sirven para analizar una web.
De una de ellas ya hemos hablando antes, en el artículo Silktide Sitescore: Una herramienta para validar sitios web curiosa, pero no convence (ups, el título parece muy crítico, pero en realidad lo hago con mucho humor, je je).
El otro sitio, Link Vendor, tiene muchas y muy buenas herramientas para analizar un sitio web. Estas herramientas están enfocadas para SEO, que en castellano quiere decir «Optimización para motores de búsqueda». Vayamos por orden, y espero no extenderme demasiado:

Link Value
Introducimos una página web, elegimos la moneda, y nos dice cuánto ganariamos en publicidad incluyendo vínculos en nuestra página. A mí me han salido 56.43 euros, pero me parecen demasiado dinero, je je. Una herramienta curiosa.
Site Analysis
Esta herramienta es muy interesante.

  • Analiza el número de vínculos entrantes desde Google, MSN, Yahoo, Ask Jeves y Alexa.
  • Nos dice si estamos dados de alta en dmoz, directorio de yahoo, y archive.org.
  • Facilita el Page Rank (¿tengo un 6?).
  • Analiza el número de palabras y letras en el elemento title y los meta tags Keywords y Description.
Domain Popularity
Su nombre lo dice todo, popularidad de un dominio. Este es uno de los análisis que más tiempo tarda. Lo que hace es buscar sitios webs que tengan vínculos a la página que estemos analizando. Además nos dice el Page Rank de estos sitios (me extraña que dublincore sólo tenga un Page Rank de 7…)
PageRank Authenticity Check
Esta herramienta nos dice únicamente nuestro Page Rank, aunque aparece en otras herramientas anteriores.
SEO Challenge
Esta herramienta es bastante curiosa y simpática. Permite comparar, en un duelo en la red, dos sitios webs. Como soy un tío muy optimista, y quería ver si realmente funciona, me he atrevido a compararme con minid. El resultado, obviamente, ha sido el de Diego ganador por KO en el primer asalto (es una licencia poética, je je). Gráficamente acompaña al perdedor con un cubo de basura, y al ganado con una corona sobre un cojín. Aunque dicen que quedar segundo no es un mal resultado, en este caso… no me convence esta frase, je je.

Pantallazo de la aplicación SEO Challege, de Link Vendor comparando los sitios web webposible.com y minid.net. Webposible obtiene 258 puntos, y minid 616, siendo el ganador.
Serps Position
Otra herramienta interesante. Tenemos que indicar las palabras clave que definirían el dominio a analizar, y nos dice en que posición aparece en los buscadores Google, MSN y Yahoo el dominio a analizar. Como curiosidad, aparecen algunos dominios locales, y entre ellos el de España.
Outbound Links
Esta herramienta es «más normalita». Simplemente nos dice el número de vínculos del sitio web que analizamos, al exterior, y también los vínculos internos.
Keyword Density
Esta aplicación nos dice el número de palabras distintas que aparecen en el texto, y vienen acompañadas por unos vínculos a Google, MSN, Yahoo y Ask Jeves. Evidentemente aparecen todo tipo de palabras, desdde artículos, a advervios. No es de las más interesantes, pero podemos realizar una búsqueda únicamente de aquellas palabras que nos interesen.
loaking Detector
Por último (¿sí, ya acabamos!), esta herramienta sirve para mostrarnos cómo nos ve un buscador. Es decir, como si fuese un terminal de texto, transformando las imágenes en su alternativa textual. Si alguien se aburre mucho, lo rogaría que hiciese una prueba con mi página de inicio webposible. Son casi idénticas, je je.

Globalmente me parece un buen conjunto de herramientas muy útiles, y que nos puede dar una idea de la posición de un sito web cualquiera (incluido el nuestro). La pena es que cada vez que queremos hacer una operación, debemos de escribir un conjunto de números y letras aleatorias que aparecen en una imagen. Y bueno, de vez en cuando falla. Pero quitando esto, y que no es un prodigio de accesibilidad, me parece más que interesante.
Si alguien se ha leido todo y ha llegado hasta aquí, por favor, que lo mencione en los comentarios. Tiene mucho mérito, je je.
Actualización:
Gracias al comentario del autor de Hiperballad (por cierto, recomiendo su lectura), se puede añadir a lo que ya se ha dicho, que estas herramientas sólo funcionan con el dominio principal, y no establece análisis distintos para diferentes subdominios, es decir, ofrecería el mismo resultado para dominio.org, dominio.org/autor, ó dominio.org/articulos.

Categorías
accesoweb Herramientas recomendaciones W3C

Otro nuevo validador de código (X)HTML

Inaguro la sección «accesoweb» para todas aquellas cosas que me entere en esta interesantísima lista de correo sobre accesibilidad, con este artículo sobre un «descubrimiento». Se trata de un validador de código XHTML y HTML.
Y es bueno, realmente bueno. Mejor incluso que W3C Markup Validation Service.
El validador en cuestión, se llama «RELAXED» the HTML Validator, y tiene el siguiente aspecto:

Pantallazo del validador de código on-line de HTML Relaxed, cuya mascota es un perro tumbado.

Inocente yo, he validado algunas de mis páginas, y lamentablemente tengo que decir que mi código no era estándar, por pereza mía: en vez de colocar xml:lang="en" lang="en", como era mi obligación en XHTML 1.0 transacciónal, me «olvidé» de poner lang="en", y por tanto, todos los vínculos, y acrónimos que tengo en mi bitácora están mal.
Me parece que tengo trabajo para rato intentando solucionar esto. Y menos mal que tengo poco escrito, je je.