Mobil Cihazlar için Web Sayfaları Tasarlama

click fraud protection

Muhtemelen iPhone'un web sayfalarını nasıl çevirebileceğini ve genişletebileceğini görmüşsünüzdür. Size tüm web sayfasını bir bakışta gösterebilir veya ilgilendiğiniz metni okunabilir hale getirmek için yakınlaştırabilir. Bir anlamda, o zamandan beri iPhone Safari kullanıyor, web tasarımcılarının iPhone'da çalışacak bir web sayfası oluşturmak için özel bir şey yapmaları gerekmemelidir. Ancak sayfanızın gerçekten çalışmasını mı yoksa öne çıkıp parlamasını mı istiyorsunuz?

Sen ne zaman web sayfası oluştur, kimin görüntüleyeceğini ve nasıl görüntüleyeceğini düşünmeniz gerekir. En iyi sitelerden bazıları, çözünürlük, renk seçenekleri ve mevcut işlevler dahil olmak üzere sayfanın ne tür bir cihazda görüntülendiğini dikkate alır. Bunu anlamak için sadece cihaza güvenmiyorlar.

Mobil Cihazlar için Site Oluşturmaya İlişkin Genel Yönergeler

  • Mümkün olduğu kadar çok cihazda test edin. Yapmanız gereken ilk şey, sitenizi bir iPhone'da ve birçok farklı şekilde görüntülemektir. mobil cihazlar veya olabildiğince öykünücüler. Tüm testleriniz için öykünücüler kullanabilseniz de, size küçük ekranda bir web sitesinde gezinmeye çalışmakla aynı hissi vermezler. Mümkün olduğunca gerçek cihazlarda test etmelisiniz.
    instagram viewer
  • Sayfalarınızın zarif bir şekilde bozulmasını sağlayın. sayfalarınız için yazabilirsiniz Flash etkin, geniş ekran tarayıcılar, ancak kritik bilgilerin herhangi bir özel özelliği (çerezler, Ajax, Flash, JavaScript vb.) işleyemeyen küçük bir monitörde bile görünür olduğundan emin olun. XHTML Basic'in ötesindeki her şey, bazı cep telefonlarının ötesinde olacaktır. Çoğu akıllı telefon tüm bunları halledebilirken, diğer mobil cihazlar yapamaz.
  • Kablosuza özel bir sayfa oluşturun ve bulmayı kolaylaştırın. Cep telefonunuz ve kablosuz müşterileriniz için belirli bir sayfa oluşturacaksanız, bunu kullanılabilir hale getirin. Kablosuz sayfanın bağlantısını belgenizin en üstüne koymak ve ardından bu bağlantıyı elde taşınabilir ortam türünü kullanarak elde taşınan olmayan cihazlardan gizlemek harika bir yoldur. Sonuçta, çoğu insan cep telefonlarından bile ana sayfanıza gelir - ve kablosuz sayfanızın bağlantısı orada değilse, sayfanın kullanımı çok zorsa ayrılırlar.

Akıllı Telefonlar için Web Sayfası Düzeni

Akıllı telefon pazarı için sayfa yazarken hatırlamanız gereken ilk şey, istemiyorsanız herhangi bir değişiklik yapmak zorunda kalmamanızdır. Mevcut akıllı telefonların çoğuyla ilgili harika şey, Webkit tarayıcılarını (iOS'ta Safari ve Android'de Chrome) kullanmalarıdır. web sayfalarını görüntüleyin, bu nedenle sayfanız Safari veya Chrome'da iyi görünüyorsa, çoğu akıllı telefonda iyi görünecektir (sadece daha küçük). Ancak tarama deneyimini daha keyifli hale getirmek için yapabileceğiniz şeyler var:

  • Ekranın küçük olduğunu unutmayın. Akıllı telefonlar, tüm bu sütunları küçük pencerede yoğunlaştıracak ve bu, onları yakınlaştırmadan okumayı çok zorlaştırabilir. Çoğu kullanıcı yakınlaştırmaya alışkındır, ancak bu yorucu olabilir. Uzun bir metin sütununun okunması daha kolaydır.
  • Sayfaları daha küçük parçalara bölün. Bir cep telefonunda uzun metin parçalarını okumak zor olabilir, bu nedenle bunları birden çok sayfaya koymak onları okumayı kolaylaştırır.

