Çarpıcı Bir Web Sayfası Oluşturma Kılavuzu

Trendler. Onlardan kaçış yok. Bazıları tuhaf görünse de çok kullanışlı olanlar da mevcut. Web tasarımı dünyasında da işlevselliği nedeniyle tek sayfadan oluşan web siteleri popülerliğini koruyor. Aslında tüm içeriğinizi bir çatı altında, yani tek sayfada sunan bir siteden bahsediyoruz. Diğer sayfalardan ayrılan bir ana sayfa yerine içeriğiniz şeritlerle farklı bölümlere ayrılır ve menü öğeleri farklı sayfalar yerine bu bölümlerin her birine bağlanır.

Web sayfası formatında web sitesi kurma trendi, web tasarımcıları arasında giderek daha fazla tercih ediliyor. Neden mi? Basit, temiz ve kompakt bir tasarım deneyimi sunuyor da ondan. Web sayfası oluşturma sürecini merak ediyorsanız doğru yerdesiniz. Bu rehberde kendi tek sayfalık web sitenizi oluşturmanın önemini ve yollarını açıklayacağız.

Web sayfası oluşturma adımları:

1. İşiniz için uygunluğuna karar verin

2. İçeriğinizin planını çıkarın

3. Site şablonu seçin

4. İçeriğinizi bölümlere ayırın

5. Paralaks efektlerle yenilik katın

6. Her bir bölüm için bir çapa menü oluşturun

7. Kullanıcıların sitenizi kaydırmasını kolaylaştırın

8. Harekete geçirici mesajınız güçlü olsun

9. Zengin bir alt bilgi alanı ekleyin

10. Sosyal medya hesaplarınızı dahil edin

11. Arama motoru optimizasyonunu (SEO) unutmayın

12. Sitenizi mobil dostu hale getirin

01. İşiniz için uygunluğuna karar verin

Web sitesi tasarımında iki temel yaklaşım vardır: tek parçadan oluşan bir web sayfası veya klasik birçok sayfadan oluşan bir site. İşinizin türüne, sitenizin özelliklerine ve önceliklerine göre bunlardan biri size daha çok uyabilir. Seçiminizi tüm seçeneklerinizi değerlendirdikten sonra yapmakta fayda var.

Web sayfası olarak tasarlanmış web siteleri, kompakt görünen ve önemli detayları etkili bir şekilde ileten güçlü bir tasarım sunar. Genellikle görsel ağırlıklıdır ve metin içeriği sınırlıdır. Sayfa kaydırma deneyiminin daha uzun olması, hikayenizi oluştururken yaratıcılığınızı konuşturmanıza ve bu sırada ziyaretçilerinizin içeriğinizi göreceği sırayı belirlemenize yardımcı olur.

Sayfalar arasında kaybolmaya son veren bir sayfa düzeni, içeriğinizin doğrusal olarak incelenebilmesine imkan sağlayarak kullanıcı deneyimini zenginleştirir. Bu format, mobil siteler ve tabletlere de uyarlanabilir. Tahmin edersiniz ki tek bir web sayfasına sahip olmanın bakımı da daha kolaydır ve klasik web sitelerine göre daha az kaynak gerektirir.

Bunu okurken muhtemelen kendi web sitenizi bu formatta canlandırdınız. Ama önce kendinize şu soruyu sorun: "Her şeyi tek sayfaya sığdırmak özellikle benim işim için iyi bir seçim mi?" Bu format, en yaratıcıdan en geleneksel iş modeline kadar her sektörde etkili olarak kullanılabilir. Varış sayfası (landing page), serbest çalışan sitesi, fotoğrafçılık portfolyosu, düğün sitesi veya farklı etkinlik odaklı bir site gibi sınırlı bir içeriğe sahipseniz bu seçeneği göz önünde bulundurabilirsiniz.

Web sitesi dendiğinde çoğu insanın aklına iletişim, mağaza, sıkça sorulan sorular, hakkında, ana sayfa gibi birçok farklı web sayfasını bir arada bulunduran klasik web siteleri gelir.

E-ticaret sitenizin mağaza kısmında geniş bir ürün yelpazesine sahip olmanız veya birçok farklı hizmet sunmanız gibi, sitede mutlaka bulunmasını istediğiniz yüklü miktarda içeriğe sahip olmak, web sayfası formatı yerine klasik bir web sitesi formatı seçmek için mantıklı bir nedendir. Böylece web sitenizde her önemli detayı kendi özel web sayfasında uzun ve kapsamlı bir şekilde açıklayabilirsiniz. Örneğin bir blog başlatıyorsanız ziyaretçilerin yazılarınızı tek tek rahatlıkla görüntüleyebilmesi için bu formatı kullanmak okuyucu deneyimini iyileştirecektir.

