Turite atsiminti keletą dalykų, jei norite, kad jūsų svetainė veiktų efektyviai. Gerai, kad yra tokie universalūs įrankiai, kaip Google Lighthouse, kurie gali padėti optimizuoti ir sekti tokius veiksnius kaip našumas, prieinamumas ir daug daugiau.
Šis įrankis atlieka auditą ir analizuoja informaciją progresyvinėje interneto programėlėje (web-app) ar svetainės puslapyje. Sudaroma ataskaita apie programėlės ar puslapio našumą. Jis tikrina tinklalapį žemo našumo standarto pagrindu, kad sužinotų, kaip jis veiks blogo ryšio atveju ar senesniame prietaise, ir pateikia naudingos informacijos, kaip jis veikia žemesnėmis, nei standartinės, sąlygomis.
Nors Google Lighthouse daugiausia dėmesio skiria progresyvioms interneto programėlėms ir svetainių mobiliosioms versijoms, jis pateikia gausu informacijos ir rekomendacijų, kurias galima pritaikyti bet kurioje svetainėje. Tai būtina norint stebėti, kaip jūsų svetainė veikia ir kokius ji pasiekia rodiklius analizuojant svarbią metriką.
Kaip Naudotis Google Lighthouse
PageSpeed Insights
Google Lighthouse galima labai produktyviai naudotis, ir jūs galite pasirinkti sau patogesnį būdą. Darbo eiga gali apimti:
Chrome DevTools: lengvai tikrinkite puslapius, kuriems reikalingas autentifikavimas, ir skaitykite ataskaitas jums patogiu ir lengvai skaitomu formatu. Naudodami Google Chrome, galite patikrinti bet kurį žiniatinklio URL, atlikdami Chrome DevTools‘uose šią procedūrą:
- Atidarykite puslapį, kurį norite patikrinti, Chrome naršyklėje.
- Atidarykite Chrome DevTools.
- Windows: klavišas F12 arba Control + Shift + I; Mac: Command + Option + I
- Pagrindiniame Chrome meniu viršutiniame dešiniajame kampe spustelėkite „Customize and control Google Chrome“/ „Konfigūruoti ir valdyti Google Chrome“, tada pasirinkite „More tools / Daugiau įrankių“ > „Developer tools / Kūrėjo įrankiai“.
- Spustelėkite Auditų kortelę.
- Spustelėkite „Run audits / Vykdyti auditą“ mygtuką.
Iš komandų eilutės: automatizuokite Lighthouse taip, kad jis būtų paleidžiamas per apvalkalo skriptus, naudojant jį kaip „Google Chrome“ plėtinį. Šalia Chrome adresų juostos spustelėkite Google Lighthouse piktogramą.
Kaip mazgo modulis (Node module): įterpkite Lighthouse į savo nuolatines integravimo sistemas.
Iš žiniatinklio vartotojo sąsajos: paleiskite Lighthouse ir susiekite su ataskaitomis be įdiegimo. Šioje versijoje galite įterpti URL į Matavimo puslapį, kad atliktumėte svetainės nagrinėjimą. Po kelių sekundžių turėtumėte pamatyti išsamią ataskaitą su bendrais balais.
Pagrindiniai Rodikliai
Paprastai tariant, Lighthouse yra svetainės stebėjimo ir vertinimo įrankis, atliekantis našumo, prieinamumo, progresyvių interneto programėlių, SEO ir daug daugiau auditų (iš viso patikrinama daugiau nei 75 rodiklių). Ši duomenų metrika apima beveik viską, ką reikia žinoti norint patobulinti svetainę ir padaryti ją patrauklesnę bei matomesnę.
Našumas
Našumo metrika daugiausia apima greitį, delsą, išteklių optimizavimą ir kt. First Contentful Paint parodo, kiek laiko užtrunka bet kokio turinio pasirodymas ekrane.
- First Meaningful Paint: trukmė, reikalinga tam, kad pirmas prasmingas turinys pasirodytų ekrane. Mažesnis balas reiškia greitesnį puslapio krovimąsi.
- Speed Index: greičio testas, parodantis, kaip greitai kraunasi visas puslapio turinys. Indeksas pagrįstas krovimosi laiku, mažesniu nei 1,25 sekundės.
- First CPU Idle: trukmė nuo krovimosi iki tada, kai prietaisas nesugeba įkelti puslapio.
- Time to Interactive nagrinėja, kaip greitai puslapis tampa interaktyvus. Šiuo matavimu daugiausia dėmesio kreipiama į tai, kiek laiko reikia vartotojo sąsajos elementams tapti interaktyviems ir ekranui sureaguoti į vartotojo įvestį.
- Estimated Input Latency rodo, per kiek laiko puslapis reaguoja į vartotojo veiksmą ar įvestį. Kuo mažesnė delsa, tuo greitesnis atrodo puslapis. Įvesties delsa neturi viršyti 50 milisekundžių.
Prieinamumas
Šiame ataskaitos skyriuje pateikiami įvairūs puslapio formatavimo nagrinėjimai, įskaitant antraštę, fono ir priekinio plano spalvas, spalvų kontrastą, vaizdų alt-tekstus, dokumento pavadinimo žymas ir nuorodų pavadinimus. Google Lighthouse Accessibility skyriuje taip pat pateikiamas „papildomų elementų nagrinėjimui rankiniu būdu“ sąrašas, kuriame įvardinti tie elementai, kurių neįmanoma patikrinti automatiškai, atliekant našumo testus.
Po nagrinėjimo Lighthouse parodo, kurie elementai neatitinka jo standartų. Tai sudaro kontrolinį sąrašą, kurį jūs galite pritaikyti savo svetainėje, o tai gali ženkliai įveikti SEO, formatavimo ir matomumo požiūriu.
Geriausia Praktika
Šiame skyriuje kalbama apie HTTPS, programėlių talpyklą ir kryžminių nuorodų saugumą. Be to, jis stebi vietovės duomenų leidimo užklausas, pažeidžiamas JavaScript kolekcijas, nebenaudojamas API ir tai, ar vartotojai gali įklijuoti ženklus į slaptažodžio laukus. Tai taip pat apima vaizdų optimizavimą, JS bibliotekas, naršyklės klaidų registravimą, žinomus JS pažeidžiamumus, ir kt.
SEO
SEO patikrinimą iš esmės sudaro puslapio žymių ir būsenos kodų paiešką. Kai kurias dalis reikia įvesti rankiniu būdu, todėl šiame skyriuje galite nurodyti meta aprašymus, pavadinimus, šriftų dydžius ir kt.
Progresyvios Interneto Programėlės
Peradresavimas iš HTTP į HTTPS, geras atsakymo kodas gerai, greitas krovimasis 3G, prisistatymo langas, indikacijos laukas, ir kt.
Progresyvios interneto programėlės turi būti:
Patikimos – krautis greitai ir niekada nerodyti „downasaur‘ą“ (Chrome klaidų puslapio), net ir esant nepastovaus ryšio sąlygoms.
Greitos – sparčiai reaguoti į vartotojo sąveiką naudodamos sklandžias animacijas, ir be užstringančio janky scrolling‘o.
Įtraukiančio – internetinė programėlė turi atrodyti kaip tikrasis mobilusis app‘as, teikiantis visapusišką vartotojo patirtį ir įsitraukimą.
Taip pat skaitykite: Kaip Schema Gali Padidinti Jūsų SEO ir Matomumą