Google Mobile Search, nuove regole 2017 per semplificare l’accesso ai siti web da dispositivi mobili!

google mobile nuove regole 2017

Dopo la annunciata rivoluzione “Mobilegaddon”, con l’intento di semplificare l’accesso ai siti web da dispositivi mobili, Google cambia passo e dichiara guerra ai messaggi intrusivi, spesso pubblicitari ma non solo, presenti in quantità su alcuni siti web che rendono difficile se non impossibile una corretta navigazione mobile. Per capire meglio, parliamo dei cosiddetti interstitial o per intenderci quei fastidiosi popup che perseguitano da sempre gli utenti web impedendo loro di accedere immediatamente ai contenuti principali.

A partire da Gennaio 2017, infatti, saranno ulteriormente aggiornati gli algoritmi del motore di ricerca che andrà pian piano a penalizzare il rank dei siti in palese contrasto con le nuove regole. Saranno retrocesse nelle SERP le pagine che contengono interstitial, almeno quelli più invasivi, con l’intento di migliorarne l’accessibilità da dispositivi mobili. Per il momento si parla soltanto di SERP provenienti da ricerca Mobile, ma non è detto che in futuro la cosa non si possa applicare a tutte le ricerche. Importante specificare che la scure di Google si abbatterà soltanto su interstitial grossolani ed invasivi, comunque non utili alla navigazione ed alla vera fruizione dei contenuti. Per esempio saranno tenuti fuori dalla penalizzazione gli avvisi come quelli legati all’utilizzo dei cookie o verifiche ed informative varie.

Google Webmaster Central Blog riporta le specifiche delle novità con le regole di applicazione ed un chiaro cenno alle eccezioni.

Ecco le modalità che saranno penalizzate da Google Mobile Search:

  • Mostrare qualunque tipo di popup che si sovrapponga alla pagina coprendo interamente i contenuti principali ed impedendo la navigazione.
  • Mostrare qualunque interstitial intrusivo che richieda una specifica azione da parte dell’utente per poter continuare la navigazione.
  • Mostrare qualunque interstitial parzialmente intrusivo, disposto a margine superiore o inferiore della pagina, anche nel caso in cui lo stesso lasci intravvedere il contenuto per intero.

interstitial_not_allowed

Ecco invece le modalità, utili alla navigazione, che non rischiano la penalizzazione:

  • Avviso di utilizzo di cookie con pulsante di accettazione.
  • Interstitial per la verifica della maggiore età dell’utente e consentire un accesso consapevole al contenuto.
  • Piccoli banner pubblicitari marginali e poco invasivi.

interstitial_allowed

Il mondo del web si dimostra particolarmente diviso sulla decisione di Google, naturalmente gli interessi di chi usa la rete come utente e chi invece lo fa da editore sono sostanzialmente diversi e spesso contrastanti.

Gli utenti di internet, quelli che usano la rete per svago o per lavoro, sono sempre più infastiditi da alcune forme di comunicazione particolarmente invadenti e ritengono sia giusto cercare di arginare il fenomeno all’interno di un regolamento certo e valido per tutti. Gli editori, dal canto loro, si sentono oggetto di costrizioni sempre più stringenti e poco naturali, ritengono di avere diritto di esercitare le loro strategie nel modo più e congeniale alle loro esigenze senza troppi vincoli. Personalmente ritengo, senza voler fare torto a nessuno, che uno schema etico, un codice deontologico, sia sempre più necessario per un uso responsabile della rete, ancor di più quando si parla di grandi numeri. La presa di coscienza dei limiti necessari al buon funzionamento di qualsiasi meccanismo sociale è sempre utile al meccanismo stesso e non implica una minore libertà d’azione o d’espressione ma soltanto una regola a cui attenersi. Il compito non è di certo facile, gli interessi contrastanti delle parti in gioco sono enormi, speriamo che per questa volta si possa pensare ad una soluzione utile a tutti.

© Copyright - Vietata la copia non autorizzata dei contenuti di questa pagina!

Immagini, come ottimizzarle per il web!