02. İçeriğinizin planını çıkarın

Bu formatın size uyduğuna karar verdiyseniz şık bir web sayfası oluşturmaya geçebilirsiniz. Sıfırdan bir web sitesi kurarken öncelikle tüm içeriğinizi stratejik bir şekilde planlamalısınız. Web sayfası oluşturmak, içeriğinizin görüntülenme sırasını belirlemeniz için mükemmel bir fırsattır; bu yüzden mantıklı ve anlaşılır olmasına özen gösterin.

Ziyaretçilerinizin sitenizde hangi sırayla gezeceğini hayal etmekle başlayın. Ziyaretçiler ilk olarak aktarmak istediğiniz ana mesajla karşılaşmalıdır. Başka bir deyişle bu, manşet kısmıdır (ziyaretçinin sitenizi aşağı kaydırmadan önce gördüğü ilk kısım).

Her web sitesinde bir "hakkında" alanı ve iletişim bilgilerinizin yer aldığı bir bölüm olmalıdır. Bu iki bölüm arasında ne sunmak istediğiniz size kalmış. Örneğin bir CTA (harekete geçirici mesaj) butonuna, tekliflerinize, pazarlama mesajınıza, ekibinizi tanıtmaya, hizmet ve ürünlerinize, referanslarınıza, bir SSS bölümüne ve fotoğraf galerisine yer verebilirsiniz.

Daha sonra son derece önemli olan içerik sırasına öncelik vermelisiniz. Ayrıca gereksiz tüm bilgileri çıkarmayı ihmal etmeyin. Güçlü bir tasarımın temeli, olabildiğince az kelime kullanmaktır. Özetle planınız, her şeyi mümkün olduğunca düzenli ve sade tutmak olmalıdır.

03. Site şablonu seçin

İçerik planınızı çıkardıktan sonra çapa menü, şerit ve sütunlar, sosyal ağ çubuğu, zengin bir alt bilgi gibi bir web sayfası için gereken tüm unsurları içeren ve size sağlam bir temel sağlayacak bir şablona ihtiyacınız olacak.

Profesyonel tasarımcıların her sektöre özel olarak oluşturduğu yüzlerce web sayfası şablonunu tamamen kişiselleştirebilir ve her türlü amaca yönelik kullanabilirsiniz. Bu şablonların en iyi yanı, üst bilgiden alt bilgiye kadar her şeyi kolayca değiştirebilmeniz, kişiselleştirebilmeniz ve tamamen size ait bir düzene sokabilmenizdir. Bu durumda size kalan tek şey hayal gücünüzün yaratıcılığını konuşturmak!

04. İçeriğinizi bölümlere ayırın

Şimdi sıra planlanan içeriğinizi şeritler kullanarak web sitenize yerleştirmede. Web sitenize şerit eklemek için kullandığınız web sitesi oluşturucunun editör panelini açın, ana menüden "Ekle" seçeneğine tıklayın ve "Şerit" seçeneğini seçin.

Burada tamamıyla kişiselleştirilebilir hazır tasarımlar arasından seçim yapabilirsiniz. Her bir şeride metin, video, görsel, iletişim formu, referans ve daha pek çok şey ekleyebilirsiniz. Sayfanıza dilediğiniz kadar şerit ekleyin ve sunmak istediğiniz içerik sırasına göre şeritlerinizi düzenleyin. Geleneksel çizgide kalmak istiyorsanız "Hakkımda" bölümüyle başlayıp "İletişim" bölümünüzü oluşturacak zengin alt bilgi alanına doğru yukarıdan aşağıya ilerleyebilirsiniz.

05. Paralaks efektlerle yenilik katın

Dikkat çeken ve müşteri kazanmanızı sağlayacak popüler web tasarımı trendlerinden biri de paralaks kaydırmadır. Bu efekt sayesinde, bir önceki adımda eklediğiniz farklı şeritlerle web sitenize üç boyutlu bir tasarım kazandırabilirsiniz. Bu paralaks etkisi aslında ziyaretçiler web sitenizi aşağı doğru kaydırırken arka ve ön plandaki katmanların farklı hızlarda hareket etmesiyle oluşur.

Web sayfası tek boyutlu olarak algılandığı için paralaks kaydırma gibi efektler eklemek, sitenizi güçlendirir ve akılda kalıcı olmasını sağlar. Paralaks efekt oluşturmak için editörde şeritlerinize yakınlaştırma, göster ve gizle gibi küçük animasyonlar ekleyebilirsiniz. Bu profesyonel web sitesi tekniği, ziyaretçilerinizin sitenizi en alta kadar kaydırmasını sağlamanın kesin yollarından biridir.

