Web Sayfası Düzenleme Neden Önemli?

Site oluşturmayı düşündüğünüzde aklınıza ilk gelen şey ne oluyor? Pek çok kişi için bu hosting, site kurma aracı tercihi ve benzer şeyler oluyor. İçerik ve sosyal medya bağlantılarını düşünmeden önce web sayfası düzenlemeyi yani sayfa düzenini, sitenizin nasıl görüneceğini düşünmelisiniz.

Bir site kurma aracı veya CMS ile site nasıl oluşturulur öğrenirken büyük bir önceliğe sahip olmasa da aklınızda bulunmalı. Bir kullanıcının sitenizi beğenip beğenmediğine karar vermesi 0.5 saniye sürüyor^[1]. 0.5 saniye!

Sitenizin sayfa düzeni karar vermede büyük bir rol oynuyor. Bu yüzden sayfa düzeni nasıl yapılır bilmek çok önemli.

Web sayfası düzenleme yazımızda sayfa düzeni nedir, sayfa düzeni nasıl oluşturulur gibi sorulara yanıt verirken başarılı birkaç örneğe de göz atacağız.

Web Sayfası Düzenleme Neden Önemli?

Web sayfası düzenleme ve sayfa düzeni hakkında konuşacaksak asıl soruyu aradan çıkarmamız gerekiyor; insanlar platformlarında neden en iyi sayfa düzenlerini kullanmalı?

Başka bir deyişle sayfa düzeni nasıl yapılır bilmek neden önemli?

İlk olarak web sayfası düzenleme yazımızın giriş kısmında bahsettiğimiz istatistiksel veriye göz atalım; kullanıcılarınız 5 milisaniyede siteniz hakkında karar verdiğinden hataya yer yok.

Sayfa düzeniniz ziyaretçinin deneyimine bir şey "katmayacak". Büyük bir kısmını oluşturacak.

Görseller, metin kutusu boyutları ve konumları ziyaretçilerin sitenizde beğendiği şeyler arasında başı çekecek. Bir noktaya kadar doğru. Tüm bunlar sayfaya rastgele yerleştirilseydi hiç iyi olmazdı değil mi?

Tepkiler haricinde web sayfası düzenleme ve sayfa düzeni genel kullanıcı deneyimi açısından da önemli. Göze hitap eden resimler gibi daha önemsiz şeylerden kullanıcıların aradıkları bilgileri kolaylıkla bulmasına kadar her şey buna dahil.

Sitenizin sayfa düzeni ister inanın ister inanmayın markanız hakkında belli bir mesaj iletiyor. Diyelim ki internetteki Facebook veya Amazon gibi popüler sitelerden birine girebilirsiniz. Anında tanınan çok belirgin sayfa düzenlerine sahipler.

Web Sayfası Düzenle Hakkında Temel Kurallar

Sayfa düzeni nedir ve neden önemli öğrendiğinize göre bir de işlemin kendisine bakalım. Site oluşturmanın her alanında olduğu gibi üst düzey bir sayfa düzeni oluşturmak da zorlu bir görev. Uymanız gereken ve eşsiz sayfa düzeni fikirleri üretmenize yardımcı olacak bazı temel kurallar var.

1. "F" Modeli

Sayfa nasıl oluşturulur diye interneti karıştırırken "'F' modeli" ile karşılaşabilirsiniz.

Açık konuşmak gerekirse sayfa düzeni fikirleri ve seçtiğiniz sayfa düzeninde içeriğinizi konumlandırmak (ayrıca düzenlemek) konusunda muheşem bir kural.

"F" modeli bir siteyi ziyaret edip bazı bilgileri okuduğumuzda doğal göz hareketimizi (dikkati) ifade ediyor. Bu modele uyarak sayfanızı "dikkat noktalarının" sadece en gerekli bilgiyi göstereceği şekilde optimize edebilirsiniz.

Haliyle "F" modeli sitenizde kullanmayı düşündüğünüz sayfa düzenlerini de etkileyebilir. Gerçeği söylemek gerekirse en iyi sayfa düzenlerinin çoğu bu modeli kullanıyor!

2. İşin Özü Basitlik

Günümüzde inanılmaz karmaşık sayfa düzenlerine sahip sitelerle sık sık karşılaşabiliyorsunuz. Video temelli girişlerden ve interaktif, şık menü seçeneklerinden son model aşağı açılır menülere ve alternatif aşağı sürüklenebilir pencerelere kadar her şey bulunuyor.

Tüm bunlar hoş. Siteniz ne kadar eşsiz olursa kullanıcı o kadar fazla hatırlar. Ancak unutmamanız gereken bir kural var; basitlik her zaman sitenizin bir parçası olmalı.