immagini come ottimizzarle per il web

Pubblicare immagini online, su blog, siti web o social network, potrebbe apparire come una cosa banale o comunque semplice da realizzare in mancanza di regole o standard da rispettare. Niente paura, non c’é nulla di complicato! In realtà, se ci interessa interessa soltanto condividere l’immagine con amici e parenti, probabilmente é davvero così. Se invece desideriamo che la nostra immagine sia perfettamente ottimizzata per un uso web, multipiattaforma o che abbia caratteristiche SEO friendly, allora propongo di concentrarci per un attimo e approfondire l’argomento.

Cominciamo parlando dello strumento fondamentale, realmente indispensabile per l’ottimizzazione delle immagini, mi riferisco naturalmente del software grafico per foto ritocco. Il più noto ed utilizzato software di questo tipo é certamente Adobe Photoshop, veramente l’ideale per l’editing professionale di immagini. In realtà esistono diversi altri prodotti in grado di fornirci un servizio simile, altrettanto validi ma meno costosi. Per dovere di cronaca ricordiamo che, per uso non commerciale, sono in vendita licenze Adobe Photoshop complete a prezzo ridotto, per poche centinaia di Euro, fornite anche su piattaforma Cloud. Esistono anche diverse alternative eccellenti ad un prezzo più abbordabile come Corel PaintShop Pro o addirittura in versione Open Source come il celeberrimo Gimp. Sono disponibili inoltre alcuni strumenti online che ci offrono un servizio simile, gratuitamente o a prezzi estremamente contenuti, come ad esempio Pixlr, PickMonkey etc.

La fase più importante per ad una corretta ottimizzazione é senza dubbio il controllo della dimensione dell’immagine. I siti moderni, come ben sappiamo, sono ricchi di immagini che spesso gravano in modo significativo sul peso complessivo della pagina limitandone l’uso a chi dispone di strumenti e risorse di banda adeguate alla corretta visualizzazione. E’ importante dunque che l’immagine sia trattata in modo tale da ridurla al minimo indispensabile, salvaguardandone la qualità, per poter essere utilizzata in rete dal maggior numero di utenti possibile. La dimensione, intesa come peso in KB é funzionale ad alcuni parametri collegati tra loro e gestibili dal software.

Il primo di questi parametri é la dimensione totale dell’ immagine in pixel, che dipende appunto dal prodotto lato x lato della nostra immagine, ad esempio 800X600 pixel per una immagine in 4/3 standard che avrà una quantità di pixel pari a 480K pixel. Quando scattiamo l’immagine con la fotocamera o con lo smartphone, la dimensione totale varia al variare della qualità in Mega Pixel del sensore di cui disponiamo. Normalmente l’immagine non compressa scattata con un sensore da 8MPixel avrà le dimensioni teoriche di 8MPixel, Va da se che non sarà possibile pubblicare una foto nella qualità massima espressa dall’hardware della nostra macchina fotografica all’ultimo grido e dunque l’immagine andrà ridimensionata e compressa secondo le nostre esigenze di pubblicazione.

Altro parametro importante è la risoluzione dell’immagine, nel nostro caso si misura in PPI (pixel per pollice), che corrisponde alla quantità di pixel per unità di superficie. Tornaniamo al nostro problema, tenendo conto che la risoluzione standard di un monitor per pc é di 72 pixel per pollice, intuiamo facilmente che una immagine con risoluzione superiore non sarebbe godibile sino in fondo e dunque uno spreco di risorse che andrebbe ad appesantire inutilmente il nostro file. E giusto dire che, grazie ai dispositivi in alta risoluzione, esistono anche altri parametri da rispettare, ma per complessità tratteremo l’argomento in un futuro post.