06. Her bir bölüm için bir çapa menü oluşturun

Site menülerini daha önce duydunuz ama bu, alıştıklarınızdan biraz farklı. Web sayfası menüsüne tutturulmuş her öğe, kendi özel sayfası yerine aynı sayfanın farklı bir bölümüne bağlanır.

Öncelikle web sayfanızın her bölümünü istediğiniz yere "çapalayarak" tanımlamalısınız. Bir çapa menüsü oluşturarak düzenli bir web sayfası tasarımı elde etmenin vazgeçilmez ve önemli üç adımı vardır:

• Bir çapa (bağlantı) ekleyin: Bu sayede ziyaretçiler sayfanızda doğrudan istedikleri bölüme gidebilir ve web sayfanızın farklı kısımlarında kolaylıkla gezinebilirler. Pek çok şablonda çapalar zaten mevcuttur ve bunları dilediğiniz zaman yeniden adlandırabilir, taşıyabilir veya silebilirsiniz.

  
  

• Sitenizin menüsünü çapaya bağlayın: Bu sayede ziyaretçileriniz menünüze tıklayarak sayfanızda istedikleri bölüme gidebilirler. Çapa eklerken, çapanızı bağlayacağınız bölümü seçmeli ve çapanıza bu bölümün adını vermelisiniz. Başka bir deyişle her bir çapaya vermeyi seçtiğiniz başlık, menünüzde o isimle görünecektir ve böylece ziyaretçiler için temiz bir gezinti deneyimi oluşturacaktır.

  
  

• Menü içinde sıralama yapın: Kaydırma kolaylığı ve gezinti dostu bir tasarım için menü sıralamanız, bölüm sıralamanızla tutarlı olmalıdır. Örneğin menünüz yataysa, menüdeki ilk öğe ("Hakkımda") sayfanızın ilk bölümüyle aynı sıralamada olmalıdır (yine "Hakkımda"). Web sayfalarında kaydırarak gezinti genellikle uzun bir süreç olduğundan menünüzü sabitleyerek her an görünür kılmalısınız. Yüzer bir çapa menüsü oluşturabilir veya menünüzü üst bilgi kısmına ekleyerek "üst bilgiyi sabitle" seçeneğini etkinleştirebilirsiniz.

07. Kullanıcıların sitenizi kaydırmasını kolaylaştırın

Web sayfasının uzun formatı nedeniyle ziyaretçiler, sitenizi aşağı yukarı kaydırırken dikkat çekici içeriğiniz içinde kaybolabilir.

Ziyaretçilerinize zahmetsiz bir gezinti deneyimi sunmak için, sürekli kaydırmak yerine tek tıkla sitenizin başına dönmelerini sağlayacak bir "en üste dön" butonu eklemeniz yeterli. Bu buton, ziyaretçiniz sitede en aşağı kaydırdığında bile görünecek şekilde sabit konumda kalır.

08. Harekete geçirici mesajınız (CTA) güçlü olsun

Tüm içeriğiniz tek yerde toplandığı için ziyaretçilerin dikkatini bülten aboneliği, fiyat talebi veya hizmet satın alma gibi önceliklerinize çekecek bir amaç belirlemelisiniz.

Harekete geçirici mesaj (CTA) işte burada devreye giriyor. CTA'lar, internetteki hedef kitlenizi o an yapmalarını istediğiniz eyleme teşvik eden kısa ifadelerdir. Mesajınızı, en yüksek görünürlüğü yakalamak adına ilk şeritin üzerindeki manşet kısmına ekleyebilir ve ziyaretçilerinizi daha önceden planladığınız amaca uygun bir bölüme yönlendirebilirsiniz.

Bunun için tıpkı 6. adımda farklı bölümlere bağlantı sağladığımız gibi CTA butonunuza köprü kurmanız yeterlidir. Ziyaretçilerinizi belirli bir bölüme yönlendirmek için editörden bir CTA butonu ekledikten sonra CTA'nıza bir köprü (bağlantı) oluşturun. Örneğin CTA'nız "Benimle İletişime Geçin" metni içeriyor olsun. O halde butona tıklayanların "İletişim" bölümünüze yönlendirileceği bir bağlantı oluşturmalısınız.

09. Zengin bir alt bilgi alanı ekleyin

Alt bilgi, web sitenizin en altındaki alandır. Çoğu kullanıcı, önemli bilgileri bulmak için doğrudan bu kısma göz atar; örneğin işletmenin iletişim bilgileri gibi. Bu yüzden güncel iletişim bilgileriniz, sosyal medya hesaplarınız, çalışma saatleriniz, gizlilik politikanız ve hizmet koşullarınızın burada bulunması önemlidir.

