Entries Tagged 'CSS' ↓

Generar CSS Dinàmics

Quan estem creant els nostres CSS ho fem de manera estàtica. Aquesta limitació de no poder crear variables i condicionals dintre del fitxer CSS va causar el desenvolupament de prostes com CSS Variables o la generació de CSS mitjançant PHP. No obstant articles com “Why ‘variables’ in CSS are harmful?” han provocat discusions sobre la implementació de variables i condicionals en els CSS.

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');

Primeres reflexions sobre Google Pages

Aquest matí quasi m’agafa un patatus quan em trobo amb Google Page Creator (abans rumorejat com a Google Trogdor). Feia com 13 minuts que l’acabaven de llançar oficialment i al cap de res començo a rebre e-mails dels companys d’oficina xerrant sobre les seves funcionalitats.

Google-page-creator

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.

CSS Hacks per a l’Internet Explorer i Safari per Mac

Porto una hora esbrinant perquè en Safari (Mac) em trencava una part dels CSS d’una pàgina i resulta que al no tancar un hack que em vaig treure de la màniga per a l’explorer (#) fa uns anyets, fa que es converteixi un hack per a Safari. Un hack porta a un altre :-)

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

Mostra:

  1. Un div de fons verd per defecte
  2. Un div de color blau a l'explorer (també 7.0)
  3. Un div de color vermell a Safari

veure exemple

Opera Rocks!

Sembla que els nois d’Opera estan treballant fort en la nova versió Opera Web Broser 8 amb moltes funcionalitats “de sèrie” per a webmasters. Ja ens va agradar el seu suport de veu per a speech CSS3 module i HTML+Voice 1.2 i altres millores en la implementació de CSS en la seva Beta 1, i en la nova beta 3 ens ofereixen suport natiu per a SVG millores en les llibreries de veu i potencien el seu Small-Screen Rendering, que és una utilitat per previsualitzar una pàgina en dispositius mòbils, navegador WAP integrat, consola javascript, i moltes d’altres utilitats que normalment es troben com a extensions d’altres navegadors.

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.

Microsoft Internet Explorer 7 decepciona

Després de l’anunciament per part de Bill Gates de l’Internet Explorer 7 a la RSA Conference 05 tothom ha especulat sobre diverses millores com la navegació per pestanyes, sol·lucionar els problemes de seguretat, suport natiu per al format d’imatges PNG sense filtres Direct-X, un més que possible agregador de feeds, millores en la implementació de SSL, suport per a CSS2 i integració amb el nou software d’Spyware de Microsoft anomenat MS Anti-spyware, moltes d’aquestes funcionalitats ja disponibles en navegadors com Mozilla Firefox o Opera Web Browser.

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.