29Aug
Kui teil on kaldalähedase brauseri paneeli vaatamise kalduvus, võib-olla märkasite, et need lehed laadivad sageli oma pilte ja paigutusi enne nende laadimist - täpne vastupidine laadimismudel, mille me 1990. aastatel kogesime. Mis toimub?
tänapäeva küsimus &Vastuste seanss tuleb meile viisakalt SuperUseriga - Q & A veebisaitide kogukonnapõhise grupi Stack Exchange jagunemisest.
Küsimus
SuperUser lugeja Laurent on väga uudishimulik, miks täpselt lehed näivad elementide laadimist täiesti erinevalt, kui nad korraga korraga tegid. Ta kirjutab:
Olen märganud, et hiljuti paljusid veebisaite on nende teksti kuvamiseks aeglane. Tavaliselt laaditakse taust, pildid ja nii edasi, kuid mitte teksti. Mõne aja pärast hakkab tekst siin ja seal ilmuma( mitte alati see kõik samaaegselt).
Põhimõtteliselt töötab see vastupidi, kui teksti esimest korda kuvati, siis laaditi pildid ja ülejäänud laadimine hiljem. Mis uus tehnoloogia selle probleemi loob? Mis tahes idee?
Pange tähele, et olen aeglasel ühendusel, mis tõenäoliselt probleemi tõstab.
Näide [ülalt] näeb - kõik on laaditud, kuid see võtab veel paar sekundit enne teksti lõplikku kuvamist.
Mis siis annab? Laurent ja paljud meist meenutavad aega, mil esimene tekst laaditi, ja hiljem ka kõik 90-ndate aastate lõpus veebibrauserit puudutavad muud animeeritud GIF-failid, plaaditud taustad ja kõik muud. Mis põhjustab esialgse disainielementide praegust olukorda, teksti hiljem?
Vastus
SuperUseri kaastöötaja Daniel Andersson pakub suurepäraselt üksikasjalikku vastust, mis läheb paremini musta fondi koormuse viimase saladuse alt:
Üks põhjus on see, et tänapäeval soovivad veebidisainerid veebifonte( tavaliselt WOFF-vormingus) kasutada), ntläbi Google'i veebifontide.
Varem olid ainsad fontid, mida saidil oli võimalik kuvada, need, mida kasutaja oli kohapeal installitud. Kuna näiteksMacil ja Windowsi kasutajatel ei olnud tingimata ühesuguseid fonte, disainerid instinktiivselt alati defineerinud reegleid nagu
fontide perekonnad: Arial, Helvetica, sans-serif;, kus kui brauseris esimest fonti süsteemis ei leitud, otsiks brauser teise ja lõpuks varundatud "sans-serif" fonti.
Nüüd saab anda fondi URL-i CSS-reeglina, et saada brauser fonti allalaadimiseks:
@import url( http: //fonts.googleapis.com/ css? Family = Droid + Serif: 400,700);ja laadige seejärel kindlale elemendile font näiteks nt
font-family: 'Droid Serif', sans-serif;See on väga populaarne, et oleks võimalik kasutada kohandatud fonte, kuid see toob kaasa ka probleemi, et brauseri ressurssi ei laadita, sest see sisaldab allalaadimisaega, fondi laadimisaega ja viimistlusaega. Ma loodan, et see on artefakt, mida te kogete.
Näiteks: üks minu riiklikest ajalehtedest, Dagens Nyheter, kasutavad oma pealkirjade jaoks veebifonte, kuid mitte nende juhte, nii et kui see sait on laetud, näen ma tavaliselt esimest ja teineteist hiljem kõiki tühikuidpealkirjas asuvad( see kehtib vähemalt Chrome'i ja Opera puhul, pole veel proovinud teisi).
( Ka disainerid puista JavaScript täiesti kõikjal nendel päevadel, nii et võib-olla keegi üritab tekstiga midagi nutikas teha, mistõttu see on hilinenud. Kuid see oleks väga kohaspetsiifiline: üldine tendents teksti edasi lükatama usun, et need ajad on kirjeldatud eespool kirjeldatud veebifontide probleemiga.)
Lisamine:
See vastus sai väga positiivseks, kuigi ma ei lähtunud üksikasjalikult ega ehk -st, sest see oli .Küsimuste teema on olnud palju kommentaare, seega proovin veidi [...]
-i Seda nähtust nähtavasti nimetatakse üldiselt "katkendliku sisu välguks" ja eriti "mitteblokeeritud teksti välguks"."FOUC" ja "FOUT" otsimine annab rohkem teavet.
Ma võin soovitada web designers Paul Iiri postitust FOUT seoses veebifontidega.
Mida saab märkida, et erinevad brauserid käituvad seda erinevalt. Kirjutasin eespool, et olen katsetanud Opera ja Chrome, kes mõlemad käitusid sarnaselt. Kõik WebKiti-põhised( Chrome, Safari jne) valivad vältida FOUT-i -ga, mitte , mis muudab veebrifiltri laadimise perioodil veebipõhise fondi teksti koos tagurpidi kirjaga. Isegi kui veebrifilt on vahemällu salvestatud, on renderdamisviisiks .Sellel teemal on palju märkusi, mis ütlevad teisiti, ja et pole kindel, et puhverdatud fonte käituvad niimoodi, kuid näiteksülaltoodud lingilt:
Millistel juhtudel saab FOUT
- kas: Kaugtarkvara /otf/ allalaadimine ja kuvamine
- Will: Vahemällu salvestatud ttf kuvamine /otf/ väljalülitamine
- Will: Andmete laadimine ja kuvamine ttf /otf/ woff
- Will: Vahemällu salvestatud andmete kuvamine ttf /otf/ väljalülitamine
- ei: Fondi kuvamine, mis on juba installitud ja mida nimetatakse tavapärase kirjafaili
- mitte: Fondi kuvamine, mis on installitud ja nimega määratud kohaliku() asukoht
Kuna Chrome ootab enne FPR riski kadumist enne renderdamist, annab see viivituse. Sellele, kuhu ulatuses nähtav mõju( eriti vahemällu laadimisel) tundub olevat sõltuv muuhulgas ka teksti, mida tuleb muuta, ja võib-olla ka muid tegureid, kuid vahemällu salvestamine ei kõrvalda täielikult efekti.
iiri keeles on ajakohastatud ka brauseri käitumist postituse allservas alates 2011-04-14:
- Firefox ( alates FFb11 ja FF4 lõplikust) -l puudub enam FOUT! Wooohoo! Http: //bugzil.la/ 499292 Põhimõtteliselt on tekst 3 sekundi jooksul nähtamatu ja siis tagastab ta tagastatava fondi. Webfont laaditakse tõenäoliselt nende kolme sekundi jooksul. .. loodetavasti. .
- IE9 toetab WOFF-i, TTF-i ja OTF-i( kuigi see nõuab sisestatava bitseti asju - enamasti õiglane, kui kasutate WOFF-i). siiski! !!IE9 on FOUT.:(
- Webkitil on plaaster, mis ootab maandumist tagasiulatuva teksti näitamiseks 0,5 sekundi järel. Nii sama käitumine nagu FF, kuid 0,5s asemel 3s.
Kui see oli disaineritele mõeldud küsimus, võiksime minna selliseid viise vältidanagu näiteks webfontloader, kuid see oleks teine küsimus. Paul iiri seos läheb sellel teemal üksikasjalikumalt üksikasjalikult.
Kas teil on seletamiseks midagi lisada? Savvy Stack Exchange kasutajad? Vaata kogu arutelu teemat siit.