10. Sosyal medya hesaplarınızı dahil edin

Online kimliğinizi her açıdan bir araya getirmeniz ve bir bütünlük oluşturmanız önemlidir. Bunun yollarından biri de Facebook, LinkedIn ve Instagram hesaplarınızı web sitenize bağlamaktır. Neden mi? Sitenizin ziyaretçi trafiğini olabildiğince artırmak için!

Daha fazla tıklanmak ve ön plana çıkmak için sosyal medya hesaplarınızı web sitenizle birleştirmenin birkaç yolu vardır:

• Web sitenize sosyal ağ çubuğu ekleyin: Bu çubuk, tüm sosyal medya ağlarının simgelerini içerir. Çoğu web sitesi oluşturucu platformda sosyal ağ çubuğu için birden fazla düzen seçeneği bulunur. Tek yapmanız gereken aralarından birini seçmek, hesaplarınızın bağlantılarını eklemek ve görünüşü zevkinize göre düzenlemek. Ziyaretçilerinizin bu öğeyi sitenizde gezinirken her an görebilmeleri için editörde öğenin üzerine tıklayın ve "Ekrana Sabitle" seçeneğini etkinleştirin.

  
  

• Instagram hesabınızı ekleyin: Instagram hesabınızı web sitenize bağlayarak daha da görünür kılmaya ve daha fazla takipçi edinmeye ne dersiniz? Böylece kullanıcılar, güncel fotoğraflara ve konum bilgilerine kolayca ulaşabilir. Instagram hesabınızı eklediğinizde pek çok kişiselleştirilebilir düzen arasından beğendiğinizi seçerek tasarımınızı şekillendirebilirsiniz.

11. Arama motoru optimizasyonunu (SEO) unutmayın

Arama motoru optimizasyonu (SEO), internette görünür olmak ve Google gibi arama motorlarının sonuç sayfalarında listelenmek isteyen her site için önemli bir unsurdur. SEO, belirli anahtar kelime aramalarında daha üst sıralarda yer almanız için sitenizi optimize etmeniz anlamına gelir. Daha fazla trafik, sitenize daha çok ziyaretçi çekmek demektir.

Sitenizin Google'a indekslendiğinden, yani veri tabanına kayıtlı olduğundan emin olmakla başlayın. Çoğu modern web sitesi oluşturucu platform, sitenizi yayınladıktan kısa süre sonra Google'a indeksler ve sonuçlarda görünür hale getirir. İndekslendikten sonra doğru anahtar kelimeleri hedefleyerek daha üst sıralarda listelenebilir ve sitenizi ön plana çıkarabilirsiniz.

SEO sürecini kolaylaştırmak için pek çok platform, size özel kontrol listeleri ve SEO araçları sunar. Bu araçlar, anahtar kelimelerden kişiselleştirilmiş SEO planı önerilerine kadar yapmanız gerekenler konusunda size süreç boyunca rehberlik eder.

Bonus: En iyi sonucu elde etmek için web sitenizi Google arama sonuçlarında listeleme rehberlerine göz atmanızı öneririz.

12. Sitenizi mobil dostu hale getirin

Günümüzün trendi internette gezinmeyi bilgisayarlardan akıllı telefonlara doğru taşıyor. Bu yüzden arama motoru optimizasyonu sıralamasında pek çok web sitesinin önce mobil sürümü dikkate alınıyor (bkz. Google'ın mobil öncelikli indekslemesi).

Peki web siteniz için bu ne anlama geliyor? Basitçe ifade etmek gerekirse sitenizin mobil hali, bilgisayar sürümü kadar şık ve işlevsel olmalıdır. Bu süreçte okunabilirlik ve gezinme kolaylığının önemi göz önünde bulundurulduğunda web sayfası oluşturmayı seçerek doğru yolda ilerlediğinizi söyleyebiliriz.

Günümüzde çoğu web sitesi oluşturucu platform, sitenizin her cihazda mükemmel görünen bir mobil sürümünü otomatik olarak oluşturur. Editöre gidin, mobil görünüme geçiş yapın ve sitenizin mobil halini kontrol edin. Mobil sitenizde gezintiyi daha da kolaylaştırmak için bir hızlı eylem çubuğu ekleyebilirsiniz. Mobil sitelerde sosyal ağ çubuğu her zaman görünmediğinden bu çubuk, ziyaretçilerin diledikleri bilgiye; örneğin iletişim bilgilerinize kolayca ulaşabilmeleri için harika bir alternatif sunar.