Introdución a la Css

•May 14, 2008 • Leave a Comment

Introdución:

La idea que se encuentra detrás del desarrollo de CSS es separar la estructura de un documento de su presentación.
El lenguaje HTML está limitado a la hora de aplicarle forma a un documento. Las páginas web desarrolladas sin las Hojas de Estilo tienen mezclado en su código HTML el contenido del documento con las etiquetas necesarias para darle forma. Esto tiene sus inconvenientes ya que la lectura del código HTML se hace pesada y difícil a la hora de buscar errores o depurar las páginas. La sintaxis CSS permite aplicar al documento formato de modo mucho más exacto y separarlo completamente del contenido de la web. El W3C (World Wide Web Consortium) es el encargado de formular la especificación de las hojas de estilo que servirán de estándar para los agentes de usuario o navegadores.El modo de funcionamiento de las CSS consiste en definir, mediante una sintaxis especial, la forma de presentación que le aplicaremos a:

* Un web entero, de modo que se puede definir la forma de todo el web de una sola vez.
* Un documento HTML o página, se puede definir la forma, en un pequeño trozo de código en  la cabecera, a toda la página.
* Una porción del documento, aplicando estilos visibles en un trozo de la página.

* Una etiqueta en concreto, llegando incluso a poder definir varios estilos diferentes para una sola etiqueta. Esto es muy importante ya que ofrece potencia en nuestra programación. Podemos definir, por ejemplo, varios tipos de párrafos: en rojo, en azul, con márgenes, sin ellos…

Además las CSS proporcionan muchas más herramientas que facilitan la maquetación, si bien antes debíamos utilizar trucos para conseguir efectos, ahora se permite:

* Definir la distancia entre líneas del documento.
* Colocar elementos en la página con mayor precisión, y sin lugar a errores.
* Y mucho más, como definir la visibilidad de los elementos, márgenes, subrayados, tachados…

CSS proporciona tres caminos diferentes para aplicar las reglas de estilo a una página Web:

1. Una hoja de estilo externa, que es una hoja de estilo que está almacenada en un archivo diferente al archivo donde se almacena el código HTML de la página Web. Esta es la manera de programar más potente, porque separa completamente las reglas de formateo para la página HTML de la estructura básica de la página.

Ejemplo:

<head>

<link href=”special.css” rel=”stylesheet” type=”text/css”>
</head>

2. Una hoja de estilo interna, que es una hoja de estilo que está incrustada dentro de un documento HTML. (Va a la derecha dentro del elemento <head>). De esta manera se obtiene el beneficio de separar la información del estilo, del código HTML propiamente dicho. Se puede optar por copiar la hoja de estilo incrustada de una página a otra, (esta posibilidad es difícil de ejecutar si se desea para guardar las copias sincronizadas). En general, la única vez que se usa una hoja de estilo interna, es cuando se quiere proporcionar alguna característica a una página Web en un simple fichero, por ejemplo, si se está enviando algo a la página web.

Ejemplo:

<head>

<style type=”text/css”>
h1 {border-width: 1; border: solid; text-align: center}
</style>
</head>

3. Un estilo en línea, que es un método para insertar el lenguaje de estilo de página, directamente, dentro de una etiqueta HTML. Esta manera de proceder no es excesivamente adecuada. Al incrustar el formateo dentro del documento de la página Web la descripción de la página, a nivel de código se convierte en una tarea larga, tediosa y poco elegante de resolver el problema de la programación de la página. Este modo de trabajo se podría usar de manera ocasional si se pretende aplicar un formateo con prisa, al vuelo. No es todo lo claro, o estructurado, que debería ser, pero funciona.

Ejemplo:

<p style=”font-size: 12pt; color: fuchsia”>
Aren’t style sheets wonderful?
</p>
Asignación de propiedades a elementos:

CSS define un conjunto de propiedades y sus posibles valores. Cada regla se estilo está compuesta por dos campos: un selector y un bloque de declaraciones. El selector establece  elementos a los que se les aplica la información de estilo. Las declaraciones especifican propiedades (y sus valores) para los elementos seleccionados. Por ejemplo, la siguienteregla de estilo CSS asigna un color de texto, un tamaño de fuente y texto en negrita atodos los elementos p del documento:

p    { color: rgb(0,0,128);
font-size: 14pt;
font-weight: bold }

Como se ve  primero se especifica el selector, y a continuación las declaración entre llaves, separadas entre sí por “;”. El nombre y el valor de cada propiedad se separan por “:”.

