Articoli relativi a CSS

Sul blog ufficiale di Internet Explorer è possibile vedere in dettaglio l’elenco dei bug a livello di CSS che sono stati corretti nella versione 7 del browser di casa Microsoft.

Link: Standards and CSS in IE

Ajax non è solo il nome della famosa squadra di calcio di Amsterdam, ma un nuovo approccio allo sviluppo delle applicazioni web. Ajax si focalizza soprattutto sulla cosiddetta user experience migrando dal concetto di modello sincrono a quello di modello asincrono.

Le applicazioni web tradizionali che richiedono una notevole interazione da parte dell’utente presentano un continuo scambio di dati tra il browser e il server web, dal punto di vista dell’utente questo significa dover aspettare spesso che il server restituisca la nuova pagina modificata.

L’idea alla base di Ajax è di interporre un “qualcosa”, un intermediario tra l’utente e il server. Questo qualcosa è normalmente un javascript che il browser dell’utente carica all’inizio della sessione e che si occupa di tutte quelle attività che non richiedono necessariamente il collegamento col server (alcune verifiche dei dati inseriti, interfaccia di navigazione…etc… )
Alcuni esempi di questa metodoloogia sono visibili agli utenti di Gmail, Flickr, Google Maps tanto per citare i casi più illustri.

Dal punto di vista tecnico, il tutto è basato su XHTML, CSS, Document Object Model, XML, XSLT, XMLHttpRequest e JavaScript.

Maggiori dettagli si possono trovare qui:

• Ajax: A New Approach to Web Applications
• AJAX and Accessibility
• Ajax takes off
• Ajaxian.com

Qualche critica, peraltro condivisibile:

• AJaX: Two steps forward… Two steps back?
• Ajax, promise or hype?

A volte capita di dover impostare alcuni attributi nei fogli di stile in maniera differente a seconda dei browser. Ad esempio, volendo utilizzare un’immagine png trasparente come sfondo mi è capitato di dover applicare regole diverse per Mozilla/Firefox ed Internet Explorer.

Esempio:

.miaclasse {
	padding:3px;
	margin:3px;
	border:1px solid #666;
	/* Il tag seguente imposta la proprietà float solo per IE */
   float: expression("left");
	/*background-color:#eeeeee;*/
	/* Mozilla e Firefox ignorano il tag seguente */
    filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='fileadmin/images/news_bg.png');

}

/* Internet Explorer ignora gli stili se vengono specificati gli attributi con le parentesi quadre. */
.miaclasse[class] {
	background-attachment: scroll;
	background-image: url(fileadmin/images/news_bg.png);
}

In pratica il primo stile ha una parte comune a tutti i browser e alcune voci solo per IE. Il secondo invece non viene interpretato da IE ma solo dagli altri.

Libri consigliati sull’argomento:
Cascading Style Sheets: la guida completa