Buon pomeriggio, cari lettori del blog! Oggi vi parlerò delle difficoltà incontrate da molti webmaster. Sicuramente molti di voi hanno trovato il messaggio in SERP di Google, che diceva che la pagina del sito non è ottimizzata per dispositivi mobili... Cliccando sul link, verifichi la compatibilità con dispositivi mobili e ottieni 2 errori di visualizzazione: il contenuto è più ampio dello schermo e gli elementi interattivi sono posizionati troppo velocemente. Oggi ti dirò come risolvere questo problema.
Pagina Google SERP non ottimizzata
Ottimizzazione di una pagina separata per la compatibilità con i dispositivi mobili
Il problema è che su molti siti appare un contenuto più ampio dello schermo. La cosa più difficile è che questo problema si presenta anche se lo hai modello reattivo sito o ha creato una versione mobile separata. È stato creando una versione mobile separata che ho cercato di risolvere questa domanda, tuttavia, tutto si è rivelato molto più semplice. Un po 'di altri tentativi per risolvere questo problema:
- Ho installato il plug-in di compressione di immagini e media per vari dispositivi
- ha creato una versione mobile separata del sito
- modificato le impostazioni di memorizzazione nella cache per il sito
- compresso il CSS del sito e modificato le impostazioni di visualizzazione
Se leggi di risolvere questo problema su Internet, puoi trovare molte soluzioni che non porteranno risultati reali. Per risolvere il problema, è sufficiente risolvere solo una discrepanza. Non è necessario modificare il codice CSS e Modifiche PHP codice del sito. Il mio metodo è adatto non solo per un sito wordpress, ma anche per altri pannelli di amministrazione in cui è aperta l'impostazione della dimensione del file multimediale. Mi sembra che la maggior parte degli errori siano dovuti al fatto che Google segnala la posizione errata degli elementi interattivi del sito. I webmaster si concentrano proprio sulla risoluzione di questo problema, perdendo però molto tempo dato problema secondario - segue proprio a causa del contenuto più ampio.
Il contenuto più ampio dello schermo è il motivo principale per cui Google rivendica una pagina su un sito. Se il sito è ottimizzato per i dispositivi mobili, le affermazioni appaiono proprio a pagine specifiche e non l'intera risorsa web. Per eliminare data ragione, è necessario controllare tutti gli elementi visualizzati nella pagina. Di norma, Google si lamenta di immagini più larghe di 600 pixel (purtroppo non ho trovato i parametri esatti nel manuale di Google). La prima cosa che devi fare è ridimensionare i tuoi file multimediali a 500 px (che è la dimensione che uso per i miei siti).
Messaggio che il tuo contenuto è più largo dello schermo
La seconda causa del problema è il contenuto più ampio dello schermo - larghezza elementi grafici supera installato da google dimensioni per dispositivi mobili. Questi possono essere cursori, un'intestazione del sito o immagini di sfondo... È proprio il problema del cappello largo (nonostante design adattivo) è stato il motivo dell'ottimizzazione non mobile da parte dei parametri di Google su uno dei miei siti. Dopo aver sostituito l'intestazione, il sito è diventato completamente ottimizzato per i dispositivi mobili.
Come ottimizzare il tuo sito per i dispositivi mobili su Google
Al fine di ottimizzare il sito per i dispositivi mobili ed eliminare il problema dei contenuti estesi, è necessario eseguire azioni secondo il seguente algoritmo:
- Selezioniamo tutti i possibili file multimediali sul sito, a partire da tag testa e termina con Piè di pagina.
- Annotiamo le dimensioni di ciascun file multimediale
- Rendiamo ogni file multimediale inferiore a 600 px
Dopo aver completato questi semplici passaggi, puoi controllare la pagina nello strumento di ottimizzazione mobile. Come puoi vedere, la modifica degli elementi interattivi potrebbe essere richiesta solo in rari casi. Spero che il mio articolo ti sia stato utile e che tu sia riuscito a risolvere il problema dei contenuti più larghi dello schermo. Se durante la decisione hai ulteriori problemi, assicurati di scriverne nei commenti, cercheremo di capirlo.
Verifica tu stesso, stai facendo di tutto per ottenere un buon posizionamento nella SERP mobile?
Il contenuto dell'articolo:
-
-
-
-
-
-
- 1. Specificità dell'ottimizzazione mobile
L'ottimizzazione mobile ha le sue caratteristiche e difficoltà, in quanto la comodità e la semplicità di interazione dell'utente con il sito è la massima indicatore importante la qualità del sito mobile. Inoltre, i risultati della ricerca mobile sono localizzati, cioè legati alla posizione dell'utente, quindi traffico mobile, spesso, si tratta di traffico regionale. Complica anche un po' l'ottimizzazione mobile, nel momento in cui la frequenza delle richieste in ricerca mobile differisce dalla frequenza in ricerca regolare e le statistiche delle richieste di ricerca mobile devono essere raccolte separatamente, quindi nucleo semantico versione mobile il sito sarà diverso A proposito, puoi controllare la frequenza delle richieste nei risultati di ricerca mobile utilizzando Yandex.Wordstat. E puoi analizzare l'elenco delle richieste nei risultati di ricerca mobile per cui il tuo sito viene mostrato nei risultati di ricerca mobile con usando google Strumenti per i Webmaster e Google Analytics. Come verificare la mobilità del sito?
Controlla il tuo sito per l'usabilità del sito per utenti mobili puoi utilizzare i seguenti strumenti:
- Lo strumento principale è Informazioni sulla velocità della pagina- non solo verifica la fedeltà del sito agli utenti mobili, ma fornisce anche consigli su come velocizzare e ottimizzare il sito per dispositivi mobili.
- - con questo strumento puoi vedere come funziona un motore di ricerca mobile robot sistemi google vede il tuo sito.
- - un servizio di motore di ricerca interno che verifica come il tuo sito soddisfi i requisiti per la mobilità.
- TestMySite- servizio esterno, controlla i dispositivi mobili in modo bello e visivo, velocità mobile sito e velocità di download sui dispositivi desktop.
- Controllore mobile W3è uno strumento per gli sviluppatori web che desiderano migliorare le proprie pagine web o applicazioni web su dispositivi mobili. Mentre è in via di definizione.
- ridimensionatore - programma interattivo view, che aiuta i designer a testare il contenuto del sito per computer desktop, cellulare e tablet
- Quirktools- un servizio per la visualizzazione del sito su diversi dispositivi: cellulari, tablet, computer e persino TV.
- Controllo delle pagine mobili in Yandex.Webmaster: controlla anche la fedeltà del sito agli utenti mobili
3. Quali sono le caratteristiche dei diversi metodi di ottimizzazione mobile?
- versione mobile- quando cambiano sia l'URL che il codice. Il server determina il tipo di dispositivo, quindi reindirizza a pagina desiderata- m.site.com (per smartphone), t.site.com (per tablet), phone.site.com - per telefoni più semplici. Per tipi diversi i dispositivi sono usati diverse varianti codice e URL di pagina diversi. Professionisti:è facile apportare modifiche alla versione mobile alternativa senza influire sul sito principale; semplicità e comodità per gli utenti, caricamento veloce. Svantaggi: diverso dall'URL principale, c'è la possibilità di contenuti duplicati ed errori 404, la semplificazione della funzionalità porta a una limitazione contenuto desiderato.
- Display dinamico (RESS - Responsive Design + Server Side)- un URL, codice diverso per diversi user-agent. Il server invia in risposta alla richiesta URL specifico diverse opzioni Codice HTML e CSS. Quale codice inviare è determinato dalla scansione robot di ricerca, l'intestazione HTTP Vary ospitata, che aiuta a selezionare proprio il contenuto del sito ottimizzato per i dispositivi mobili. Professionisti: JavaScript non necessario può essere rimosso dall'HTML; puoi personalizzare il tuo layout e le tue applicazioni per ogni dispositivo. Svantaggi: difficile da sviluppare e non completamente elaborata la definizione dei tipi di dispositivi mobili.
- Design adattivo- quando l'URL e il codice non cambiano. Il server invia a tutti i dispositivi, sia mobili che desktop, lo stesso codice HTML, che si adatta a seconda delle dimensioni dello schermo da usando i CSS... In questo caso, è necessario assicurarsi che il necessario File CSS, JavaScript e immagini. Professionisti: relativamente facile da sviluppare e l'URL non cambia. Svantaggi: bassa velocità download e nessuna alternativa.
4. Cosa dicono i motori di ricerca sui metodi di ottimizzazione dei siti per dispositivi mobili?
GOOGLE: Le istruzioni dicono che il sistema non dà la preferenza a nessun tipo di adattamento, ma evidenzia comunque il design adattivo come raccomandato, sebbene a prima vista sia nel mob TOP5. risultati di 3 su 5 - siti con una versione mobile, tuttavia, questa è una singola osservazione che si verifica e non rivendica.
V YANDEX l'algoritmo di classificazione della ricerca mobile di Vladivostok determina tutti i tipi di ottimizzazione: design adattivo, versione mobile e RESS. Come Google, Yandex lascia la scelta ai webmaster, che devono scegliere da soli il metodo di ottimizzazione. Ma allo stesso tempo, riferisce che c'è una tendenza costante a diminuire il numero di versioni mobili e ad aumentare il numero di siti con design reattivo e RESS in Runet. Pertanto, al fine di scegliere un metodo di ottimizzazione adatto a te stesso, si consiglia di determinare esattamente quali attività l'utente deve eseguire utilizzando il suo dispositivo mobile sul tuo sito web. Riflessioni insieme a Google e una discussione nel Club sulla ricerca Yandex aiuteranno a confrontare in dettaglio tutti i pro e i contro diversi modi implementazione di versioni mobili dei siti e scegli quella più adatta al tuo sito e alla tua attività. 5. Come ottimizzare correttamente un sito per dispositivi mobili?
<1>
La velocità di caricamento della pagina è più importante per gli utenti mobili che per gli utenti desktop. Non deve superare i 3 secondi, tuttavia, le pagine dei risultati di ricerca mobile sul dispositivo dell'utente vengono caricate in media fino a 22 secondi. Per capire come alleggerire e comprimere il tuo sito, usa il servizio Informazioni sulla velocità della pagina- in esso troverai raccomandazioni dettagliate per velocizzare il tuo sito per dispositivi mobili. Vale a dire, compressione o rimozione in un separato File JavaScript e CSS, il parser ne fornisce un elenco dettagliato. Non dimenticare che puoi utilizzare il caricamento asincrono degli script in modo che gli utenti non perdano tempo o lascino il tuo sito mentre gli script vengono caricati in background.
<2> JavaScript, CSS e immagini non possono essere bloccati. Controlla la serratura, puoi ricerca Google Console sotto Indice di Google>> Risorse bloccate. Blocco JavaScript, CSS e immagini possono portare a un posizionamento basso nei risultati di ricerca per dispositivi mobili.
<3> Non ci dovrebbero essere "errori 404" sulle pagine che vengono mostrate ai navigatori web mobili. Succede che una pagina possa essere visualizzata normalmente sui desktop, ma dà un "errore 404" sugli smartphone, ad esempio, o sui tablet. Puoi controllare gli errori con Xenu, ScreamingFrog o Console di ricerca di Google Per ulteriori informazioni, vedere Scansione >> Scansione errori.
<4> Se si dispone di una versione mobile, per non duplicare il contenuto delle versioni principale e mobile, è necessario configurare correttamente la loro indicizzazione. Se la versione mobile su un sottodominio entra nei normali risultati del motore di ricerca, non è necessario creare un robots.txt separato e indicare: User-agent: * Disallow: / È meglio registrare il seguente codice nelle pagine m .site.com/page-1 - e sulle pagine del sito principale e il motore di ricerca capirà quale URL è quello principale.
<5> Per le versioni mobili delle pagine del sito, è necessario configurare correttamente un reindirizzamento per ciascuna di esse, poiché il reindirizzamento, ad esempio, alla pagina principale verrà considerato dai motori di ricerca come un errore. Tuttavia, su pagine mobili ah, non dovrebbero esserci più di 5 reindirizzamenti, poiché si ritiene che dopo il quinto reindirizzamento i motori di ricerca non li indicizzino.
<6> Se la versione mobile del sito ha animazioni in formato Flash o video con un player proprietario, è necessario sostituirli con tag HTML5, poiché questo metodo è supportato da tutti i browser. Ad esempio, puoi creare un'animazione come questa con Google Web Designer.
Invece di una conclusione
L'ottimizzazione per dispositivi mobili è sia più facile che più difficile rispetto alla normale ottimizzazione del sito web. Da un lato, il sito per dispositivi mobili ha bisogno di essere semplificato, reso il più laconico, leggero, veloce e preciso possibile. D'altra parte, non è così facile farlo. È simile alla pittura giapponese, che, utilizzando le linee più accurate, crea un'immagine unica e impressionante. Allo stesso modo, il sito mostrato all'utente nei risultati di ricerca mobile dovrebbe essere semplice, ma luminoso, conciso, ma accomodante informazione necessaria, veloce, ma chiaro.Tuttavia, tenendo conto di tutte le sfumature dell'ottimizzazione per i dispositivi mobili sopra descritte, non solo puoi ricevere traffico mobile meritato, ma anche monetizzarlo in futuro, aumentando al contempo la conversione del tuo sito mobile, aumentando così il ritorno sul business . Ma leggi questo in uno dei nostri prossimi articoli.
Attendiamo con impazienza i tuoi commenti su quale opzione di ottimizzazione mobile hai scelto per te. Perché se condividi l'esperienza, si moltiplica!
Un aggiornamento è stato rilasciato ad aprile 2015 algoritmo di ricerca Google con il nome non ufficiale "Mobilegeddon" e nel febbraio 2016 Yandex ha annunciato il lavoro di un algoritmo simile chiamato "Vladivostok". La loro essenza è simile: nella ricerca mobile, viene data la preferenza a quei siti che sono adattati per la visualizzazione su dispositivi mobili. Ciò significa che l'adattamento mobile non può più essere ignorato.
E non si tratta solo di requisiti motori di ricerca... Il traffico mobile globale ha raggiunto il traffico desktop all'inizio del 2014. E oggi, circa il 67% del traffico in Internet russo è rappresentato da dispositivi mobili. Tenendo conto delle esigenze dei nostri lettori, stiamo lavorando per mobilitare il blog. Molto presto vedrai la nostra risorsa aggiornata, che sarà molto comoda da leggere su vari dispositivi.
1. Analizza il tuo pubblico di destinazione
Prima di avviare l'ottimizzazione per dispositivi mobili, analizza il tuo pubblico di destinazione nelle seguenti aree (ad esempio, utilizzando i rapporti Metrica standard):
- demografia (sesso ed età);
- geografia (da quali regioni il maggior numero di transizioni);
- dispositivi (quali sono i dispositivi più popolari tra i tuoi visitatori: desktop, cellulari o compresse);
- sistema operativo (Android, iOS, Windows Phone, Windows 7, ecc.);
- comportamento sul sito (profondità di navigazione, tempo sul sito, rifiuti, ecc.).
Conoscere il profilo pubblico di destinazione, sarai in grado di adattare il design e i contenuti alle esigenze dei tuoi visitatori.
2. Adattare il modello per la visualizzazione su dispositivi mobili
Ci sono 3 in linea di principio approcci diversi a adattamento mobile- sono tutti descritti nella documentazione per gli sviluppatori di Google. Ognuno di loro ha i suoi vantaggi e svantaggi.
versione mobile
In questo caso, ci saranno 2 siti: desktop e mobile. La versione mobile è ospitata su un nuovo dominio (come m.site.ru).
Vantaggi:
- il design del sito è completamente affilato per i dispositivi mobili, non è necessario cercare un compromesso;
- i webmaster hanno la capacità di ottimizzare i contenuti in conformità con le specifiche della visualizzazione su dispositivi mobili;
- puoi modificare i siti indipendentemente l'uno dall'altro;
- più facile da raggiungere ad alta velocità download.
Screpolatura:
- la necessità di una piena amministrazione del nuovo sito;
- a causa del servizio separato, i costi per apportare modifiche aumentano.
Il negozio trial-sport.ru ha una versione mobile su un dominio separato
Display dinamico
In questo caso, il design è adattato a risoluzioni dello schermo specifiche. Le linee della griglia e i layout degli elementi hanno dimensioni fisse per dispositivi diversi.
Vantaggi:
- facilità di sviluppo;
- non è necessario apportare modifiche separatamente alla versione mobile;
- È più facile per i webmaster controllare l'aspetto del design e dei contenuti sui diversi dispositivi.
Difetto- potrebbero verificarsi problemi durante la visualizzazione su dispositivi le cui dimensioni dello schermo non corrispondono a quelle specificate dagli sviluppatori.
Il sito web decathlon.ru utilizza un URL con un diverso insieme di codice HTML
Design adattivo
In questo caso, il layout del sito viene adattato con precisione a qualsiasi dimensione di visualizzazione.
Vantaggi:
- corretta visualizzazione su tutti i dispositivi;
- non è necessario apportare modifiche separatamente alla versione mobile.
Screpolatura:
- la complessità dello sviluppo, soprattutto per i progetti esistenti;
- potrebbero esserci problemi con l'adattamento dei blocchi su siti con un design complesso.
Il sito della società Vostok-Service utilizza un design adattivo che si adatta a qualsiasi schermo del dispositivo
Oltre a questi metodi di adattamento, puoi utilizzare i plugin per i CMS più diffusi. Ad esempio, WordPress ha WPtouch e WP Mobile Edition. Questa è una soluzione economica, ma la correttezza dei siti è scarsa. E se per i blog questa è la via d'uscita, allora per progetti complessi una soluzione del genere è inaccettabile.
3. Semplifica il tuo design
Design versione adattiva il sito dovrebbe essere semplice e conciso. Oggi il cosiddetto “ design piatto”, Che è caratterizzato dal minimalismo, che lo rende più facile da usare. L'espressione si ottiene attraverso il gioco di colori, piuttosto che sfumature, ombre, trame e forme ed elementi interattivi complessi.
Un esempio di minimalismo nel design
Inoltre, quando sviluppi un sito mobile, dovresti dimenticare flash player, widget e finestre pop-up. Anche l'effetto parallasse, amato da molti, va lasciato da parte, visto che non viene riprodotto su tutti i sistemi operativi mobile e rallenta la resa delle pagine.
4. Lavora per migliorare l'usabilità
Quando progetti la navigazione, pensa prima di tutto all'utente e alla sua comodità. Qualsiasi pagina dovrebbe essere accessibile in un paio di passaggi, senza filtri ed elenchi complessi. Per effettuare una chiamata con un clic, scrivi correttamente il formato del numero con il prefisso del paese e della città +7 495…. Fornire l'autorizzazione con un clic tramite i social network. In una parola: cerca di ridurre al minimo le azioni dei visitatori verso l'obiettivo.
Lo smartphone utilizza un dito invece del cursore del mouse, quindi tutti gli elementi devono essere di dimensioni sufficienti. Una persona non deve ingrandire l'immagine per fare clic su qualsiasi elemento. Non utilizzare caratteri con grazie, riccioli, corsivo. Dimensione ottimale font - 16 pixel, altezza della linea - 1.2 em.
5. Velocizza il caricamento della pagina
L'accelerazione dei download, da un lato, migliora fattori comportamentali, d'altro canto, ha un effetto positivo sul ranking. Uso vari servizi compressione:
- HTML e script (compressore HTML o Gzip);
- Codice CSS (minificatore CSS o compressore CSS);
- codice JS (Javascriptcompressor, jscompress, ecc.);
- immagini (Optimizilla, Resizepiconline, EWWW Image Optimizer, ecc.);
- usa la cache del browser
Controlla la velocità di caricamento della pagina e vedi possibili problemi puoi utilizzare il servizio PageSpeed Insights a questo link.
6. Usa i pulsanti social
Gli utenti mobili ripubblicano attivamente i contenuti. Non privarli di questa opportunità. Quindi ti assicurerai traffico aggiuntivo e migliorare i segnali sociali. Aggiungi pulsanti-collegamenti ai social network più popolari, ma non più di 4-5 nella parte visibile dello schermo, altrimenti i pulsanti saranno troppo piccoli o occuperanno molto spazio.
7. Ottimizza i tuoi contenuti
Il contenuto dovrebbe essere creato non solo tenendo conto della comodità di visualizzarlo su piccoli schermi ma anche il comportamento degli utenti mobili.
Segui queste regole:
- linearità dei contenuti (la cosa più importante è prima nella schermata e poi in ordine decrescente);
- usa titoli brevi (si leggono velocemente);
- spezzare il testo in paragrafi brevi ma significativi (l'area dello schermo del cellulare è molto più piccola del PC e se l'utente non viene portato via dalle prime righe, perderà rapidamente interesse; evita l'acqua nel testo e ragionamento vuoto);
- aggiungere elementi di navigazione per l'articolo (contenuto e ancore, pulsanti "su", "giù", "leggi");
- fornire l'opportunità di inviare un articolo per posta (non tutti hanno il tempo di leggere fino alla fine - come funzione utile darà la possibilità di leggere successivamente il materiale di interesse);
- adattare le tabelle per la visualizzazione mobile (usare plugin, script o elementi speciali scorrimento orizzontale solo tabella).
8. Non limitare l'accesso ai contenuti
Alcuni designer, invece di adattare tutti i contenuti per dispositivi mobili, li nascondono parzialmente. Questo di solito viene fatto a causa della complessità del modello, ma questo è l'approccio sbagliato. Offrire una versione "leggera" è ingiusto per gli utenti mobili. Dobbiamo lavorare per semplificare e ottimizzare il design, non per ridurre il contenuto.
9. Rimani alla moda
Segui le tendenze attuali nel campo del design e dell'usabilità e apporta rapidi cambiamenti per non essere lasciato indietro la locomotiva. Ad esempio, le seguenti tendenze sono rilevanti oggi:
- design modulare (il contenuto è raggruppato in blocchi che si allineano in uno o più nastri, a seconda delle dimensioni dello schermo);
- design piatto (ombre, penombra, volume - questo è tutto nel passato);
- l'approccio mobile first (prima si facevano i siti per PC, poi per necessità si adattavano ai cellulari - oggi è vero il contrario).
10. Non dimenticare di analizzare il sito per la mobilità.
Controlla periodicamente il tuo sito per la conformità ai requisiti dei motori di ricerca per l'adattamento mobile. Su Google, puoi farlo seguendo il link. Basta inserire l'indirizzo della pagina e attendere il risultato della verifica. Tutti gli errori rilevati devono essere corretti il prima possibile.
Per verificare la mobilità in Yandex, aggiungi il sito a Yandex.Webmaster, quindi vai alla sezione "Strumenti" / "Controlla pagine mobili" e inserisci l'indirizzo del sito. Se ci sono errori, li correggiamo anche.
Se non hai tempo per gestire in modo indipendente controlli ed errori nella visualizzazione mobile del sito, puoi ordinare un servizio di audit e ottenere consigli dal servizio "Personal Manager".
Quindi, l'adattamento mobile non è solo un fattore di ranking, ma anche un modo per aumentare il traffico e migliorare il comportamento degli utenti sul sito. Se ti concentri sul rendere più facile per l'utente interagire con il tuo sito, aumenterai la tua competitività e le tue conversioni.
attraverso Soluzioni veloci puoi salvare il tuo sito da Mobilegeddon e assicurarti che superi il test di compatibilità di Google.
introduzione
Ad aprile 2015 c'è stata una vera rivoluzione in mondo virtuale, che ha già ricevuto il nome "Mobilegeddon". Questo perché Google ha cambiato il suo algoritmo e ha iniziato a mettere i siti ottimizzati per dispositivi mobili davanti agli altri. Pertanto, tutti i proprietari di siti si sono precipitati in massa per apportare modifiche alle proprie risorse.
Nel momento in cui scriviamo, possiamo dire che l'impatto sui risultati di ricerca dell'algoritmo modificato non è molto forte, ma è già caratterizzato dall'aggiunta di una nuova etichetta accanto ai risultati di ricerca mobile.
Ma in futuro, la situazione potrebbe cambiare drasticamente. Pertanto, non sarà superfluo verificare la compatibilità del tuo sito con i gadget mobili.
Forse, prima non avevi abbastanza soldi o tempo per ottimizzare le tue risorse. Ma ora è il momento di farlo, perché prima o poi sarai messo alle strette, e dovrai fare lo stesso, ma in fretta, pensando poco alle conseguenze.
Quindi, a cosa presta attenzione il test? compatibilità mobile da Google?
Google suddivide il test in cinque parti, per ogni passaggio puoi ottenere punti:
1. Visualizza la configurazione della finestra
L'impostazione del viewport all'interno della pagina consente al browser di controllare la larghezza e il ridimensionamento della pagina per i diversi dispositivi.
2. Chiarezza del carattere
Utilizzato in combinazione con il viewport. La dimensione del carattere può essere ridimensionata per adattarsi al visualizzatore di pagine. In questo caso, puoi specificare dimensione di base font e la scala tipografica sarà in stili relativi.
3. Evita di usare plugin
Flash, Java e Silverlight presentano molti inconvenienti per gli utenti mobili. Scegli tecnologie web native (come HTML5).
4. Dimensione del contenuto
Assicurati che il contenuto rientri nei limiti orizzontali del dispositivo e che gli utenti non debbano scorrere verticalmente e orizzontalmente per visualizzare il contenuto.
5. Dimensioni di pulsanti e collegamenti
Non dovresti solo testare il tuo sito su dispositivi mobili, ma anche applicare PageSpeed Insights di Google per ottimizzare i tempi di caricamento e migliorare l'esperienza dell'utente.
Alcune informazioni di base
Con la proliferazione di smartphone e tablet, molti proprietari di siti Web hanno scoperto che le loro creazioni, che sono così comode e hanno un bell'aspetto su un computer desktop, sono scomode e brutte sui dispositivi mobili. La maggior parte dei siti a quel tempo erano realizzati per una dimensione dello schermo specifica e non avevano un layout "fluido".
È stata trovata una via d'uscita molto specifica dalla situazione: molte aziende hanno semplicemente creato un altro sito separato progettato specificamente per i dispositivi mobili.
Poi sono arrivati i CSS3 e le query multimediali. Ora i web designer e gli sviluppatori possono creare siti in grado di testare il dispositivo da cui viene visualizzata la pagina e regolare di conseguenza il layout del design. Il contenuto può essere adattato a una gamma specifica di dispositivi di output senza dover modificare il contenuto stesso.
Tra le altre cose, questo consente anche di risparmiare sui costi di mantenimento di un'altra versione mobile del sito.
Bene, proviamo a farlo.
Ma tieni presente che tutte queste correzioni sono temporanee e possono aiutarti mentre stai costruendo un sito web reale, completo e reattivo.
Tutte le decisioni che prendi devono tenere conto delle esigenze della tua attività e dei visitatori del tuo sito. Ognuno di questi cambiamenti può influenzare anche altri aspetti della tua strategia SEO.
Si prega di consultare un professionista SEO qualificato prima di apportare modifiche a un sito live.
Così,
* Hai un sito esistente;
* Vuoi apportare modifiche minime all'HTML e al CSS del sito web.
In questo caso, hai diverse opzioni:
Cambia il modello del tuo sito web
Molti dei CMS odierni consentono di modificare il tema o il modello. E molti dei modelli sono reattivi, cioè si adattano alla larghezza dello schermo desiderata.
Se, ad esempio, stai utilizzando WordPress, lavora qui per cinque minuti. Il tema può essere cambiato con pochi clic. Quasi istantaneamente, il tuo sito riceverà design fresco, e sarà adatto per i dispositivi mobili.
A seconda di come è stato progettato il sito esistente, potresti scoprire che alcuni contenuti non vengono visualizzati automaticamente in nuovo argomento... Quindi potresti dover fare del lavoro manuale.
professionisti
La possibilità di cambiare design all'istante.
Sono disponibili diverse migliaia di temi (alcuni sono gratuiti).
contro
Non tutto il contenuto precedente potrebbe essere visibile nel nuovo modello senza ulteriore lavoro.
Un nuovo design potrebbe non corrispondere sempre al tuo marchio.
Crea un sito separato per i dispositivi mobili
Forse, secondo alcuni, questo equivale a un'ammissione di sconfitta. Ma creare un sito autonomo e ottimizzato per i dispositivi mobili è probabilmente il più conveniente. soluzione efficace a breve termine per molti siti web che non hanno accesso al CMS, o che non possono essere ridisegnati.
