css

CSS Clean: optimiza tus CSS

ByLuis October 25, 2007

A la hora de crear nuestras hojas de estilos, podemos crear ficheros css que no sean del todo Ã³ptimos, ocupando mÃ¡s espacio de lo debido, entre otras cosas. Por ello CSS Clean nos ayuda a optimizar nuestros css de forma rÃ¡pida y sencilla.
Basado en CSSTidy, existen varios niveles de compresiÃ³n, permitiendo desde hacer el css algo ilegible, pero menos extenso, hasta una compresiÃ³n personalizada, la cual permite quitar los Ãºltimos punto y comas, dejar los comentarios, eliminar las propiedades que no sean vÃ¡lidas para una versiÃ³n de CSS.
Una aplicaciÃ³n que nos puede ser de mucha ayuda y que facilmente puede conseguir un ratio de compresiÃ³n del 20%.
CleanCSS
VÃa / dzone

Desarrollo web

Consejos para desarrollar cumpliendo estándares

ByLuis June 4, 2008

Buenos consejos a tener en cuenta cuando se trata de desarrollar cumpliendo estándares web.

Menos es más, no uses mas código del necesario
No uses CSS o Javascript dentro del HTML, ya sea en las etiquetas como en el head.
Usa código semántico, las cabeceras mediante etiquetas h1, h2, …, resaltar mediante strong, …
No uses meta etiquetas redundantes
Usa microformatos para hacer tu sitio legible
Usa tablas solo para mostrar tablas
Usa rel=”external” para enlaces externos, no uses target=”_blank”, hazo mediante Javascript
No uses Javascript mediante enlaces
No muestres contenido importante mediante Flash o Ajax, siempre mediante HTML plano

10 Coding Guidelines for Perfect Findability and Web Standards

Trucos | Tutoriales

30 ‘chuletas’ para desarrolladores

ByLuis May 4, 2006

Aunque ahora estamos acostumbrados a buscar directamente en Google cuando tenemos una duda, se suele tardar mucho menos, nunca viene mal tener una “chuleta” con lo que solemos utilizar. Una lista bastante amplia y Ãºtil, aunque algunas no son de las “bonitas” que ocupan un folio y alguna que otra es de pago:

Desarrollo web (JavaScript, CSS, cÃ³digos hexadecimales, HTML, XHTML, entidades HTML)
Bases de datos (MySQL, Oracle, SQL)
Lenguajes (PHP, Ruby, expresiones regulares, JSP, Java)
Control de versiones (CVS)
Otras (Google, Windows, Unix, Vi, mod_rewrite, cÃ³digos de caracteres ASCII, htaccess)

Cheat Sheet Roundup – Over 30 Cheatsheets for developers

VÃa / MenÃ©ame

css

Fading mediante CSS

ByLuis September 22, 2006

Se trata de mostrar distintas capas (por ejemplo, noticias) en un mismo recuadro, usando un efecto de fading entre cada capa. Es necesaria la librerÃa de script.aculo.us para que funcione. Un cÃ³digo sencillo que nos permite hacer un fundido entre varias capas.

A CSS Crossfader Demo
Demo
VÃa / Ajaxian

css | XHTML

Crea una guía de estilos

ByLuis August 30, 2006

Un gran consejo que deberÃamos llevar todos a cabo, es crearnos una guÃa con los estilos que tiene nuestra aplicaciÃ³n. No solo si trabajamos en nuestro propio diseÃ±o, porque siempre se nos acaban olvidando y podemos caer en el error de crearnos estilos repetidos, sino tambiÃ©n para cuando trabajamos en proyectos grandes y o bien los estilos ya estÃ¡n creados pero no los conocemos, porque una cosa es leer un css y otra es adivinar que pinta tiene, o bien porque creamos alguno para que se sepa que existe.

Uno de esos documentos que odiamos hacer, pero que siempre echamos de menos tener.
Creating a Style-Guide for your site
VÃa / SitePoint

Desarrollo web

Recursos para un sitio compatible con navegadores

ByLuis October 23, 2007

Uno de los mayores problemas con los que nos encontramos cuando estamos desarrollando una aplicaciÃ³n web es la compatibilidad con los diferentes navegadores, bueno, realmente la compatibilidad de estos navegadores con los estÃ¡ndares.

Para ayudarnos en esta lucha, nada mejor que esta serie de recursos:

Cross Browser CSS For Your Site: una guÃa para realizar CSS compatible con los diferentes navegadores, grandes consejos con ejemplos, no teorÃa.
Starting With CSS: Revisited: cada navegador tiene estilos por defecto para las etiquetas HTML, siendo estos algo diferentes entre ellos. Elimina el margin y el padding para empezar con todos los navegadores del mismo modo.
Two CSS Hacks For Identical Pages: dos consejos que podemos usar y un aviso de cÃ³mo empezar a escribir tu cÃ³digo.
CSS Hacks & Issues: una serie de consejos y trucos para librarse de los quirks de Internet Explorer.
Box Model Hack: hack para dibujar correctamente el modelo de caja en IE 5 y 5.5.
Eric Meyer On CSS: consejos para usar trucos con los navegadores y ocultar estilos.
/* Position Is Everything */: necesario para aquellos que quieran desarrollar su layout.
glish.com : CSS layout techniques: ejemplos de layouts de 3 columnas, 2 columnas y modelos fluidos.
100 Percent Cross Browser, Pure CSS Layouts: otro lugar donde encontrar layouts CSS.
Rendering Mode and Doctype Switching: esta pÃ¡gina te enseÃ±a que DOCTYPE usar para usar el “standards mode”.
Activating the Right Layout Mode Using the Doctype Declaration: tabla con una relaciÃ³n de los navegadores y el tratamiento que le dan al doctype.
In Search of the Holy Grail: creaciÃ³n de layouts.
Litmus Labs: CSSVista: aplicaciÃ³n que permite modificar tus CSS en Firefox y en IE.
Browser Shots: herramienta online que te devuelve pantallazos de una pÃ¡gina vista en diferentes navegadores.
IE NetRenderer: lo mismo pero para diferentes versiones de IE.

Designing For Every Browser: How To Make Your Site Fully Cross Browser Compatible

VÃa / dzone

css | Desarrollo web

Formularios CSS

ByLuis November 13, 2006

Algo que parece de lo mÃ¡s sencillo a veces nos puede llevar mÃ¡s tiempo del que pensamos, el desarrollo de formularios, si queremos que sea bueno, puede ser muy variado, por eso os pasamos una recopilaciÃ³n de distintas implementaciones de formularios que hemos encontrado.
En ellos podrÃ¡s encontrar desde el uso de fieldset y legend, maquetaciÃ³n sin el uso de tablas, divisiÃ³n en grupos de datos, formularios dinÃ¡micos dependientes de selecciÃ³n de opciones previas y muchos otros mÃ¡s.
CSS-Based Forms: Modern Solutions
VÃa / dzone

Similar Posts