Accessibilità ed svg

31 luglio 2010 - Fonte: http://ftapparo.org

Da tempo interventi legislativi incentivano lo sviluppo di siti accessibili, cioè di siti che siano fruibili anche da chi soffra di disabilità come cecità, visione o udito ridotto, incapacità di interpretare correttamente i colori etc.

In molti casi piccole cose come inserire l’attributo alt nelle immagini possono costituire un primo ma semplice passo per migliorare l’esperienza dei visitatori diversamente abili ma sfortunatamente non sempre un immagine si riesce a descrivere efficacemente in una frase. In tali circostanze l’uso di grafiche svg ha il potenziale di migliorare l’accessibilità del nostro sito, in quanto il codice svg è puro testo e i singoli tag, che rappresentano...

Leggi il seguito »

una barra alla OSX con le transizioni css

9 luglio 2010 - Fonte: http://ftapparo.org

Una delle novità introdotte dall’ultima beta di firefox 4 è il supporto parziale per le transizioni css; considerando che anche safari e chrome le supportanto, questo significa che presto sarà possibile inserire nei nostri siti piccoli ma piacevoli effetti a beneficio di una parte importante dei visitatori, a patto di assicurare un dolce degrado per gli altri.

Per prendere un po’ di dimestichezza con questa funzionalità ho quindi giocato a sviluppare una barra simile a quella  di OSX o di alcune versioni di sistemi GNU/Linux: l’uso delle transizioni css si limita a far sì che quando il mouse si sposta sopra un bottone questo...

Leggi il seguito »

Rimpicciolire le immagini png

25 giugno 2010 - Fonte: http://ftapparo.org

È noto che il formato jpeg comprime di solito molto meglio del formato png. La ragione è che quest’ultimo insiste ad evitare qualunque perdita di informazioni, mentre il primo no: di fatto un’immagine codificata in jpeg sarà una buona rappresentazione di quella originale (a meno di insistere per livelli di compressione esagerati), ma non sarà fedele pixel per pixel. Tale libertà aggiuntiva può venire sfruttata per ottenere livelli di compressione di solito irraggiungibili altrimenti.

Sfortunatamente usare il formato jpeg significa rinunciare alla trasparenza, almeno fino a quando non si sarà diffuso il supporto per il formato jpeg2000, cosicché molti webmaster si...

Leggi il seguito »

Ultima creazione

21 giugno 2010 - Fonte: http://ftapparo.org

Ecco il mio ultimo sito, che ne pensate?

L’ho scritto per due ragazze veramente in gamba, tanto che stanno già vedendo i primi risultati: in bocca al lupone a tutte e due!

ps: per i più curiosi, il sito è basato su drupal, che considero un un cms stupendo: molto flessibile ed elegante.

...

Leggi il seguito »

Giochiamo con border-image

13 giugno 2010 - Fonte: http://ftapparo.org

Ormai quasi tutte le ultime versioni dei browser supportano la proprietà css border-image, che permette di inserire delle immagini come bordi dei box della nostra pagina. Ciò permette di creare con poca fatica simpatici effetti che abbelliranno la nostra pagina per una fetta consistente degli utenti, senza creare problemi di sorta agli altri.

Ad esempio nell’immagine di sotto la cornice è stata creata utilizzando border-image (la foto del fiore è generosamente offerta sotto creative common da Josef F. Stuefer): è importante notare che per i browser che non supportano border-image, la pagina cornice sarà un semplice bordo giallo, senza alcun problema funzionale o estetico.

...

Leggi il seguito »

creare due div con la stessa altezza

3 giugno 2010 - Fonte: http://ftapparo.org

Recentemente ho letto un articolo molto interessante dove l’autore affronta il probema di dare a due div affiancati l’altezza necessaria per accomodare il contenuto di entrambi: in pratica se i due div sono colonne di testo si vuole fare in modo che esse abbiano entrambe la minima altezza sufficiente per permettere la visualizzazione dei rispettivi contenuti, come in questo esempio. Chiaramente quello che rende interessante il problema è che le dimensioni devono essere determinate in modo dinamico.

L’autore dell’articolo proponeva l’uso di jquery: con un paio di...

Leggi il seguito »

menu grafici con svg

9 maggio 2010 - Fonte: http://ftapparo.org

Questo week end ho avuto un po’ di tempo per giocare con svg. Volevo provare a creare un menù grafico tutto in svg, qualcosa di semplice tanto per cominciare a vedere svg in pratica: il risultato è questo menù. Ovviamente richiede l’uso di browser che supportino svg e internet explorer non lo è: un problema pratico non indifferente se si pianifica di inserire un menù svg su un sito web, ma sembra esistano delle soluzioni.. indagherò. Ho anche letto che ni internet explorer 9 ci sarà un primo piccolo supporto per svg, speriamo.

Il funzionamento è molto semplice: il codice svg è contenuto nel tag <svg>, che supporta tra gli altri...

Leggi il seguito »

Hotlink protection con .Htaccess

7 maggio 2010 - Fonte: http://www.loslocosdelared.com

Molti di noi hanno uno spazio web condiviso, quindi con un tot di banda che se sovraccaricata non permette una ottimale fruizione del proprio sito web. Molto spesso il sovraccarico di banda è dovuto al fatto che le immagini presenti sul proprio server vengono usate su altri siti semplicemente richiamandole dal nostro ("HotLink") per impedire ciò si può operare usando codice opportuno inserito in un file .htaccess (questo file di configurazione è utile solo per Apache Web Server).

Ecco ciò che va inserito nel vostro file .haccess che a sua volta dovrà essere inserito nella root del vostro sito

Come è possibile notare ho evidenziato in grassetto due cose:

Gestire errore 404 con .htaccess

19 marzo 2010 - Fonte: http://www.loslocosdelared.com

Avete sempre odiato l'errore 404 "Risorsa non trovata", avete sempre pensato che quella pagina bianca è odiosa e avete sempre pensato che sarebbe sata una cosa fine, far comparire una pagina formattata del vostro sito al posto di quell'odioso errore.


Eccovi accontentati: oggi vi spiegherò com'è possibile gestire gli errori che lancia il vostro web server (nel nostro caso Apache2), intercettandoli e ridirigendo l'utente verso pagine scelte da voi.

N.B. Questo tutorial può essere tranquillamente esteso a tutti gli altri errori lanciati dal webserver.

Prima...

Leggi il seguito »

Google Buzz… un po’ si twitta, un po’ si chatta, un po’ su buzza

11 febbraio 2010 - Fonte: http://www.loslocosdelared.com

Ormai tutti hanno notato su GMail quella strana icona in istituzionale quadricolore... Buzz! Buzz??? Che cavolo è sto Buzz? Tutti si sono fatti questa domanda.

Google Buzz è l'ultima diavoleria targata Google ed ha tutte le caratteristiche per poter sfondare, anche e molto di più di Google Wave. Nel dettaglio, Buzz è una sorta di uccellino grasso e truccato:

  • Aggiornamenti di stato in tempo reale e di qualunque lunghezza;
  • Possibilità di aggiungere...

    Leggi il seguito »