Chrome a Safari pridávajú experimentálnu podporu Retina

Najnovšie verzie prehliadačov Safari a Chrome obsahujú podporu pre navrhovanú špecifikáciu, ktorá stránkam uľahčuje podporu displejov s vysokým rozlíšením.

Chrome a Safari pridávajú experimentálnu podporu Retina

Funkcia „image-set()“ bola navrhol vo februári od inžiniera Safari Edwarda O’Connora a hoci zostáva neoficiálny, podporujú ho najnovšie vydania oboch prehliadačov.

Otázka, ako čo najlepšie podporiť rastúci rozsah hustoty pixelov na trhu, bola vyvrcholená uvedením Retina displeja na MacBook Pro od Apple rozsah v júni.

Apple stále zaobchádza s webom ako s občanom druhej kategórie v systémoch iOS a Mac OS X

Vývojár Mozilly Robert Accettura sa po uvedení zariadení Retina sťažoval že Apple „v systémoch iOS a Mac OS X stále zaobchádza s webom ako s občanom druhej kategórie“.

Pokiaľ nevytvoríte natívnu aplikáciu, je ťažké správne využívať nové displeje Apple, tvrdil. „Prečo nebolo pri dodaní iPadu 3 zahrnuté riešenie pre autorov webu? Zdá sa hlúpe, že neexistuje žiadne API na správne prepojenie s jednou z najviac ponúkaných funkcií nového zariadenia.“

Podpora pre Retina displeje prichádza pomaly od niektorých najväčších vývojárov. Spoločnosť Adobe pri uvedení spoločnosti Apple predviedla nevydanú zostavu Photoshopu optimalizovanú pre Retinu, ale vydanie sa očakáva až „neskôr v tomto roku“. Microsoft uviedol, že Outlook 2011 pre Mac podporuje Retina displeje, ale neboli oznámené žiadne plány Word, Excel alebo PowerPoint a akékoľvek vydanie Office 2013 pre Mac bude pravdepodobne niekoľko mesiacov po PC spustiť.

Retina na webe

Na webe Apple Safari Web Content Guide odporúča používať dopyty médií CSS3 na zacielenie na zariadenia s vysokou hustotou. Zistí sa pomer hustoty pixelov a na dosiahnutie najlepších výsledkov sa načítajú prostriedky s nízkym alebo vysokým rozlíšením.

Teraz sa Safari 6 aj Chrome 21 dodávajú s experimentálnou podporou pre a nová špecifikácia sady obrázkov navrhnutá pre CSS4, o ktorom sa hovorí, že príde v iOS6. Tu namiesto toho, aby vývojár povedal prehliadaču, aké aktívum má načítať na konkrétnom zariadení, poskytne možnosti a nechá prehliadač rozhodnúť, čo je za daných okolností najvhodnejšie:

selektor {
pozadie: súbor obrázkov (url (foo-lowres.png) 1x,
url (foo-highres.png) 2x) centrum;
}

Vo vyššie uvedenom príklade „autor hovorí, že foo-highres.png je
dvojnásobné rozlíšenie ako foo-lowres.png,“ vysvetlil Edward O’Connor. Prehliadače, ktoré podporujú image-set() „by potom mohli použiť 2x obrázok na displeji s vysokým rozlíšením a 1x obrázok na displeji s nízkym rozlíšením“. Aktíva sa nemusia načítať, aby sa určilo, čo je najlepšie, takže sa používa menšia šírka pásma.

Podpora v nízkom rozlíšení

Tieto možnosti by mohli presahovať rámec jednoduchých kontrol rozlíšenia, povedal Jason Grigsby z vývojárov mobilných webov Oblak štyri.

„Dúfam, že v budúcnosti niekto, kto používa zariadenie s vysokou hustotou a pomalým pripojením, bude môcť prehliadaču povedať, že chce iba obrázky s nízkym rozlíšením,“ povedal. "Bolo by ešte lepšie, keby prehliadač vedel inteligentne určiť, aký obrázok použiť na základe aktuálnej rýchlosti siete."

Špecifikácia sady obrázkov ešte nie je oficiálna a Grigsby varoval pred jej používaním na živých stránkach, pretože sa môže v budúcnosti zmeniť. "Takže ak máte spôsob, ako to v budúcnosti ľahko zmeniť, potom môže mať zmysel zahodiť opatrnosť za hlavu a začať to používať," vysvetlil. "V opačnom prípade zvážte použitie na menej kritických miestach, kde môžete experimentovať s novou technológiou."