6/27/2008

¿Cómo abreviar el código CSS?

Es muy frecuente encontrar código CSS en varias líneas que podrían ser simplificadas en una sola. Muchos diseñadores CSS prefieren la versión "contraída" del CSS para tener menos código, reducir el tamaño de sus archivos CSS, etc.

Acá presentamos algunos ejemplos conocidos sobre cómo se podrían simplificar algunas línea de código CSS:

Backgrounds:

CSS Expandido ( background ) - - - - - - - >
background-color: red;
background-position: top;
background-position: center;
background-image: url(../);
background-attachment: scroll;
background-repeat: repeat-x;

contracción - - - - - - - >
background: url(../) red top center scroll repeat-x;

Márgenes:

CSS Expandido ( margin / padding ) - - - - - - - >
margin-top: 10px;
margin-left: 5px;
margin-right: 5 px;
margin-bottom: 10px;

contracción 1 - - - - - - - >
margin: 10px 5px 10px 5px ;
contracción 2 - - - - - - - >
margin: 10px 5px;

Tipos de letra:

CSS Expandido ( font ) - - - - - - - >
font-family: Arial, Helvetica, "Trebuchet MS";
font-size: 12px;
font-style: italic;
font-weight: bold;
line-height: 15px;

contracción - - - - - - - >
font: bold italic 12px/15px Arial, Helvetica, "Trebuchet MS";

Bordes:

CSS Expandido ( border ) - - - - - - - >
border-top: 1px;
border-bottom: 1px;
border-left: 1px;
border-right: 1px;
border-color: red;
border-style: solid;

contracción - - - - - - - >
border: 1px solid red;

Colores:

CSS Expandido ( color ) - - - - - - - >
color:#0099FF;
color:#000000;
color:#660000;

contracción - - - - - - - >
color:#09F;
color:#000;
color:#600;

Listas:

CSS Expandido ( list-style ) - - - - - - - >
list-style-image: url(../);
list-style-position: inside;
list-style-type: circle;

contracción - - - - - - - >
list-style: url(../) inside circle;

Etiquetas: ,

Buscar enlaces a esta noticia en Technorati Menea esta noticia Enviar a Fresqui.com Enviar a del.icio.us Enviar a Yahoo Enviar a Digg

6/16/2008

Es posible encriptar CSS, Javascript, HTML o PHP?

Pues primero hay que tener claro qué es lo que se ejecuta en el servidor y luego qué es lo que se ejecuta en el cliente:

Servidor:
  • PHP: la programación conocida como "del lado del servidor".
Cliente:
  • CSS.
  • Javascript
  • HTML

Primero que todo ninguno de los códigos anteriores se puede encriptar porque si fuera así se irrespetaría la sintaxis del lenguaje y el código pierde su valor y deja de ser funcional.

Por otro lado, en el caso de los CSS, HTML y Javascript que se ejecutan en el navegador, sólo en el último caso se puede aplicar un obfuscador, el cual no encripta propiamente el código sino que lo reemplaza por otro que puede ser interpretado (se respeta la sintaxis de javascript) pero que no es leíble fácilmente por un humano. Sin embargo, todo lo que se ejecuta en el cliente se almacena de manera local (en caché) por lo que los archivos siempre son descargadas y si alguien se propone adueñarse de un código, técnicamente no hay nada que le impida hacerlo; pero se pueden usar ciertas técnicas (como el obfuscamiento) para que dicha tarea sea más difícil.

Etiquetas: , , ,

Buscar enlaces a esta noticia en Technorati Menea esta noticia Enviar a Fresqui.com Enviar a del.icio.us Enviar a Yahoo Enviar a Digg

6/06/2008

Analizando Tiempos de Descarga de Páginas Web.

En la página

http://www.websiteoptimization.com/services/analyze/

Se tiene acceso a una herramienta que permite verificar los tiempos de descarga de una página. Dentro del análisis tiene un "resumen" donde recomienda realizar ajustes (si es necesario) del tamaño del HTML, de la cantidad de archivos CSS y de la cantidad de imágenes incluidas.

Muy útil cuando se estudia los diferentes tipos de público meta a los que se quiere llegar y cómo se ajusta la página a sus necesidades.
Buscar enlaces a esta noticia en Technorati Menea esta noticia Enviar a Fresqui.com Enviar a del.icio.us Enviar a Yahoo Enviar a Digg