Resimlerin web sitenizde neden görüntülenmediğini ve nasıl düzeltileceğini öğrenin
Eski deyiş, "bir resim bin kelimeye bedeldir" diye devam ediyor. Bu, özellikle ilgi alanlarının çok az olduğu ve bu nedenle doğru görüntünün doğru ilgiyi çekerek ve sayfa ziyaretçilerinin öğrenmeleri veya spesifik bir performans göstermeleri için neleri öğrenmeleri gerektiğine yetecek kadar uzun bir ilgi göstererek bir siteyi gerçekten yapabilecekleri veya kırabilecekleri Web'de doğrudur. site için "kazan" sinyalini veren eylem. Evet, bir web sitesine gelince, görüntüler aslında binlerce kelimeden fazla olabilir!
Bu nedenle, çevrimiçi görsellerin önemi ile birlikte, sitede olması beklenen bir resmin yüklenememesi durumunda, web sitenizin ne diyeceğini düşünelim. Bu, HTML'nin bir parçası olan satır içi resimlere sahip olup olmadığınızı veya CSS ile uygulanan arka plan resimlerinizin olup olmadığını (ve muhtemelen sitenizin her ikisinin de sahip olduğu) olabilir. Sonuç olarak, bir grafik bir sayfaya yüklenemediğinde, tasarımın bozuk görünmesine ve bazı durumlarda kullanıcının bu sitedeki kullanıcı deneyimini tamamen ortadan kaldırmasına neden olur. Resmin gönderdiği "bin söz" kesinlikle olumlu değil!
Görüntülerin bir siteye yüklenememesinin yanı sıra, web sitesi testi sırasında bu sorunu giderirken nelere dikkat etmeniz gerektiğinin bazı yaygın nedenlerine de göz atalım.
Yanlış Dosya Yolları
Bir sitenin HTML veya CSS dosyasına görüntü eklediğinizde, bu dosyaların bulunduğu dizin yapınızdaki konuma bir yol oluşturmanız gerekir. Bu, tarayıcıya görüntüyü nereden arayacağını ve getireceğini söyleyen koddur. Çoğu durumda, bu 'görüntüler' adlı bir klasörün içinde olurdu. Bu klasörün yolu ve içindeki dosyalar yanlışsa, tarayıcı doğru dosyaları alamayacağı için görüntüler düzgün yüklenmez. Bunu anlattığın yolu izleyecek, ama çıkmaz bir noktaya vuracak ve uygun görüntüyü göstermek yerine boş çıkacak.
Resim yükleme sorunlarının hata ayıklamasında 1. adım, kodladığınız dosya yolunun doğru olduğundan emin olmaktır. Belki de yanlış dizini belirttiniz veya bu dizinin yolunu doğru şekilde listelemediniz. Durum böyle değilse, bu yolla başka bir sorununuz olabilir. Okumaya devam etmek!
Dosyalar İsimler Yanlış yazılmış
Dosyalarınızın dosya yollarını incelerken, görüntünün adını doğru yazdığınızdan da emin olun. Deneyimlerimizde, yanlış adlar veya yanlış yazımlar, resim yükleme sorunlarının en yaygın nedenidir. Unutmayın, web tarayıcıları dosya isimleri söz konusu olduğunda çok üzücü. Yanlışlıkla bir harfi unutursanız ya da yanlış harfi kullanırsanız, tarayıcı benzer bir dosya aramayacak ve "Ah, muhtemelen bunu kastediyorsunuz, değil mi?" Hayır - dosya yanlış yazılırsa, yakın olsa bile, sayfaya yüklenmez.
Yanlış Dosya Uzantısı
Bazı durumlarda, dosyanın doğru şekilde yazıldığından emin olabilirsiniz, ancak dosya uzantısı yanlış olabilir. Görüntünüz bir .jpg dosyasıysa , ancak HTML'niz bir .png arıyorsa bir sorun olacaktır. Her görüntü için doğru dosya türünü kullandığınızdan emin olun ve web sitenizin kodunda aynı uzantı için aradığınızdan emin olun.
Ayrıca, büyük / küçük harf duyarlılığına da bakın. Dosyanız .JPG ile biterse, harflerin tümü harflerle birlikte, ancak kodunuz .jpg, tüm küçük harflerde ise, aynı harf kümeleri olsa bile, bu ikisinin farklı olduğunu görecek belirli web sunucuları vardır. Vaka hassasiyeti sayar! Bu yüzden dosyalarımızı her zaman küçük harflerle kaydediyoruz. Bunu yapmak, görüntü dosyalarımızda olabilecek olası bir sorunu ortadan kaldırarak kodumuzda her zaman küçük harf kullanmamıza izin verir.
Dosyalar Eksik
Görüntü dosyalarınızın yolları doğruysa ve ad ve dosya uzantısı da hata içermiyorsa, kontrol edilecek bir sonraki öğe, dosyaların aslında web sunucusuna yüklendiğinden emin olmaktır. Bir site başlatıldığında, bu sunucuya dosya yükleme ihmal, gözden kaçırmak için yaygın bir hatadır.
Bu sorunu nasıl düzeltirsiniz? Bu görüntüleri yükleyin, web sayfanızı yenileyin ve dosyaları anında beklendiği gibi görüntülemelidir. Görüntüyü sunucuda silmeyi ve yeniden yüklemeyi deneyebilirsiniz. Tuhaf görünebilir, ama bu işi bir kereden fazla gördük. Bazen dosyalar bozulur, bu nedenle bu "sil ve değiştir" yöntemi yardımcı olabilir.
Görüntülerin Hosting Edilmesi
Genellikle sitenizin kendi sunucunuzda kullandığı resimleri barındırmak istersiniz, ancak bazı durumlarda başka bir yerde barındırılan resimleri kullanıyor olabilirsiniz. Görsel barındıran sitenin içeriği azalırsa, resimleriniz de yüklenmez.
Transfer Sorunu
Bir görüntü dosyasının harici bir etki alanından mı yoksa kendi kendinizden mi yüklü olduğu her zaman, tarayıcı tarafından ilk kez talep edildiğinde bu dosya için bir aktarım sorunu olabileceği ihtimali her zaman vardır. Bu yaygın bir olay olmamalıdır (eğer varsa, yeni bir barındırma sağlayıcısına bakmanız gerekebilir), ancak zaman zaman ortaya çıkabilir.
Bu meselenin talihsiz tarafı, kontrolünüz dışında bir sorun olduğu için bununla ilgili yapabileceğiniz hiçbir şey gerçekten yok. İyi haber, genellikle hızlı bir şekilde çözülen geçici bir sorun olmasıdır. Örneğin, bir kişi kırık bir sayfa görür ve onu yenilerse, tek başına sorunu düzeltir ve görüntüleri düzgün bir şekilde yükler. Kırık bir görüntü görüyorsanız, belki de sadece bir iletim sorunu olup olmadığını görmek için tarayıcıyı yenileyin. ilk isteğiniz.
Birkaç Son Not
Görüntüleri ve yükleme endişelerini düşündüğünüzde, aynı zamanda dikkatli olmanız gereken iki şey , ALT etiketlerinin ve web sitenizin hızının ve genel performansının doğru kullanımıdır .
ALT veya "alternatif metin", etiketler bir görüntü yüklenmezse tarayıcı tarafından görüntülenen etiketlerdir . Ayrıca belirli engelli kişiler tarafından kullanılabilecek erişilebilir web siteleri oluşturmada önemli bir bileşendir. Sitenizdeki tüm satır içi resimler uygun bir ALT etiketine sahip olmalıdır. CSS ile uygulanan resimlerin bu özelliğe sahip olmadığını unutmayın.
Web sitesi performansı için, çok fazla resim yüklemek, hatta web teslimatı için uygun şekilde optimize edilmemiş birkaç dev resim bile yükleme hızını olumsuz yönde etkileyecektir. Bu nedenle, sitenizin tasarımında kullandığınız tüm görsellerin etkisini test ettiğinizden emin olun ve web sitenizin projesi için uygun olan genel görünümü ve hissi oluştururken, o sitenin performansını iyileştirmek için gerekli adımları atın.