responsivo

Motobase

Nuovo negozio e-commerce su piattaforma PrestaShop, design responsivo (in collaborazione con www.geeo.it)

 

Fibroadenoma

Sito web CMS su piattaforma Joomla 3.x, design responsivo (in collaborazione con www.geeo.it)

 

Versan & Dafne

Sito web CMS su piattaforma Joomla 3.x, design responsivo in 2 lingue (italiano, e inglese) (in collaborazione con www.geeo.it)

 

Rossini Service

Sito web CMS su piattaforma WordPress (in collaborazione con www.geeo.it)

Nomos

Sito web CMS su piattaforma WordPress; il template grafico utilizzato supporta il responsive design adattando le dimensioni anche a dispositivi tablet e mobile.

Elettrolaser

Sito web CMS su piattaforma Joomla 3.x, design responsivo in 6 lingue (italiano, inglese, francese, tedesco, spagnolo e russo)

Mobilegeddon: Google cambia algoritmo favorendo i siti mobile-friendly

Google annuncia una novità importante: gli algoritmi di ricerca a breve verranno adattati per favorire il ranking dei siti ottimizzati per dispositivi mobile.

A partire da oggi Google introduce le modifiche dell’algoritmo che regola le risposte alle ricerche degli utenti favorendo i siti mobile friendly, ottimizzati per smartphone e tablet. La decisione del motore di ricerca è motivata dal fatto che oltre il 50% delle ricerche viene effettuato ormai da un dispositivo mobile, un dato che in occasione della stagione natalizia negli Stati Uniti ha superato anche il 60%.

Il presente e il futuro (prossimo) del web è mobile

La scelta di Google legata al “mobile friendly” è giustificata dal fatto che il mobile ha un ruolo sempre più importante nel mondo della navigazione web, e oltretutto la sua crescita non accenna a diminuire.

  • Nel dicembre 2014 ben 27,8 milioni di italiani hanno avuto accesso a internet da smartphone e 10,2 milioni da tablet
  • Nel 2014 si rileva il primato del mobile nella fruizione quotidiana di internet, con una media di 15,6 milioni di utenti online da dispositivi mobile (smartphone e tablet) contro i 12,7 milioni di utenti online da PC.
  • Da gennaio 2014 al dicembre 2014 l’utilizzo quotidiano di internet da dispositivi mobile ha avuto una crescita del 20%

Quali soluzioni?

Se avete intenzione di rendere il vostro sito “mobile friendly” le strade possibili sono principalmente due:

Design responsive

Si ha un unico sito per servire sia i dispositivi desktop che quelli mobile, quindi il codice html così come l’indirizzo di una pagina è lo stesso per qualsiasi dispositivo la visualizzi, salvo avere una visualizzazione diversa a seconda della dimensione del display.

Versione mobile del sito

Si ha un sito mobile distinto da quello desktop, quindi saranno diversi sia l’indirizzo delle pagine che il codice html delle stesse. Il sistema ridireziona alla versione corretta del sito in base al dispositivo utilizzato dall’utente.

Dal punto di vista tecnico si può scegliere una strada o l’altra a seconda delle necessità del sito, non c’è una soluzione che va considerata migliore a priori, ciascuna delle due presenta vantaggi e svantaggi; c’è però da dire che Google recentemente si è espressa a favore del design responsive.

RWD – Responsive Web Design

Il termine Responsive Web Design (RWD) viene utilizzato per indicare una particolare tecnica di Web design per la realizzazione di siti web in modo che le pagine adattino automaticamente il layout per fornire una visualizzazione ottimale in funzione dell’ambiente nei quali vengono visualizzati (pc su desktop con diverse risoluzioni, tablet, smartphone, cellulari di vecchia generazione, web tv) riducendo al minimo all’utente la necessità di ridimensionamento e scorrimento, in particolare quello orizzontale.

responsive-web-design-vancouver-paladin-security1

La necessità di dover adattare la visualizzazione alle diverse dimensioni e risoluzioni degli schermi, ha introdotto il concetto di Resolution breakpoints per poter suddividere in un numero discreto le tipologie di layout ovvero di organizzazione dei contenuti, in funzione della larghezza del device. Tali breakpoint sono generalmente espressi in pixel, anche se l’aumento della densità dei pixel nelle nuove generazioni di device comporta che non si possa considerare il viewport solo in termini di pixel senza considerarne l’effettiva dimensione.

Ethan Marcotte nel suo libro “Responsive web design” identifica 6 Resolution breakpoints:

  • 320 pixel per device con schermi piccoli, come cellulari, mantenuti con orientamento verticale (portrait)
  • 480 pixel per device con schermi piccoli, come cellulari, mantenuti con orientamento orizzontale (landscape)
  • 600 pixel piccoli tablet, come Kindle di Amazon (600×800) e Nook di Barnes&Noble (600×1024), tenuti con orientamento verticale
  • 768 pixel tablet da 10 pollici come l’iPad (768×1024) mantenuti con orientamento verticale
  • 1024 pixel computer da scrivania, laptop e netbook, e tablet come l’iPad (1024×768) mantenuti con orientamento orizzontale
  • 1200 pixel computer con schermi larghi, tipicamente desktop ma anche laptop

Tali tipologie possono essere più genericamente ricondotte a 4 principali:

  • mobile: per cellulari
  • narrow: per tablet
  • normal: pc desktop
  • wide: schermi di grandi dimensioni
Lisario Rinaldo | Consulente Informatico | Senior Software Developer | Senior Analyst | Project Manager