29 OCAK PERŞEMBE
MENÜYÜ SABİTLEMEK
Mimarlık ofisi web site çalışmamda menüyü sabitledim ve arka planının saydamlığını %50 civarına getirdim.
Sayfalarda aşağı inildiğinde menü sabit olarak yukarıda duruyor.
Arka plandaki siyah rengi de %50 saydam yaparak, web sitenin tasarımına uygun bir tarz oluşturmaya çalıştım.
28 OCAK ÇARŞAMBA
MİMARLIK OFİSİ WEB SİTESİ
Ana Sayfa’da masaüstü görünümde görseli yan yana kullandım.
Tablet ve cep telefonu görünümünde her satırda 2 görsel kullanmayı düşünüyorum.
Fakat diğer düşüncem de şu: Slide şeklinde görsellerin kayması. Yani 4’ten fazla sayıda görsel kullanmak. Belki 8 tane. Sağdan sola doğru görseller kayacak. Siteye bir hareket getirebilir bu. Otomatik olarak oyanayacak görseller. Mouse ile üstüne gelindiğinde durabilir.
27 OCAK SALI
BİSİKLET TAMİRİ VE SATIŞI YAPAN İŞLETMENİN WEB SİTESİ
Ana Sayfa’da Hero bölümünün altında olan Hakkımızda bölümünün masaüstü ve mobil görünümlerini paylaşmak istiyorum.
Masaüstü görünümde sol tarafta görsel kullanarak, sağ tarafta işletme hakkında kısa bilgi ve sunulan hizmetlerle beraber çeşitli istatistikler sunuldu.
Tabi mobil sürümde tablet görünümü ve cep telefonu görünümünde düzenleme yapmam gerekti.
Öncelikle mobil görünümlerde görseli üstte kullanmam yanlış olacaktı. Çünkü web sitenin en üstündeki Hero bölümünün görseli ile beraber iki görsel olacaktı art arda. Ve web sitenin ziyaretçilerine sunulması gereken görselden ziyade hakkımızda bilgileri, sunulan hizmetler ve istatistiklerdi. Bu sebeple görseli alta aldım.
1024 piksel çözünürlükte tablet görünümüne geçiyor ve 767 pikselde cep telefonu görünümüne geçerek sunulan hizmetler tek sıra olarak gözükmeye başlıyor.
26 OCAK PAZARTESİ
MİMARLIK OFİSİ WEB SİTE ÇALIŞMASI — ANA SAYFA
Ana Sayfa tamamlandı. Tabi proje sürecinde mutlaka bazı değişiklikler yapılacaktır.
Butonlar yuvarlak şekilde istendi ama dikdörtgen şekle dönüştürülebilir.
Ana Sayfa’ya bir veya birkaç bölüm daha eklenebilir.
25 OCAK PAZAR
24 OCAK CUMARTESİ
MİMARLIK OFİSİ WEB SİTE ÇALIŞMASI
Üzerinde çalışmaya başladığım mimarlık ofisi web site çalışmamdan bir bölüm.
Ana Sayfa’da, sunulan hizmetleri görsel kullanmadan sade bir şekilde sundum. Butonlar ile HİZMETLER sayfasına yönlendirme yapılacak ve o sayfada daha detaylı bilgiler yer alacak.
23 OCAK CUMA
SERVİSLERİMİZ BÖLÜMÜ
Üzerinde çalıştığım web site projesinde aşağıdaki şekilde bir alternatif tasarım sunacağım.
Aslında çok fazla tercih ettiğim bir yöntem değil. İçerikleri, tıklandığı zaman gözükecek şekilde kullanmak yerine topluca tek seferde göstermek kullanıcı deneyimi açısından daha doğru geliyor bana. Ama yine de bu stili sunmak istedim.
22 OCAK PERŞEMBE
MÜŞTERİ DEĞERLENDİRMELERİ BÖLÜMÜ
Koyu arka plan rengi kullandığım web site.
Müşteri yorumları kısa tutulacak, sağ üstteki oklarla ve yorum kutularında sürükleme yapılarak kaydırılabilecek.
Fotoğraf kısmı kaldırılabilir. Bu bölümlerde fotoğraf ekleme kısmını çok doğru bulmuyorum.
Görünen yorum sayısı 3’e de düşürülebilir.
21 OCAK ÇARŞAMBA
SERVİSLER BÖLÜMÜ
Servisler bölümünde görsel kullanılmak istenmediği zaman bu bölümü farklı stiller kullanarak güzelleştirmek gerekli.
Bir satırda 3 kutu da düşünülebilir. Mobil görünümde tek sıraya düşecek.
Mouse ile üstüne gelindiğinde kutu siyah, diğer öğeler beyaz oluyor. Renk geçişleri için 0,5 saniye süre belirledim. Bu sebeple geçişler çok keskin değil, bir anda olmuyor.
20 OCAK SALI
ÜRÜNLER SAYFASI
El emeği ürün satışı yapılacak web site.
Şu anda web site üzerinden online ödeme yapılarak satın alma düşünülmüyor.
Her ürünün altındaki butona tıklayınca WhatsApp sohbetine yönlendirme yapılacak ve ürünün ismi WhatsApp sohbetinde otomatik olarak doldurulacak: “Merhaba. Çanta Model 1 ürününüzü satın almak istiyorum.” gibi.
19 OCAK PAZARTESİ
PROJE GÖRSELLERİ
Mimarlık, mobilya, tadilat vb. hizmetler veren işletmelerin ve profesyonellerin web sitelerinde mutlaka GALERİ bölümü olmalı.
Geçmişte tamamlanan projelerin fotoğrafları burada paylaşılmalı.
Ve bu bölüm Fotoğraf Galerisi şeklinde olmalı; tıklanabilir olmalı. Fotoğraflara tıklandığında galeride sağa sola kaydırılabilmeli, kullanıcılar için kolaylık sağlanmalı.
Bazen web sitelerde görseller tıklanarak büyütülmüyor. Tıklanabilir olduğunda da oklar ve kaydırma yöntemi ile galeride gezilemiyor. Tıklanan görsel aynı veya ayrı sayfada açılıyor ve o sayfayı kapatmak veya geri gitmek, diğer görsele aynı işlemi uygulamak gerekiyor. Bu çok yanlış.
Şimdi ben bu web sitede Lightbox ile açılan bir galeri yapacağım. Oklar ile veya mobilde kaydırma yöntemi ile galeride gezilebilecek. İlerleyen günlerde onu da paylaşacağım.
18 OCAK PAZAR
17 OCAK CUMARTESİ
TEKLİF FORMU
Mobilya üretimi, tadilat gibi sektörlerde faaliyet gösteren firmaların web sitelerinde Teklif Formu bulunmasını ısrarla tavsiye ediyorum.
Teklif Formu’nun içeriği daha da detaylandırılabilir. Bu tamamen size kalmış.
Tamamlamış olduğum web site projesinde bu şekilde bir form tercih edildi.
16 OCAK CUMA
“ÇALIŞMA SÜRECİMİZ” BÖLÜMÜ
İç mimarlık hizmeti sunan bir firmanın web sitesinde böyle bir bölüm kullandık.
Üstte fotoğraf kullanıldığı için, alt kısımda ikonlar veya yine fotoğraflar kullanmayı uygun bulmadım.
Çalışma aşamalarından bahsedildiği için rakam kullanmayı daha uygun gördüm.
Masaüstü görünümü paylaşıyorum.
15 OCAK PERŞEMBE
İLETİŞİM FORMU
İletişim formlarını ilgi çekici hale getirmeyi seviyorum.
Bu web sitesi projemde sayfalardaki başlıkları dikdörtgen çizgi içerisinde kullandık. Bu sebeple form kutularında da aynı tarzı kullanmak tekrara düşmek demek olacaktı. Web sitesini ziyaret edecek olanların da dikkatini dağıtacaktı.
Bu sebeple kutuların altında siyah çizgi kullandım. Sanki çok güzel oldu değil mi? 
14 OCAK ÇARŞAMBA
ÖZGEÇMİŞİNİZ İÇİN KİŞİSEL WEB SİTESİ
Bu çok fazla tercih edilmeyen ya da çok fazla bilinmeyen bir şey.
Evet özgeçmiş için çoğunlukla PDF dosyası kullanırız, olması gereken de budur ama ben tüm profesyonellerin kişisel web sitelerinin olması gerektiğini düşünüyorum.
Çalıştığınız firma bu duruma sıcak bakmayabilir. Fakat, özellikle iş aradığınız dönemlerde bir kişisel web siteniz olursa ve iş başvurularınızda web sitenizi ve alan adınızla beraber kurumsal e-posta adresinizi kullanırsanız, firma tarafından bu durum kabul edilebilecek.
Bir profesyonel için hazırladığım web sitesi çalışmasından örnek.
ABOUT ME bölümünde fotoğraf ve kişisel bilgiler yer alıyor. Sonrasında MORE sayfası ekledik ve İŞ DENEYİMİ ve EĞİTİM DURUMU bölümleri ekledik.
Firmalara, İnsan Kaynakları departmanlarına PDF dosyası göndermek zorunda olmadığınız zamanlar web sitenizin linkini kurumsal e-posta adresiniz ile göndermek nasıl olur?
İsminiz Barış Çınar diyelim.
Web siteniz: bariscinar.com olsun. E-posta adresiniz de info@bariscinar.com olsun.
Web sitenizde bariscinar.com/cv sayfası olsun diyelim.
info@bariscinar.com e-posta adresi ile bu linki paylaşmak mı yoksa baris-cinar07@gmail.com ile PDF dosyanızı paylaşmak mı?
13 OCAK SALI
BUTONLARDA RENK GEÇİŞİ KULLANMAK
Doğru kullanıldığında web sitenin görünümünü olumlu anlamda etkileyen; yanlış kullanıldığında ise olumsuz anlamda etkileyen bir şeydir renk geçişleri.
Müşteri firma tarafından bana, firma logosu ile bağlantılı birkaç renk gönderildi. Bu renklerin kullanılması istendi.
Gönderilen renkler altın rengi ve aşağıdaki butonda görülen renklerdi.
Fakat web sitesinin arka plan rengini siyah istemelerinden dolayı bu renkleri kullanarak nasıl doğru sonuca ulaşabileceğimi düşündüm ve aşağıdaki butondaki renk geçişini ve beyaz çerçeveyi kullanmaya karar verdim.
Tabi bunun yanında birkaç alternatif daha sundum fakat bu çok beğenildi.
12 OCAK PAZARTESİ
MOBİLYA ATÖLYESİ WEB SİTESİ
Mutfak dolabı, banyo dolabı, portmanto vb. üretimi yapan mobilya atölyesi web sitesi.
Bu web sitede yazıdan daha fazla görsele yer verilmeli.
Geçmişte yapılan işlerin paylaşılması büyük önem taşıyor.
Ana Sayfa‘da böyle bir bölüm karşılayacak. Arka plandaki görselin üzerine 2 görsel daha kullandım. Mouse hareketleri ile 4 yöne doğru hareketleri olacak bu görsellerin. İlerleyen günlerde video kaydı alarak da paylaşacağım.
11 OCAK PAZAR
WEB SİTE ÇALIŞMASI
Üzerinde çalıştığım web sitenin Ana Sayfa’sından sonra diğer sayfalara geçiyorum bugün.
Ana Sayfa’da birkaç düzenleme, ekleme-çıkarma yapılabilir.
10 OCAK CUMARTESİ
WEB SİTENİZE TELEFON NUMARASI VE DOĞRUDAN ARAMA LİNKİ EKLEMEK
Web sitenizi ziyaret edenlerin size telefon, WhatsApp gibi iletişim araçlarıyla doğrudan ulaşmasını istiyorsanız menüye cep telefonu numaranızı yazı olarak veya HEMEN ARAYIN butonu şeklinde ekleyerek, tıklandığında doğrudan arama yapılmasını sağlayabilirsiniz.
Veya web sitenizin bir kenarına TELEFON veya WHATSAPP ikonu sabitlenebilir.
9 OCAK CUMA
SERVİSLER BÖLÜMÜ
Kanada’da faaliyet gösteren ve makine satışı yapan bir firma için üzerinde çalıştığım web site projemden bir bölüm.
Üzerine gelinen bölüm biraz yakınlaşarak renkleniyor.
Karelerin tamamı tıklanabilir. Bazen bu durum atlanıyor web sitelerde. Sadece yazılara link eklenebiliyor. Bu da web sitesi ziyaretçilerinin o bölüme tıklayarak ilgili sayfaya gitmesini zorlaştırıyor.
8 OCAK PERŞEMBE
KİŞİSEL MARKANIZI OLUŞTURMAK
Birkaç gün önce SERVICES bölümünü paylaştığım web sitenin ANA SAYFA‘sını paylaşıyorum.
Müşterim, Kanada’da uzun yıllardır inşaat işi yapan birisi. Firmaları da var. Firmalarının da web sitesini ben yapmıştım.
Kişisel Markalaşma konusu benim de üzerinde sıklıkla durduğum, son zamanlarda sürekli bahsedilen bir konu.
Kendisi çok doğru bir düşünceyle kişisel olarak da web sitesinin olması gerektiğini düşündü.
Firmalar, firma isimleri ile ön plana çıkmaya çalışır fakat iş hayatında firma isimleri değil, insan isimleri her zaman ön plandadır.
7 OCAK ÇARŞAMBA
RENK GEÇİŞİ (GRADIENT) KULLANIMI
Kanada’da faaliyet gösteren bir inşaat firmasının web sitesinde butonlarda ve bazı başlıklarda renk geçişi kullandım.
Firmanın logosunda da benzer bir stil olduğu için, web sitede bu stili kullanmak çok doğru bir tercih oldu.
Tabi öncelikle firma tarafından böyle bir istek geldi. Benimle birkaç tasarım örneği paylaşıldı. Böylelikle istedikleri stili kolayca anlamış oldum. Ve birkaç örnek stil sundum. Bu stil çok beğenildi ve web sitenin tamamına uygulandı.
Hem koyu arka plan rengi kullanmanı hem de renk geçişi kullanmanın iddialı bir hareket olduğunu kabul ediyorum fakat ortaya çok güzel bir sonuç çıktığını düşünüyorum.
6 OCAK SALI
CALL TO ACTION (EYLEM ÇAĞRISI)
Web site çalışmalarımda sayfaların belli bölümlerinde (çoğunlukla en alt kısmında) iletişime geçmeye teşvik etmek amacıyla bu bölümleri kullanırım.
Bazen bir görsel ile, bazen iletişim formu ile kullanılabilir. Bu, sektöre göre değişebilir.
Projelendirme hizmeti sunan firmalarda bu bölümde doğrudan Teklif Formu sunulabilir veya buton ile ilgili sayfaya yönlendirme yapılabilir.
Bu web sitede olabildiğince sade bir tasarım kullanıldı.
5 OCAK PAZARTESİ
SERVICES BÖLÜMÜ
Kanada’da faaliyet gösteren bir inşaat firması için bir web site projesi tamamlamıştım. Firmanın ortaklarından birisi tarafından kişisel markasını da oluşturabilmek için kişisel web site istendi.
7 gün kadar süren bir projeydi. Eğlenceli bir çalışma oldu.
“Web Site Tasarımı & Geliştirme” projelerinde, çalışmaya başlamadan önce müşterinizden almanız gereken bilgiler-dosyalar oluyor. Bunları hızlıca temin edebildiğinizde projeyi de hızlıca tamamlayabiliyorsunuz.
Bu müşterim gerçekten ne istediğini bilen ve istediğim her şeyi zamanında yollayan biriydi.
Sadece logo tasarımı çok ama çok düşük çözünürlükte, yıllar önce tasarlanmıştı. Yeni bir tasarım talep etmedi. Ben de yaklaşık 200 piksel yüksekliğinde olan bu logoyu vektörel olarak üstünden çizdim.
Web sitesi projelerinde beklediğiniz her şey, beklediğiniz şekliyle gelmez.
Mesela geçen gün, şu anda üzerinde çalıştığım bir web sitesi projesi için beklediğim görselleri müşterimden aldım. Fakat ışık ve renk olarak pek memnun olmadığım fotoğraflardı. Web sitede, tasarım sürecinde geçici stok fotoğraflar kullanmıştım. O stok fotoğrafları kaldırıp, gerçek proje fotoğrafları, ana gönderildiği şekliyle paylaşmam, web sitenin görünümüne ciddi anlamda olumsuz etki edecekti.
Ben de fotoğrafları birkaç saat boyunca üzerinde çalışıp düzenledim. Renk olarak istediğim noktaya getirdim.
Aşağıda paylaştığım SERVICES bölümü hem Ana Sayfa’da hem de Services sayfasında kullanıldı.
İlk hâlinde 3 farklı görsel vardı ve 3 servis, 3 kutudan oluşuyordu. Fakat müşterim tarafından tek görsel kullanılması ve 3 servisin o görselin içinde yazılması istendi. En uygun görsel olarak bunu seçtik ve ortaya böyle bir tasarım çıktı.
4 OCAK PAZAR
“HEADER” TASARIMI
Web sitede Ana Sayfa’nın en üstünde ziyaretçileri bir video karşılayacak.
Logo ve menü başlıklarını arka plan rengi olmadan kullanıp, sayfada aşağı inildiğinde ise beyaz zeminde gözükebilmeleri için siyah renge çevireceğim.
3 OCAK CUMARTESİ
ANA SAYFA'DA “PORTFOLIO” BÖLÜMÜ
Kanada’da faaliyet gösteren bir inşaat firması için şu anda üzerinde çalıştığım web sitesinde Ana Sayfa’da PORTFOLIO bölümünü paylaşıyorum.
Şu anda elimde toplam 7 projeye ait birer görsel var.
Fotoğraf galerisi şeklinde yan yana ve alt alta da düşünebilirdim ama 7 sayısından dolayı bunu yapamadım. Sayı 6,8 veya 9 olsa idi her sırada 2,3 veya 4 görsel kullanabilirdim.
Bu tarzı denemek istedim. 2,5 saniyede bir otomatik olarak bir görsel sola kayıyor. Oklar ile de ileri geri gidilebiliyor.
Aslında bu bölümde amaç, aşağıdaki VIEW ALL PROJECTS butonu ile ziyaretçileri diğer sayfaya çekmek. O sayfada proje bilgileri de yer alacak.
Tabi firmanın isteği üzerine bu bölümde görselleri altında ve içinde proje isimleri de yazılabilir.
Şu anda görsellere tıklanarak lightbox olarak açılmıyorlar. Sürükleyerek kaydırma yapılabiliyor. İstek üzerine o da yapılabilir. Tıklanan görsel büyük olarak gözüküp oklar ile kaydırılabilir. Bu bölümde proje bilgileri de gösterilebilir.
2 OCAK CUMA
RESPONSIVE GÖRÜNÜM
Dün paylaştığım bölümün bilgisayar, tablet ve cep telefonu görünümlerini paylaşıyorum.
Ziyaret ettiğim web sitelerde özellikle mobil görünümlerde çok ciddi hatalar görüyorum.
Günümüzde, web sitelerinin ziyaretçilerinin büyük çoğunluğu mobil cihazlardan giriş yapıyor. Fakat buna rağmen, mobil görünüm için gerekli düzenlemeler yapılmıyor.
Açık konuşmak gerekirse beni işimde en çok yoran şey responsive görünüm için harcadığım emek ve zaman. Her pikseli, web sitenin kusursuz gözükmesi için tek tek inceliyorum.
1 OCAK PERŞEMBE
İNŞAAT FİRMASI WEB SİTE ÇALIŞMAM
Kanada’da faaliyet gösteren bir inşaat firması için üzerinde çalıştığım web site projemden bir bölüm paylaşmak istiyorum.
Sayfada aşağı yukarı hareket edildiğinde arka plandaki görseli sabit tuttum.