Continuo nella mia rassegna sugli add-ons per Firefox. Oggi è il turno di ScribeFire, un sistema che permette di scrivere post nei propri blog senza staccarsi dal browser e, soprattutto, continuando la navigazione senza dover accede al prorpio sito.
Si può utilizzare in diverse modalità, ma la mia preferita e con la finestra divisa in due. Mentre navigo per il WWW posso aprire ScribeFire e cominciare a scrivere nella metà bassa dello schermo.
Le opzioni sono molte. Dalla possibilità di scegliere su quale blog scrivere, alla gestione dei vecchi post a molte altre funzionalità, tra le quali la possibilità di guadagnare qualche soldo attraverso i banner.
Concludendo trovo che questo sia un altro dei molti add-on efficaci presenti nel panorama di Firefox, uno del quale non potrete fare a meno.
Indirizzo dell’add-on
Secondo me, ma anche secondo altri miei colleghi, questa è sicuramente una delle più belle estensioni che siano state create per Firefox, almeno per gli sviluppaotori*.
Le sue capacità sono enormi. Con Firebug si riesce a analizzare ogni singolo aspetto della pagina HTML caricata: l’albero DOM, il codice HTML, i CSS, le prestazioni in fase di download della pagina e dei suoi elementi, gli script. Ma la cosa ancor più sorprendente è la possibilità di modificare il codice on the fly e vedere subito i risultati. In questo modo la definizione dei CSS, per esempio, diventa un processo diretto, fatto di prove e di errori, praticati direttamente nel browser. Ovviamente sono esclusi tutti i possibili risvolti legati all’(in)compatibilità con altri browser. Oltre a tutto questo ci sono altre funzionalità, come la possibilità di creare un log per il debugging in javascript, una console per i messaggi, ecc.
Come se non bastasse, molti altri sviluppatori hanno cominciato a implementare add-on per Firebug, estendendo ancora di più le sue già notevoli capacità (vedi post precedente su YSlow).
Vi segnalo il sito dell’add-on e il sito di chi lo ha sviluppato.
* Quando parlo di sviluppatori intendo tutti coloro che hanno a che fare con lo sviluppo o l’analisi delle pagine HTML, includendo chi si occupa di: SEO, accessibilità, web design, programmazione di web application, ecc.
Con questo post voglio iniziare un ciclo di brevi articoli nei quali parlare delle estensioni per Firefox.
Le estensioni (o add-on) sono uno degli elementi più interessanti di questo browser perché permettono di aggiungere qualsiasi tipo di funzionalità. Ad oggi il numero di add-ons è veramente impressionante ed ancora più impressionante è la qualità di questi mini prodotti (in alcuni casi per niente mini).
Il primo add-on del quale voglio scrivere è YSlow, sviluppato da Yahoo!.
Si tratta di un’estensione per un’altra estensione, Firebug (della quale parlerò prossimamente), che ha lo scopo di misurare il peso di una pagina web, dando informazioni su come ottimizzarla. Le regole che vengono utilizzate per la valutazione sono state studiate da Yahoo! e sono consultabili alla pagina di documentazione di YSlow. Il prodotto è veramente interessante e permette, come del resto Firebug, di esplorare tutta la pagina in maniera estremamente approfondita.
Categoria: sviluppo web
Non so bene perché abbia aspettato così tanto prima di segnalare questo sito web (ma soprattuto questo gruppo di ricerca: Feng-GUI, Feng-GUI Lab), il quale propone un algoritmo molto interessante per la simulazione dei movimenti oculari.
Il loro software, che implementa l’algoritmo di cui parlavo, permette di determinare quale sia la sequenza dei movimenti oculari dell’utente, dando così delle indicazioni riguardo alla rilevanza degli elementi grafici di una pagina web. L’idea è quella di dare un riferimento piuttosto preciso (ma sempre teorico) per determinare cosa è più visibile e cosa non lo è, e in che ordine.
E’ molto interessante leggere quali sono i parametri che l’algoritmo utilizza per determinare il peso degli elementi grafici, ma soprattuto è molto importante provarlo.
Tra i tanti music player ne esiste uno nuovo, open source, basato su Mozilla, veramente bello. L’interfaccia ricorda quella di iTunes e le funzionalità, come tutti i progetti Mozilla, sono infinite.
Songbird
Per chi avesse bisogno di “fonti musicali” per allietare le ore di lavoro, vi suggerisco tre siti interessanti.
Il primo, Deezer, è una community nella quale è possibile ascoltare musica liberamente.
Il secondo, Jogli, è un sistema che raccoglie i video musicali presenti in YouTube dai post degli utenti.
Il terzo, Musicovery, è una web application che crea una playlist di canzoni in base allo stile musicale che avete scelto di ascoltare.
Di tutti gli argomenti che ho trovato in rete ne ho trovato uno particolarmente interessant: i tooltip in javscript.
I tooltip sono i balloon, le nuvolette che appaiono quando restate sopra un elemento per qualche secondo con il vostro puntatore e vi forniscono informazioni aggiuntive sull’elemento.
Realizzarli in javascript non è complicato, ma sicuramente è antipatico. Da qui la pubblicazione di una lista di librerie/plugin che permettono di inserire un tooltip in una pagina web. Scegliete quello che preferite.
Non c’entra molto con gli argomenti che solitamente tratto, ma è troppo bello per non proporlo.
Ho letto in rete un ottimo articolo per evitare l’utilizzo dei CSS hacks. Il problema è affrontato in maniera diversa da come mi sarei immaginato, ma la soluzione è funzionale ed elegante. In pratica si tratta di aggiungere del codice javascript in modo da poter creare, successivamente, degli stili personalizzati per ogni browser, in maniera semplice ed intuitiva.
Vi posto il codice sorgente:
<script type="text/javascript">
var cssFix = function(){
var u = navigator.userAgent.toLowerCase(),
addClass = function(el,val){
if(!el.className) {
el.className = val;
} else {
var newCl = el.className;
newCl+=(" "+val);
el.className = newCl;
}
},
is = function(t){return (u.indexOf(t)!=-1)};
addClass(document.getElementsByTagName(’html’)[0],[
(!(/opera|webtv/i.test(u))&&/msie (d)/.test(u))?(’ie ie’+RegExp.$1)
:is(’firefox/2′)?’gecko ff2′
:is(’firefox/3′)?’gecko ff3′
:is(’gecko/’)?’gecko’
:is(’opera/9′)?’opera opera9′:/opera (d)/.test(u)?’opera opera’+RegExp.$1
:is(’konqueror’)?’konqueror’
:is(’applewebkit/’)?’webkit safari’
:is(’mozilla/’)?’gecko’:”,
(is(’x11′)||is(’linux’))?’ linux’
:is(’mac’)?’ mac’
:is(’win’)?’ win’:”
].join(" "));
}();
</script>
Questo codice attiva i seguenti stile per i relativi browser.
.ie — Tutte le versioni di IE;
.ie8 — IE 8.х;
.ie7 — IE 7.x;
.ie6 — IE 6.x;
.ie5 — IE 5.x;
.gecko — Tutte le versioni di Firefox;
.ff2 — Firefox 2;
.ff3 — Firefox 3;
.opera — Tutte le versioni di Opera;
.opera8 — Opera 8.x;
.opera9 — Opera 9.x;
.konqueror — Konqueror;
.safari — Safari.
E questo è un piccolo esempio: in questo caso verrebbe visualizzato il testo in rosso in Opera.
.opera div {
color:red;
}
Oggi stanno diventando indispensabili per creare delle RIA, anche se qualcuno le critica perché creano alcuni problemi di accessibilità oltre a mettere il codice della pagina in secondo piano (a questo proposito, affronterò il problema delle tecnologie utilizzate nello sviluppo dei siti web in un prossimo post), ma le librerie javascript (o i framework come qualcuno li chiama) sono sicuramente il futuro.
Sono molti i “big” che ne hanno sviluppate di proprie e moltissime anche quelle dei meno big. Ormai sono una realtà dalla quale non è possibile prescindere. Io le ho utilizzate e rendono lo sviluppo delle interfacce più semplice, però ricordate: scegliete quelle che preferite all’inizio di un progetto e mantenetele resistendo alla tentazione di effettuare un mesh-up di librerie. Vi assicuro che c’è da impazzire.
Di seguito vi riporto i link di alcune delle più conosciute:
