Stardust v1.0, il mio tema accessibile per WordPress

Ho rilasciato il mio prima tema free per WordPress: Stardust v1.0.

Stardust v1.0 – WordPress Theme

Stardust - tema WordPress

E’ un tema a 2 colonne a larghezza fluida, realizzato in XHTML 1.0 Strict valido. Ho voluto puntare l’attenzione soprattutto sull’accessibilità, sono quindi presenti i vari skip link ad inizio e fine pagina, il codice è semanticamente corretto e le pagine sono pienamente navigabili anche senza CSS o con le immagini disabilitate. E’ stato testato su Firefox, Internet Explorer 6 e 7 ed Opera.

Lo potete già trovare nella directory ufficiale disponibile per il download o per testarlo direttamente online.

Tra le risorse usate segnalo le immancabili Silk Icons di famfamfam.com, che al momento sembrano non essere disponibili sul sito ufficiale, ma potete trovarle anche a questo collegamento.

Ho utilizzato anche un paio di icone di Liquidicity, dal set bianco su sfondo nero, all’interno dell’header.

Aspetto i vostri pareri, provate il tema e fatemi pure tutte le osservazioni che volete, sono sempre disponibile a migliorarlo e correggere eventuali problemi ed incompatibilità.

Icone alternative per la suite Adobe CS3

La Adobe ha messo in commercio la nuova suite CS3, che ancora prima dell’uscita ha suscitato numerose polemiche per le sue icone.

Ne avevo parlato anche in passato, poco convinto dalla scelta grafica, ed ancora oggi penso che il lavoro alla Adobe sia stato in questo senso troppo approssimativo.

Per chi possiede la suite (che è disponibile anche in versione trial per 30 giorni) ma proprio non riesce a sopportare le nuove icone, ecco un ottimo showcase di icone alternative. Il blog che le ha raccolte si chiama liquidicity, l’ho scoperto da poco e lo consiglio a tutti i designer. Vi segnalo 2 pacchetti che meritano particolare attenzione:

CS3 iKons – StudioTwentyEight

CS3 iKons

Set di icone che segue lo stile di quelle standard, migliorandone l’aspetto con un ottimo effetto glossy. Sono quelle che utilizzo attualmente.

CS3 Icon Set Replacement – Adam Betts

CS3 Icon Set Replacement

Una collezione di icone dal grande impatto visivo, per le quali viene usato lo stile della suite CS3 su una base coerente con le Creative Suite precedenti.

A voi la scelta delle icone migliori, tornerò prossimamente a parlare della suite Adobe CS3 dopo aver testato meglio i vari programmi: su tutti Photoshop, Illustrator e Dreamweaver.

Appunti ed idee sul web, ecco Wridea

WrideaSe cercate uno strumento online dove segnare appunti e memorizzare le idee che vi vengono in mente, Wridea è il servizio che fa per voi. Potete usarlo per annotarvi qualsiasi cosa in pochi istanti, ed ha tutte le caratteristiche degli strumenti del Web 2.0 (ebbene sì, usa Ajax ed ovviamente è ancora in beta).

L’interfaccia è semplice ed intuitiva: presenta due colonne in cui vengono visualizzate le vostre note ed i relativi dettagli. Una delle maggiori comodità è la possibilità di creare delle categorie di idee e distinguerle tramite il colore, oltre a poter creare più pagine per una ulteriore suddivisione.

Utilizzo Wridea soprattutto per segnarmi gli articoli da scrivere, e devo ammettere che mi trovo benissimo. Certo, potrei usare carta e penna, ma non potrei condividere gli appunti ed aggiornarli da qualsiasi computer. Comoda anche la possibilità di approfondire le note, cosa che non è possibile fare su servizi più semplici come Ta-Da Lists.

Screenshot di Wridea

Ci sono sicuramente margini di miglioramento, ma già così è un ottimo strumento.

Avete bisogno di segnarvi appunti, cose da fare, priorità lavorative oppure avete un blog e volete ricordarvi le idee sugli articoli da scrivere? Wridea potrebbe fare al caso vostro.

Thickbox 3: ecco le novità

Thickbox 3Thickbox è un Javascript di cui ho già parlato in passato, che consente di aprire immagini, iframe e nuove pagine all’interno della stessa finestra in cui si naviga.

La novità di questi giorni è l’uscita della versione 3, a poco tempo dalla versione 2.1. Dal blog dell’autore, ecco l’elenco dei principali miglioramenti:

  • Se non viene impostata una dimensione per l’apertura di contenuto inline, iframe o AJAX, la finestra avrà di default 630px di altezza e 440px di larghezza
  • Il codice è stato ripulito utilizzando JSLint, il file thickbox.js è stato compresso ulteriormente
  • Aggiornamento per utilizzare la versione 1.1.2 di jQuery
  • L’immagine di caricamento è stata cambiata ed ora viene precaricata
  • Lo script ora funziona con le mappe immagini e con gli elementi input dei form oltre che con i semplici links (il tag a)
  • Maggiore integrazione con AJAX, per caricare nuovi contenuti in una finestra di Thickbox già aperta

Le novità sono rilevanti, probabilmente interesseranno di più chi vorrà utilizzare questo Javascript integrandolo con AJAX. E’ una valida alternativa ad altri script analoghi, spesso molto più pesanti: l’attuale versione pesa solo 10kb nella versione compressa, a cui vanno aggiunti circa 20kb di jQuery.

Potete trovare esempi, guide per l’installazione di Thickbox 3 ed ovviamente i file da scaricare sul sito ufficiale.

Joost: inviti disponibili per tutti

Ormai Joost, la tv p2p che sta facendo molto parlare di sè, è prossima al lancio. Il sito è stato rinnovato, il software da installare ha subito numerosi aggiornamenti, e dopo aver partecipato attivamente alla beta (ancora in corso) non posso che essere entusiasta della mia esperienza.

Non sapete cos’è Joost e volete approfondire l’argomento? Non posso che consigliarvi la lettura della mia recensione sul servizio.

Se invece avete provato ad iscrivervi ma ancora non siete stati accettati, in questi giorni gli inviti a mia disposizione (e di tutti gli altri beta tester) si sono moltiplicati, quindi eccoli anche per voi!

Se volete riceverne uno, anche solo per la curiosità di vedere di cosa si tratta, fatevi avanti senza problemi. Mi serviranno solo nome, cognome ed un indirizzo e-mail valido. Chiedete il vostro invito per Joost nei commenti di questo articolo o in privato tramite il modulo contatti.

N.B.: fate attenzione ad inserire sia il nome che il cognome, le richieste incomplete non potranno essere soddisfatte.

Aggiornamento: Joost ha aperto a tutti! Non servono più gli inviti, potete andare su www.joost.com e registrarvi direttamente.

Estensioni Firefox: la Top 10 per il Web Design

Firefox si è rivelato uno dei migliori browser per lo sviluppo sul web, uno strumento indispensabile per ogni Web Designer al di là della sua diffusione presso i non professionisti.

In questo articolo voglio elencare le 10 estensioni di Firefox a cui non potrei mai rinunciare, che mi aiutano nel lavoro di tutti i giorni e che spero possano risultare utili a chi ancora non le conosce.

1. Web Developer

Aggiunge una toolbar con numerosi strumenti e funzionalità, dalla possibilità di disabilitare i CSS alla validazione della pagina corrente.

2. Firebug

Permette di fare il debug e modificare il contenuto di una pagina con pochi clic, monitorando CSS, HTML e Javascript in tempo reale. La considero un’estensione complementare a Web Developer, piuttosto che sostitutiva.

3. CSS Mate

Estensione fondamentale per fare test al volo sui CSS di una pagina, avendo un feedback immediato.

4. IE Tab

Per testare un sito è comodo avere degli strumenti che facilitino lo switch tra i vari browser. Questa estensione permette di visualizzare una pagina con il rendering engine di Internet Explorer dentro una tab di Firefox.

5. IE View Lite

Variante di IE Tab (vedi sopra), consente di aprire la pagina corrente in una finestra di Explorer tramite una voce nel menu contestuale.

6. OperaView

Estensione dal funzionamento analogo ad IE View, utile per aprire una pagina sul browser Opera.

7. HTML Validator

Aggiunge all’interno della finestra per la visualizzazione del codice alcune indicazioni utili sulla validazione della pagina. Segnala errori e warnings, con utili suggerimenti per correggerli.

8. MeasureIt

Semplice ma utilissimo tool che crea un righello con il quale misurare gli elementi di una pagina.

9. Screengrab!

Per catturare screenshot di una pagina salvando solo la porzione visibile o tutto il contenuto. Questa estensione è stata migliorata ed il salvataggio dei file immagine ora è molto più veloce.

10. SEO for Firefox

Aggiunge informazioni utili ai risultati della ricerca di Google: PageRank, età del dominio, numero di links, rank su Technorati ed Alexa e molto altro.

Trovate queste estensioni di Firefox anche nella pagina utility di TomStardust.com, insieme ad altre risorse. Se avete consigli sull’argomento o se pensate che nell’elenco manchi qualcosa di importante non esitate a dirlo nei commenti!

Quando AJAX non serve

Design Snack con Javascript disabilitatoIl mese scorso un sito a cui sono registrato ha subito un deciso restyling: si tratta di Design Snack.

E’ una community dove ognuno può segnalare un sito e farlo votare dagli altri utenti; più voti ottiene, più in alto sale in classifica, passando da semplice segnalazione a risorsa approvata ed infine “awarded”.

Appena ho visto l’homepage ho notato subito l’aggiunta di AJAX nella colonna destra, che permette di navigare tra le categorie. La funzione è comoda, peccato che con Javascript disabilitato ci si trovi davanti ad una pagina parzialmente vuota (vedi screenshot).

Qualcuno potrebbe pensare che sia impossibile trovare una soluzione accessibile ottenendo gli stessi risultati, ed invece non è così.

Un altro famoso sito risolve tutto con un semplice Javascript: Hicksdesign. Cliccando sui vari “recent works” è possibile cambiare al volo il contenuto visualizzato nella pagina, ma il bello è che tutto rimane accessibile. Se infatti provate a disabilitare Javascript, magari aiutandovi con la Web Developer Toolbar (per Firefox), vedrete comunque tutti i contenuti, raggiungibili tramite delle ancore.

Il web è ricco di esempi del genere. Non è detto che si debba per forza di cose utilizzare sempre l’ultima tecnologia disponibile: AJAX sicuramente ha grandi potenzialità, ma è sempre necessario prestare attenzione a tutte le conseguenze di una sua applicazione.

Se si possiede un’alternativa valida, accessibile e con meno problemi, è quella che va utilizzata!

Un anno di TomStardust.com: statistiche e articoli più letti

Ebbene sì, esattamente 1 anno fa stavo scrivendo il primo post su questo sito: oggi è il compleanno di TomStardust.com!

Il 9 aprile 2006 iniziai da zero, con un dominio nuovo ed un’installazione di WordPress appena fatta. Nessun collegamento da parte di altri siti, popolarità praticamente nulla, ed eppure sono riuscito ad avere soddisfazioni inimmaginabili all’inizio di questa avventura. Forse niente di straordinario, ma certi piccoli traguardi fanno piacere, soprattutto quando non sono programmati.

In questo articolo voglio cogliere l’occasione per fare il resoconto di quello che è accaduto in questo anno, iniziando col rendere pubblici alcuni numeri:

  • 84 articoli scritti
  • 254 commenti distribuiti sui vari articoli, con un’impennata negli ultimi mesi
  • 7086 messaggi di spam bloccati (ad oggi) dal plugin Akismet. Ma poteva andarmi peggio..

A questi numeri si aggiunge il superamento della soglia 200 lettori del feed, che non sarà mai un valore molto indicativo, ma segna comunque un buon andamento.

C’è stato anche il primo posto per il concorso Hosting Talk, l’accettazione su numerosi siti showcase, oltre alla recensione su Accessites.org, tutte cose di cui sono più che contento, come potrete immaginare.

Che dire poi dell’intervista su Blographik? Mik ha creduto in quello che facevo ben prima di altri, e mi ha dato la possibilità di parlare di web design e delle mie passioni. Se non l’avete letta, spero possiate trovarla interessante.

Ma abbandonando le statistiche e l’autopromozione, è necessario parlare anche di contenuti. Ecco gli articoli più letti durante l’intero anno:

  1. Utilizzare PNG trasparenti su Internet Explorer – Il post vincitore, che risolve i problemi di chi è alle prese con le immagini in formato PNG su IE6
  2. Joost: come vedere la TV su internet – Sono in molti a cercare notizie su come vedere la televisione sul proprio PC di casa senza bisogno di adattatori o nuovo hardware. Questo è in assoluto l’articolo più letto sull’argomento, seguito dalla seconda parte, ovvero Babelgum: come vedere la TV su internet
  3. Le icone della suite Adobe CS3 – Incredibile ma vero, è bastata un’anteprima sulle icone della suite CS3 ad attirare l’attenzione di molti. Argomento tornato alla ribalta in questi giorni con la presentazione ufficiale della Adobe.
  4. Problemi con Cleartype? – Con l’uscita di Explorer 7 sono stato letteralmente sommerso dalle richieste di chi aveva problemi a leggere i testi all’interno del nuovo browser Microsoft. Ecco qualche indicazione su come disattivare l’effetto Cleartype.

Se non li avete letti, spero che questo riepilogo possa offrirvi qualche spunto interessante. Ovviamente continuerò a scrivere ed a raccogliere i vostri suggerimenti per migliorare questo sito, ricordate che se avete consigli siete sempre i benvenuti!