iPhone'larda Bağlantılar ve Gezinme

  • URL'ler ne kadar kısa olursa o kadar iyidir. Bir cep telefonunda bir URL yazmayı denediyseniz, bunun bir acı olduğunu bileceksiniz (belki de çok fazla kısa mesaj göndermeye alışmış gençler hariç). iPhone'da bile uzun URL'ler yazmak sıkıcıdır. Onları kısa tutun.
  • Ancak uzun bağlantı metnine dokunmak daha kolaydır. Birkaç ayrı kelimenin farklı makalelere bağlı olduğu bir sayfada, yan yana, yakınlaştırma yapmadan doğru olana dokunmak çok zor olabilir. Birçok insan pes edecek ve başka bir yere gidecek. Telefonda 3 ila 5 kelimelik linklere tıklamak 1 kelimelik linklere göre daha kolaydır.
  • Navigasyonu ekranın en üstüne koymayın. İstediğiniz bilgiyi bulmak için ekranlarda ve bağlantı ekranlarında gezinmekten daha sinir bozucu bir şey yoktur. Cep telefonları için tasarlanmış web sayfalarına baktıysanız, ilk görünen şeyin içerik ve başlık olduğunu göreceksiniz. Ardından, bunun altında navigasyon var.
  • Navigasyonu gizlemekten korkmayın.Gezinme bağlantılarını gizleme CSS veya JavaScript ile ve yalnızca kullanıcı istediğinde görünmelerini sağlamak, sayfayı akıllı telefon kullanıcıları için daha kolay hale getirmenin bir yoludur.

Akıllı Telefonlardaki Görüntüler için İpuçları

  • Resimler küçük olmalıdır. Evet, Android ve iPhone'lar görüntüleri yakınlaştırabilir ve uzaklaştırabilir, ancak boyutları ve indirme süresi ne kadar küçükse, kablosuz müşterileriniz o kadar mutlu olur. Görüntüleri optimize etme her zaman iyi bir fikirdir, ancak cep telefonu sayfaları için çok önemlidir.
  • Görüntüler hızlı bir şekilde indirilmelidir. Görüntüleri bir mobil cihazdan görüntülerken web sayfalarında çok yer kaplar. Ve genellikle çok hoş olmalarına ve tam ekran bir web tarayıcısında görüntülendiğinde sayfaların daha iyi görünmesini sağlarken, genellikle bir mobil cihazda araya girerler. Artı, bir akıllı telefon kullanıcısı hücresel ağdayken, ödemek istedikleri son şey bir sürü büyük resim veya gezinme simgesi indirmektir.
  • Sayfanın üst kısmına büyük resimler koymayın. Navigasyonda olduğu gibi, sayfanın en üstünde 3 ila 4 ekran dolusu bir görüntünün yüklenmesini beklemek çok sıkıcı olabilir. Ve bu, web sayfalarında son derece yaygındır. Bunun tek istisnası, okuyucunun, örneğin bir fotoğraf galerisinde tıkladıklarında bir görüntü alacağını bilmesidir.

Mobil Tasarım Yaparken Nelerden Kaçınmalı?

Mobil uyumlu bir sayfa oluştururken kaçınmanız gereken birkaç şey vardır. Yukarıda belirtildiği gibi, gerçekten sayfanızda bunlara sahip olmak istiyorsanız, yapabilirsiniz, ancak sitenin onlarsız çalıştığından emin olun.

  • flaş: Çoğu cep telefonu Flash'ı desteklemez, bu nedenle kablosuz sayfalarınıza dahil etmek iyi bir fikir değildir.
  • Kurabiye: Birçok cep telefonunda çerez desteği yoktur. iPhone'lar var çerez desteği.
  • Çerçeveler: Tarayıcı bunları desteklese bile, ekranın boyutlarını düşünün. Çerçeveler sadece mobil cihazlarda çalışmaz - okunması çok zor veya imkansızdır.
  • Tablolar: Bir mobil sayfada düzen için tabloları kullanmayın. Ve genel olarak tablolardan kaçınmaya çalışın. Her cep telefonunda desteklenmezler (iPhone'lar ve diğer akıllı telefonlar desteklemesine rağmen) ve garip sonuçlarla karşılaşabilirsiniz.
  • iç içe tablolar: Bir tablo kullanmanız gerekiyorsa, onu başka bir masaya yerleştirmediğinizden emin olun. Bunları, masaüstü tarayıcıların desteklemesi zordur ve en iyi ihtimalle sayfanın daha yavaş yüklenmesini sağlar.
  • mutlak önlemler: Başka bir deyişle, nesnelerin boyutlarını mutlak boyutlarda (piksel, milimetre veya inç gibi) tanımlamayın. 100 piksel genişliğinde bir şey tanımlarsanız, bir mobil cihazda ekranın yarısı olabilir ve diğerinde genişliğin iki katı olabilir. Göreceli boyutlar (ems ve yüzdeler gibi) en iyi sonucu verir.
  • Yazı Tipleri: Hiçbirinin yazı tipleri Cep telefonlarında erişime sahip olmaya alışkınsınız.
instagram story viewer