Hojas de estilo en cascada

(CSS)
Steven Cascante Nez
A21183

Agenda
Qu

es CSS?
Resea histrica
Principales ventajas
Principales desventajas
Mejores prcticas
Mejores sitios
Uso en paquetes de comercio
electrnico

Qu es CSS?
CSS

es un lenguaje de hojas de estilos creado

para controlar el aspecto o presentacin de
los documentos.

CSS

es la mejor forma de separar los

contenidos y su presentacin.

CSS

se utiliza para definir el aspecto de todos

los contenidos, es decir, el color, tamao de
letra, la separacin entre prrafos, la
tabulacin de una lista, etc.

Resea histrica

Las hojas de estilos aparecieron poco despus que el lenguaje

de etiquetas SGML, alrededor del ao 1970.

La propuesta CHSS fue realizada por Hkon Wium Lie y SSP fue
propuesto por Bert Bos. Entre finales de 1994 y 1995 Lie y Bos
se unieron para definir CSS.

En 1995, el W3C decidi apostar por el desarrollo y

estandarizacin de CSS y lo aadi a su grupo de trabajo de
HTML. A finales de 1996, el W3C public CSS nivel 1.

El 12 de Mayo de 1998, el grupo de trabajo de CSS publica su

segunda recomendacin oficial, conocida como CSS nivel 2.

Ejemplo de sintaxis
<div class="entry-content"> .entry-content {
grid-columns: (30px * *)[4];
<h2>What is Sushi?</h2> grid-rows: 9em 33.3% *;
column-count: 4;

column-gap: 30px;
<img src="sushi.jpg"
}
.entry-content h2 {
class="photo" alt="" />
float: page top left;

width: 6gr;
</div>
height: 1gr;
margin-left: -30px;
}
.entry-content img.photo {
float: page bottom left;
float-offset: 4gr 1gr;
}

Principales ventajas

Control de diseo.
Redefinicin de etiquetas.
Uso de etiquetas para su misin.
Personalizacin.
Maquetacin y accesibilidad.
Respeto a los estndares.
Tamao.
Usabilidad.
Visibilidad.
Posicionamiento web.
Reduccin del tiempo de desarrollo.

Principales desventajas
No

todas las propiedades de las CSS son

reconocidas igualmente por todos los
navegadores.
Ciertas propiedades, como posicin o
visibilidad de los elementos, pueden provocar
que una parte del contenido de la pgina
resulte inaccesible.
Mayor dificultad al identificar los elementos
afectados por distintas clases de estilos.

Mejores prcticas
Empezar

con una pgina de contenido

en blanco.
Resetear los estilos CSS.
Organizar las hojas de estilo en un nico
maestro.
Disponer de clases tiles para depurar.
Organizar las hojas en apartados y
bloques.

Mejores sitios en css

www.csszengarden.com

http://www.webdesignerwall.com/trends/best-of-css-d
esign-2007

http://www.smashingmagazine.com/2006/12/19/50-beau
tiful-css-based-web-designs-in-2006/

http://lineupblog.com/weblog/2007/07/21/los-50-mejore
s-sitios-de-inspiracin-para-diseadores

Uso en paquetes de Comercio

Electrnico
En

los Sistemas Administradores de

Contenido (CMS) los CSS estn
prcticamente integrados.
En aplicaciones como oscommerce no
tanto, pues tienen un diseo basado en
tablas en vez de div's.

En el futuro

Capacidades visuales avanzadas: mejoras en

cuanto a interfaz grfica, posicionamiento y tamao de
objetos, usando alineacin para cada uno y
desplazamiento.
Hojas de Estilo Aural: utilizar las opciones de ciertos
dispositivos con capacidades de reproduccin de
sonido. Agregar sonidos de fondo o efectos de
transicin con determinados eventos.
Bordes y Fondos: Usar imgenes para los bordes,
redondear y/o agregar sombras.
Creacin de pies de pgina, referencias cruzadas y
construccin de cabeceras para ttulos de secciones.