Retina iOS cihazlarında ilk kez piyasaya sürülmesinden bu yana epey zaman geçti, ancak tasarımcıların ve geliştiricilerin tam olarak yanıt veren, mobil cihazların gerçeklerine ayak uydurabilmeleri için hala Retina'ya hazır olmayan pek çok web sitesi var. dostu dünya.
İşte, çalışmalarınızı giderek daha yaygın görülen Retina ekranlarında en iyi şekilde görünmesini sağlayacak seçenekler hakkında bilmeniz gerekenler. İyi haber şu ki, göründüğü gibi göz korkutucu, o kadar da karmaşık değil.
$config[code] not foundWeb Sitenizi Retina Hazır Görüntüler İçin Hazırlamak
Eğlencenizi İkiye Katlayın
Aslında, bu kedinin cildini kapamanın birkaç yolu vardır. İlk önce CSS'inizi biraz netleştirmeniz ve resimlerinizin sürümlerini normal çözünürlüklerinin iki katına eklemeniz gerekir. CSS, sitenizin görüntülenmekte olduğu aygıta göre hangi görüntünün gösterileceğini belirler.
Gereksinim duyacağınız CSS güncellemeleri, hedef tarayıcılarınıza bağlı olarak değişecektir, ancak iyi haber şu ki, bunun artık çok karmaşık olmadığı ve daha da kolaylaştığı. Gerçek kodlamayı başka bir güne bırakacağız.
Akılda tutulması gereken bir şey: retina görüntüleriniz için bir adlandırma kuralı geliştirmek isteyebilirsiniz, böylece daha sonra düzenlenmeleri gerekebilecek bir görüntünün iki sürümünü kolayca ilişkilendirebilirsiniz.
SVG
Başka bir yaklaşım SVG veya Ölçeklenebilir Vektör Grafikleridir. Adından da anlaşılacağı gibi, bunlar vektör grafikleriyle sınırlıdır ve fotoğrafik resimlerle çalışmaz, ancak SVG grafikleri sitenizdeki her grafik için iki görüntü dosyasına olan ihtiyacı ortadan kaldırır. Yine, tarayıcıdan tarayıcıya farklılıklar vardır, bu nedenle gereksinimlerinize bağlı olarak ek araştırma yapmak isteyebilirsiniz.
Yukarıda da belirtildiği gibi, SVG muhtemelen site fotoğraf tipi görüntüler içermedikçe çoğu sitedeki tek çözümünüz olarak çalışmayacak.
Kaba kuvvet
Tabii ki, aynı zamanda düşük çözünürlüklü dosyaları kolayca bırakabilir ve sadece Retina'ya hazır görüntüleri sunabilirsiniz. Bunu yalnızca çok sıkı tanımlanmış bir kitleye sahip kullanımlar için öneriyoruz. Bant genişliğinin bir sorun olmayacağını biliyorsanız, bu doğru yol olabilir, ancak kesinlikle en iyi yöntem değildir
Diğer Kodlama Çözümleri
Çaba ve şıklık yelpazesinin diğer ucunda, PHP ve Javascript kodlaması ile birlikte bazı sunucu tarafı değişikliklerine (.htaccess dosyası girişleri gibi) dayanan kodlama metodları vardır.
Bu, sizin en iyi yaklaşımınız olabilir, ancak ilgili çaba küçük projeler için buna değmeyebilir.
Genel olarak, uyguladığınız yaklaşım kitlenize, sitenizin görsellerinin niteliğine ve geliştirme ekibinizin teknik uzmanlık seviyesine bağlı olacaktır. Hemen hemen her durum için iyi bir çözüm var. Tek kötü çözüm, Retina ekranlarını tamamen görmezden gelmektir.
Shutterstock ile NASDAQ fotoğraf