La compressione del file immagine durante il salvataggio é il terzo ed importante parametro da considerare prima della pubblicazione. Tutti i software moderni sono dotati della funzione “Esportazione per il web” che offre la possibilità, una volta configurata la dimensione e la risoluzione, di comprimere il file per un migliore utilizzo. La cosa serve ad impedire che l’immagine risulti inutilmente pesante e difficile da caricare tramite browser. Le immagini destinate alla pubblicazione web vanno ottimizzate generalmente per la dimensione scelta, ad esempio 800X600 pixel, una risoluzione di 72 pixel per pollice ed un valore di compressione che varia a seconda dei gusti personali e della qualità di dettaglio che si desidera mantenere, normalmente 80% nei files jpg per immagini di buona qualità. Per quanto riguarda le estensioni con cui salvare i files, le più utilizzate sono appunto jpeg o jpg, png e gif. Personalmente comprimo in jpg quasi tutto e mi limito a png per le immagini che necessitano della trasparenza.

Il percorso di ottimizzazione delle immagini per il web non finisce qui, comincia ora la fase che completa l’immagine con caratteristiche SEO fiendly, consentendo alla stessa di essere correttamente riconosciuta ed indicizzata dai motori di ricerca.

Il nome é il primo fattore che la identifica l’immagine e ne descrive il contenuto ponendola all’attenzione dei motori di ricerca. Il consiglio é quello di nominare il file secondo uno schema descrittivo in modo che lo stesso sia utile ad una migliore comprensione e classificazione dell’immagine, ad esempio (costiera_amalfitana_tramonto.jpg). Ricordiamo, a proposito dell’importanza del nome file, che l’URL dell’immagine si compone, nella sua parte finale, del nome del file stesso.

E possibile inoltre aggiungere un contenuto descrittivo all’interno dell’attributo di testo alt, direttamente nel codice HTML con la funzione di fornire un testo alternativo per descrivere il contenuto dell’immagine e renderla maggiormente comprensibile e fruibile ai motori di ricerca. Non tutti lo utilizzano ma é possibile assegnare all’immagine anche un attributo title, per aggiungere appunto un titolo che identifichi l’immagine dando alla stessa un’identita univoca.

<img src=”../costiera_amalfitana_tramonto.jpg” title=”Tramonto in Costiera Amalfitana” alt=”tramonto sul mare, veduta da Amalfi” width=”800″ height=”600″>

I moderni CMS includono alcune funzionalità interessanti relative all’immagine, alla quale possono attribuire oltre al titolo ed al testo alternativo, come già visto, anche una descrizione ed una didascalia per completare le funzionalità SEO disponibili.

In conclusione possiamo dire che utilizzare con metodo una corretta ottimizzazione e gestione delle immagini web, nonostante possa apparire come una pratica faticosa e non sempre gradita, é invece estremamente utile ed in grado di produrre in breve tempo risultati veramente apprezzabili in termini di prestazioni del nostro sito web, nonchè aumentarne significativamente le caratteristiche SEO.

© Copyright - Vietata la copia non autorizzata dei contenuti di questa pagina!

Boostrap V4, quasi pronta la release ufficiale!

Boostrap V4, quasi pronta la release ufficiale!

Dopo aver rilasciato il secondo step della versione 4 Beta del noto Framework, Bootstrap dichiara che ci siamo, la release ufficiale é quasi pronta! Parecchie le novità che la differenziano dalla versione precedente, a quanto sostiene il team che la ha sviluppata sono intervenuti praticamente su tutti i fronti ed in tutte le righe di codice che la compongono. Quali le novità più evidenti?

Ora, il framework privilegia in esclusiva il preprocessore Sass, rispetto alla versione precedente che supportava anche Less. Una scelta di campo per cercare di dare una direzione certa allo sviluppo e semplificare la vita agli utilizzatori. Un sistema di griglia ancora migliorato per privilegiare ulteriormente l’approccio mobile. Nuove opzioni di personalizzazione CSS, come gradienti, transizioni, ombre etc. gestibili ora direttamente come variabili Sass. Completamente abbandonato il supporto per IE8 per migliorare ulteriormente il codice CSS, un esempio concreto é l’implementazione delle unità relative ems e rems al posto del pixel utilizzato in precedenza. Tutti coloro che desiderano ancora piena compatibilità con IE8, saranno costretti ad utilizzare la versione precedente del framework. Rivisti completamente tutti i plugins JavaScript.

