Posts Tagged 'html'

YAML – Generador de layouts basados en CSS

En algún post anterior hacía referencia a sitios web con layouts css para hacer C&P. Vía fresherswisdom.com he conocido YAML, una interesante aplicación online que permite, de modo visual, la creación de layouts “limpitos” de modo personalizado.

yaml

Mapas web con css

SlickMap CSS es un “simple” CSS para crear mapas web como estos a partir de listas HTML:

slickmap-css-sitemap

Increible lo que una simple hoja de estilo puede hacer (demo).

Visto en Dzone

Firefinder para Firebug

Siguen apareciendo extensiones para Firebug. La última que he encontrado se llama Firefinder y ofrece la posibilidad de acceder directamente a elementos HTML a partir de selectores CSS o expresiones XPath.

firefinder

Visto aquí.

HTML2DOM

La creación de contenido HTML vía Javascript es un poco coñazo y muchas veces recurrimos al modo fácil que consiste en usar la propiedad no estándard innerHTML.

http://www.html2dom.com/ es una utilidad online para, como el mismo nombre de dominio indica, la creación automática del código javascript necesario para la construcción de un árbol DOM a partir de un código HTML dado.

html2dom

TIP HTML: Tabla scrollable con columnas y filas fijas

En el proyecto en el que estoy trabajando, el mismo que a duras penas me deja tiempo para blogear, tengo como requerimiento mostrar una tabla HTML con la cabecera y la columna izquierda fijas, de tal modo que el resto de la tabla sea “scrollable”. Algo de este tipo:

tabla

Siguiendo mi política de no reinventar la rueda, he estado investigando el mejor modo de hacerlo y he encontrado dos soluciones un tanto artificiosas pero apañadas:

  1. http://www.cubido.at/Default.aspx?tabid=176&EntryID=8
  2. http://saloon.javaranch.com/cgi-bin/ubb/ultimatebb.cgi?ubb=get_topic&f=20&t=009273

Tras probar ambas y alguna otra aproximación, finalmente he optado por la segunda opción dado que apenas requiere de Javascript y funciona tanto en Firefox como en Explorer.

Layouts CSS

Existen por la web infinidad de sitios donde descargar layouts css listos para usar. Ninguno de ellos me acababa de convencer hasta que encontré CSSeasy. La verdad, crear un layout con css no tiene ningún misterio pero… para que molestarse en hacer uno desde cero si ya lo ha hecho otra persona por ti… no vayamos a incurrir en el antipatrón metodológico “reinventar la rueda” 😉

Otro sitio con layouts más conocido es y que también me gusta es http://bluerobot.com/web/layouts/

Pixel Perfect – Un plugin de Firebug para diseñadores.

Pixel perfect es una extensión de Firebug que facilita la maquetación de páginas web permitiendo al diseñador la superposición de imágenes sobre una página ya creada. Las imágenes superpuestas pueden ser arrastradas libremente hasta encontrar su posición ideal. Además de la posición también es posible modificar la opacidad.

La gente de http://extensionesfirefox.blogspot.com/ ha publicado un video en Youtube que muestra su funcionamiento (Gracias por el video):


Add to Technorati Favorites
Clicky Web Analytics Clicky

Flickr Photos

Aljibe

luz

C1

C1

Más fotos