Bu wikiHow makalesi sana profesyonel görünen ve iyi performans gösteren bir web sitesi tasarlamayı öğretir. Web sitenizin tasarımının büyük kısmı nihayetinde size kalmış olsa da, bir web sitesi oluştururken yapılması ve kaçınılması gereken bazı kritik şeyler vardır.
adımlar
Bölüm 1 / 2: Web Sitenizi Nasıl Tasarlarsınız
Adım 1. Bir web sitesi oluşturucu kullanmak isteyip istemediğinizi belirleyin
Sıfırdan oluşturulan web siteleri oldukça ayrıntılı bir HTML kodlaması anlayışı gerektirir, ancak Weebly, Wix, WordPress veya Google Sites gibi ücretsiz bir barındırma hizmetini kullanarak kolayca bir web sitesi oluşturabilirsiniz. Web sitesi oluşturucuları, ilk kez tasarımcıların kullanması HTML'den çok daha kolay olma eğilimindedir.
- Kendi web sitenizi kodlamaya karar verirseniz, hem HTML hem de CSS kodlamasını öğrenmeniz gerekir.
- Web sitenizi oluşturmak için zaman ve enerjiye yatırım yapmak kulağa çekici gelmiyorsa, sitenizi sizin için oluşturması için bir web sitesi tasarımcısı da tutabilirsiniz. Serbest tasarımcılar saatte 30 dolar ile saatte 100 doların üzerinde herhangi bir yere mal olabilir.
Adım 2. Sitenizin haritasını çıkarın
Bir web sitesi oluşturucuyu açmadan önce, web sitenizin yaklaşık olarak kaç sayfaya sahip olmasını istediğinizi, bu sayfaların her birinin içeriğinin ne olması gerektiğini ve ana sayfa ve "Hakkında" gibi önemli sayfaların genel düzenini bilmelisiniz. sayfa.
Hangi içeriğin görünmesi gerektiğini belirlemek yerine, her birinin kaba resimlerini çizerseniz, web sitenizin sayfalarını görselleştirmek daha kolay olabilir
Adım 3. Sezgisel tasarım kullanın
Yeni fikirler için söylenecek bir şey olsa da, web sitenizin temel tasarımı aşağıdaki gibi yerleşik yönergeleri izlemelidir:
- Gezinme seçenekleri (örneğin, farklı sayfalar için sekmeler) sayfanın en üstüne gelmelidir.
- Bir menü simgesi (☰) kullanıyorsanız, sayfanın sol üst köşesinde olmalıdır.
- Bir arama çubuğu kullanıyorsanız, sayfanın sağ üst tarafına yakın olmalıdır.
- Yararlı bağlantılar (örneğin, "Hakkında" sayfasına veya "Bize Ulaşın" sayfasına bağlantılar) her sayfanın en altına yerleştirilmelidir.
Adım 4. Tutarlı olun
Seçtiğiniz metin yazı tipi, renk paleti, resim teması ve tasarım seçenekleri ne olursa olsun, web sitenizde aynı kararı kullandığınızdan emin olun. Ana sayfa için tamamen farklı bir yazı tipi kullanıldığında, "Hakkında" sayfası için kullanılan bir yazı tipini veya renk şemasını görmek inanılmaz derecede rahatsız edici olabilir.
- Örneğin, sitenizin ana sayfası için yalnızca soğuk tonlu renkler kullanıyorsanız, sonraki sayfada parlak, yüksek renkler uygulamayın.
- Özellikle renkler dinamik (örn. hareketli) bir şekilde görüntülendiğinde, yüksek veya çakışan renkler kullanmanın az sayıda web kullanıcısında epilepsi uyandırabileceğini unutmayın. Sitenizde bu tür renkleri kullanmaya karar verirseniz, ilgili sayfalardan önce bir epilepsi uyarısı eklediğinizden emin olun.
Adım 5. Gezinme seçenekleri ekleyin
Ana sayfanın en üstüne web sitenizdeki önemli sayfalara doğrudan bağlantılar yerleştirmek, ilk kez gelen ziyaretçileri önemli içeriğe yönlendirmeye yardımcı olacaktır. Çoğu site yaratıcısı bu bağlantıları varsayılan olarak ekler.
Web sitenizdeki her sayfaya, yalnızca sayfanın adresi üzerinden değil, web sitenizdeki seçeneklere tıklayarak erişilebildiğinden emin olmanız önemlidir
Adım 6. Birbirini tamamlayan renkler kullanın
Diğer tasarım türleri gibi, web sitesi tasarımı da görsel olarak hoş renk kombinasyonlarına dayanır; Bu nedenle, birbiriyle uyumlu tema renkleri seçmek çok önemlidir.
Nereden başlayacağınızı bilmiyorsanız siyah, beyaz ve gri iyi bir kombinasyondur
Adım 7. Minimalist bir tasarım kullanmayı düşünün
Minimalizm, soğuk tonlu renkleri, basit grafikleri, beyaz üzerine siyah metin sayfalarını ve mümkün olduğunca az süslemeyi teşvik eder. Minimalizm, çok az süslü öğeler gerektirdiğinden, web sitenizin çok fazla çalışma gerektirmeden profesyonel ve çekici görünmesini sağlamanın kolay bir yoludur.
- Birçok web sitesi yaratıcısı, web sitenizi kurarken seçebileceğiniz "minimalist" bir temaya sahip olacaktır.
- Minimalizme bir alternatif, daha sert çizgiler, parlak renkler, kalın metinler ve minimal görüntüler kullanan "vahşilik"tir. Brutalism, minimalizmden daha az takipçiye sahiptir, ancak web sitenizin içeriğine bağlı olarak, tasarım ihtiyaçlarınıza daha uygun olabilir.
Adım 8. Benzersiz seçimler yapın
Düz çizgiler ve ızgara kilitli web öğeleri güvenli bahislerdir, ancak birkaç benzersiz stilistik karar vermek hem sitenize kişilik kazandıracak hem de sitenizin öne çıkmasına yardımcı olacaktır.
- Web sitesi öğelerini asimetrik olarak yerleştirerek veya katmanlı bir görünüm oluşturmak için üst üste binen öğeler kullanarak trendleri kovalamaktan korkmayın.
- Zarif, keskin köşeler ve kare biçimli öğeler ("kart tabanlı" sunum olarak da bilinir) yuvarlak, yumuşak öğelerden daha az tercih edilir.
Bölüm 2/2: Web Sitesi Performansını En Üst Düzeye Çıkarma
Adım 1. Mobil optimizasyon seçeneklerinden yararlanın
Mobil tarayıcılar, masaüstü tarayıcılardan daha fazla web trafiği oluşturur; bu, web sitenizin mobil sürümüne gösterdiğiniz ilginin en azından masaüstü web sitenizin gelişimine eşit olması gerektiği anlamına gelir. Çoğu web sitesi oluşturucu hizmeti otomatik olarak sitenizin mobil sürümünü oluşturur, ancak mobil siteniz için aşağıdaki bilgileri aklınızda tutmak isteyeceksiniz:
- Düğmelerin (ör. site bağlantıları) büyük olduğundan ve dokunması kolay olduğundan emin olun.
- Mobil cihazlarda görüntülenemeyen özellikleri uygulamaktan kaçının (ör. Flash, Java vb.).
- Web siteniz için bir mobil uygulama yaptırmayı düşünün.
Adım 2. Sayfa başına çok fazla fotoğraf kullanmaktan kaçının
Hem masaüstü hem de mobil tarayıcılar, çok sayıda fotoğraf veya video görüntüleyen sayfaları yüklemekte zorlanabilir. Web tasarımında görseller önemli olmakla birlikte, sayfa başına birkaç taneden fazla kullanmak gereksiz yere uzun yükleme sürelerine neden olabilir ve bu da kişilerin söz konusu sayfa(lar)ı ziyaret etmesini engelleyecektir.
Genel olarak konuşursak, web sitenizin sayfalarının dört saniyenin altında yüklenmesini istiyorsunuz
Adım 3. Bir "İletişim" sayfası ekleyin
Hemen hemen tüm yerleşik web sitelerinin iletişim bilgilerinin (örneğin bir telefon numarası ve bir e-posta adresi) bulunduğu bir "Bize Ulaşın" sayfasına sahip olduğunu fark edeceksiniz; bazı sitelerin bu sayfada yerleşik bir soru formu bile vardır. Bir "İletişim" sayfası eklemek, web sitesi görüntüleyenlerine sizinle doğrudan bir iletişim hattı sağlar ve böylece olası hayal kırıklıklarına bir çözüm ekler.
Adım 4. Özel bir 404 sayfası oluşturun
Birisi web sitenizde ayarlanmamış veya mevcut olmayan belirli bir sayfayı ziyaret ettiğinde, bir "404 Hatası" web sayfası görüntülenecektir. Çoğu tarayıcının varsayılan bir 404 sayfası vardır, ancak kendi sayfanızı web sitesi oluşturucunuzun ayarlarından özelleştirebilirsiniz; öyleyse, aşağıdaki ayrıntıları eklediğinizden emin olun:
- Neşeli bir hata mesajı (örneğin, "Tebrikler - hata sayfamızı buldunuz!")
- Sitenin ana sayfasına geri dönüş bağlantısı
- Sık görüntülenen bağlantıların listesi
- Web siteniz için bir resim veya logo
Adım 5. Mümkünse bir arama çubuğu kullanın
Web sitesi oluşturma yönteminiz web sitenize bir arama çubuğu eklemeyi destekliyorsa, bunu yapmanız şiddetle önerilir. Bu, kullanıcıların gezinme seçeneklerinizi tıklamak zorunda kalmadan belirli bir sayfaya veya öğeye hızlı bir şekilde gitmelerini sağlayacaktır.
Arama çubukları, hedef kitleniz deneme yanılma kullanmadan genel bir terim aramak istediğinde de kullanışlıdır
Adım 6. Ana sayfanıza en çok zaman ayırın
Birisi web sitenizin ana sayfasına ulaştığında, web sitenizin temasının özünü hemen anlamalıdır; buna ek olarak, gezinme seçenekleri ve herhangi bir resim de dahil olmak üzere ana sayfanın tüm öğeleri hızlı bir şekilde yüklenmelidir. Ana sayfanız aşağıdaki özelliklere sahip olmalıdır:
- Harekete geçirici mesaj (ör. tıklanacak bir düğme veya doldurulacak bir form)
- Bir gezinme araç çubuğu veya menüsü
- Davetkar bir grafik (ör. tek bir sağlam fotoğraf, video veya beraberinde metin içeren küçük bir fotoğraf grubu)
- Web sitenizin hizmetine, konusuna veya odağına ilişkin anahtar kelimeler
Adım 7. Web sitenizi birden çok platformda birden çok tarayıcıda test edin
Farklı tarayıcılar web sitenizin özelliklerini farklı şekilde ele alabileceğinden, bu inanılmaz derecede önemlidir. Web sitenizi tanıtmaya başlamadan önce, Windows, Mac, iPhone ve Android platformlarında aşağıdaki tarayıcılarda web sitenizi ziyaret etmeyi ve kullanmayı deneyin:
- Google Chrome
- Firefox
- Safari (yalnızca iPhone ve Mac)
- Microsoft Edge ve Internet Explorer (yalnızca Windows)
- Birkaç farklı Android telefondaki yerleşik tarayıcı (örneğin, Samsung Galaxy, Google Nexus, vb.)
Adım 8. Web sitenizi eskidikçe güncellemeye devam edin
Tasarım trendleri, bağlantılar, fotoğraflar, kavramlar ve anahtar kelimeler zaman geçtikçe değişir, bu nedenle güncel kalmak için web sitenizde değişiklik yapmaya devam etmeniz gerekir. Bu, web sitenizin performansını diğer benzer web siteleriyle birlikte en az üç ayda bir (tercihen daha sık) kontrol etmenizi gerektirecektir.
Temel HTML Yardımı
HTML ile Örnek Web Sayfası
Destek wikiHow ve tüm örneklerin kilidini aç.
HTML Hile Sayfası
Destek wikiHow ve tüm örneklerin kilidini aç.
Örnek Basit Web Sayfası
Destek wikiHow ve tüm örneklerin kilidini aç.
İpuçları
- Web sitesi erişilebilirliği, web sitesi geliştirmenin bir başka önemli yönüdür. Bu, işitme engelli izleyiciler için altyazılar, görme engelli ziyaretçiler için sesli açıklamalar ve web siteniz potansiyel olarak nöbet tetikleyici etkiler kullanıyorsa ışığa duyarlılık uyarıları gibi şeyleri içerir.
- Çoğu web sitesi yaratıcısı, tercih ettiğiniz öğeleri eklemeden önce sitenizin düzenini ve tasarımını güçlendirmek için kullanabileceğiniz bir dizi şablona sahiptir.
Uyarılar
- Çoğu site yaratıcısı ücretsizdir; ancak, kendi alan adınızı kullanmak istiyorsanız (örneğin, "www.adınız.wordpress.com" yerine "www.adınız.com"), aylık veya yıllık bir ücret ödemeniz gerekir.
- İntihalden kaçının ve tüm telif hakkı yasalarına uyun: Web'den rastgele görüntüler, hatta yapısal öğeler bile izinsiz eklemeyin.
