Sudah cukup lama sejak retina display pada perangkat iOS pertama kali dirilis, tetapi masih ada banyak situs web di luar sana yang tidak siap-Retina, bahkan ketika perancang dan pengembang telah memahami fakta-fakta ponsel yang sepenuhnya responsif, dunia yang bersahabat.
Inilah yang perlu Anda ketahui tentang opsi untuk membuat pekerjaan Anda terlihat terbaik pada tampilan Retina yang semakin umum. Berita baiknya adalah, meskipun kelihatannya menakutkan, itu sebenarnya tidak terlalu rumit.
$config[code] not foundMempersiapkan Situs Web Anda untuk Gambar Siap Retina
Gandakan Kesenangan Anda
Sebenarnya ada beberapa cara Anda bisa menguliti kucing ini. Yang pertama, Anda perlu sedikit mempertajam CSS Anda dan menyertakan versi gambar Anda dengan dua kali lipat resolusi normal. CSS akan menentukan gambar yang akan ditampilkan berdasarkan perangkat tempat situs Anda dilihat.
Pembaruan CSS yang Anda perlukan akan bervariasi tergantung pada browser target Anda, tetapi kabar baiknya adalah itu tidak terlalu rumit sekarang, dan semakin mudah. Kami akan menyerahkan kode aktual ke hari lain.
Satu hal yang perlu diingat: Anda mungkin ingin mengembangkan konvensi penamaan untuk gambar retina Anda sehingga Anda dapat dengan mudah mengaitkan dua versi gambar jika mereka perlu diedit nanti.
SVG
Pendekatan lain adalah SVG, atau Scalable Vector Graphics. Sesuai namanya, ini terbatas pada grafik vektor dan tidak akan berfungsi dengan gambar foto, tetapi grafik SVG menghilangkan kebutuhan untuk dua file gambar untuk setiap grafik di situs Anda. Sekali lagi, ada variasi dari peramban ke peramban sehingga Anda ingin melakukan penelitian tambahan tergantung pada kebutuhan Anda.
Dan seperti disebutkan di atas, SVG mungkin tidak akan berfungsi sebagai satu-satunya solusi Anda di sebagian besar situs, kecuali situs tersebut tidak mengandung gambar tipe foto.
Kasar
Tentu saja, Anda juga dapat dengan mudah membuang file beresolusi rendah dan hanya menyajikan gambar-gambar siap-Retina. Kami hanya merekomendasikan ini untuk digunakan dengan audiens yang sangat ketat. Jika Anda tahu bandwidth tidak akan menjadi masalah, ini mungkin rute yang tepat, tetapi tentu saja ini bukan praktik terbaik
Solusi Pengkodean Lainnya
Di ujung lain dari upaya dan keanggunan spektrum adalah metode pengkodean yang bergantung pada beberapa perubahan sisi server (seperti entri file.htaccess) bersama dengan PHP dan Javascript coding.
Ini mungkin pendekatan terbaik Anda, meskipun upaya yang terlibat mungkin tidak sepadan untuk proyek yang lebih kecil.
Secara keseluruhan, pendekatan yang Anda lakukan akan tergantung pada audiens Anda, sifat visual situs Anda, dan tingkat keahlian teknis tim pengembangan Anda. Ada solusi yang bagus untuk hampir setiap situasi. Satu-satunya solusi buruk adalah mengabaikan tampilan Retina sepenuhnya.
Foto NASDAQ via Shutterstock
