Tasarım Yönü
Tasarım Yönü adımı, Tema Oluşturucu'nun (Theme Builder) tüm temayı oluşturmasından önce temanızın görsel tasarımını incelemenize, düzenlemenize ve son haline getirmenize olanak tanır.
Genel Bakış
Keşif Görüşmesi'ni (Discovery Interview) tamamladıktan sonra, Tema Oluşturucu size masaüstü ve mobil önizleme ile tasarım yönünüzü sunar. Bu sayede, temaya geçmeden önce tasarımınızın farklı cihazlarda tam olarak nasıl görüneceğini görebilirsiniz.
Tasarım Yönü Bileşenleri
1. Renk Paleti
Temanızın renk şeması şunları içerir:
- Birincil renk — düğmeler, bağlantılar ve vurgular için kullanılan ana marka rengi
- İkincil renk — çeşitlilik sağlamak için tamamlayıcı renk
- Vurgu rengi — önemli öğeler için dikkat çekici renk
- Nötr renkler — arka planlar ve metinler için gri ve beyaz tonları
- Metin rengi — okunabilirlik için ana metin rengi
2. Tipografi
Şunlar için yazı tipi seçimleri:
- Başlık yazı tipi — sayfa başlıkları ve bölüm başlıklarında kullanılır
- Gövde yazı tipi — paragraf metinleri ve içeriklerde kullanılır
- Yazı boyutları — farklı ekran boyutları için duyarlı boyutlandırma
- Satır yüksekliği — okunabilirlik için satırlar arasındaki boşluk
- Yazı ağırlıkları — kalın, normal ve açık varyasyonlar
3. Düzen ve Boşluk
- Kapsayıcı genişliği — içerik için maksimum genişlik
- İç dolgu ve dış boşluklar (Padding and margins) — öğelerin etrafındaki boşluk
- Izgara sistemi (Grid system) — duyarlı tasarım için sütun düzeni
- Bileşen boşluğu — kullanıcı arayüzü (UI) öğeleri arasındaki mesafe
4. Görsel Öğeler
- Düğme stilleri — birincil, ikincil ve üçüncül düğme tasarımları
- Kart tasarımları — içerik blokları için düzenler
- İkonlar — ikon stili ve boyutlandırması
- Kenarlıklar ve gölgeler — zarif görsel derinlik
- Üzerine gelme efektleri (Hover effects) — etkileşimli durum stillendirmesi
Önizleme Oluşturma (Preview Rendering)
Masaüstü Önizlemesi
Masaüstü önizlemesi, tasarımınızı tam genişlikte (genellikle 1200 piksel veya daha geniş) gösterir:
- Tam navigasyon menüsü
- Tüm sütunlarla birlikte eksiksiz düzen
- Büyük tipografi ve boşluklar
- Tüm görsel öğeler tam boyutta
Mobil Önizlemesi
Mobil önizlemesi, tasarımınızı mobil genişlikte (genellikle 375 piksel) gösterir:
- Duyarlı navigasyon (hamburger menü)
- Tek sütunlu düzen
- Ayarlanmış tipografi ve boşluklar
- Dokunmaya uygun düğme boyutları
Duyarlı Kırılma Noktaları (Responsive Breakpoints)
Tema Oluşturucu, önizlemeleri bu kırılma noktalarında oluşturur:
| Cihaz | Genişlik | Önizleme |
|---|---|---|
| Mobil | 375px | Portre telefon |
| Tablet | 768px | Manzara tablet |
| Masaüstü | 1200px | Tam genişlik masaüstü |
| Büyük Masaüstü | 1920px | Ultra geniş ekran |
Tasarımınızı Düzenleme
Ayarlamalar Yapmak
Tasarım yönünüzü şu yollarla düzenleyebilirsiniz:
- Renkleri ayarlama — paletteki herhangi bir rengi değiştirebilirsiniz
- Yazıları değiştirme — farklı yazı tipleri seçebilirsiniz
- Boşluğu değiştirme — iç dolgu ve dış boşlukları ayarlayabilirsiniz
- Düzeni güncelleme — kapsayıcı genişliklerini ve ızgara sütunlarını değiştirebilirsiniz
- Öğeleri özelleştirme — düğme stilleri, kart tasarımları vb. düzenleyebilirsiniz
Önizleme Güncellemeleri
Değişiklikler gerçek zamanlı olarak yansır:
- Masaüstü önizlemesi hemen güncellenir
- Mobil önizlemesi hemen güncellenir
- Tüm duyarlı kırılma noktaları güncellenir
- Değişiklikleri doğrulamak için önizlemeler arasında geçiş yapabilirsiniz
Karşılaştırma Görünümü
Tasarım yönünüzü şunlarla karşılaştırın:
- Orijinal tasarım — neyin değiştiğini görmek için
- Rakip tasarımlar — ilham aldığınız sitelerle karşılaştırmak için
- Önceki versiyonlar — daha önceki tasarım yönlerine geri dönmek için
Tasarım Yönü Onayı
Tasarımınızdan memnun kaldığınızda:
- Her iki önizlemeyi de gözden geçirin — masaüstü ve mobil görünümün iyi olduğundan emin olun
- Tüm renkleri kontrol edin — kontrast ve erişilebilirliği sağlayın
- Tipografiyi test edin — tüm boyutlarda okunabilirliği doğrulayın
- Düzeni onaylayın — boşluk ve hizalamayı kontrol edin
- Tasarımı onaylayın — tema oluşturma işlemine devam edin
Sonraki Adımlar
Tasarım yönünüzü onayladıktan sonra:
- Tema Oluşturucu tüm temanızı oluşturur
- Tema WordPress sitenize kurulur
- WordPress özelleştirici (customizer) kullanarak daha fazla özelleştirme yapabilirsiniz
- Hospitality Menus veya diğer özelliklere geçin
En İyi Uygulamalar
- Gerçek cihazlarda test edin — mümkünse gerçek telefonlar ve tabletler kullanın
- Okunabilirliği kontrol edin — metnin tüm boyutlarda okunabilir olduğundan emin olun
- Kontrastı doğrulayın — erişilebilirlik için Validate Palette Contrast kullanın
- Performansı düşünün — hız için görselleri ve yazı tiplerini optimize edin
- İçerik planlayın — düzenin gerçek içeriğinizle çalışmasını sağlayın
Sorun Giderme
Önizleme Güncellenmiyor
- Sayfayı yenileyin
- Tarayıcı önbelleğini temizleyin
- Farklı bir tarayıcı deneyin
- İnternet bağlantınızı kontrol edin
Renkler Farklı Görünüyor
- Monitör renk ayarlarını kontrol edin
- Farklı cihazlarda deneyin
- Renk kontrastını erişilebilirlik araçlarıyla doğrulayın
- Renk körlüğü simülatörlerini düşünün
Tipografi Sorunları
- Yazı tipi dosyalarının yüklendiğini doğrulayın
- Farklı kırılma noktalarında yazı boyutunu kontrol edin
- Gerçek içerikle test edin
- Okunabilirlik için satır uzunluğunu düşünün
İlgili Belgeler
- Discovery Interview — tasarım bilgilerini toplayın
- Hospitality Menus — yapılandırılmış menü sayfaları oluşturun
- Validate Palette Contrast — renk erişilebilirliğini kontrol edin
- Generate Logo SVG — özel logolar oluşturun