di Kiko

Quando mi siedo alla scrivania ogni mattina accendo il mio MacBook e il FlyBook. A seconda delle giornate e dal lavoro che ho da fare, soltanto uno dei due è collegato ad un monitor esterno da 19 pollici. Il MacBook mi permette di sfruttare i suoi 13 pollici, mentre il FlyBook è un tablet da 8,9 pollici. Per il principio della web usability dovremmo cercare di progettare i nostri design per le risoluzioni maggiormente utilizzate. Vista la tendenza di acquistare PC con monitor sempre più grandi, ma registrata pure la moda dei netbook con schermi piccoli, la domanda che lo sviluppatore dovrebbe porsi è: per quale risoluzione ideale lavorare? Se prima tale dubbio riguardava la doppia dimensione, cioè larghezza e lunghezza, ultimamente il problema sembra riguardare più la larghezza. Infatti, la maggior parte dei siti, e parlo dei siti di informazione includendo fra questi i blog, si sviluppano necessariamente in lunghezza e cià costringe inevitabilmente l'utente a eseguire numerosi scrolling. Per la larghezza il problema rimane. Basta dare un'occhiata alle statistiche di accesso al sito per rendersi conto che i visitatori utilizzano diversi strumenti: monitor grandi, netbook, i classici portatili da 14 o 15 pollici, etc. La mia esperienza personale mi porta a considerare come minima larghezza 1000 pixel e quindi, escludendo la barra di scrolling laterale, 970 pixel. Perfetta per realizzare ottimi layout. Riscontrate anche voi simili statistiche? E quale risoluzione tendete a privilegiare per i vostri progetti?

Continua a leggere La risoluzione ai tempi dei netbook

Categoria: Web Design

Ok, qualcuno ha provato a dimostrare che la gente scrolla la pagina e che quindi non bisognerebbe preoccuparsi troppo di affastellare contenuti nella parte superiore (above the fold) per metterli in evidenza. Una verifica però è sempre meglio farla, anche senza trasformare quello dell'above the fold in una sorta di feticcio o di ossessione. Uno strumento per i test ce lo ha messo a disposizione Google proprio nelle ultime ore. Si chiama Browser Size. Una volta inserito l'URL della pagina che si desidera testare, l'applicazione carica la pagina e sovrappone ad essa uno schema grafico semi-trasparente che mostra sui due assi (orizzontale e verticale) le dimensioni in pixel della finestra, e al centro una serie di grafici che visualizzano in forma di percentuale quanti utenti vedono una certa zona della pagina. I dati su cui si basa il tool sono presi dalle statistiche d'accesso con i vari browser alla home page di Google. azithromycin 500 mg

Continua a leggere Google Browser Size

Categoria: Web Design

Dovendo realizzare un layout a larghezza fissa, negli ultimi tempi, in quella che potremmo definire l'era del post-800x600, si è imposta quasi come uno standard la dimensione di 960px in senso orizzontale. Prendendo spunto dal recente rifacimento di Typographica.org (in cui i designer si sono spinti fino ai 1045px), Cameron Moll si chiede quale dimensione possa essere l'erede dei 960px nel caso in cui si decida di ottimizzare il layout per risoluzioni del monitor superiori ai 1024px. Le proposte: 1020, 1040, 1080. Ciascuna opzione è presentata da Moll facendo dei calcoli sulla divisibilità  (per 2, 3, 4, etc). Dai commenti emerge uno spettro di opinioni molto variegato. Se l'appoggio di molti va ai 1080px, c'è anche chi mette sul piatto un argomento da non trascurare e di cui sono certo molti di voi (me compreso) possono rappresentare un esempio: chi usa monitor con alte o altissime risoluzioni, difficilmente usa il browser massimizzato. Occhio dunque a non esagerare. Forse i 960px sono ancora l'opzione di salvaguardia da mantenere?

Continua a leggere La larghezza ideale per risoluzioni oltre i 1024px

Categoria: Web Design

