Įdiekite skaitiklį nepajudindami išdėstymo

Po teksto atsiradęs skaitiklis gali pastumti aplinkinį turinį, jei puslapis jam nerezervavo vietos. Įdiegimas turėtų išlaikyti sugeneruotus matmenis, tilpti į bloką ir netyčia neatidėti matavimo. Tai atskiros patikros: stabilus išdėstymas neįrodo, kad užskaityta kiekviena puslapio peržiūra.

Išlaikykite sugeneruotus matmenis

Pasirinkite dizainą paslaugoje Stats4U ir nukopijuokite diegimo kodą. Paveikslėlio skaitikliui palikite plotį ir aukštį, jei sugeneruotas kodas juos turi. Šie matmenys aprašo paveikslėlio proporcijas ir leidžia naršyklei rezervuoti vietą prieš jam atkeliaujant. Nekopijuokite kito dizaino matmenų.

Jei senesnis paveikslėlio fragmentas neturi matmenų, naršyklėje ar dizaino informacijoje perskaitykite natūralų pasirinkto paveikslėlio plotį ir aukštį. Pridėkite tas tikras reikšmes. Skaičiai, pasirinkti vien langeliui sutalpinti, gali iškreipti paveikslėlį.

<img src="COUNTER_IMAGE_URL" width="ACTUAL_WIDTH" height="ACTUAL_HEIGHT" alt="Visitor statistics">

Tai šablonas, o ne diegimo kodas: didžiosiomis raidėmis užrašytus vietaženklius pakeiskite sugeneruotu paveikslėlio adresu ir išmatuotais matmenimis. Kai paveikslėlis perteikia informaciją, naudokite trumpą prasmingą alternatyvų tekstą; tuščias tinka tik kai lygiavertė informacija jau prieinama, o paveikslėlis dekoratyvus.

Sutalpinkite į bloką neslėpdami problemos

Siaura šoninė juosta gali būti mažesnė už pasirinktą skaitiklį. Rinkitės mažesnį dizainą arba dėkite skaitiklį platesnėje skiltyje. Prisitaikančio paveikslėlio taisyklė gali išlaikyti proporcijas, bet ištempta peržiūra nepakeičia patikros, ar jo tekstas tebėra skaitomas.

1. Įkelkite puslapį lėtu ryšiu ir stebėkite turinį aplink skaitiklį.
2. Patikrinkite rezultatą ties 320 ir 360 CSS pikselių. Patikrinkite patį puslapį, ar nejuda į šoną.
3. Laikinai užblokuokite paveikslėlio užklausą naršyklės kūrėjų įrankiuose. Rezervuota vieta ir aplinkinės nuorodos vis tiek turėtų elgtis tinkamai.

Netyčia neatidėkite skaičiavimo užklausos

Paveikslėlio skaitiklio atidėtasis įkėlimas sulaiko jo užklausą, kol paveikslėlis priartėja prie matomos srities. Kai apsilankymą skaičiuoja ta užklausa, lankytojai, niekada nenuslenkantys prie poraštės, gali būti praleisti. Nepridėkite loading="lazy" prie skaičiuojančio paveikslėlio kaip bendro našumo pataisymo.

Sugeneruota asinchroninė JavaScript integracija atskiria sekimą nuo paprasto įdiegimo vien paveikslėliu ir reikalinga papildomiems įvykiams. Palikite sugeneruotą integraciją, užuot jungę kelis to paties skaitiklio fragmentus. Jei išdėstymas stabilus, bet sumos netikėtos, vietą ir sekiklio užklausas tikrinkite atskirai.

Kitas žingsnis

Naudokite svetainės platformą atitinkantį diegimo vadovą.

Atidaryti diegimo vadovą

MDN: <img> — width, height, alt, loading