- Ukufinyelela nokuhlela amathuluzi onjiniyela usebenzisa izinqamuleli namamenyu wokuqukethwe.
- Ukuhlaziywa okujulile kwezitayela ze-DOM ne-CSS ukuze kuthuthukiswe ukufinyeleleka kanye nomklamo ophendulayo.
- Ukuhlolwa kokusebenza kanye nokuqapha umthwalo wezinsiza ngephaneli yeNethiwekhi kanye neLighthouse.
- Amasu okulungisa amaphutha e-WPO kanye nokwenza ngcono ukuthuthukisa ukuma kwe-SEO.
Uma usebenza embonini yewebhu, kungaba ukuklama, ukuhlela, noma uzama ukuqinisekisa ukuthi isayithi lakho alibonakali ku-Google, kungenzeka ukuthi uke wahlangana nenkinobho ethi " inspect element" . Kumane kuyindlela eya ku-Chrome DevTools, iqoqo lamathuluzi akuvumela ukuthi uhlole ukusebenza kwangaphakathi kwanoma iyiphi iwebhusayithi ukuze uqonde ukuthi isebenza kanjani, ulungise amaphutha ngokushesha, noma umane uhlole ukuthi yini engemuva kobuso obubonakalayo.
Ingxenye engcono kakhulu ukuthi awudingi ukufaka noma yini engavamile; isiphequluli sesivele sinayo eyakhelwe ngaphakathi. Kusukela ekuhlaziyeni ukuthi kungani isithombe sithatha isikhathi eside ukulayisha kuya ekuguquleni i-CSS ngesikhathi sangempela ukuze ubone ukuthi inkinobho ebomvu ingabukeka kanjani ngaphandle kokuthinta ikhodi eseceleni kweseva, i-Chrome DevTools iyithuluzi elibalulekile kunoma ubani ofuna ukuthuthukisa ulwazi lomsebenzisi kanye nokusebenza kobuchwepheshe kwephrojekthi yakhe.
Indlela yokungena enhliziyweni ye-DevTools
Kunezindlela eziningana zokuvula le phaneli yokulawula, kuye ngokuthi yini oyithola ilula kakhulu. Okulula kakhulu ukuchofoza kwesokudla noma kuphi ekhasini lewebhu bese ukhetha okuthi "Hlola." Uma ukhetha izinqamuleli zekhibhodi zesivinini, ku-Windows naku-Linux ungacindezela u- Ctrl + Shift + I , kuyilapho ku-Mac inhlanganisela ingu -Cmd + Option + I. Ungacindezela futhi inkinobho ethi F12, evame ukusebenza njengokushintsha ukuvula nokuvala iphaneli.
Uma usungaphakathi, ungakhetha ukuthi ufuna ifasitela libekwe kuphi: libekwe ngakwesokudla, kwesobunxele, phansi, noma ngisho nasefasiteleni elihlukile , okuyinto enhle uma unamamonitha amaningi futhi ufuna ukubuka iwebhusayithi kwelinye kanye nekhodi kwelinye.
Iphaneli Yezinto: Uhlaka lwamathambo nesikhumba sewebhu
Ithebhu ye-Elements yilapho kwenzeka khona umlingo we-DOM (Document Object Model). Lapha awuboni ikhodi ye-HTML engaguquki ethunyelwe kusuka kuseva, kodwa ubona ukumelwa kwangempela, okuguquguqukayo kwekhasi, okuhlanganisa noma yini i-JavaScript eyikhiqizile ngokushesha. Yindawo efanelekile yokuhlola ukuthi i-semantic markup yakho ilungile, okuyinto eyisisekelo se-SEO ekhasini.
Uma usebenzisa i-Inspection Mode (isithonjana somcibisholo ekhoneni eliphezulu kwesobunxele), ungahambisa igundane lakho phezu kwewebhusayithi bese ubona imininingwane eqondile: ubukhulu bephikseli, imibala yangemuva, amamajini, kanye nokugoqa. Ikwazisa ngisho noma ukungafani kombala kunganele, okubalulekile ekufinyelelekeni kwewebhu . Ngaphezu kwalokho, ungasusa izinto eziphazamisayo, njengezibhengezo zamakhukhi, noma uhlele umbhalo ngqo usebenzisa i-Design Mode nge-console.
Ukuqonda kahle ithebhu yenethiwekhi
Uma iwebhusayithi ihamba kancane, i-Network Panel iyindawo yokuqala okufanele uyibheke. Leli thuluzi ligcina wonke amafayela alandiwe: izithombe, izikripthi, amafonti, kanye ne-HTML uqobo. Uma ulayisha kabusha ikhasi, uzobona uhlu lokulandelana kwezikhathi olubonisa isimo sempendulo ye-HTTP , uhlobo lwensiza, kanye nosayizi wefayela.
Ukuze uhlaziye izikhathi zokulayisha ikhasi ngobungcweti, kubalulekile ukusebenzisa inketho ethi "sula i-cache bese ulayisha kabusha" , njengoba lokhu kulingisa ulwazi lomsebenzisi omusha. Ngaphezu kwalokho, i-Chrome ikuvumela ukuthi ulingise ukuxhumana okuhamba kancane (njenge-3G), okubalulekile ekunqumeni ukuthi iwebhusayithi yakho iyasebenza yini kumadivayisi eselula angambozwa kahle. Uma ufuna ukuya phambili, ungavumela izithombe-skrini ukuze ubone ukuthi ikhasi lisebenza kanjani imizuzwana ngemizuzwana njengoba izinsiza zilandwa.
Ukuthuthukiswa kwe-WPO kanye nokusebenza kahle nge-Lighthouse
I-Web Performance Optimization (WPO) ubuciko bokwenza iwebhusayithi ihambe phambili. Phakathi kwe-DevTools, sithola i-Lighthouse , ithuluzi lokuhlola elihlaziya isivinini, ukufinyeleleka, kanye nemikhuba emihle kakhulu. Ngokungafani namanye amathuluzi angaphandle, i-Lighthouse ikunikeza iziphakamiso eziqondile zokuthuthukisa isikhathi sokulayisha kanye nokunikeza.
Ukuze kuthuthukiswe ukusebenza, kunconywa ukuthi ubuyekeze amathebhu e-Sources kanye ne-Network ukuze uthole noma yimaphi amafayela e-CSS noma e-JS amakhulu kakhulu okufanele ancishiswe noma ahlanganiswe . Unganquma futhi ukuthi ulayisha izinsiza eziningi kakhulu ezivela ezizindeni zangaphandle (njenge-Google Fonts) bese ucabanga ukuthi ukuzisingatha kuseva yakho kungaba ngcono yini ekunciphiseni izicelo ze-HTTP.
Amaqhinga athuthukisiwe onjiniyela nama-SEO
Uma udinga ukulungisa amaphutha e-JavaScript, i-Console ingumngane wakho omkhulu. Icebo eliwusizo kakhulu ukusebenzisa i -variable ethi `$0` ku-console , ebhekisela ngqo ku-element yokugcina oyikhethile kuphaneli ye-Elements. Ngakolunye uhlangothi, uma ufuna ukwazi ukuthi kwenzekani lapho insiza yehluleka, ungasebenzisa isici sokuvimbela isicelo ukuze ulingise ukuthi ifayela le-CSS noma i-API ayitholakali bese ubona ukuthi iwebhusayithi isasebenza yini.
Kulabo abafuna ukukhipha idatha, umsebenzi we-"Copy element" ukuvumela ukuthi uthumele isakhiwo sethebula noma uhlu lonke kumhleli wekhodi noma ulusebenzise ne-ImportXML ku-Google Sheets. Konke lokhu, kuhlanganiswe nomklamo ophendulayo olingisa amadivayisi eselula ahlukene, kwenza i-DevTools ibe yisudi yokuhlaziya ubuchwepheshe ephelele.
Ukusetshenziswa okuhlakaniphile kwala mathuluzi kukuvumela ukuthi uguqule iwebhusayithi ehamba kancane, engahlelekile kahle ibe yiplatifomu elungiselelwe kahle i-Google eyivuzayo ngokwezinga layo. Ukuhlola izakhi, ukuhlaziywa kwenethiwekhi, kanye nokuhlolwa kokusebenza akugcini nje ngokuba ngabahleli bezinhlelo, kodwa nakunoma ubani ofuna ukuqinisekisa ulwazi lomsebenzisi olungenamthungo kanye nezinga eliqinile lezinjini zokusesha.
Umbhali oshisekayo ngomhlaba wamabhayithi nobuchwepheshe ngokujwayelekile. Ngiyathanda ukwabelana ngolwazi lwami ngokubhala, futhi yilokho engizokwenza kule bhulogi, ngikubonise zonke izinto ezithakazelisayo kakhulu ngamagajethi, isofthiwe, ihadiwe, izitayela zobuchwepheshe, nokuningi. Inhloso yami ukukusiza ukuthi uzulazule emhlabeni wedijithali ngendlela elula nejabulisayo.