Los mejores diseños en CSS del 2008

0 COMENTARIOS -  Publicado hace 15 meses -  Clasificado en: , ,

Se acaba el año y desde WebDesignerWall nos ofrecen su selección con los, en su opinión, 50 mejores diseños en CSS del 2008. Interesante recopilación. De este año, en el mundo del desarrollo web, yo destacaría la posición de privilegio alcanzada por jQuery como framework para Javascript. La comunidad de desarrolladores que utiliza jQuery cada vez es mayor y de hecho el número de plugins, ejemplos y tutoriales sobre el tema no para de crecer. Incluso en algunas ofertas de trabajo ya se solicita de modo independiente al conocimiento de Javascript.

Best of CSS Design 2008

Best of CSS Design 2008

Algunas entradas relacionadas:

 

CSSiPhone

1 COMENTARIO -  Publicado hace 15 meses -  Clasificado en: , , ,

CSSiPhone es un nuevo sitio que presenta capturas de pantalla de sitios adaptados al iPhone. Vamos, como un CSSMania pero de sitios adaptados al iPhone.

Algunas entradas relacionadas:

 

100 Plantillas XHTML/CSS

1 COMENTARIO -  Publicado hace 15 meses -  Clasificado en: , ,

En Smashing Magazine han hecho una recopilación de 100 plantillas XHTML/CSS. La verdad es que hay algunas más que interesantes.

Algunas entradas relacionadas:

 

Reducir ficheros Javascript y CSS con PHP

1 COMENTARIO -  Publicado hace 16 meses -  Clasificado en: , , ,

Un poco en la línea de lo que hacen jsmin-php o minify, este script en Reinhold Weber aprovecha la posibilidad de lectura/volcado de archivos con php y el uso de expresiones regulares para convertir varios archivos CSS en uno sólo y servirlo sin comentarios ni saltos de línea o espacios innecesarios. 

<?php
  header('Content-type: text/css');
  ob_start("compress");
 
 function compress($buffer) {
    /* remove comments */
    $buffer = preg_replace('!/\*[^*]*\*+([^/][^*]*\*+)*/!', '', $buffer);
    /* remove tabs, spaces, newlines, etc. */
    $buffer = str_replace(array("\r\n", "\r", "\n", "\t", '  ', '    ', '    '), '', $buffer);
    return $buffer;
}
  

  /* your css files */
  include('master.css');
  include('typography.css');
  include('grid.css');
  include('print.css');
  include('handheld.css');

ob_end_flush();
?>

Siguiendo el mismo procedimiento se podrían comprimir todos los archivos .js en uno sólo. Habría que cambiar el Content-type: 

Header("content-type: application/x-javascript");

Con estas prácticas conseguimos por un lado reducir el tamaño de los ficheros que el cliente descargará, lo que significa menos ancho de banda consumido, y por otro lado reducimos el numero de peticiones HTTP, lo que significa una mayor velocidad en la carga de la web.

Algunas entradas relacionadas:

 

Recarga el CSS sin recargar el resto de la página

0 COMENTARIOS -  Publicado hace 16 meses -  Clasificado en:

Vía Web Resources Depot un bookmarklet sencillo pero que puede ser de gran ayuda. Un bookmarklet es un marcador que, en lugar de apuntar a una dirección URL, hace referencia a una pequeña porción de código JavaScript para ejecutar ciertas tareas automáticamente. El bookmarklet que nos ocupa es capaz de actualizar el CSS sin necesidad de recargar toda la página. Cuando estamos editando un CSS nos puede resultar muy interesante actualizar únicamente el CSS, especialmente en el caso de desarrollos con AJAX, en vez de recargar toda la web. 

javascript:void(function(){var%20i,a,s;a=document.getElementsByTagName('link');for(i=0;i%3Ca.length;i++){s=a[i];if(s.rel.toLowerCase().indexOf('stylesheet')%3E=0&&s.href)%20{var%20h=s.href.replace(/(&|%5C?)forceReload=\d+/,'');s.href=h+(h.indexOf('?')%3E=0?'&':'?')+'forceReload='+(new%20Date().valueOf())}}})();

Algunas entradas relacionadas:

 

Malo CSS

0 COMENTARIOS -  Publicado hace 16 meses -  Clasificado en: ,

Malo es una librería muy pequeña que nos puede ahorrar gran trabajo a la hora de maquetar en CSS. Malo es un derivado de otro framework de mayor tamaño (Emastic CSS Framework). Malo es muy ligero -apenas 8 líneas de CSS-, muy flexible y fácil de usar. Malo está basado en el que cada columna puede ser dividida en dos, tres, cuatro o cinco partes.

  • 100% = 50% + 50%
  • 100% =~ 33,33% + 33,33% + 33,33%
  • 100% = 25% + 25% + 25% + 25%
  • 100% = 20% + 20% + 20% + 20% + 20%

También se pueden anidar columnas. Por ejemplo:
100% = 50% + 50% ( y dentro 25% + 25% + 25% + 25%)

Un ejemplo podría ser: 

<div class="dp100">col 1</div>
<div class="dp100">
     <div class="dp50">col 2</div>
     <div class="dp50">
          <div class="dp50">col 3</div>
          <div class="dp50">col 4</div>
     </div>
</div>

que daría una estructura similar a ésta:

Malo Estructura

Malo » »

Algunas entradas relacionadas:

 

Google DOCTYPE

0 COMENTARIOS -  Publicado hace 22 meses -  Clasificado en: , , , ,

Mark Pilgrim -una de las personas más reconocidas en el mundo del desarrollo web- ha lanzado Google DOCTYPE, una enciclopedia abierta y biblioteca de referencia. Google DOCTYPE sera escrito por y para desarrolladores web. En este momento ya incluye artículos sobre seguridad web, manipulación DOM, Javascript, consejos y trucos para CSS,... Esto parece ser sólo el comienzo de un proyecto ambicioso, de código abierto y con licencia Creative Commons.

Google DOCTYPE » »
Vía Ajaxian » »

 
Páginas: < Anterior 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 Siguiente >