Şık, modern sayfa düzenlerine basitlik nasıl uyum sağlar? Oldukça basit. Çoğu insan belli bir site modeline alışık. Yani ana menünün sayfanın üst kısmında, arama çubuğunun sağ üstte veya ortada olmasını beklersiniz.

En iyi sayfa düzenlerine bağlı kalırsanız bu anlamda siz de başarılı olursunuz.

Ana menünün sayfanın en alt kısmında yer aldığı veya menülerin sadece belli koşullar gerçekleştirildikten sonra belirdiği bir siteyi ziyaret ettiğinizi düşünün. Kesinlikle can sıkardı.

3. Bölüm Yerleşimi Önemli

Bariz bir şey olduğunu düşünebilirsiniz ama çoğu zaman değil.

Oluşturmak istediğiniz sitenizin türü ne olursa olsun, eTicaret platformu olsun veya olmasın belli bölümlerin yerini seçerken dikkatli olmalısınız.

Olayın görsel boyutundan bahsetmiyorum. Bölümler karmaşık ve interaktif olabilir! Sayfa nasıl oluşturulur diye bölüm yerleşimi üzerine düşünürken ziyaretçilerinize maksimum miktarda faydalı bilgi ve bağlantı sunmaya odaklanmalısınız.

Peki bu tam olarak ne anlama geliyor? Satış yapıyorsanız ve bu satışı reklam eden bir banner varsa sayfanın üst kısmında tıklanabilir durumda olmalı. Böylelikle kullanıcı sitenin satış bölümüne yönlendirilebilir.

Ne demek istediğimi anladınız mı?

Üst düzey bir sayfa düzeni sorunsuz entegre edilmiş bölümlere sahip olur. Bunu gerçekleştimek de oldukça zor bir iş. İşte bu yüzden profesyonel web tasarımcılara talep çok!

Gerçek Hayattan Sayfa Düzeni Örnekleri

"Sayfa nasıl oluşturulur?" konusunda bazı "temel kurallara" baktığımıza göre sıra geldi web sayfası düzenleme konusunda gerçek hayattan bazı örneklere göz atmaya.

1. Amazon

Web sayfası düzenleme rehberimizde daha önce de belirttiğimiz üzere Amazon sayfa düzeninde muhteşem bir iş çıkarmış. Bunun iki büyük sebebi var; çok tanınabilir ve kullanıcı dostu olması.

Tanınma kısmı renk düzeni ve sitenin sayfa düzeninin kombinasyonundan kaynaklanıyor. Sayfanın üst kısmındaki mavi-siyah temsili menü menüdeki yazı tipiyle bir araya gelince "evet bu Amazon!" diyorsunuz.

Sayfa düzeni basit ancak Amazon'un iş modeliyle iyi işliyor. Marka kullanıcıların gezebilecekleri oldukça kapsamlı bir listeye sahip olsa da hepsi kenar çubuklarına gizlendiğinden kullanıcılar siteyi ilk ziyaret ettiklerinde korkmuyorlar.

Web sayfası düzenleme açısından Amazon sayfanın ortasındaki otomatik devam eden yatay bölüme bazı haberleri ve diğer reklamları entegre etmede muhteşem bir iş çıkarıyor. Oldukça popüler bir tasarım ve iyi işliyor.

2. Squarespace

Web sayfası düzenleme rehberimize bir site kurma aracı şirketinin ana sayfa sayfa düzenini dahil etmemiz biraz ironik görünse de Squarespace şu anda popüler olan ana sayfanın arka planındaki tam boyutlu fotoğraf sayfa düzeninin muhteşem örneklerinden biri.

Böyle bir tasarım ilk bakışta yeni sayfa düzeni üzerine fikri vermese de Squarespace sitenin genel sayfa düzenine görsel yerleştirme konusunda muhteşem bir iş çıkarıyor. Aynı görsel markanın ürünü olan site kurma aracını pazarlamada da rol oynuyor. Çok akıllıca!

Squarespace genel sayfa düzeni konusunda minimalistik bir yaklaşıma sahip. Keşfedecek çok fazla seçenek yok. MEVCUT seçenekler yaratıcı ve akıllıca yollarla entegre edilmiş. Muhteşem bir örnek!

3. Bethesda

Bethesda dünyanın en çok bilinen oyun geliştirme şirketlerinden biri.

Şirketin ana sayfasını ziyaret ettiğinizde anında o anda dillerle olan içerikle karşılaşıyorsunuz. Web sayfası düzenleme yazımızın yazıldığı dönemde Fallout serisi ana sayfayı süslüyor.

Bethesda'nın sayfa düzeni hakkındaki ilginç şeylerden biri hem şirketin o anda ön planda olan ürününü ön plana çıkarması hem de ziyaretçilere diğer haberler hakkında faydalı bilgiler vermesi.

