ALA Summer Reading Issue

Vi presentiamo la ALA Summer Reading Issue, i nostri articoli preferiti scelti tra i 355 numeri di A List Apart. Potete leggerli (in inglese) anche come epub sul Kindle, sull’iPhone, sull’iPad, su Readmill o altri lettori di e-book.

Diciamo no al grassetto simulato

I browser possono fare cose terribili ai caratteri. Se il testo ha come stile bold o italic e la famiglia del carattere non include un font bold o italico, i browser compenseranno questa mancanza cercando di crearsi da soli degli stili bold e italic. Il risultato sarà una goffa imitazione del design del carattere reale e può diventare particolarmente atroce con i font web. Alan Stearns di Adobe condivide con noi delle tecniche e ci dà dei suggerimenti su come essere sicuri che le regole @font-face corrispondano al font-weight e agli stili dei font e che ci sia una regola @font-face per ciascuno stile utilizzato dal contenuto. Se state passando parte del vostro tempo a scegliere un bel web font per il vostro sito, dovete a voi stessi e ai vostri utenti l’essere sicuri che stiate effettivamente usando un web font – e solo un web font – per visualizzare il contenuto del vostro sito in tutta la sua gloria.

Tuffiamoci nel responsive prototyping con Foundation

Ci sono centinaia di dispositivi che possono accedere al full web, come disse una volta Steve Jobs. Hanno capacità e vincoli differenti, cose come lo stile di input o le dimensioni dello schermo, la risoluzione e la forma. Con tutti questi dispositivi pronti a superare i tradizionali computer desktop per quel che riguarda il traffico web del prossimo anno, abbiamo bisogno di tool che ci aiutino a creare in maniera responsive. Jonathan Smiley ci mostra come tuffarci nel responsive design usando Foundation, un leggero framework front-end che ci aiuta a fare prototipi e siti in produzione in maniera rapida.

Il miglior browser è quello che avete con voi

Fino ad ora, l’accesso al web che conosciamo (e che abbiamo creato) è avvenuto principalmente per mezzo di computer desktop. Questa tendenza sta però cambiando: l’ITU stima che nei prossimi 18–24 mesi i dispositivi mobile supereranno i PC come mezzo più popolare per l’accesso al web. Se queste previsioni dovessero avverarsi, molto presto il web ed i suoi utenti saranno soprattutto mobile. Anche i designer che abbracciano tale cambiamento lo trovano spesso disorientante. Un problema sta nel considerare ancora il mobile web come una cosa separata. Stephanie Rieger di futurefriend.ly e del W3C ci presenta i principi per comprendere e progettare una nuova normalità in cui gli utenti sono “channel-agnostic”, i device sono numerosi, gli standard sono passeggeri, l’uso del mobile non implica necessariamente “nascondere la versione desktop” e ogni byte è importante.

La delicata questione del vendor prefix: Eric Meyer di ALA intervista Tantek Çelik

Durante una riunione pubblica del W3C CSS Working Group, il web standards lead di Mozilla Tantek Çelik ha fatto esplodere una crisi nella Terra degli Standard Web quando si è lamentato degli sviluppatori che non hanno capito ed abusano dei vendor prefix supportando solo quello di WebKit, creando così un panorama di monocoltura di browser. La soluzione che propone Tantek, far finta che Mozilla sia WebKit, ha infiammato molti animi nella comunità degli standard, specialmente quando i rappresentanti di Opera e Microsoft sono stati immediatamente d’accordo riguardo tale questione e hanno annunciato dei piani simili a quelli di Mozilla. Per andare alla radice della nuova enorme confusione, il nostro Eric Meyer intervista, in esclusiva per A List Apart, Tantek sul controverso piano di Mozilla di supportare le proprietà con il prefisso -webkit-.

Ogni volta che chiamate “CSS3” una feature proprietaria, un gattino muore

Qualsiasi feature -webkit- che non sia presente in una specifica (nemmeno in Editor’s draft) non è CSS3. Sì, vengono comunemente evangelizzate come tali, ma non fanno assolutamente parte di CSS. Questa distinzione non è una pignoleria: è importante perché incoraggia alcuni produttori ad aggirare il processo degli standard, ad implementare qualunque cosa trovino in WebKit, per poi evangelizzarla agli sviluppatori come se fosse la cosa migliore del mondo. Siamo così bramosi di utilizzare il nuovo gioiello che spesso ci dimentichiamo di quante persone hanno combattuto negli scorsi dieci anni per far sì che potessimo scrivere codice senza fork e senza hack ed aspettarci che funzioni in maniera interoperabile. Lea Verou spiega perché le soluzioni “single-vendor” non sono standard e non sono salutari per la vostra pratica professionale o per il futuro del web.

Scalable Vector Graphics multipiattaforma con svgweb

Povero Scalable Vector Graphics! E’ uno standard ufficiale fin da prima del rilascio di IE6 e tuttavia non ha mai avuto molto pubblico sul web, sicuramente non quello che si merita. E proprio nel momento in cui SVG cominciava ad essere supportato abbastanza efficacemente dai browser, ecco che arriva il tag canvas a rubargli l’idea delle immagini generate lato client. Ma nonostante tutta l’attenzione che si dedica a canvas, c’è ancora posto per SVG, in special modo per gli svluppatori che vorrebbero rimpiazzare plugin come Flash per la visualizzazione dei dati. A differenza di canvas o di altri approcci solo basati su script, SVG può essere facilmente diviso tra elementi di design ed elementi di codice, con l’aggiunta di poco codice per aggiungere l’interattività. Funziona anche su dispositivi come l’iPad e l’iPhone. E ora, grazie a svgweb e ad un uso intelligente di Flash, funziona anche sulle piattaforme più vecchie su cui nessuno si aspetterebbe che SVG possa funzionare. Jim Ray ci mostra come.

Il panorama dei browser per smartphone

Gli utenti si aspettano che i siti funzionino sui loro cellulari. Tra due o tre anni, il supporto per mobile sarà lo standard per tutti i siti. I web developer devono aggiungere lo sviluppo per web mobile al proprio bagaglio di conoscenze o rischiano di perdere clienti. Come si rendono i siti compatibili con il mobile web? La risposta più semplice è di testarli su tutti i dispositivi mobili e sistemare tutti i problemi che si incontrano. Ma con almeno dieci sistemi operativi e quindici browser differenti, è impossibile fare una cosa del genere. Non possiamo però nemmeno testare i siti su iPhone ed Android e aspettarci di aver fatto il nostro dovere. PPK investiga il mercato del mobile web, così come le piattaforme e i browser attualmente in uso sui telefoni cellulari e ci mostra come impostare un ambiente di test funzionante per il mobile web.

Validazione innovativa delle form

Quando gli utenti compilano una form per comprare uno dei vostri prodotti o per sottoscrivere un vostro servizio, volete che gli errori siano ridotti al minimo e che vengano guidati verso il successo. Ora, con gli input types e gli attributi delle form in HTML5, potete porre dei vincoli di validazione per controllare l’input dell’utente. Con le nuove pseudo-classi UI di CSS3, potete assegnare degli stili agli stati di validazione per rendere la compilazione della form più veloce e semplice.

SVG con un piccolo aiuto da Raphaël

Volete creare delle immagini vettoriali scalabili (SVG) che siano creative, interattive, appaiano bellissime ad ogni risoluzione eme/em degradino con grazia? Brian Suda vi spinge ad usare Raphaël per il lavoro duro con SVG.