Sobre todo cuando trabajamos con hojas de estilo grandes podemos dejarnos atrás elementos que ya no se utilizan y que, a pesar de no servir para nada, suman al peso final de nuestra CSS.
CSS Redundancy Checker es una sencilla utilidad online con la que podremos encontrar todos esos selectores a los que ya no se hace referencia desde ninguna de nuestras páginas. Para ello simplemente tendremos que introducir la dirección de nuestra hoja de estilo y las URL de todas las páginas que la utilizan (o una muestra significativa de ellas para sitios basados en plantillas, por ejemplo).
La utilidad se encargará de comprobar los selectores que se emplean en las páginas y nos devolverá una lista de aquellos que nos sobran por no ser utilizados en ninguna de esas páginas.
CSS Redundancy Checker: http://services.immike.net/css-checker/
Vía No Sólo Código
Ahora que todo hijo de vecino y su web tienen cuenta de Twitter nos vemos constantemente en la “necesidad” de promocionarla para conseguir mas seguidores.
La gente de Go2Web20, más conocidos por su directorio de aplicaciones web, han lanzado una pequeña utilidad con la que podrás crear un badge que resultará bastante llamativo al estar fijo en un costado de tu web.
Introduce tu cuenta de usuario, selecciona el texto del botón de entre las opciones disponibles, personaliza el color de tu badge y pega el código resultante justo antes del final del body (</body>) de tu página web.
Twitter “Follow” Badge: http://www.go2web20.net/twitterFollowBadge/
Vía Maestro Alberto
Powered by Twitter Tools.
Creo que a estas alturas todos estamos al tanto de que hay mucha gente que tiene problemas para distinguir colores o, sin ir más lejos, que no tiene tan buena vista como un adolescente ¿verdad?
Checkmycolours es una cómoda herramienta online que nos permitirá verificar que existe el suficiente contraste entre nuestros colores de fondo y los colores del texto.
Para ello sólo tendrás que introducir una dirección URL en su casillero y la aplicación se encargará de hacer la verificación basándose en el algoritmo propuesto por el W3C
Checkmycolours: http://www.checkmycolours.com/
Vía Download Squad
Cuando tenemos que crear un sitio web con columnas podemos optar por dos aproximaciones: columnas de ancho fijo o columnas flexibles basadas en porcentajes del tamaño de la ventana del navegador.
Cuando escogemos columnas flexibles o líquidas, generalmente planteamos un número fijo de columnas y hacemos que llenen el espacio disponible.
Si escogemos las columnas de ancho fijo podremos aprovechar resoluciones mayores de pantalla mostrando más columnas por línea pero, llegados a un punto, seguramente nos encontraremos con que las columnas no encajan perfectamente en el espacio que deben cubrir y dejan un antiestético margen al costado.
Soh Tanaka ha ideado una forma de conseguir aunar los beneficios de ambas aproximaciones: permitimos el máximo de columnas que encajen en el espacio y con jQuery repartimos el espacio sobrante de forma uniforme entre todas.
http://www.sohtanaka.com/web-design/smart-columns-w-css-jquery/
Están muy de moda los carruseles que nos permiten mostrar contenido, generalmente rico en imágenes, en forma de galería o presentación.
WP Carousel es un plugin con el que implementar un carrusel en tu blog de WordPress será pan comido, descargar e instalar el plugin como de costumbre y luego dirigirnos a su página de opciones.
En ella simplemente tendremos que definir la categoría de la que se tomarán los artículos, la cantidad de ellos que se mostrarán y definir las dimensiones de nuestra caja contenedora.
Para crear contenido para nuestro carrusel simplemente tendremos que escribir un artículo como de costumbre, el plugin tomará la primera imagen que introduzcamos y para texto explicativo usará el que introduzcamos como extracto o excerpt.
A nivel de Javascript, el plugin utiliza jQuery que toma del que viene empaquetado por defecto en todas nuestras instalaciones de WordPress.
WP Carousel: http://sumolari.com/plugins-temas/wp-carousel/
Los formularios, no hace mucho hablabamos de que tenemos que conseguir que nuestros visitantes se interesen los suficiente para rellenarlos pero ¿y si les facilitamos un poco más la tarea?
GeoFill es una librería javascript basada en Yahoo Geo y Geo IP con la que podrás ofrecer a tus usuarios varias formas de completar automáticamente los campos relativos a su localización (ciudad y país).
En primer lugar puedes hacer la detección automáticamente con cada visita y después permitir que los usuarios decidan si esos datos que has obtenido son correctos o no y si desean utilizarlos.
En segundo lugar podrás esperar a que el usuario decida realizar la detección y hacerla en base a su dirección IP o a su código postal (aunque esto último es algo más complicado ya que muchos países usamos códigos similares) e igualmente permitir al usuario desechar o utilizar los datos.
En mi caso, el script es más bien poco fiable, cuando se hace la detección por IP me pone en Santiago de Compostela y cuando la intento por código postal me pone en los Estados Unidos, por eso me parece más que importante la opción de introducir mis datos manualmente pero estoy segura que a mucha gente le funciona estupendamente el sistema y para ellos será una ventaja interesante.
GeoFill: http://icant.co.uk/geofill/index.php
Vía Ajaxian
En esta cuarta entrega, Patricia nos habla de un tema muy importante: la seguridad de nuestros sitios Drupal.
Mi nombre es Patricia Perochena, trabajo en una empresa de informática realizando desarrollos web. He trabajado durante 5 años en Servicio Técnico, realizando labores de instalación, mantenimiento, configuración y reparación de todo tipo de pc´s. Empecé a hacer páginas web en 1996.
Mi mayor afición es la informática y todo lo que suene friki. Colaboro en diferentes proyectos de software de libre distribución y propietarios como betatester y haciendo labores de traducción.
Mi sitio web es http://patripe.com
Powered by Twitter Tools.
Hace unos días (más de los que había planeado en principio, lo siento) Fsc Xavier me preguntaba la forma de conseguir un menú acordeón básicamente sólo con CSS que mostrase los elementos anidados con sólo pasar el ratón por encima.
A pesar de que puede conseguirse, mi recomendación es no liarse en cosas tan raras y dejarse seducir un poco por el javascript. Con este plugin de jQuery es muy sencillito de hacer y, además, para los usuarios sin javascript es completamente accesible.
Para conseguir nuestro menú simplemente tendremos que llamar a la librería y el plugin como de costumbre, versiones minimizadas a poder ser, e inicializamos el script pasándole el id de nuestro menú y, si queremos, la configuración para nuestro acordeón.
<head>
...
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="jquery.hoveraccordion.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('mimenu').hoverAccordion();
</script>
</head>La estructura del menú consiste en una lista desordenada, como la de cualquier menú con listas anidadas.
<ul id="mimenu">
<li><a href="#">Item 1</a>
<ul>
<li>Subitem 1a</li>
</ul>
</li>
<li><a href="#">Item 2</a>
<ul>
<li>Subitem 2a</li>
</ul>
</li>
</ul>Para descargar el plugin y ver un par de ejemplos de uso dirigíos a la página del autor.
HoverAccordion: http://berndmatzner.de/jquery/hoveraccordion/
Alojado en RedCoruna Hosting
¿Quieres hasta 6 meses de hosting gratis? Utiliza el cupón RCwebmasterlibre al contratar cualquier plan con RedCoruna - más información
Seguir @webmasterlibre
