Buon pomeriggio amici. Oggi mi allontanerò un po' dagli strumenti pubblicitari e aprirò una nuova rubrica sul blog. Si chiama "Webmastering" e includerà materiali utili per migliorare le prestazioni e la qualità del sito, landing page. Inizierò con una panoramica di uno strumento interessante per controllare la mobilità di un sito web.
Controllo della velocità del sito con Google
Google offre 2 strumenti per questo.
# 1 PageSpeed Insights
Penso che tu lo conosca bene. Inserisci un link al tuo sito, premi il pulsante "Analizza" e ottieni il risultato sotto forma di due schede.
La scheda "Per dispositivi mobili" include un rapporto sulla velocità di caricamento di un sito per dispositivi mobili e - importante! - valutazione di convenienza sito per smartphone La scheda "Per computer", rispettivamente, la stessa analisi per il desktop.
La parte migliore è che il servizio ti permette di scaricare ottimizzato immagini, css e script da utilizzare sul tuo sito. Ecco un aiuto gratuito da Google.
Come puoi vedere dallo screenshot, sto riscontrando seri problemi con la versione mobile. Come va?
# 2 Testmysite.Withgoogle
In effetti, questo è lo stesso strumento, ha solo un bellissimo involucro. Ho scoperto questo servizio l'altro giorno e sono stato corrotto dal modulo di segnalazione.
Quando inserisci un link al sito e fai clic su "Verifica", il servizio offrirà il risultato sotto forma di una pagina di destinazione dinamica a tutti gli effetti, sulla quale ti dirà in modo succinto e convincente come stanno le cose con il sito e ti offrirà scarica il rapporto completo
Naturalmente, ho chiesto un rapporto completo e l'ho ricevuto per posta in un paio di minuti. Sembra ragionevole, diverse schermate di istruzioni utili con collegamenti a materiali specifici:
È interessante notare che se si analizza lo stesso sito, le cifre per questi strumenti saranno leggermente diverse. Tuttavia, lavorano sulla stessa tecnologia.
È così che in pochi secondi puoi non solo controllare la mobilità del sito e controllare la velocità di caricamento, ma anche scaricare un rapporto completo con contenuti ottimizzati. È libero. Da google
Bene, come va con la mobilità?
Eh, ancora una volta Google ci "piace" con le sue regole e algoritmi, inventando nuove "emicranie" per i webmaster. Questa volta ci viene offerto di provare un nuovo algoritmo ottimizzato per i dispositivi mobili, che consentirà di visualizzare siti adattati nella ricerca per dispositivi mobili e ridurre le risorse "non mobili".
Come funzionerà tutto questo?
È molto semplice: tutti i siti che non sono adatti ai dispositivi mobili (secondo Google) verranno semplicemente ignorati dal motore di ricerca e appariranno negli ultimi posti nella ricerca mobile e le risorse mobili aumenteranno. Ad esempio, se ci sono diversi siti con un tema simile, sul tablet l'utente troverà quelli che hanno un design adattato per la visualizzazione su dispositivi mobili.
Le mie impressioni su questa innovazione sono duplici: da una parte è tutto corretto, se utilizzo la ricerca su tablet o smartphone, allora voglio vedere nella SERP quei siti che si comportano correttamente a schermo. D'altra parte, l'algoritmo per determinare la "mobilità" è così strano da far pensare all'opportunità di tale "saper fare". Ovviamente, ho controllato i miei siti per consigli e ho trovato strano, a dir poco, comportamento di Google nei confronti dell'analisi delle risorse.
Vale la pena dire che, durante la creazione di siti Web, ho sempre controllato l'aspetto su vari dispositivi manualmente e tramite i servizi, quindi ero calmo sulla "mobilità", ma si è rivelato non così semplice. Pertanto, Google consiglia di testare le tue risorse tramite un test ottimizzato per i dispositivi mobili:
Basta inserire l'indirizzo del sito o della pagina e fare clic su "Analizza". Durante il test della pagina principale del sito del mio amico di Crimea krimeo.ru, ho visto che la pagina era ottimizzata per i dispositivi mobili.
Non sorprende che il suo modello sia reattivo e il sito abbia un bell'aspetto su diversi dispositivi. Quindi ho deciso di controllare il mio sito e qual è stata la mia sorpresa quando questa risorsa non ha superato il test.
Interessante... il template di questo blog è anche responsive, ho avuto accesso sia da tablet che da smartphone più volte... perché allora a Google non è piaciuto?
Ho iniziato ad analizzare cosa esattamente sul sito potesse provocare un tale risultato. La soluzione è stata trovata dove meno me lo aspettavo: sul mio sito le miniature degli articoli venivano visualizzate in un rettangolo di 720x350px e questo (secondo Google) non rende il sito considerato mobile. Sorprendentemente, più grande è l'immagine (pulsanti), più facile è per gli utenti di dispositivi mobili colpire con un dito ... ma Google la pensa diversamente.
È anche sorprendente che durante la navigazione nel sito su uno smartphone, tutte le immagini siano perfettamente adattate alle dimensioni dello schermo e non si notino "stipiti". Bene, ho deciso di condurre un esperimento e ho adattato la dimensione delle immagini, ad es. minore è la dimensione dello schermo del dispositivo, minore è l'immagine sul sito. Prova ad afferrare l'angolo del browser con il mouse e a rimpicciolirlo.. 
Ora, alcuni webmaster potrebbero avere un problema diverso: se Google si comportasse in questo modo con miniature grandi, allora la situazione con le illustrazioni per gli articoli sarà la stessa, e questo è molto più importante della pagina principale. Per fare ciò è necessario rendere le immagini adattive per l'intero sito, utilizzando il mezzo di lanciare uno script js, ma non è tutto, la cartella cache e la regola per il salvataggio delle immagini devono essere duplicate in .htaccess
In effetti, gli articoli che contengono immagini di grandi dimensioni non superano il test di Google e quelli con illustrazioni più piccole sono considerati completamente ottimizzati per dispositivi mobili. Non fornirò schermate: prendi semplicemente l'URL di una pubblicazione separata e controlla la "mobilità".
Perché altrimenti Googlebot vede che il blog non è ottimizzato per dispositivi mobili?
Perché ci sono molte restrizioni non necessarie in robots.txt.
C'è solo una restrizione nel file WordPress virtual robots.txt generato automaticamente:
Non consentire: / wp-admin
Ed ecco cosa scrive Google sul motivo per cui i creatori di WordPress hanno creato robots.txt come questo per impostazione predefinita:
Per garantire che le pagine siano indicizzate e visualizzate correttamente, devi concedere a Googlebot l'accesso a JavaScript, CSS e grafica sul tuo sito. Googlebot dovrebbe vedere il tuo sito come un utente normale. Se il file robots.txt non consente l'accesso a queste risorse, Google non sarà in grado di analizzare e indicizzare correttamente i contenuti. Questo può degradare le classifiche di ricerca del tuo sito.
Agente utente: * Disallow: / wp-admin Disallow: / wp-includes Disallow: / wp-content / plugins Host: Your_site Sitemap: http: // Your_site / sitemap_index.xml (Sitemap by WordPress SEO by Yoast) User -agent : Consenti immagine Googlebot: / wp-content / caricamenti / Agente utente: YandexImages Consenti: / wp-content / caricamenti /
Spero che Google migliorerà il suo algoritmo di verifica e dia risultati reali, perché nella vita reale su tablet e smartphone, molti siti hanno un bell'aspetto.
Abbiamo visto una tale sorpresa sotto forma di un algoritmo ottimizzato per i dispositivi mobili dal 21 aprile 2015. Google ci "vizia")). Vivi in pace? Ecco una Panda per te! Pochi? Anche qui c'è un pinguino! Mandare via? Diventa ottimizzato per i dispositivi mobili!
Conclusione
Sta a te decidere cosa fare con queste informazioni, se passare a responsive design o meno è una questione personale per ogni webmaster, ma queste nuove regole sono già entrate in vigore.
A proposito, "ottimizzato per dispositivi mobili" non è solo un design del sito reattivo, qui sono adatti anche una versione mobile separata e un plug-in per WordPress, l'importante è che il sito appaia corretto su qualsiasi dispositivo. Tienilo in considerazione.
Saluti, cari amici!
I gadget mobili hanno conquistato il mondo. Oggi non vanno nemmeno a prendere il pane senza telefono.
Al giorno d'oggi, Internet si sta sviluppando rapidamente. La rapida crescita del mercato di Internet mobile sta costringendo i creatori di risorse web ad adattare i propri siti a questo tipo di dispositivo.
Il mio punto è che se vuoi che il tuo sito abbia successo e sia popolare, allora dovresti pensare a come renderlo facile da visualizzare su tutti i tipi di gadget.
In questo articolo ti dirò come controllare un sito su dispositivi mobili utilizzando servizi speciali. Li ho suddivisi grosso modo in due gruppi: gratuiti ea pagamento.
Funzionano quasi tutti sullo stesso principio:
- vai al sito web dello sviluppatore di questo o quel servizio
- scarica il software che ti serve
- eseguire l'applicazione
- e dopo un po' la versione mobile del tuo sito web è davanti a te!
Ci sono servizi che possono testare il tuo sito online.
La scelta, come sempre, è tua!
Gratuito
Mobile friendly... Questa applicazione è stata creata da Google appositamente per verificare se una risorsa web è ottimizzata per smartphone e altri gadget.
Responsabile... Grazie a questa applicazione, puoi vedere facilmente come appare il sito su Kindle, iPad, Android, iPhone.
sbirciatina su ipad... Uno degli strumenti di test gratuiti più popolari con cui puoi vedere la visualizzazione del tuo sito Web su iPhone e iPad.
Opera Mini Simulatore... L'emulatore di Opera contiene un database molto ampio di gadget mobili. Il suo unico inconveniente può essere considerato la mancanza di una modalità online, ovvero, per testare la tua risorsa, dovrai scaricare e installare il software necessario.
Gomez... Valuta la compatibilità della tua risorsa con i dispositivi mobili in base a 30 parametri, il che ti consente di ottenere la valutazione più completa. Per l'utilizzo gratuito, è necessario inserire le informazioni di contatto.
MobiReady... Un ottimo strumento di test che misura la reattività di un progetto. La verifica si basa sui migliori standard W3C (World Wide Web Consortium).
Emulatore di telefoni cellulari e Screenfly... Servizi simili che consentono anche di visualizzare lo stato di una risorsa web sugli schermi di eventuali gadget.
Pagato
CrossBrowserTest... Controlli su 130 browser diversi e 25 sistemi operativi, tra cui: Blackberry, Android, iPad, iPhone. Per usarlo, dovrai pagare $ 29,95 al mese.
BrowserStack... Fornisce un rapido accesso a un enorme database. Costa fino a $ 19 per un mese, ma esiste anche una versione gratuita.
sopracciglio... Progettato per la rimozione da Android, iPad, iPhone. Dovrai pagare $ 1 per cinque screenshot.
Perfetto mobile... Dà accesso a un database di tablet e telefoni cellulari, che ti consente di vedere come l'ottimizzazione di alta qualità è su ogni tipo di dispositivo. Per il suo utilizzo è necessario pagare fino a $ 15 al giorno.
Visualizzatore multi-browser... Un'applicazione cross-browser contenente emulatori mobili e browser per i test in qualsiasi formato. Costa fino a $ 140 e c'è anche una versione demo gratuita.
DeviceAnywhere... Un ottimo strumento che permette di verificare in modo puntuale i contenuti web testando una risorsa in tempo reale. Può essere a pagamento ($ 100 al mese) o gratuito.
Come puoi vedere, ci sono molti programmi e servizi, scegli l'opzione più conveniente e usala per la tua salute.
Versione mobile per motori di ricerca
A volte il sito viene visualizzato perfettamente su tutti i dispositivi mobili, ma i motori di ricerca google e yandex non ne riconoscono la mobilità. È solo che Yandex e Google hanno requisiti aggiuntivi per la versione mobile.
Puoi verificare l'adattamento della versione mobile per Google utilizzando il servizio Mobile Friendly. L'ho già menzionato nell'elenco degli strumenti gratuiti.
E per Yandex esiste uno strumento simile nella versione attualmente testata dell'ufficio del webmaster (https://beta.webmaster.yandex.ru/).
Iscriviti alle notizie del blog e imparerai molte cose interessanti e utili. Nel frattempo vi saluto, ci vediamo con un nuovo articolo!
Cordiali saluti! Abdullin Ruslan
C'è una cosa del genere, Google presto (secondo indiscrezioni - dal 21 aprile 2015) inizierà a classificare molto male i siti che non hanno superato il controllo in Google Webmasters per la facilità di visualizzazione sui dispositivi mobili.
Non è chiaro esattamente, il sito avrà problemi solo se viene mostrato agli utenti mobile, o anche a chi ha effettuato l'accesso da PC, cioè ci sarà un problema a parte?
In sostanza, questo quasi non cambia per i siti che hanno la metà o una parte significativa del traffico mobile. Pertanto, è meglio superare il test il più rapidamente possibile.
Ti dirò come fare questo:
| Prima | A seguito di |
|---|---|
 |  |
