Il 31% degli Americani che accede a internet da un dispositivo mobile afferma che quello è il modo con cui si collegano sempre o la maggior parte delle volte. Per questo gruppo, se il vostro contenuto non esiste sul mobile, non esiste del tutto. Il governo degli USA ha proposto una grande iniziativa per rendere il contenuto dei siti federali mobile-friendly. Karen McGrane ci spiega perché tutto questo è importante e cosa possiamo imparare.
Argomento: Mobile/Multidevice
Responsive comp: ottenere un contratto senza mockup
Se create siti web, ci sono buone possibilità che avrete pensato a quale possa essere un processo di design responsive-friendly e probabilmente sarete giunti alla conclusione che aggiungere un mockup per ogni breakpoint non sia un approccio sostenibile. Progettare direttamente nel browser potrebbe essere la risposta, ma potrebbe essere difficile capire da dove cominciare o potreste sentirvi disorientati dalla prospettiva di rinunciare ad una metodologia su cui avete fatto affidamento per molto tempo. Faccia il suo ingresso il responsive comping: questo nuovo processo di web design senza i mockup rende semplice scrollarsi di dosso la scimmia di Photoshop e ricominciare da capo progettando con il vostro vecchio amico browser.
La griglia infinita
I grid system sono una componente chiave del graphic design, ma sono sempre stati pensati per pagine dalle dimensioni finite. Finora. Oggi progettiamo per un medium che non ha dimensioni finite, un medium che cambia forma per adattarsi meglio all’ambiente, in grado di mostrare un unico layout su uno smartphone, su un cartellone in Times Square e su tutto quello che sta tra questi due estremi. Progettiamo per una tela infinita e perciò, dobbiamo conoscere i grid system. Scopriamo le tecniche e le linee guida che possono aiutarci a dare una struttura al contenuto su qualunque schermo questo venga visualizzato.
L’estetica del Web
Oggi, con tutti i dispositivi che riescono a connettersi a internet, è diventato più semplice, praticamente necessario, accettare la natura flessibile del web. Il responsive web design è una best practice emergente e i nostri layout stanno cominciando a diventare più flessibili, ma, spesso, l’innovazione si concentra sulle implementazioni tecniche mentre sembra che si ignori l’estetica visiva. Mettiamola in un altro modo: stiamo adottando il responsive ma dimenticandoci del design. Adesso è il momento per cercare un’estetica propria di questo medium.
Un esempio di CV responsive
I veterani brizzolati del job hunting sanno fin troppo bene che un brillante curriculum vitae e un colloquio praticamente perfetto potrebbero ancora lasciarvi senza il lavoro dei vostri sogni. La concorrenza è feroce e non finisce mai. Trovare nuovi modi per distinguersi nell’implacabile economia di oggi è vitale per la sopravvivenza di noi designer/developer. Fortunatamente, il maghetto degli standard web nonché mobile web developer Andrew Hoffman ha trovato un modo dandy per differenziarci e che tra l’altro è perfetto per i lettori di citeA List Apart/cite. Vediamo come creare un curriculum semplice in HTML5/CSS3 che si adatti bene alle varie dimensioni della viewport, che sia semplice da aggiornare e mantenere e che non diventi mai obsoleto.
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.
La crisi di identità del pixel
Il pixel è stato per molto tempo la particella atomica del design basato sullo schermo: un’unità di misura concreta e conosciuta. Ma i layout basati sui pixel hardware stanno rapidamente diventando una specie protetta. Anche l’introduzione di un nuovo pixel di riferimento, standardizzato dal W3C, sebbene prometta stabilità a lungo termine, non ci aiuta a navigare nel caos attuale. Considerate le due definizioni standard di pixel e le 500 viewport standard che i device Android dei vostri utenti potrebbero supportare. Per creare design che trascendano le differenze tra piattaforme, la promessa del web e degli standard, dovete normalizzare il pixel tra i vari dispositivi. Scott Kellum mostra come la matematica e le media query ci permettano di mantenerci mentalmente sani e ci aiuta a progettare in maniera consistente tra le varie piattaforme.
Organizzare il mobile
Quando si stanno organizzando i contenuti e le azioni per il mobile, sono sempre importanti alcuni solidi principi di architettura dell’informazione come un’etichettatura chiara, larghezza e profondità ben bilanciate ed appropriati modelli mentali. Ma l’organizzazione delle esperienze nel mobile web deve anche allinearsi con le modalità con cui le persone usano i loro dispositivi mobili e perché, enfatizzare il contenuto piuttosto che la navigazione, fornire opzioni rilevanti per esplorazione e pivoting, mantenere chiarezza ed attenzione ed allinearsi ai comportamenti mobile. In questo esclusivo estratto dal suo nuovo libro, citeMobile First!/cite, Luke Wroblewski spiega come fare tutto questo.
Una pagina più semplice
Volete progettare un libro? Ci sono montagne di esempi molto ben progettati che possono ispirarvi. Ma per quel che riguarda i libri digitali? Come potete creare delle esperienze di lettura con typeset eleganti ed estremamente bilanciate quando i tablet rendono i caratteri in maniera differente e supportano diversi font, quando il testo si può espandere in ogni direzione ed il carattere può cambiare dimensione? Craig Mod (Flipboard, Art Space Tokyo) affronta tali questioni e presenta la release iniziale di Bibliotype, una libreria tipografica HTML di base per la lettura su tablet.
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.