Sayfada aşağı doğru indikçe Bethesda'nın sitesinde yer alan farklı içerik türleri için farklı bölümler kullandığını görüyorsunuz. Marka şık özelliklerden kaçınarak ana sayfada olabildiğince fazla bilgi vermeye odaklanıyor.

4. Wikipedia

Wikipedia çoğumuzun sürekli ziyaret ettiği bir site olsa da sitenin sayfa düzenine insanlar çok az dikkat ediyor.

Ana sayfaya baktığınızda alışılmamış bir dairesel menü tasarımı görüyorsunuz. Eşsiz olmasa da kullanıcının dikkatini çekiyor!

Wikipedia en yaygın olarak bilgi bakmak amacıyla kullanıldığından arama çubuğu ekranın tam ortasında. Site ayrıca steril, basit ve samimi bir tasarıma sahip.

5. Forbes

Forbes haber odaklı siteler için muhteşem sayfa düzeni örneklerinden biri. Temiz ve organize bir sayfa tasarımına sahip.

Forbes'u ziyaret ettiğinizde bir noktaya kadar sitenin "F" modeline sahip olduğunu görebiliyorsunuz. Ana sayfadan aşağı inince belirginleşiyor. Ayrıca görsellerle dolu. Metinsel veriler kısa, öz ve isabetli. Arıca sitenin belli bir bölümüne odaklanıyor.

Sayfanın üst kısmında Forbes aşağı açılır menüyü kullanarak gezinebileceğiniz basit ama açık konular listesine sahip. Farklı yazılar sunmanın temiz bir yolu!

Üst Düzey Sayfa Tasarımı İçin En İyi Site Kurma Araçları

Web sayfası düzenleme yazımızda verilen muhteşem sayfa düzeni örneklerine ek olarak kendi sitenizde kullanabileceğiniz modern ve eşsiz sayfa düzenleri oluşturmanıza imkan tanıyacak bazı site kurma araçlarından da bahsetmek istiyorum.

Tablo: Squarespace, Shopify ve WordPress.com

Aşağıda adı geçen seçenekler öncü olsa da göz atabileceğiniz başka seçenekler de var. Unutmayın; olay tamamen oluşturmak istediğiniz isteye ve kullanmak istediğiniz sayfa düzeni türüne bağlı.

• Squarespace. Squarespace modern ve şık şablonlara sahip. Hepsi mobil ve masaüstü kullanımlar için optimize. Her şablon farklı sayfa düzenine sahip ve her biri belli bir noktaya kadar özelleştirilebilir. Squarespace'in plan fiyatları ayda $12'den başlıyor.
• Zyro. Bazı muhteşem eTicaret fonksiyonlarına, modern sayfa düzenlerine ve şablonlarına sahip olmak istiyorsanız Zyro sizin hayal kırıklığına uğratmayacak. Zyro'nun fiyatları ayda $1.30'dan başlıyor. Kelepir!
• Shopify. eTicaret platformu oluşturacaksanız size bu konuda Shopify'dan daha iyi yardımcı olacak araç yok. Hem kullanımı inanılmaz kolay, hem de araçta seçebileceğiniz bazı muhteşem şablonlar ve sayfa düzenleri yer alıyor. Hepsi eTicaret ihtiyaçlarınız için optimize edilmiş. Fiyatlar ayda $29'dan başlıyor.
• WordPress. WordPress'in site kurma aracı seçeneği iyi olsa da sayfa düzenleri ve yönetimi konusunda tam özgürlük istiyorsanız WordPress.org'a göz atmalısınız. Biraz kullanım bilgisi ve bazı iyi WP plugin'leriyle aklınıza gelebilecek herhangi bir siteyi oluşturabilirsiniz. Ayrıca kullanımı tamamen ücretsiz. Tek yapmanız gereken bir hosting sağlayıcısı bulmak.

Son Sözler

Sayfa düzeni nedir, sayfa düzeni nasıl yapılır artık az çok biliyorsunuz. İhtiyaçlarınıza uygun bir web sayfası düzenleme fikri kafanızda oluşmuştur.

Web sayfası düzenleme bir yana site kurma araçları hakkında bilgi almak isterseniz sektördeki öncü site kurma araçları listemize göz atabilirsiniz. Zyro, Squarespace veya WordPress.org. Hangisini seçerseniz seçin web sayfası düzenleme konusunda bol şans!

Bilimsel Referanslar
✓ Doğrulanmış | katkıda bulunan: Andrew Mallonee , Founder of Mallonee Media

1. Gitte Lindgaard Gary Fernandes Cathy Dudek & J. Brown: 'Attention web designers: You have 50 milliseconds to make a good first impression!'