Fora d’aquesta polèmica, és interessant entendre com podem generar CSS dinàmics a través de llenguatges de programació, en aquest cas una plataforma Apache + PHP. La idea és que es serveixi un fitxer amb extensió .css generat pel PHP.

1. En primer lloc necessitarem que l’apache faci que els fitxers .css siguin interpretats pel PHP. Per tant dintre de la secció <IfModule mod_php4.c> del nostre httpd.conf haurem de modificar la nostra línia:

   AddType application/x-httpd-php .php .phtml .css

2. Ara que el nostre CSS serà interpretat per l’apache, és hora de introduir la nostra programació PHP dins del fitxer CSS.
3. Per acabar, només faltarà especificar el tipus de fitxer ‘text/css’ amb PHP, doncs Firefox no es porta gaire bé si el content-type és text/html

   header('Content-type: text/css');

De nou, Google ha tornat a sorprendre treient un producte excel·lent sense previ avís, tant que s’han hagut de desactivar les noves altes (similar al que va passar amb Google Analytics)

Due to heavy demand, we are unable to offer new accounts for today. If you’d like to be added to our waiting list, please enter your email address.

Després de recuperar-me, he fet les primeres proves i realment és un producte força bo per als que volen fer una web i no tenen coneixements per fer-la. Edició intuitiva WYSIWYG, basada en AJAX, gestió complerta de pàgines publicades, diferents templates de columnes i 41 dissenys força agradables, hosting de 100 Mb i altres utilitats interessants com l’AutoSave.

De fet l’estratègia sembla clara. Escric poc sobre Google (massa gent ho fa i jo no soc cap expert de Google) però l’any passat em va picar per escriure aquest article: El futuro de Internet y los ordenadores gracias a las nuevas aplicaciones web. Si a aquest camí se li afegeix aconseguir la màxima info sobre una persona o una empresa, lligues totalment a l’usuari. I les últimes novetats de Google sembla que indiquen clar aquest camí.

Qualsevol persona que vols crear la seva pàgina ha de tenir una Google Account, que implica tenir un correu de Gmail. Un cop creada Google ja te control del seu correu més la seva pàgina dins dels seus servidors (no oblidem el Google’s Master Plan). A més, fa poc Google va llançar el programa “Gmail for your domain” de manera que pots fer que Google et gestioni el correu del teu domini (la teva empresa). Per altra banda, tu pots crear-te la teva pàgina d’inici mitjançant la Google Personalized Home.

Per tant, tres branques:

1. Google OS (Goobuntu) + Google Office + Utilitats tipus Google Pack: Arrenques amb el teu Pendrive USB desde qualsevol ordinador amb l’usuari de Google Account
2. Google Page Creator + Google Personalized Home + Gmail + Google Analytics + Measure Map + Google Calendar + Google Base + Google Groups + Blogger Google Video … : Crea els continguts
3. Google Search + totes les eines que ajuden a Google Search: buscar els continguts creats

Totes tres branques orientades a treure rendiment al productes estrelles per a Google: Google Adsense i Google Adwords.

Crec a més que el proper pas de Google Page Creator serà integrar els widgets que hi ha per la Google Personalized Home la clara integració amb serveis tipus Google Groups i potser l’esperat Google Calendar.

Però no tot son floretes. També te els seus defectes:

• No es poden crear carpetes
• Dificultat per crear menús
• Incompatible amb Opera (Hola Xavi) Amb aquest graciós missatge
  Oops! Sorry, your web browser is not yet supported.

  Our programming wizards tried their darndest to get Google Page Creator to work with as many browsers as possible. But alas, even the most expert practitioners of web sorcery must sleep now and again, lest their JavaScript magic run dry.

  So, for now, you’ll need either to download a new version of Firefox or download a new version of Internet Explorer (Windows only), and then come right back.

• El codi resultant pateix de divitis
• XHTML mal construit (<div>s dins de <span>s)
• La tira de CSS Hacks (molts no necessaris amb un bon CSS)
• CSS poc optimitzat (mútliples atributs de font, marges negatius…)

Malgrat tot, un producte excel·lent, però… què passarà amb l’absurda patent sobre AJAX? Serà el replantejament de la web 2.0? Recordem que amb patents més tontes ens hem topat, com la dels GIFs i JPEGs, entre altres.