Reglas de cascada

Si definimos dos veces en distintas partes de una hoja de estilo, o en dos hojas de estilo diferentes que se aplican al mismo documento HTML/XHTML, la misma regla con valores contradictorios. Aquí es donde entra en juego el mecanismo de cascada que establece las siguientes reglas para la resolución de conflictos:

Encontrar todas las declaraciones que incluyan al elemento y propiedad en cuestión.

Ordenar las declaraciones según el origen. Si esas declaraciones proceden de información de estilo especificada por el diseñador web tendrán mayor importancia que si proceden de información de estilo establecida por el usuario o tomada por el navegador por defecto. Esta primera clasificación no suele ayudar mucho, porque en general toda la información de estilo es proporcionada por el diseñador, bien mediante hojas de estilo externas (enlazadas al documento utilizando el elemento link ) bien incluyendo la información de estilo en el propio documento (mediante elementos/atributos style).

Si aún persisten los conflictos, se ordenan las declaraciones más prioritarias (las procedentes del diseñador web) por la especificidad del selector. Las declaraciones más especificas se consideran más prioritarias.

De seguir existiendo contradicciones, el ultimo aspecto a considerar debe ser el orden.
Las declaraciones que aparecen más tarde serán consideradas prioritarias.

Versiones CSS

Hay varias versiones: CSS1 y CSS2, con CSS3 en desarrollo por el World Wide Web Consortium (W3C). Los navegadores modernos implementan CSS1 bastante bien, aunque existen pequeñas diferencias de implementación según marcas y versiones de los navegadores.CSS2, sin embargo, está solo parcialmente implementado en los más recientes.

Comprueba aquí el soporte de css que tiene el navegador:

http://ayudawordpress.com/manual-css-decide-el-nivel-de-soporte-de-navegador/

Para validar las Hojas de Estilo:

http://jigsaw.w3.org/css-validator/

o

mediante la Web Developer Tool Bar del Firefox, pinchando en Tools y Validate Local Css.

Album de fotos

•April 18, 2008 • 1 Comment
Naturaleza

Este es el abum de fotos, son fotos sacadas de pixalia y subidas a Picasa web album.

Ver archivos pdf

•April 18, 2008 • 4 Comments

Como en el ordernador no esta instalado el acrobat reader (por lo menos en el mio no) podeis ver los pdf desde la siguiente pagina dando la url o subiendo el archivo, pero como hay que subirlo no os paseis con el tamaño.

 

 

pdfmenot.com

 

 

Ruby On Rails

•April 18, 2008 • Leave a Comment

Expansion del Ruby

18 Abril, 2008 by rormiguel

El indice TIOBE mide el uso de los lenguajes de programación, se actualiza mensualmente, los resultados estan obtenidos a partir de las lineas de codigo escritas en el mundo. Los resultados en Abril del 2008 son los siguientes:

 

 

 

 

Position
Apr 2008
Position
Apr 2007
Delta in Position Programming Language Ratings
Apr 2008
Delta
Apr 2007
Status
1 1 Java 20.529% +2.17%   A
2 2 C 14.684% -0.25%   A
3 5 (Visual) Basic 11.699% +3.42%   A
4 4 PHP 10.328% +1.69%   A
5 3 C++ 9.945% -0.77%   A
6 6 Perl 5.934% -0.10%   A
7 7 Python 4.534% +0.72%   A
8 8 C# 3.834% +0.28%   A
9 10 Ruby 2.855% +0.06%   A
10 11 Delphi 2.665% +0.33%   A
11 9 JavaScript 2.434% -0.70%   A
12 14 D 1.169% -0.35%   A
13 13 PL/SQL 0.608% -1.28%   B
14 12 SAS 0.572% -1.63%   A–
15 21 Pascal 0.513% -0.06%   B
16 17 Lisp/Scheme 0.476% -0.20%   B
17 22 FoxPro/xBase 0.459% -0.09%   B
18 18 COBOL 0.409% -0.24%   A–
19 16 Ada 0.393% -0.29%   B
20 31 ColdFusion 0.384% +0.11%   B

 

En el 2006 subio 11 posiciones y fue declarado lenguaje de programación del año.

 

Web 2.0

•April 18, 2008 • 2 Comments

La Web 2.0 es la representación de la evolución de las aplicaciones tradicionales hacia aplicaciones web enfocadas al usuario final. El Web 2.0 es una actitud y no precisamente una tecnología.