Gallerie di immagini, adesso c’è anche Smoothbox

Una schermata di esempio con SmoothboxHo parlato più volte di Mootools e delle possibilità che offre soprattutto dopo l’uscita della versione 1.0. Mi sono accorto che si sta diffondendo sempre più, ed è recente una conversione di Thickbox proprio per questa libreria, con il nome Smoothbox.

Thickbox è un Javascript che consente la creazione di gallerie di immagini ed anteprime, ne avevo parlato in questo articolo. Utilizza jQuery, ma avere più possibilità a seconda del framework che si decide di usare sul proprio sito non è un male, anzi. Infatti metterne insieme più di uno non è raccomandabile per possibili problemi di compatibilità, ma soprattutto per il peso delle pagine.

Adesso quindi se volete usare un effetto per l’ingrandimento delle immagini o per creare delle gallerie, le scelte sono molteplici:

Scegliete la soluzione che preferite e che più si adatta alle vostre esigenze, la raccomandazione è di appoggiarsi sempre su una libreria Javascript ridotta all’essenziale per evitare caricamenti inutili ai visitatori.

Se avete altri script simili da segnalare non esitate a farmelo sapere tramite i commenti o il modulo contatti, le risorse sull’argomento sono infinite!

Aggiornamento: sono arrivate le prime segnalazioni interessanti, le integro nell’articolo soprattutto per facilitarne la lettura.

  • Simone raccomanda TripTracker, che consente la creazione di uno slideshow senza troppe difficoltà. Il Javascript pesa circa 30kb e per siti commerciali richiede l’acquisto di una licenza, ma per un sito personale è ottimo.
  • LeoB segnala lo script Slimbox, che è una conversione di Lightbox v2 sempre per la libreria Mootools in soli 7kb. Da provare!

Aggiornamento #2:

  • Ancora LeoB segnala Smoothgallery e Slideshow, due soluzioni alternative per gallerie di immagini con Mootools.
  • Pirolab invece segnala Clearbox, risorsa interessante anche se in ungherese.

I commenti, la censura e le keywords

Commento in forma di fumettoDa qualche tempo ho introdotto su questo sito la classifica dei maggiori commentatori tramite un plugin di WordPress. La cosa ha i suoi pro e contro, ma devo ammettere che sta servendo allo scopo che mi ero prefissato, ovvero quello di incentivare i visitatori a lasciare un segno della loro presenza. Sicuramente c’è chi è stato stimolato maggiormente dalla possibilità di avere un proprio link in homepage, ad altri la cosa non ha cambiato niente, ma comunque sia la partecipazione è salita.

Spero che ci siano anche altri motivi dietro a tutto questo, ma per il momento mi limito ad analizzare i fatti.

Oggi però un articolo sul blog di html.it ha sollevato una questione molto diffusa in tutta la blogosfera, che riguarda il modo di firmarsi nei commenti. Principalmente ci sono 3 correnti:

  • Chi si firma con il nickname o il nome
  • Chi usa il nick/nome seguito da qualche parola chiave collegata alla propria attività
  • Chi si firma esclusivamente con keywords, pensando esclusivamente ai motori di ricerca

In questo sito ho voluto evitare stratagemmi e lasciare più libertà possibile, anche perchè non mi piacciono le censure: non c’è moderazione dei commenti, i collegamenti non hanno il famigerato rel=”nofollow”, e non ho mai cancellato nessun intervento. Vorrei però cogliere l’occasione per dire la mia.

Ho lasciato questa libertà perchè io per primo non sopporto le imposizioni dall’alto, e provo fastidio quando devo aspettare per vedere pubblicato un commento nei blog altrui. Ci sono però alcune situazioni che ritengo fuori luogo, e capisco poco chi si firma con delle keywords sperando di venire indicizzato con maggiore successo da Google.

Secondo voi ha senso? E’ corretto presentarsi agli altri utenti in questo modo? Francesco de Francesco sottolinea come spesso sia pericoloso adottare certi metodi, anche perchè a lungo termine è la trasparenza che viene premiata, sia dagli utenti che dai motori di ricerca.

Ogni tanto bisognerebbe ricordare che internet è fatta per gli utenti, ed il primo obiettivo dovrebbe essere relazionarsi in maniera onesta e sincera con gli altri. Ci vuole molto per guadagnarsi la fiducia di qualcuno, un attimo per perderla.

In ogni caso non voglio cambiare niente ed ho intenzione di continuare a seguire la mia linea di pensiero, se da questa discussione uscirà qualcosa di costruttivo sarà tanto di guadagnato. Cosa ne pensate? A voi la parola!