Lo sviluppo delle tecnologie di produzione degli schermi LCD diffonde sul mercato schermi con qualità  sempre più alta e prezzi sempre più accessibili. Di recente ho letto un articolo che parlava del sorpasso dei monitor da 22 pollici su quelli da 19. Se davvero il 22 pollici diventerà  uno standard, in che modo ne risentirà  la navigazione web? Vi siete chiesti come apparirebbe il vostro sito su uno schermo da 22 pollici con 1680 x 1050 pixel di risoluzione, quando per esempio avete adottato un layout fluido? Un paragrafo che su uno schermo da 15" poteva disporsi su 12 righe, verrebbe visualizzato su unÂ’unica riga lunga 1680 pixel, con risultati drastici per la leggibilità  e lÂ’accessibilità  ai contenuti. (more…)

Continua a leggere L’impatto dei wide-screen su layout e accessibilità 

Categoria: Grafica

Ci sono davvero moltissime segnalazioni che per mancanza di tempo o spazio non passano qui sul blog. Alla maniera di Smashing Magazine, vorrei introdurre un appuntamento mensile dei bookmark, così da proporvi le segnalazioni interessanti del mese appena passato che non hanno ancora trovato un ritaglio nei vari post del blog. Dei molti bookmark che ho raccolto a novembre vi presento i 20 che maggiormente meritano una segnalazione: dal markup ai CSS, dal web design all'ispirazione... Ecco la lista: What Beautiful HTML Code Looks Like 30 ways to improve readability Better Web Forms: Redesigning eBay's Registration CSS PNG Image Fix for IE Pagination Gallery: Examples And Good Practices 23 Actionable Lessons from Eye-Tracking Studies The Blog Readability Test Figure Microformats Interesting Web Browsers You Have Never Heard Of 12 Invaluable Sites for Web Design and Design Inspiration Fieldsets, Legends and Screen Readers The Successful Error Page 21 Factors that Influence the First Impression of Your WebsiteÂ’s Visitors Screen resolution and better user experience CSS fix for Graphical Input Submit Button Off-Set What If Gmail Had Been Designed by Microsoft? The AxsJAX Framework for ARIA Future-Proof Your Web Site Design by Planning Your CSS In Advance For Webdesigners - 383 helpful links for webdesigners 30 More Excellent Blog Designs

Continua a leggere Bookmark di Novembre

Categoria: Web Design

àˆ uno di quei casi in cui non si può fare altro che leggere, analizzare i risultati e alla fine confrontarli con la propria esperienza per valutarne la bontà  e l'attendibilità .Sul sito di Software Projects (trattasi di una web agency americana), è stato pubblicato l'esito di uno studio da loro condotto per verificare quale sia la risoluzione di pagina e il layout migliore per incrementare il tasso di conversione.Il confronto è stato effettuato tra tre gruppi con cinque landing page ciascuno: il primo aveva un layout ottimizzato per la risoluzione di 800x600px, il secondo un layout fluido, il terzo un layout ottimizzato per i 1024x768px. I risultati sono riassunti in questa tabella, per i dettagli rimando all'articolo:

Continua a leggere Le pagine ‘strette’ aiutano le conversioni?

Categoria: Web Marketing

Cameron Moll ha da poco pubblicato Gridding the 960, il seguito di Optimal width for 1024px resolution? citato a suo tempo da Cesare in un post su questo blog.Senza entrare in riflessioni senza fine del tipo meglio liquido che fisso, devo dire che ho trovato molto interessante il post per diversi motivi. 960px è una misura che va bene per risoluzioni 1024x768 o superiori, ed è un numero facilmente divisibile (per 2, 3, 4, 5, 6, 8, 9, 10, 12); vengono poi presentate tre immagini che, usate come sfondo, possono costuire delle ottime griglie-guida per il layout, insieme ad alcuni link interessanti. Concludo con due approfondimenti: Web design con le griglie per l'aspetto teorico; mentre per la parte pratica e d'ispirazione, il recentissimo The grid su DesignMeltDown.

Continua a leggere 960 e le griglie

Categoria: Web Design

