Sudah cukup beberapa waktu sejak memaparkan Retina pada peranti iOS pertama kali dikeluarkan, tetapi masih terdapat banyak laman web di luar sana yang tidak retina-siap, walaupun para pereka dan pemaju telah mendapat pinggul untuk fakta-fakta yang responsif, mudah alih -mesra dunia.
Inilah yang anda perlu tahu tentang pilihan untuk membuat kerja anda kelihatan lebih baik pada paparan Retina yang semakin biasa. Berita baiknya ialah, seperti yang menakutkan kerana ia mungkin kelihatan, ia tidak begitu rumit.
$config[code] not foundMenyediakan Laman Web Anda untuk Imej Retina-Ready
Double Fun Anda
Sebenarnya ada beberapa cara yang boleh anda kulitkan kucing ini, jadi untuk bercakap. Pada yang pertama, anda perlu mengasah CSS anda sedikit dan memasukkan versi imej anda pada dua kali ganda resolusi normalnya. CSS akan menentukan imej mana yang akan dipaparkan berdasarkan peranti di mana tapak anda sedang dilihat.
Kemas kini CSS yang anda perlukan akan berbeza-beza bergantung pada penyemak imbas sasaran anda, tetapi berita gembira adalah bahawa ia tidak begitu rumit sekarang, dan semakin mudah. Kami akan meninggalkan pengekodan sebenar pada hari yang lain.
Satu perkara yang harus diingat: anda mungkin ingin membangunkan konvensyen penamaan untuk imej retina anda supaya anda dapat dengan mudah mengaitkan dua versi imej sekiranya mereka perlu diedit kemudian.
SVG
Satu lagi pendekatan ialah SVG, atau Grafik Vektor Skalable. Seperti namanya, ini adalah terhad kepada grafik vektor dan tidak akan berfungsi dengan imej fotografi, tetapi grafik SVG menghapuskan keperluan untuk dua fail imej untuk setiap grafik di laman web anda. Sekali lagi, terdapat variasi dari pelayar ke penyemak imbas supaya anda ingin melakukan penyelidikan tambahan bergantung kepada keperluan anda.
Dan seperti yang dinyatakan di atas, SVG mungkin tidak akan berfungsi sebagai satu-satunya penyelesaian anda pada kebanyakan laman web, melainkan laman web ini tidak mengandungi imej jenis foto.
Kekerasan
Sudah tentu, anda juga boleh membuang fail resolusi rendah dan hanya menyampaikan imej Retina-siap. Kami hanya mengesyorkan ini untuk kegunaan dengan penonton yang sangat ketat. Jika anda tahu bandwidth tidak akan menjadi isu, ini mungkin laluan yang betul, tetapi ia bukanlah satu amalan terbaik
Penyelesaian Pengekodan Lain
Pada ujung lain usaha dan spektrum keanggunan adalah kaedah pengekodan yang bergantung pada beberapa perubahan sisi pelayan (seperti penyertaan fail.htaccess) bersama dengan PHP dan Javascript coding.
Ini mungkin pendekatan terbaik anda, walaupun usaha yang terlibat mungkin tidak berbaloi untuk projek yang lebih kecil.
Secara keseluruhan, pendekatan yang anda ambil akan bergantung kepada khalayak anda, sifat visual tapak anda, dan tahap kepakaran teknikal pasukan pembangunan anda. Terdapat penyelesaian yang baik untuk hampir setiap keadaan. Satu-satunya penyelesaian yang buruk ialah mengabaikan Retina memaparkan sepenuhnya.
Foto NASDAQ melalui Shutterstock
