Anasayfa › Web Tasarım
Web Tasarım
Web tasarım, sayfaların düzenini, menülerin ve formların kullanımını planlar: telefonda ekranın altına sabitlenen menünün ne zaman kullanıldığı, formlarda tarayıcının otomatik doldurma özelliğinin desteklenmesi, henüz içeriği olmayan bölümlerin sitede nasıl gösterileceği ve fotoğraflarda görünen kişilerden izin alınması.
Web Tasarım Çalışmasında Telefonda Alta Sabitlenen Menü Ne Zaman Kullanılır?
Alta sabitlenen menü, telefonda sayfa kaydırılırken ekranın alt kenarında yerinde kalan gezinme çubuğudur. Çubukta birkaç simge ve her simgenin altında kısa bir yazı bulunur. Web tasarım sürecinde bu çubuğun kullanılıp kullanılmayacağı, sitenin menü yapısına ve ziyaretçilerin telefonda en sık yaptığı işlemlere göre belirlenir. Masaüstü görünümü bu karardan etkilenmez; çubuk yalnızca dar ekranlarda gösterilir.
Çubuk, sitede telefonda tekrar tekrar kullanılan az sayıda işlem varsa kullanılır. Bu işlemler genellikle telefonla arama, yol tarifi, teklif formu ve hizmet listesidir. Menüde çok sayıda sayfa ve alt menü bulunuyorsa çubuk bunların hepsini taşıyamaz; bu durumda üstteki açılır menü kullanılır. Çubuk açılır menünün yerine geçmez. Menünün yanında, en sık kullanılan bağlantıları ekranın altına taşır.
Karar için önce ziyaret verilerine bakılır. GA4’teki teknoloji raporları, ziyaretlerin hangi cihaz türüyle yapıldığını gösterir. Menü bağlantılarına yapılan dokunmalar etkinlik olarak ölçülüyorsa telefonda en çok hangi bağlantının kullanıldığı da görülür. Ölçüm yoksa önce menü dokunmaları için etkinlik tanımlanır. Çubuğa yalnızca bu sıralamanın başındaki bağlantılar alınır. Az kullanılan sayfalar çubuğa konmaz; üstteki menüde kalmaya devam eder.
Her öğe bir simge ve bir yazıdan oluşur. Simge tek başına bırakılmaz; ekran okuyucular yazısız bir simgeyi adlandıramaz. Bulunulan sayfanın öğesi yalnızca renkle değil, kalın yazı ya da çizgiyle de belirtilir. Dokunma alanları yeterince büyük tutulur ve öğeler arasında boşluk bırakılır. Arama öğesi telefonun arama ekranını, yol tarifi öğesi Google Haritalar’daki kaydı açar.
Sabit çubuk sayfanın en alt kısmını örter. Bu yüzden sayfanın sonuna çubuğun yüksekliği kadar boşluk eklenir; sayfa altı ve son düğme çubuğun arkasında kalmaz. Bazı telefonlarda ekranın altında sistem hareketleri için ayrılmış bir şerit bulunur; çubuk bu şeridin üstüne yerleştirilir. Bir form alanına dokunulup ekran klavyesi açıldığında çubuk gizlenir. Çerez bildirimi ve sohbet düğmesi çubukla üst üste gelmez.
Elementor Pro’da çubuk tek bir bölüm olarak kurulur. Bölüm yapışkan ayarıyla ekranın altına sabitlenir ve görünürlük ayarıyla masaüstünde gizlenir. Çubuk şablon olarak bütün sayfalara aynı anda eklenir. Yayından önce farklı ekran boyutlarındaki gerçek telefonlarda dikey ve yatay konumda denenir. Web tasarım işlerinde çubuktaki her öğenin dokunma sayısı yayından sonra aylık raporda ayrıca gösterilir.
Formlarda Tarayıcının Otomatik Doldurma Özelliği Nasıl Desteklenir?
Otomatik doldurma, tarayıcının daha önce kaydettiği ad, e-posta, telefon ve adres bilgilerini formdaki alanlara kendisinin yazmasıdır. Ziyaretçi ilk alana dokunduğunda tarayıcı kayıtlı bilgileri öneri olarak gösterir. Öneri seçildiğinde form tek dokunuşla dolar. Bunun çalışması için tarayıcının her alanın ne istediğini anlaması gerekir. Tarayıcı bunu üç bilgiden anlar: alan türü, etiket ve amaç tanımı.
Alan türü, alana hangi tür bilginin yazılacağını belirtir: düz metin, e-posta, telefon ya da sayı. Telefonda doğru tür, doğru klavyeyi açar. E-posta alanında @ işaretinin bulunduğu klavye, telefon alanında rakam tuşları çıkar. Tür düz metin bırakılırsa ziyaretçiye tam klavye açılır ve tarayıcı alanı tanımakta zorlanır. Elementor’un form bileşeninde her alanın türü alan ayarlarından seçilir.
Her alanın görünür bir etiketi olur ve etiket alana bağlanır. Alan boşken içinde görünen soluk ipucu metni etiketin yerine konmaz; ziyaretçi yazmaya başlayınca kaybolur. Amaç tanımı, alanın beklediği bilgiyi tarayıcıya doğrudan söyleyen bir niteliktir. Ad, soyad, e-posta, telefon, adres satırı, ilçe ve posta kodu için ayrı tanımlar vardır. Form eklentisinde bu seçenek yoksa nitelik yazılım ekibince alana eklenir.
Otomatik doldurulan bilgi, ziyaretçinin elle yazdığı biçimden farklı olabilir. Telefon numarası boşluklu, ülke koduyla ya da başında sıfır olmadan gelebilir. Formun denetim kuralı bu yazılışların hepsini kabul eder ve kayıtta tek biçime çevirir. Hata iletisi sorunlu alanın altında düz yazıyla belirir; renk tek başına kullanılmaz. Hatalı bir gönderimde formdaki öteki bilgiler silinmez.
Spam gönderimlerini ayırmak için formlara ziyaretçinin görmediği gizli alanlar konabilir. Tarayıcı bu alanları da doldurursa gerçek bir ziyaretçinin gönderimi spam sayılabilir. Bu yüzden gizli alanlarda otomatik doldurma kapatılır. Doğrulama kodu istenen alanlar için ayrı bir amaç tanımı vardır; bazı telefonlar kısa mesajla gelen kodu bu alana önerir. Kart bilgisi ve parola alanları da kendi amaç tanımlarıyla işaretlenir; tarayıcı bunları ayrı kayıtlardan önerir.
Deneme, kayıtlı bilgileri olan tarayıcılarla telefonda ve masaüstünde yapılır. Her alana doğru bilginin yazıldığı ve hiçbir alanın boş ya da yanlış dolmadığı kontrol edilir. Form gönderimleri GA4’te anahtar etkinlik olarak ölçülür; düzeltmeden önceki ve sonraki gönderimler karşılaştırılır. Web tasarım ile yazılım tek ekipte yürütüldüğü için form alanlarındaki nitelikler tasarım değişiklikleriyle birlikte güncellenir.
Henüz İçeriği Olmayan Bölümler Sitede Nasıl Gösterilir?
Henüz içeriği olmayan bölüm, sitenin planında yer alan ama metni ya da kaydı hazır olmayan bölümdür. Blog, referanslar, sık sorulan sorular ya da yeni bir hizmet sayfası bu durumda olabilir. Web tasarım aşamasında her boş bölüm için üç yoldan biri seçilir. Bölüm gizlenebilir, gerçek bilgiyle kısa bir sayfa olarak yayımlanabilir ya da içerik gelene kadar hiç açılmayabilir.
Boş ya da yalnızca “Çok yakında” yazan bir sayfa yayımlandığında sunucu yine başarılı yanıt döndürür. Google, ana içeriği bulunmayan bu sayfaları yumuşak 404 olarak değerlendirebilir. Yumuşak 404, sayfa açıldığı hâlde ziyaretçiye içerik sunulmaması durumudur. Search Console bu sayfaları Sayfa dizine ekleme raporunda ayrı bir başlık altında gösterir; sayfalar genellikle dizine alınmaz.
Gizlenecek bölüm WordPress’te taslak olarak tutulur. Taslak sayfa ziyaretçiye açılmaz ve site haritasına girmez. Bölüme giden bağlantılar menüden, sayfa altından ve öteki sayfaların metinlerinden çıkarılır. Ana sayfadaki son yazılar ya da referanslar listesi boşsa o liste de gizlenir. İçi boş kategori ve etiket sayfaları açılmaz; açılmışsa SEO eklentisinin ayarlarıyla dizin dışında bırakılır.
Bölümün menüde görünmesi gerekiyorsa sayfa gerçek bilgilerle açılır. Sayfada bölümün neyi kapsayacağı, şimdiden okunabilecek ilgili sayfalara bağlantılar ve iletişim yolu yer alır. İçerik tamamlanana kadar sayfaya noindex eklenir; bu, SEO eklentisinin sayfa ayarlarındaki tek bir seçenekle yapılır. Noindex, Google’dan sayfayı dizinine eklememesini isteyen etikettir. Bu sayfa XML site haritasına konmaz; site haritası yalnızca dizine alınması istenen adresleri taşır.
Hazır temalar örnek yazılar, örnek görseller ve yer tutucu metinlerle gelir. WordPress de kurulumda kendiliğinden bir örnek yazı ve bir örnek sayfa oluşturur. Bu içerikler yayına çıkmadan önce silinir. Silmeden sonra sitede temanın örnek telefon numarası, örnek adresi ve Latince dolgu metni aranır. Görsellerin alternatif metinleri de örnek içerikten kalmış olabileceği için ayrıca okunur.
İçerik hazır olduğunda sayfa yayımlanır ya da üzerindeki noindex kaldırılır. Sayfa menüye ve site haritasına eklenir; ilgili sayfalardan ona bağlantı verilir. Ardından URL denetimi aracından sayfa için dizine ekleme isteği gönderilir. Birkaç gün sonra Sayfa dizine ekleme raporunda sayfanın durumuna bakılır. Sayfa dizine eklenmiş görünüyorsa bölümün açılışı tamamlanır. Bu adımlar sizin onayınızla aylık iş listesinde sırayla uygulanır.
Fotoğraflarda Görünen Kişiler İçin İzin Nasıl Alınır?
Sitede yayımlanan fotoğraflarda çalışanlar, etkinlik katılımcıları ya da arka planda tanınabilen kişiler bulunabilir. Web tasarım sürecinde bu fotoğrafların her biri, yayımlanmadan önce bir izin kaydıyla eşleştirilir. İzin kaydı olmayan fotoğraf siteye yüklenmez. Süreç dört adımdan oluşur: iznin istenmesi, kaydın yazılması, kaydın saklanması ve iznin geri alınması. Bu adımlar sürecin site tarafını kapsar; hukuki koşulları belirlemez.
İzin istenirken kişiye önce fotoğrafın kendisi gösterilir. Ardından fotoğrafın nerede kullanılacağı söylenir: sitenin hangi sayfaları, hangi sosyal medya hesapları ya da basılı malzemeler. Kullanım süresi ve iznin nasıl geri alınacağı da baştan belirtilir. Kayıt yalnızca bu fotoğrafları ve bu yerleri kapsayacak biçimde yazılır. Aynı fotoğraf sonradan başka bir yerde kullanılacaksa kişiye yeniden sorulur.
İzin yazılı olarak alınır: imzalı bir form ya da kişinin kendi e-posta adresinden gönderdiği onay. Kayıtta kişinin adı, fotoğraf dosyalarının adları, kullanım yerleri, başlangıç günü, süre ve iletişim adresi yer alır. İzin belgeleri sitenin medya kütüphanesine yüklenmez; oraya yüklenen dosya, adresini bilen herkes tarafından açılabilir. Belgeler erişimi sınırlı ayrı bir klasörde saklanır.
Her fotoğraf bir çizelgede ilgili izin kaydına bağlanır. Böylece sitedeki bir fotoğrafın hangi izne dayandığı tek satırda görülür. İzni alınamayan biri arka planda tanınabiliyorsa üç yol vardır. Fotoğraf kırpılır, yüz bulanıklaştırılır ya da başka bir fotoğraf seçilir. Hazır görsel sitelerinden alınan fotoğraflarda kişi izni lisans koşullarında belirtilir; lisans belgesi de saklanır.
Fotoğraf dosyası, çekildiği yerin konum bilgisini ve cihaz bilgilerini taşıyabilir. Bu bilgiler dosya siteye yüklenmeden önce silinir. Dosya adı ve alternatif metin, kişinin adını yalnızca kişi bunu kabul ettiyse içerir. Alternatif metin, ekran okuyucuların görselin yerine seslendirdiği kısa açıklamadır; görselde ne olduğunu anlatır. Fotoğrafın altındaki açıklama yazısında da aynı kural uygulanır.
İzin geri alındığında fotoğraf önce sayfalardan, sonra medya kütüphanesinden silinir. Yalnızca sayfadan kaldırılan dosya kendi adresinde açılmaya devam eder. WordPress’in ürettiği farklı boyutlu kopyalar da kütüphaneden silmeyle birlikte kaldırılır. Ardından site önbelleği ve CDN temizlenir. Search Console’daki Kaldırmalar aracıyla görselin adresi arama sonuçlarından geçici olarak gizlenebilir. Silme günü izin kaydına eklenir.
Alt menüdeki telefon düğmesine kaç kez dokunulduğunu GA4’te nasıl görebilirim?
Telefon bağlantılarına dokunma, GA4’ün otomatik ölçümlerinde ayrı bir etkinlik olarak kaydedilmeyebilir. Google Etiket Yöneticisi’nde bu bağlantıya dokunulduğunda çalışan bir etkinlik tanımlayın ve GA4’e gönderin. Etkinliği anahtar etkinlik olarak işaretlerseniz dokunma sayıları Etkinlikler ve Anahtar etkinlikler raporlarında görünür.
Formumda otomatik doldurulan alanlar renkli bir zeminle görünüyor; bu rengi değiştirebilir miyim?
Bu zemin, alanı tarayıcının doldurduğunu gösteren işarettir. Rengi sitenin stil kurallarıyla sınırlı ölçüde değiştirebilirsiniz; tarayıcılar bu konuda farklı davranır. Değişiklikten sonra alandaki yazının zeminden ayırt edildiğini açık ve koyu temada deneyin. İşaret tamamen kaldırılırsa ziyaretçi hangi alanın doldurulduğunu ayırt edemez.
Temanın örnek sayfaları hâlâ Google’da çıkıyor; bunları nasıl temizlerim?
Örnek sayfaları ve yazıları WordPress’te çöp kutusuna taşıyıp kalıcı olarak silin. Silinen adresler 404 hatası verir; Google bu adresleri yeniden taradığında dizinden çıkarır. Bir örnek sayfanın sitenizde gerçek bir karşılığı varsa adresi o sayfaya 301 yönlendirmeyle bağlayın. Durumu Sayfa dizine ekleme raporundan izleyin.
Fotoğraf dosyasındaki konum bilgisini yüklemeden önce nasıl silebilirim?
Windows’ta dosyaya sağ tıklayıp Özellikler penceresini açın. Ayrıntılar sekmesinin altındaki özellikleri ve kişisel bilgileri kaldırma bağlantısıyla konum ve cihaz bilgilerini silebilirsiniz. Telefonda kameranın konum kaydı ayarı kapatılırsa yeni fotoğraflar bu bilgiyi taşımaz. Silme işleminden sonra dosyanın özelliklerine yeniden bakın.