Així el CSS:
div {background:#f00;}
div {background:#0f0;#background:#00f;#}

veure exemple

No obstant, el gran repte d’Opera és ser el navegador més ràpid, i el gran desavantatge, que si vols el navegador complert i sense publicitat, només tens la sol·lució de comprar la seva versió de pagament.

No obstant, sembla que Microsoft ha decepcionat sobretot als que lluitem una mica per els estandards web, ja que es rumoreja que continuaran sense donar suport complert als CSS degut a que Microsoft considera que aquest estandard te greus problemes de base.

Mentre Google no sigui més eficaç en la cerca semàntica i si aquest rumor es confirma, als que lluitem per els estandards web seguirem se’ns continuarà titllant de “freakies” i posicionant en un segon pla. Tot pot estar al seu abast.

No obstant hem de considerar que només es tracta de rumor, i tal com comenten a The Web Standards Project, moltes vegades del rumor a la realitat hi pot haver una gran diferència.

Això és degut a que el binomi Windows i Internet Explorer 5.5 i superiors, a diferència de Mozilles, Operes, Netscapes ,… no suporten nativament el canal Alpha de les imatges transparents. Per solucionar-ho haurem de recórrer a una funció de l’Explorer: el filtre AlphaImageLoader.

Un exemple de la seva implementació en una fulla d’estils CSS:

div {position:relative; height:250px; width:250px; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader (src='myimage.png',sizingMethod='image');"}

Les propietats del sizinMethod poden ser:

• crop: Retallarà la imatge al tamany especificat a l’element on s’aplica
• image: Deixarà la imatge a les seves dimensions originals
• scale: Escalarà la imatge per a ocupar tot el tamany de l’element on s’aplica

Trobareu un bon article a alistapart.com anomenat Cross-Browser Variable Opacity with PNG: A Real Solution

¿Cuál es la finalidad de internacionalizar un documento??

Se trata de especificar el idioma en que están escritos la totalidad o la parcialidad de los elementos de una página web.

¿Por qué especificar el idioma de los documentos?

Los buscadores como Google luchan para mostrar los mejores resultados de una búsqueda según las preferencias del usuario, más después de la salida de competidores como MSN Search, A9 de Amazon …

Una de las preferencias que puede identificar fácilmente cualquier buscador es la definición del idioma que tiene el usuario. Es lógico que cada vez tengan más importancia todos los parámetros que sirven para especificar el idioma para priorizar los resultados cuando, por ejemplo en google, busco “páginas en español” o “páginas de España”.

Para entender mejor la importancia de la definición de un idioma para documentos y elementos individuales, podemos poner como ejemplo los lectores de voz que existen actualmente y que en un futuro vendran integrados con los navegadores gracias a las especificaciones XML Voice i las propiedades de audio para CSS2. No se interpretará igual si decimos

“Fundado en 1793 por la República francesa, el musée du Louvre constituye uno de los primeros museos europeos. ”

que entonemos en francés “musée du Louvre” dentro del contexto en español. Quién sabe si dentro de unos meses podremos buscar páginas en español que contengan la palabra “Louvre” en francés…

¿Cómo especificar el idioma de los elementos de una página web?

Las etiquetas HTML y XHTML nos permiten especificar la codificación de los carácteres, el idioma, y localización geográfica de una página web, así como sus elementos individuales. Por ejemplo si tengo una página en español, puedo especificar que un enlace hará referencia a una página en catalan o que cito un texto en inglés dentro de un párrafo en alemán.

Trataremos los siguientes elementos tomando como ejemplo una web en español. Podeis consultar la documentación original para otros idiomas i tipos de documentos, por ejemplo XML.

Especificar la codificación de una página

Necesitaremos especificar la codificación de una página para que el navegador sea capaz de interpretar los carácteres especiales de cada idioma. En la codificación americana, por ejemplo, no caben los carácteres especiales como los acentos. Para una web en español utilizaremos la codificación iso-8859-1.

Para documentos HTML:

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>

Para documentos XHTML servidos como text/html:

< ?xml version="1.0" encoding="iso-8859-1"?>

Aunque existen diferentes nomenclaturas para definir una misma codificación o idioma, se recomienda siempre utilizar las estándares.

http://www.iana.org/assignments/character-sets

Nota: Se recomienda evitar utilizar equivalentes HTML o Hexadecimales de carácteres (como & o   ), delegando la función de que el navegador interprete bien el documento a la codificacion de la página. Si no se pueden evitar, es recomendable utilizar el equivalente hexadecimal.

Especificar los atributos de idioma de una página

Mediante el metatag Content-Language describiremos el idioma principal de una página, y mediante los atributos de idioma definiremos qué idioma deberá procesar el navegador.

De esta manera definiremos los idiomas principales de la siguiente forma:

<meta http-equiv="Content-Language" content="es,en,de,fr,it"/>

</html>

En el caso de que tengamos un documento con diferentes traducciones en la misma página (por ejemplo un manual de la impresora), podemos utilizar:

<meta http-equiv="Content-Language" content="es,en,de,fr,it"/>

</html>

Podemos utilizar el mismo sistema para especificar un cambio de idioma para ciertos elementos, por ejemplo:

<p>En francés, <em>Gato</em> es <em lang="fr">chat</em>.</p>

Tendremos en consideración las siguientes implementaciones, según el tipo de documento que estemos ofreciendo:

Para documentos HTML:

<html lang="es">

Para documentos XHTML servidos como text/html:

<html lang="es" xml:lang="es" >

Para documentos XHTML servidos como XML:
<html xml:lang="es" >

Para más atributos de lenguaje consultar:

http://www.loc.gov/standards/iso639-2/langcodes.html

Especificar el idioma de un enlace

Si deseamos especificar el idioma que encontraremos en un enlace, podemos utilizar la siguiente sintaxis:

<p>Puedes encontrar la traducción al catalán de esta página en <a href="catalan-doc.html" hreflang="ca">instruccions per a la rentadora</a>.</p>