- Il primo pezzo, che ha aiutato a risolvere il problema senza ulteriori gesti.
- Secondo momento se vediamo il messaggio "Gli elementi interattivi sono troppo vicini tra loro". Mostrato su google.com/webmasters/tools/mobile-friendly.
È solo che negli stili la classe richiesta prescrive più rientri per collegamenti e pulsanti. Afferra il margine o il riempimento di 5px o più.A volte il blocco Adsense può creare un problema del genere. Forse devi inserire un blocco più grande o con un carattere più grande.
In robots.txt aggiungi la riga:
Consenti: /wp-content/themes/ Template_Name/style.css(Se il file con stili si trova a un indirizzo diverso, lo registriamo. Se ci sono più file con stili, inseriamo le righe per ciascun file.)
P.S. Inizialmente, mi aspetto che il primario sia stato fatto da te.
Nell'articolo attuale parleremo di come viene verificata la versione mobile del sito, della sua praticità, leggibilità e corretta visualizzazione.
Puoi controllare l'usabilità del tuo sito web su dispositivi mobili utilizzando vari servizi web. In particolare, questo servizio di Google ti consente di valutare adeguatamente l'alfabetizzazione del tuo layout mobile.
Google ha recentemente annunciato che i siti che non soddisfano i requisiti di layout mobile pessimizzeranno le ricerche mobili. Questo algoritmo è già funzionante e alcuni siti che non si sono preoccupati di essere visualizzati su piattaforme mobili sono stati effettivamente inseriti nelle SERP per dispositivi mobili.
Se il tuo sito è tre volte conveniente per le piattaforme desktop, devi controllare la qualità del layout mobile, altrimenti perderai una parte impressionante del tuo traffico (la quota di piattaforme mobili nella ricerca cresce rapidamente ogni anno), il che significa che perderai i tuoi clienti Pertanto, è necessario adattare i propri siti ai dispositivi mobili e verificare la correttezza della visualizzazione dei siti nei browser mobili.
Verifica della qualità del layout mobile utilizzando Google Chrome
Per gli sviluppatori, Google ha un ottimo strumento per simulare i dispositivi mobili. Questo strumento è integrato nel browser Google Chrome. Per accedervi è necessario cliccare F12 nel browser (vai in modalità sviluppatore) e clicca sull'icona dello smartphone:
La pagina viene convertita in modalità di commutazione del dispositivo, in cui è possibile selezionare uno dei dispositivi mobili più diffusi, il tipo di rete (GPRS, 2G, 3G, 4G, ecc.), specificare parametri di visualizzazione rigorosi. Ciò consente di simulare il funzionamento del sito su specifici dispositivi mobili. I dispositivi disponibili includono varie versioni di iPad, iPad Mini, iPhone, BlackBerry, Google Nexus, HTC, LG, Nokia, Samsung Galaxy e alcuni altri dispositivi popolari.
Scegliendo un dispositivo specifico, puoi controllare il sito su un dispositivo mobile. Ad esempio, visualizzando la pagina principale del sito Nubex su iPad 3:
E sul Samsung Galaxy S4:
Qui non solo puoi vedere la visualizzazione del sito su un particolare dispositivo, ma anche lavorare completamente con il sito, come se il gadget necessario fosse di fronte a te. Indubbiamente, questo strumento è semplicemente insostituibile quando si sviluppa una versione mobile del sito, ma come verrà visualizzato il tuo sito su dispositivi reali - devi verificare su dispositivi reali. Ciò è particolarmente importante se è necessario verificare la visualizzazione del sito nei browser "nativi" (Safari - per iPad / iPhone, IE - per Windows Phone, ecc.).
