Kendinize “Yanıt veren web tasarımı nedir?” Diye sordunuz mu? Yanıt veren web tasarımı, bir tasarımcının gördüğü cihaza bağlı olarak “yanıt veren” bir web sayfası oluşturduğu veya yeniden boyutlandırdığı bir yaklaşımdır. Bu büyük boyutlu bir masaüstü bilgisayar monitörü, bir dizüstü bilgisayar veya akıllı telefonlar ve tabletler gibi küçük ekranlı cihazlar olabilir.
Duyarlı Web tasarımı, dijital varlığı olan herkes için önemli bir araç haline geldi. Akıllı telefonların, tabletlerin ve diğer mobil bilgisayar cihazlarının büyümesiyle, daha fazla insan web sayfalarını görüntülemek için daha küçük ekranlar kullanıyor.
$config[code] not foundBu web sitelerinin aynı zamanda, Nisan 2018’de Google’ın henüz duyurduğu ilk mobil endeksini de göz önünde bulundurmaları gerekiyor. cihazlar.
Duyarlı Web Tasarımı Nedir?
Duyarlı tasarımın amacı, tek bir alana sahip olmaktır, ancak farklı boyutlardaki cihazlarda görüntülendiğinde farklı tepki veren farklı unsurlara sahiptir.
Geleneksel bir "sabit" web sitesi alalım. Bir masaüstü bilgisayarda görüntülendiğinde, örneğin web sitesi üç sütun gösterebilir. Ancak aynı düzeni daha küçük bir tablette görüntülediğinizde, kullanıcıların beğenmediği bir şeyi yatay olarak kaydırmaya zorlayabilir. Veya öğeler görünümden gizlenmiş veya bozuk görünmüş olabilir. Bu etki aynı zamanda birçok tabletin ya dikey yönde görülebildiği ya da yatay görüntü için yanlara çevrilebilmesi nedeniyle karmaşıklaşıyor.
Küçük bir akıllı telefon ekranında, web sitelerinin görülmesi daha da zor olabilir. Büyük görüntüler düzeni “bozabilir”. Grafikler ağırsalar, sitelerin akıllı telefonlara yüklenmesi yavaş olabilir.
Ancak, bir site duyarlı tasarım kullanıyorsa, tablet sürümü otomatik olarak yalnızca iki sütunu görüntülemek üzere ayarlayabilir. Bu şekilde, içerik okunabilir ve gezinmesi kolaydır. Bir akıllı telefonda, içerik belki de dikey olarak istiflenmiş tek bir sütun gibi görünebilir. Ya da muhtemelen kullanıcı, diğer sütunları görüntülemek için kaydırabilecektir. Görüntüler düzeni bozmak veya kesilmek yerine yeniden boyutlandırılır.
Önemli olan: Duyarlı tasarımıyla, web sitesi otomatik olarak izleyicinin gördüğü cihaza göre ayarlar.
Responsive Web Tasarımı Nasıl Çalışır?
Duyarlı siteler sıvı ızgaraları kullanır.Tüm sayfa öğeleri piksel yerine oranla boyutlandırılmıştır. Dolayısıyla, üç sütununuz varsa, her birinin tam olarak ne kadar geniş olması gerektiğini değil, diğer sütunlarla ilişkili olarak ne kadar geniş olması gerektiğini söylemezsiniz. Sütun 1 sayfanın yarısını almalı, sütun 2% 30'u almalı ve sütun 3 örneğin% 20'yi almalıdır.
Görüntüler gibi medya da nispeten yeniden boyutlandırılır. Bu şekilde bir görüntü sütununda veya göreceli tasarım öğesinde kalabilir.
İlgili konular
Fare v. Dokunma: Mobil cihazlar için tasarım yapmak, fareye karşı dokunma sorununu da beraberinde getiriyor. Masaüstü bilgisayarlarda, kullanıcının gezinmek ve öğeleri seçmek için normalde bir faresi vardır. Bir akıllı telefon veya tablette, kullanıcı çoğunlukla parmak kullanıyor ve ekrana dokunuyor. Fareyle seçmek kolay görünebilecek bir şey, ekrandaki küçük bir noktada parmağınızla seçmek zor olabilir. Web tasarımcısı “dokunma” dikkate almalıdır.
Grafikler ve indirme hızı: Ayrıca, grafik, reklam ve indirme hızı sorunu var. Mobil cihazlarda, bir sitenin akıllı telefona yüklenmesi sonsuza dek sürmeyecek şekilde masaüstü görünümlerinden daha az grafik görüntülemek akıllıca olabilir. Daha küçük reklamlarla daha büyük reklam boyutlarının değişmesi gerekebilir.
Uygulamalar ve “mobil sürümler”: Geçmişte, web siteniz için bir uygulama oluşturmayı düşünmüş olabilirsiniz - bir iPad uygulaması veya bir Android uygulaması. Ya da özellikle BlackBerry için bir mobil versiyonunuz olurdu.
Ancak günümüzde pek çok farklı cihazla, her cihaz ve işletim platformu için uygulamalar ve farklı sürümler oluşturmak zorlaşıyor.
Küçük İşletmeler Neden Duyarlı Web Tasarımına Geçmeli?
Daha fazla kişi mobil cihazlar kullanıyor. Yakın zamanda yapılan bir Pew araştırması, Amerikalıların% 77'sinde 2018'de Pew Research Center’ın 2011’de yapılan ilk akıllı telefon sahipliği anketinde sadece% 35’ten fazla olan akıllı telefonlarına sahip.
Trafiğinizi kontrol edin; web sitenize mobil cihazlardan kaç ziyaretçinin geldiği konusunda şoke olabilirsiniz. (Google Analytics'inizde, sol taraftaki "Kitle" yi, ardından mobil trafiğe göre trafik oranının ne olduğunu görmek için "Mobil" i seçin. Hangi cihazların trafiği gönderdiğini görmek için bile delinebilirsiniz.)
Duyarlı tasarım şablonları artık satın almak için her yerde. Örneğin, bir WordPress siteniz varsa, ThemeForest gibi saygın bir şablon galerisini ziyaret edebilir ve “duyarlı WordPress temalarını” arayabilirsiniz. 50 doların altında bir tane satın alın. Web geliştiriciniz daha sonra logonuz ve markanız için özelleştirebilir.
Editörün Notu: Burada Küçük İşletme Trendleri'nde, yeni bir duyarlı tasarım üzerinde çalışıyoruz. Yapmamalı mıydın?
Shutterstock üzerinden fotoğraf
Daha fazla: İçerik Pazarlama, Ne 95 Yorumlar ▼