29Aug
Jei esate linkę žiūrėti naršyklės langą su erelio akimis, galbūt pastebėjote, kad puslapiai dažnai įkelia jų vaizdus ir išdėstymą prieš įkeliant jų tekstą - tiksliai priešingai pakrovimo modeliui, kurį patyrėme devintajame dešimtmetyje. Kas vyksta?
Šiandienos klausimas &Atsakymų sesija ateina pas mus iš "SuperUser" - "Stack Exchange", bendruomenės pagrįstos "Q & A" svetainių grupės pasidalijimo.
Klausimas
SuperUser skaitytojas Laurent yra labai įdomu, kodėl puslapiai, atrodo, apkrovos elementus visiškai skirtingai, nei jie vieną kartą.Jis rašo:
Aš pastebėjau, kad pastaruoju metu daugelis svetainių lėtai rodė savo tekstą.Paprastai fonas, vaizdai ir tt bus pakraunami, bet nėra teksto. Praėjus tam tikram laikui, tekstas pradeda pasirodyti čia ir ten( ne visada tuo pačiu metu).
Tai iš esmės veikia priešingai, kaip anksčiau, kai tekstas buvo rodomas pirmiausia, tada vaizdai ir kita buvo pakrovimas vėliau. Kokios naujos technologijos sukuria šią problemą?Bet kokia idėja?
Atkreipkite dėmesį, kad esu lėtas ryšys, kuris tikriausiai sustiprina problemą.
Pavyzdžiui, žr. [Aukščiau] - viskas įkeliama, bet jis užtruks dar keletą sekundžių, kol tekstas bus rodomas.
Taigi, kas duoda? Laurentas ir daugelis iš mūsų, prisiminė laiką, kada pirmiausia įkeltas tekstas ir visi kiti animaciniai GIF, plytelių fonai ir visi kiti 90-ųjų dešimtmečio interneto naršymo artefaktai. Kas sukelia dabartinę dizaino elementų padėtį, vėliau tekstą?
Atsakymas
SuperUser autorius Daniel Andersson pateikia puikiai išsamų atsakymą, kuris patenka į "why-the-fonts-load-last mystery" apačią:
Viena iš priežasčių yra tai, kad interneto dizaineriai šiais laikais mėgsta naudoti šriftus( paprastai WOFF formatu), pvzper "Google" žiniatinklio šriftus.
Anksčiau vieninteliai šriftai, kuriuos galėjo rodyti svetainėje, buvo tie, kuriuos naudotojas buvo įdiegęs vietoje. Kadangi, pvz.,Mac ir Windows vartotojai nebūtinai turėjo tuos pačius šriftus, dizaineriai instinktyviai visada nustatė taisykles kaip
šriftų šeimos: Arial, Helvetica, sans-serif;, kur, jei pirmasis šriftas sistemoje nerastas, naršyklė ieškos antrosios ir galiausiai atsarginio "sans-serif" šrifto.
Dabar galite nurodyti šriftų URL kaip CSS taisyklę, kad naršyklė galėtų atsisiųsti šriftą:
@import url( http: //fonts.googleapis.com/ css? Family = Droid + Serif: 400,700);ir tada įkelkite konkretaus elemento šriftą, pvz.:
font-family: "Droid Serif", sans-serif;Tai labai populiari, kad galėtume naudoti pasirinktinius šriftus, tačiau taip pat gali kilti problema, kad nė vienas 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 šriftus į savo antraštes, bet ne jų veda, taigi, kai ši svetainė yra įkelta, aš paprastai pirmiausia žiūriu veda, o po pusantro sekundės visi tušti skyriai aukščiauužrašyta antraštėmis( bent jau tiesa "Chrome" ir "Opera", o ne bandė kitų).
( Be to, dizaineriai šiais laikais visur šlakstė "JavaScript", todėl galbūt kažkas bando padaryti kažką protingo su tekstu, todėl jis yra atidėtas. Tai būtų labai konkretus svetainės variantas: visuotinė teksto tendencija atidėtiManau, kad šie laikai yra pirmiau aprašyta interneto šriftų problema.)
Papildymas:
Šis atsakymas buvo labai įvertintas, nors aš neatsižvelgiau į išsamią informaciją, o gal ir , nes iš šio. Klausimyno gale buvo daug komentarų, taigi aš bandysiu šiek tiek išplėsti [...]
Reiškinys, žinoma, yra žinomas kaip "neužpildyto turinio blyksnis" apskritai ir ypač "neužpildyto teksto blykstė".Ieškant "FOUC" ir "FOUT" pateikiama daugiau informacijos.
Galiu rekomenduoti interneto dizainerio Paulo Irish'o įrašą FOUT dėl interneto šriftų.
Ką 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", atlikus "", o ne "" interneto šriftų tekstą naudojant atsarginį šriftą interneto šrifto įkėlimo laikotarpiu. Net jei žiniatinklio šriftas yra talpykloje, bus , kad būtų atvaizdavimo uždelsimas .Šio klausimo siužetai yra daug komentarų, kuriuose sakoma kitaip, ir tai, kad kietuosiuose šriftuose elgiamasi panašiai, bet, pvz.,iš aukščiau esančios nuorodos:
Kokiais atvejais jūs gaunate FOUT
- Will: Nuotolinio ttf /otf/ atsisiuntimas ir rodymas
- Will: Rodyti talpyklą ttf /otf/ be
- Will: Atsisiuntimas ir rodymas duomenų saugyklos ttf /otf/ woff
- bus: Rodomas talpyklos duomenų ttf /otf/ neveikia
- Ne: Rodomas šriftas, kuris jau yra įdiegtas ir nurodytas jūsų tradicinėje šriftų krosnyje
- Ne: Rodomas šriftas, kuris yra įdiegtas ir pavadintas naudojant vietinį() vieta
Kadangi "Chrome" laukia, kol FUT rizika pasibaigs prieš pateikiant, tai daro vėlavimą.Koks apimtis efektas yra matomas( ypač kai įkeliama iš talpyklos), atrodo, priklauso nuo, be kita ko, nuo teksto, kuris turi būti pateiktas, ir galbūt kitų veiksnių kiekio, tačiau spartinimas visiškai nepašalina šio efekto.
"Airijos" nariai taip pat turi atnaujinimus, susijusius su naršyklės veikimu nuo 2011-04-14, poskyrio 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ą.Webfont, tikriausiai, bus įkeltas per šias tris sekundes, nors. .. tikiuosi. .
- IE9 palaiko WOFF, TTF ir OTF( nors tai reikalauja įdėjimo bitset dalykas - daugiausia tariamas, jei naudojate WOFF). taip pat! !!IE9 turi FOUT.:(
- Webkit turi pataisą, laukiančią žemę rodyti atgalinį tekstą po 0,5 sekundžių. Ta pati elgsena kaip FF, bet 0,5s, o ne 3s.
Jei tai buvo dizainerių klausimas, galėtume pasistengti išvengti tokių būdųtokių problemų kaip "webfontloader", bet tai būtų dar vienas klausimas. Polija Airijos nuoroda dar labiau išsamiai apibūdina šį klausimą.
Turite kažką įtraukti į paaiškinimą, nutildyti komentaruose. Norite skaityti daugiau atsakymų iš kitų technologijų,Patikimi "Stack Exchange" vartotojai? Patikrinkite visą diskusijų temą čia.