Ako nastaviť svoje webové stránky pre snímky pripravené na snímku

Obsah:

Anonim

Bolo to už dosť času, kedy boli zobrazené Retina na zariadeniach so systémom iOS, ktoré sú prvýkrát vydané, ale stále sú tu mnohé webové stránky, ktoré nie sú pripravené na technológiu Retina, dokonca aj keď dizajnéri a vývojári sa dostali k skutočnosti plne citlivého, mobilného - priateľský svet.

Tu je to, čo potrebujete vedieť o možnostiach, aby vaša práca vyzerala čo najlepšie na čoraz väčšom bežnom displeji Retina. Dobrou správou je, že ako skľučujúca, ako sa môže zdať, nie je to tak zložité.

$config[code] not found

Pripájanie vašich webových stránok pre obrázky pripravené na snímku so sietou

Zdvojnásobte svoju zábavu

Existuje veľa spôsobov, ako môžete túto kožu pokožku, aby som tak povedal. V prvom prípade budete musieť trochu zosilniť svoj CSS a obsahovať verzie vašich obrázkov dvojnásobne ako ich normálne rozlíšenie. CSS určuje, ktorý obrázok sa má zobraziť na základe zariadenia, na ktorom sa vaše stránky zobrazujú.

Aktualizácie služby CSS, ktoré budete potrebovať, sa líšia v závislosti od vašich cieľových prehliadačov, ale dobrou správou je, že teraz to nie je hrozne komplikované a stáva sa jednoduchšie. Vlastné kódovanie ponecháme na iný deň.

Jedna vec, ktorú je potrebné mať na pamäti: možno budete chcieť vytvoriť konvenciu pomenovania obrázkov sietnice, aby ste mohli ľahko spájať obe verzie obrázka v prípade, že je potrebné ich neskôr upraviť.

SVG

Ďalším prístupom je SVG alebo škálovateľná vektorová grafika. Ako to naznačuje názov, sú obmedzené na vektorovú grafiku a nebudú pracovať s fotografickými obrázkami, ale grafika SVG eliminuje potrebu dvoch obrázkových súborov pre každú grafiku na vašom webe. Opäť existujú varianty od prehliadača po prehliadač, takže budete chcieť urobiť ďalší výskum v závislosti od vašich potrieb.

Ako už bolo uvedené vyššie, SVG pravdepodobne nebude fungovať ako vaše jediné riešenie na väčšine webových stránok, ibaže stránka neobsahuje žiadne fotografické obrázky.

Hrubou silou

Samozrejme, môžete tiež jednoducho vyprázdniť súbory s nízkym rozlíšením a jednoducho zobrazovať obrázky pripravené na snímku. Odporúčame to len na použitie s veľmi dôkladne definovaným publikom. Ak viete, šírka pásma nebude problémom, mohlo by to byť správna cesta, ale rozhodne to nie je najlepšia prax

Ostatné riešenia kódovania

Na druhom konci úsilia a elegancie spektra sú metódy kódovania, ktoré sa spoliehajú na niektoré zmeny na strane servera (napr. Položky súboru.htaccess) spolu s kódovaním PHP a Javascript.

Toto môže byť váš najlepší spôsob, hoci úsilie, ktoré sa v ňom podieľa, nemusí stáť za menšie projekty.

Celkovo váš prístup bude závisieť od vášho publika, od charakteru vizuálnych stránok vášho webu a od úrovne odborných znalostí vášho vývojového tímu. Existuje dobré riešenie pre takmer každú situáciu. Jediným zlým riešením je úplne ignorovanie displejov Retina.

NASDAQ Foto cez Shutterstock