Dell'argomento ci siamo già  occupati in altri post, per esempio segnalando un bel post di Simon Collison, The importance of window-width, che chiariva molto bene l'importanza di distinguere tra la risoluzione del monitor e la larghezza effettiva della finestra del browser (e di conseguenza dell'area utile per il contenuto). L'autore aggiungeva alle sue considerazioni una serie di statistiche relative al suo sito.Su questa stessa linea, ma con un campione più ampio e diversificato per tipologia, si colloca il report Actual browser sizes pubblicato di recente su baekdal.com (ne parlo solo ora perché non avevo avuto il tempo per darci un'occhiata più attenta).Rispetto alla domanda cruciale e che non a caso conclude lo studio ("Quale dimensione reale devo supportare?"), la sintesi è data da questa tabella: Ora, è chiaro che chi sviluppa un sito dovrebbe farlo conoscendo bene la dotazione dei suoi utenti. Ma osservando questi dati mi pare di poter dire che prima di optare senza pensarci per dimensioni adattate alla risoluzione dominante di 1024x768px (se ricordate avevamo parlato tempo fa dei fatidici 960px) bisognerebbe fermarsi un attimo a riflettere.

Continua a leggere Design e risoluzione reloaded

Categoria: Web Design

Post e segnalazioni per quelli mai stanchi del tormentone fisso vs. liquido (si parla di dimensioni del layout, se non si fosse capito).Cameron Moll si chiede e chiede ai suoi lettori: Optimal width for 1024px resolution?. Ovvero: visto che la diffusione di nuovi monitor, sempre più ampi, consente tutto sommato di smettere di sviluppare avendo come base il canonico 800x600, quale potrebbe essere la misura ottimale di un layout ottimizzato per 1024px? Un po' di calcoli e considerazioni e arriva la risposta: dove prima c'era lo standard dei 750-760px, ora potrebbe esserci quello dei 960px.Non potevano mancare tra i commenti i consigli a tagliare la testa al toro adottando una soluzione liquida (o fluida, se preferite).Risposta alle sollecitazioni in un secondo post, a mio parere molto sensato. Mi è molto piaciuto questo passo (traduco): Cià detto, il design fluido risolve ogni problema di layout allo stesso modo in cui i computer dovrebbero finalmente creare l'ufficio senza carta: semplicemente non lo fanno. Moll segnala poi un recente alertbox di Jacob Nielsen dedicato proprio alla risoluzione da adottare. Così recita il summary: Optimize Web pages for 1024x768, but use a liquid layout that stretches well for any resolution, from 800x600 to 1280x1024. Ah, lo sapete che Nielsen usa un display a 2048x1536 di risoluzione e non lo considera poi tanto grande? Del resto, parola di guru, entro una decina d'anni ci abitueremo a schermi da 5000x3000.

Continua a leggere 960 e non se ne parla più (forse…)

Categoria: CSS

Alta risoluzione

12 Maggio

L'articolo Spring 2006 Reboot Trends, già  segnalato qui sul blog, è lo spunto per un'ulteriore riflessione. Un dato che emerge, infatti, è che la maggior parte dei siti che hanno partecipato a questo grande evento ha adottato un layout fisso per risoluzione minima 1024x768.Scelta implementativa così palese che John Oxton il primo maggio stesso ha dovuto cercare siti adatti per l'800x600 quasi con il lanternino attraverso il post Looking for an 800 x 600 Reboot superstar.Ho già  sottolineato altre volte come in realtà  il CSS Reboot, pur essendo indicativo per certe tendenze del web design, si riferisce solo a una piccola parte di siti dato che in maggior parte si tratta di siti personali di web designer e blogger con un'utenza tecnica e comunque specifica. Incuriosito, ho consultato The Counter per Aprile 2006 e risulta, su un campione molto attendibile di centinaia di milioni di utenti della rete, che un significativo 16% usa una risoluzione 800x600.C'è da considerare poi un altro fattore, evidenziato di recente da Simon Collison in The importance of window-width: la risoluzione dello schermo e la larghezza della finestra del browser sono due cose ben diverse.Giusto qualche tempo fa si preannunciava come possibile trend del web design un incremento dei layout fluidi...ora si scopre che la tendenza è esattamente opposta. Quali saranno i motivi? Io ne ho un paio: il primo è che il web spesso è imprevedibile, il secondo è che layout a larghezza fissa sono senza dubbio più facili da realizzare, gestire e controllare.

Continua a leggere Alta risoluzione

Categoria: Web Design