Tanto altro ancora in previsione di un rilascio imminente della versione definitiva. Ancora uno o due livelli di sviluppo beta e poi ci siamo! Vai al sito

© Copyright - Vietata la copia non autorizzata dei contenuti di questa pagina!

App nativa o web app? un pò di chiarezza..

App nativa o web app? un pò di chiarezza..

La sempre crescente necessità di produrre applicazioni per dispositivi mobili come tablet e smartphones ci porta in molti casi a dover decidere tra applicazione nativa e applicazione web.

Cerchiamo ora di comprenderne le differenze più importanti, i punti di forza e di debolezza. Ecco le caratteristiche principali delle due soluzioni:

  • La cosa che salta all’occhio per prima e che vale la pena specificare é che un’applicazione nativa é creata appositamente per una data piattaforma, come ad esempio Android o iOS e viene installata sul dispositivo come una normale applicazione da desktop. Questo tipo di applicazioni sono normalmente distribuitae tramite store digitali, diversi a seconda della piattaforma, ad esempio App Store e Google Play. Una app nativa é scritta sempre con un linguaggio dedicato che differisce da una piattaforma all’altra, Objective-C per quanto riguarda iOS e Java per Android. Offre all’utente caratteristiche e prestazioni decisamente superiori, utilizza infatti a pieno la velocità del processore ed in più gestisce funzionalità tipiche del dispositivo tramite l’accesso diretto al sistema operativo. Consente allo sviluppatore una migliore e più concreta monetizzazione del suo lavoro, essendo distribuita da uno store e pagata con carte di credito.
  • Una web app, invece, é in sostanza un sito web ottimizzato per il mobile che gira su un normalissimo web server e per funzionare necessita soltanto di un browser che le interpreti. La web app ha la caratteristica di essere scritta nei linguaggi più classici ed apprezzati del web, come HTML, CSS e Javascript. Ha l’enorme vantaggio di poter essere aggiornata in tempo reale direttamente dal web server. Anche se non può accedere al sistema operativo del dispositivo, ha comunque a disposizione funzionalità interessanti offerte dalle API del browser come ad esempio geolocalizzazione, orientamento, web storage etc. Il più grande vantaggio della web app é quello di essere completamente indipendente dalla piattaforma tecnologica del device, il che la rende universale e disponibile a tutti.
  • Il problema principale per una app nativa risiede nella forte frammentazione del mercato e delle piattaforme tecnologiche presenti in esso che richiede un impegno costante specifico da parte degli sviluppatori per soddisfare gli utenti iOS piuttosto che Android e quant’altro. Non succede altrettanto per le applicazioni basate sul web che normalmente nascono mutipiattaforma, anche se con piccole differenze irrilevanti, e si adattano agevolmente a tutti gli utenti mobile del web con un notevole risparmio di tempo e di denaro.

Una struttura performante contro una struttura versatile, tempi di sviluppo più lunghi e costosi contro tempi più contenuti e strumenti di sviluppo più agili e maggiormente utilizzati. Queste, in sintesi, sono le differenze più importanti che dividono i due mondi a confronto.

© Copyright - Vietata la copia non autorizzata dei contenuti di questa pagina!

Ratchet, front-end mobile in modo semplice e veloce!

Ratchet, front-end mobile in modo semplice e veloce!

Si chiama Ratchet il tool di sviluppo HTML,CSS e JS, creato appositamente per dispositivi mobili che si aggiunge ai già titolati JQuery Mobile e Sencha Touch. Come la maggior parte dei frameworks, é dotato di classi di base per facilitare la costruzione di interfacce app assolutamente impeccabili e componenti JS per migliorarne l’aspetto.

Ha un approccio semplice, intuitivo ed un tema elegante, compatibile con iOS ed Android. Il prodotto é rilasciato con licenza MIT e dunque utilizzabile da tutti in modo aperto, da qualche anno fa parte della famiglia Bootstrap che é sinonimo di qualità. Vai al sito

© Copyright - Vietata la copia non autorizzata dei contenuti di questa pagina!