Cómo no usar más iframe
Estuvieron de moda. Fueron la sensación. Pero como muchas otras etiquetas, perdieron su reinado dado a que no eran accesibles y mal indexado por los buscadores. Pero no totalmente, ya que suelen ser bastante útiles para refrescar datos dinámicos, sin tener que hacer un reload del sitio completo. ¿Te suena esta teoría de algún lugar? ¿Quizás de [AJAX][1]? Esa sigla tan de moda y que vende más que detergente o equipo de fútbol holandés, puede utilizar 2 recursos para realizar sus consultas a servidor asincrónicamente. Una, es el objeto XMLHTTPRequest (propietario de Microsoft); la otra, es IFrame. Esas ventanas modales ([lightbox, greybox, thickbox][2]) suelen utilizar iframe‘s para abrir otros contenidos dentro de la misma página, sin tener que volver a cargarla, evitando también el ya obsoleto popup. Así que no estaba tan muerta del todo esta etiqueta…
Bueno, pero la idea es evitar su uso dentro de contenidos, para así impedir la limitada acccesibilidad que nos entrega (no todos los browsers lo interpretan) y que sea indexado separadamente por los buscadores (así como ocurre con los <frame>, que tienen la misma lógica). Mediante CSS lograremos el mismo fin, el de poder diagramar un espacio donde el contenido fluya a través de scroll vertical. Pero todo dentro de la misma página.
El orden ante todo
Me considero una persona bastante ordenada, y eso se refleja tanto en mi vida personal como profesional. Mantengo ordenado (trato) mi escritorio, mi desktop, archivos y por supuesto el código fuente que escribo. Con el tiempo he desarrollado un estándar para los proyectos, tanto para el orden de las carpetas, como para el registro de envío de e-mails entre otros. Es que he perdido tanta información y ha habido tanta desinformación que mejor me hice mi orden propio, y ha funcionado muy bien hasta ahora.
Cumpliendo 3 años (actualizado)
Bueno, he activado el nuevo diseño del sitio. Espero sea un aporte, 1 año con el mismo layout me tenía bastante aburrido ya. Estaré en estos días ajustando algunas cosas aún, principalmente los plugins y los tags. Cualquier notificación de error o comentario constructivo, siempre será bienvenido. Seguiré escribiendo artículos desde ya.
Ayer domingo 4 de noviembre de 2007, CSSLab cumplió 3 años de exitosa vida. Como estoy de viaje, no pude notificarlo a tiempo, pero antes 1 dia tarde que nunca.
Clearfix v2.0: el widget
Navegando me topé con una <a href=“http://www.456bereastreet.com/archive/200603/new_clearing_method_needed_for_ie7/” title=“Enlace externo a “New clearing method needed for IE7?”">reescritura del código de .clearfix para que éste sea interpretado por IE7 correctamente. Y bueno, como no me gustaba la interfaz del <a href=“http://www.csslab.cl/2007/03/09/clearfix-el-widget/" title=“Enlace en CSSLab a “.clearfix: el widget”">widget Clearfix que hice anteriormente, aproveché de rediseñarlo y lanzarlo con este nuevo código que se ve mejor. Nuevamente, lo dejo para libre descarga.
[Download Clearfix v2.
Tablas porque te quiero
Siendo un poco justo con , se ha diezmado bastante su personalidad en estos años de incesante impulso semántico. Esta fiel etiqueta ha sido degradado a no más poder por mucho tiempo, y vengo a su rescate.
Como he escrito muchas veces ya a lo largo de este sitio, las tablas son para contener datos tabulados. Sólo para eso, esa información desagradable que suelen acompañar a los gráficos, esos nombres y números que a nadie le gusta.
CSS Reseter
Este reseter ha sido actualizado, visita la nueva versión. Tercer artículo influenciado directamente del [videocast][1]. En esta ocasión, les presento una hoja de estilos que utilizo para proyectos de gran envergadura (cuando con más de 40 páginas y no son alimentadas a mano, sino mediante un CMS). Se trata de un CSS Reseter, una serie de propiedades CSS que resetean las propiedades a su estado original. Conocido por todos es que por defecto los browsers tienen algunas diferencias de estilos en ciertas etiquetas HTML, principalmente , , , ….
100% alto, finalmente para todos
Segunda entrega causa directa del [videocast 1][1]. Esta vez, una muy pero muy buena y útil técnica para lograr altos de columnas de 100% respecto del contenedor. Con esto, se puede lograr que el fondo de una o ambas columnas crezcan de acuerdo a la mayor. Este problema de diseño tenía variadas soluciones anteriormente: que el contenedor tuviera el fondo a modo de una imagen, o a través de Javascript también se podían lograr altos de 100%.
Alto mínimos para IE6 (y el resto, claro)
Primer aporte procedente del [videocast][1]. Como prometido, este artículo será un corto pero efectivo método para obtener la propiedad min-height en todos los browsers, especialmente para IE6 que no lo aplica para nada.
Esta propiedad lo que hace es aplicar un alto mínimo a un elemento. Por ejemplo, queremos que una caja tenga un alto de 200px. Como sabemos, los elementos que estén dentro de esta caja se mostrarán hasta que alcancen esos 200 pixeles, y pasado eso si se agregan más elementos la caja no va a crecer, sino que permanecerá fija.
Videocast 1: layout compuesto (actualizado)
En un proyecto en que estoy involucrado actualmente, me tocó participar en la arquitectura y construir el sitio completamente, desde cero. Lo bueno es que lo estoy haciendo solo, por lo que propongo y aplico mis propios métodos, y lo mantengo bastante ordenado (con un código limpio y ordenado), tanto el HTML como las hojas de estilo. A medida en que lo voy desarrollando, aplico algunos métodos bastante simples pero efectivos para determinados problemas que van surgiendo, los que compartiré en este sitio en su momento.