La Web 2.0 es la transición que se ha dado de aplicaciones tradicionales hacia aplicaciones que funcionan a través del web enfocadas al usuario final. Se trata de aplicaciones que generen colaboración y de servicios que reemplacen las aplicaciones de escritorio.

Es una etapa que ha definido nuevos proyectos en Internet y está preocupándose por brindar mejores soluciones para el usuario final. Muchos aseguran que hemos reinventado lo que era el Internet, otros hablan de burbujas e inversiones, pero la realidad es que la evolución natural del medio realmente ha propuesto cosas más interesantes como lo analizamos diariamente en las notas de Actualidad y los enlaces que recolectamos en explorando.

Y es que cuando el web inició, nos encontrábamos en un entorno estático, con páginas en HTML que sufrían pocas actualizaciones y no tenían interacción con el usuario.

Pero para entender de donde viene el término de Web 2.0 tenemos que remontarnos al momento en que Dale Dougherty de O’Reilly Media utilizó este término en una conferencia en la que compartió una lluvia de ideas junto a Craig Cline de MediaLive. En dicho evento se hablaba del renacimiento y evolución de la web.

Constantemente estaban surgiendo nuevas aplicaciones y sitios con sorprendentes funcionalidades. Y así se dio la pauta para la Web 2.0 conference que arranca en el 2004 y hoy en día se realiza anualmente en San Francisco, con eventos adicionales utilizando la marca en otros países.

En la charla inicial del Web Conference se habló de los principios que tenían las aplicaciones Web 2.0:

  • La web es la plataforma
  • La información es lo que mueve al Internet
  • Efectos de la red movidos por una arquitectura de participación.
  • La innovación surge de características distribuidas por desarrolladores independientes.
  • El fin del círculo de adopción de software pues tenemos servicios en beta perpetuo

La Web 2.0 con ejemplos

Entender la evolución que ha llegado con la Web 2.0 puede realizarse con ejemplos, con proyectos. Podemos comparar servicios web que marcan claramente la evolución hacia el Web 2.0 con una nueva forma de hacer las cosas:

¿Qué tecnologías apoyan a la Web 2.0?

El Web 2.0 no significa precisamente que existe una receta para que todas nuestras aplicaciones web entren en este esquema. Sin embargo, existen varias tecnologías que están utilizándose actualmente y que deberíamos de examinar con más cuidado en busca de seguir evolucionando junto al web.

Tecnologías que dan vida a un proyecto Web 2.0:

  • Transformar software de escritorio hacia la plataforma del web.
  • Respeto a los estándares como el XHTML.
  • Separación de contenido del diseño con uso de hojas de estilo.
  • Sindicación de contenidos.
  • Ajax (javascript ascincrónico y xml).
  • Uso de Flash, Flex o Lazlo.
  • Uso de Ruby on Rails para programar páginas dinámicas.
  • Utilización de redes sociales al manejar usuarios y comunidades.
  • Dar control total a los usuarios en el manejo de su información.
  • Proveer APis o XML para que las aplicaciones puedan ser manipuladas por otros.
  • Facilitar el posicionamiento con URL sencillos.

¿En qué nos sirve la Web 2.0?

El uso de el término de Web 2.0 está de moda, dándole mucho peso a una tendencia que ha estado presente desde hace algún tiempo. En Internet las especulaciones han sido causantes de grandes burbujas tecnológicas y han hecho fracasar a muchos proyectos.

Además, nuestros proyectos tienen que renovarse y evolucionar. El Web 2.0 no es precisamente una tecnología, sino es la actitud con la que debemos trabajar para desarrollar en Internet. Tal vez allí está la reflexión más importante del Web 2.0.
Yo ya estoy trabajando en renovar y mejorar algunos proyectos, no por que busque etiquetarlos con nuevas versiones, sino por que creo firmemente que la única constante debe ser el cambio, y en Internet, el cambio debe de estar presente más frecuentemente.

Mashups

•April 18, 2008 • Leave a Comment

Estuvimos haciendo un wiki sobre los mash ups.Yo lo deje en wikispaces.com.

http://queesunmashup.wikispaces.com/

 

Más completo que el de la wikipedia en español

Mi primer post

•April 18, 2008 • 1 Comment

Este es mi blog personal creado para el curso de Ruby on Rails, en el dejare links a los apuntes y demas.