Adım Adım Web Tasarım - Dijital Pazarlama Uzmanı

Adım Adım Web Tasarım

mm

Merhabalar,

Sizlere bu yazı serimde bir web sayfası nasıl hazırlanır, hazırlanırken nelere dikkat edilir, kaç aşamada hazırlanır gibi soruların kendimce cevaplarını vereceğim. Kimsenin olmadığı gibi benimde bilgim %100 değil, yanlış olduğunu düşündüğünüz bilgileri uygun bir dil ile düzeltmek sizin elinizde.Şimdiden teşekkür ediyor ve konuya geçiyorum.

Bir web sayfası bir çok şekilde tasarlanıp açılabilir. Bunlar müşterinin isteklerine göre farklılık gösterebilir. Websitesi açmanın en kolay yollarından bir tanesi ise hazır templateler (wordpress, joomla, prestashop, magento vb.) kullanmaktır. Ben size bu yazımda hazır templateler kullanılmadan oluşturulan web sayfalarının hazırlanış aşamalarını anlatacağım. Hazır templateleri başka bir seride anlatabilirim.

Hazırlanış aşamasını 3 grupta inceleyebiliriz.Bunlar;

  • Sayfaların still tasarımları
  • Sayfaların HTML , CSS ‘e dökümü.(FRONT END)
  • Tasarımları HTML/CSS’e dökülmüş sayfalara sorgu işlemleri ve sonuç gösterimleri.(PHP, ASP vb.) (BACK END)

Bu 3 grubu tek yazıda incelemem zor olacağından sırası ile ayrı yazılarda inceleyeceğim.

SAYFA TASARIMLARI

Herhangi bir şirket, şahıs veya kuruluş adına tasarlayacağımız websitesinde brief çok önemlidir. Daha önceki yazılarımda brief nedir ve nasıl yazılırı anlatmıştım. Ulaşmak için buraya tıklayın.

Müşteriden gelen brief size birnevi yol gösterir. Yapmanız gereken briefi okuyup anladıktan sonra sitesini yapacağınız kişi veya kuruluş ile ufak çaplı bir araştırmaya girmektedir.

Ne iş yapar? Ne satar? Ne sergiler? Ne ister? Varsa beğendiği bir örnek site hoşumuza gider.

Ön araştırmayı yaptıktan sonra artık yapacağımız iş ile gerekli temel bilgiye sahibiz.Hangi sayfaların hangi sayfalara bağlanacağını, hangi içeriği veri nerede göstermemiz gerektiğini biliyoruz ve tasarımlarımıza başlayabiliriz.

Aslında araştırmalarım doğrultusunda öğrendiğim bilgiye göre Web Arayüz Tasarımlarına başlanırken önce Mobil görünümden başlanırmış ve ona göre Desktop dizayna geçilir. Fakat ben alışkanlığımdan ötürü önce Desktop sonra Mobile görünümleri tasarlıyorum. Henüz çok büyük bir zararını görmedim fakat ilerde bana zarar verdiğini düşünürsem tabiki kendimide revize edebilirim 🙂

Anasayfa şablonu bizim için çok önemlidir. Anasayfa’da aslında sitenin bütün stilinin ne tarz olacağını, kullanacağımız birçok stili belirleriz.Alt sayfalarıda çalışırken Anasayfa’daki kullandığımız stilleri baz alarak çalışırız.

Örneğin; Anasayfa tasarımında “buton”larda flat tasarım çalıştıysak, alt sayfalarda gölgeli butonlar kullanmak bütünlüğü bozacak, görünüş olarak gayet kötü bir hale sokacaktır sitemizi. Bu yüzden bütünlüğü korumak en önemli maddemiz olmalı.

Anasayfa tasarımımızı oturttuktan sonra aslına bakarsanız işimiz gayet kolay.Sadece stil ve mizanpajı koruyarak alt sayfalara içerik uyarlaması yapmanız yeterli oluyor. Zaten stillerinizi güzel belirlediyseniz şablon çorap söküğü gibi akıyor.


Son kısımda ise size tasarımı yaparken düşünmeniz gereken kişileri; ekip arkadaşlarınızdan bahsedeceğim.

Sayfa tasarımlarını yaparken aslında bir yandan da tasarımın sizden sonra gideceği noktaları hesaplamak ve ona göre tasarlamak hem işin çıkış sürecini hızlandırır hemde sizden sonraki kişilerin işini kolaylaştırır.

Örneğin; Günümüzde bir hayli revaşta olan Bootstrap sistemine uygun tasarımlar yapmak Front End Developerınızın işini epey bir kolaylaştırır. Size sıfırdan bootstrap öğrenin demiyorum fakat hiç değilse bootstrap grid ve layout mantığını öğrenmeniz sizi tasarımları yaparken onlara dikkat etmeye itecektir.


Bu yazımda sadece Sayfa Tasarımları yapılırken nelere dikkat edilmeli gibi konulara kısa kısa değindim. Bu işin birde KULLANICI DENEYİMİ ( USER EXPERİENCE ) kısmı var. Oraya hiç değinmedim çünkü bir başka yazıda daha detaylı anlatmak istiyorum.

Ayrıca ARAYÜZ TASARIMl ( USER INTERFACE ) tasarımlarında stil olarak nelere dikkat edilmeli gibi konulara pek değinmedim. Bu konuyuda bir başka yazıda detaylı anlatmak istiyorum.

Okuduğunuz için teşekkür ederim,

Saygılar.