Kodėl interneto puslapiai nedelsdami parodo savo tekstą?

I’ve noticed that recently many websites are slow to display their text. Usually, the background, images and so on are going to be loaded, but no text. After some time the text starts appearing here and there (not always all of it at the same time).

It basically works the opposite as it used to, when the text was displayed first, then the images and the rest was loading afterwards. What new technology is creating this issue? Any idea?

Note that I’m on a slow connection, which probably accentuates the problem.

See [above] for an example – everything’s loaded but it takes a few more seconds before the text is finally displayed.

One reason is that web designers nowadays like to use web fonts (usually in WOFF format), e.g. throughGoogle Web fonts.

Previously, the only fonts that were able to be displayed on a site was those that the user had locally installed. Since e.g. Mac and Windows users not necessarily had the same fonts, designers instinctively always defined rules as

kur, jei sistemoje nerastas pirmasis šriftas, naršyklė ieškotų antrosios ir galiausiai atsarginio "sans-serif" šrifto.

Dabar galite nurodyti šrifto URL kaip CSS taisyklę, kad naršyklė galėtų atsisiųsti šriftą kaip tokį:

tada įkelkite konkretaus elemento šriftą, pvz.:

Tai labai populiari, kad galėtume naudoti pasirinktinius šriftus, tačiau taip pat gali kilti problema, kad tekstas nebus rodomas tol, kol naršyklėje nebus įkeltas šaltinis, kuris apima atsisiuntimo laiką, šrifto įkėlimo laiką ir pateikimo laiką. Tikiuosi, kad tai yra artefaktas, su kuriuo susidūrėte.

Pavyzdžiui: vienas iš mano nacionalinių laikraščių, Dagens Nyheter, naudoja interneto šriftus savo antraštėms, bet ne jų veda, taigi, kai ši svetainė yra įkelta, aš paprastai mato veda pirmą kartą, o po pusės sekundės visi tuštieji tarpai yra užpildyti su antraštėmis (bent jau tiesa "Chrome" ir "Opera". Nebandžiau kitų).

(Be to, dizaineriai šiais laikais visur šlakstė "JavaScript", todėl galbūt kažkas bando daryti kažką protingo su tekstu, todėl jis yra atidėtas. Tai būtų labai konkretus svetainės pobūdis: visuotinė tendencija, kad tekstas bus atidėtas šiuose puslapiuose laikai yra pirmiau aprašyta interneto šriftų problema, manau.)

Papildymas:

Šis atsakymas buvo labai išreikštas, nors ir nebuvo išsamiai apibūdintasnes apie tai. Klausimų gijos buvo daug komentarų, todėl bandysiu šiek tiek išplėsti […]

Apskritai reiškinys yra žinomas kaip "neužpildyto turinio blyksnis" ir ypač "neužpildyto teksto blykstė". Ieškant "FOUC" ir "FOUT" pateikiama daugiau informacijos.

Galiu rekomenduoti interneto dizainerio Paulo Irish'o pranešimą FOUT dėl interneto šriftų.

Galima pastebėti, kad skirtingos naršyklės skirtingai elgiasi. Aš parašiau aukščiau, kad išbandžiau "Opera" ir "Chrome", kurie abu elgėsi panašiai. Visi "WebKit" pagrįstieji ("Chrome", "Safari" ir tt) pasirenka išvengti "FOUT"ne interneto šriftų teksto pakeitimas atsarginiu šriftu per interneto šriftų įkėlimo laikotarpį. Net jei žiniatinklio šriftas yra talpyklojebus būti atmesti vėlavimą. Šio klausimo siužetai yra daug komentarų, kuriuose sakoma kitaip, ir tai, kad kietuosiuose šriftuose elgiamasi panašiai, bet, pvz., iš pirmiau pateiktos nuorodos:

Kokiais atvejais gausite FOUT

• Bus: Atsisiuntimas ir rodymas nuotolinio ttf / otf / woff
• Bus: Rodyti talpyklą ttf / otf / woff
• Bus: Atsisiunčiami ir rodomi duomenys ttf / otf / woff
• Bus: Talpyklų duomenų rodymas ttf / otf / woff
• Nedarys: Rodomas šriftas, kuris jau yra įdiegtas ir pavadintas tradiciniu šriftu
• Nedarys: Rodomas šriftas, kuris yra įdiegtas ir pavadintas naudojant vietinę () vietovę

Kadangi "Chrome" laukia, kol FUT rizika pasibaigs prieš pateikiant, tai vėluoja. Prie kurioapimtis poveikis yra matomas (ypač kai įkeliamas iš laikinosios atminties), atrodo, priklauso nuo kitų dalykų, kiek reikia tekstą, ir, galbūt, kitus veiksnius, tačiau spartinimas visiškai nepašalina efekto.

Airijoje taip pat yra keletas atnaujinimų, susijusių su naršyklės veikimu nuo 2011-04-14, apačioje:

• " Firefox" (nuo FFb11 ir FF4 finalo) nebėra FOUT! Wooohoo! Http: //bugzil.la/499292 Iš esmės tekstas yra nematomas 3 sekundes, o tada grąžina atgalinį šriftą. Webfontas greičiausiai apkrovos per tuos tris sekundes, nors … tikiuosi..
• IE9 palaiko WOFF, TTF ir OTF (nors tai reikalauja įterpimo bitset dalykas - daugiausia tariamas, jei naudojate WOFF). VISUS! IE9 turi FOUT.:(
• "Webkit" turi pataisą, laukiančią žemę, kad parodyti atsarginį tekstą po 0,5 sekundžių. Tas pats elgesys kaip FF, bet 0,5s, o ne 3s.

Jei tai buvo dizainerių klausimas, galėtume ieškoti būdų, kaip išvengti tokių problemų, tokių kaip

bet tai būtų kitas klausimas. Pauliaus Irisho nuoroda dar labiau išsamiai aptaria šį klausimą.

Ar turite ką nors įtraukti į paaiškinimą? Garsas išjungtas komentaruose. Norite skaityti daugiau atsakymų iš kitų "Tech-savvy Stack Exchange" vartotojų? Patikrinkite visą diskusijų temą čia.