Yeni Tema: Arslania v2

Arslania v2

İlk defa bir blogda konuk yazar olarak bulunmanın vermiş olduğu heyecan ile sizlere “Arslania v2” adını verdiğimiz tasarımın anatomisini aktaracağım.

Malum, bir önceki yazıdan da anlayabileceğiniz üzere yaklaşık olarak 1 yıl önce Enes Ateş tarafından tasarımı yapılan Arslania v2 temasının, Erhan Yakut tarafından kodlama ve WordPress entegrasyon işi yapılacaktı. Ali, WordPress Kitabı‘nı bitirmeden önce sohbet ederken, “Abi senin bu eski tasarım noldu ya? Yalan mı oldu?” falan diye laflıyorduk. Ali de, Erhan Yakut’un çeşitli işleri ve yoğunluğu sebebiyle işin uzadığını söyledi. Ben de “Eğer bir sakıncası yoksa yapabilirim.” dedim. Bu temaya başlamadan önceki temayı da ben kodladığım için Ali sağolsun, işi gözü kapalı teslim etti. Böylece başlamış olduk. Size işin hikaye kısmını değil, kodlarken nelere dikkat ettiğimi, neler kullandığımı ve nacizane tecrübelerimi paylaşacağım…

HTML5 / CSS/ jQuery

HTML5 son günlerde oldukça revaçta bir teknoloji. Gelişmeleri ve bu doğrultudaki makaleleri yakinen takip etsem de henüz elle tutulur, gözle görülür bir proje geliştirdiğim yoktu. Biraz sıradışı olalım, temayı HTML5 ile kodlayalım diye düşündük.

  • HTML5’e geçiş aşamasında değişen onlarca semantik kod ve elementler var. Ufak bir araştırma ile işime yarayan tüm kodlara Smashing Magazine ve Fatih Hayrioğlu’nun şu yazısından ulaştım.
  • Malum tarayıcı Internet Explorer’ın genel anlamda HTML5 desteği sunmaması, beraberinde ek arayışlar getirdi. Remy Sharp‘ın blogundaki şu script işimi gördü.
  • Internet Explorer 8 altı sürümleri desteklemesi için herhangi bir girişimde bulunmadım. Kontrol ettim, ancak herhangi bir düzeltme kodu ya da uyarı yapmadım.
  • Internet Explorer 6’yı hiç umursamadım, zira Internet Explorer 6 öldü!
  • SEO odaklı düşündüm ve çeşitli bölümleri buna uygun olarak kodlamaya çalıştım.
  • Font replacement metodu için oldukça uygun bir script olan Cufón‘u kullanmayı tercih ettim. Bu amaca yönelik uygulamalardan biri de @font-face. Ancak @font-face’in bana göre oldukça eksiği bulunuyor. Anti-aliasing problemi yaşatması, @font-face teknolojisini kullanmak istemememin başlıca sebebidir. Bir de lisans sorunları var. Orası apayrı…
  • Sorgu sayısını azaltıp, performansı arttırmak adına tasarımda görebildiğiniz pek çok yerde CSS Sprite tekniğini kullandım.
  • Anasayfada gördüğünüz üzere seçilmiş yazılardan oluşan, jQuery kütüphanesini kullanarak bir manşet uygulaması yazdım.
  • Ali tarafından güzel bir 404 Sayfası tasarlandı.
  • Logonun karşısında gördüğünüz Twitter alanında son gönderileri gösterebilmek için Beyazıt Kölemen’in şuradaki yazısından faydalandım.
  • Bir önceki temada yorumları göstermek için Disqus isimli güzel bir uygulama kullanmıştık. Yeni tasarımın özel ve güzel bir yorum stili olması sebebiyle Disqus eklentisini devre dışı bırakmayı tercih ettik. Yorumların bu hali şimdi daha da güzel oldu bence :)
  • Yorumlar demişken, yazar yorumlarını, normal ziyaretçi yorumlarından daha belirgin hale getirmek için ufak bir WordPress hilesi yaptım. Böylece yazarın ve editör(lerin)ün yorumları, normal kullanıcılardan daha farklı görünüyor. Bunu yapmak istememin başlıca sebebi şudur: Yorumlarda Ali’ye birçok soru ve istek geliyor. Ali tarafından verilen cevaplar da önemli olduğundan ve Ali’nin yaptığı yorumlar belli olsun diye bu hileyi uyguladım.
  • Tasarımın tamamlandığı günlerde, sosyal medyada tasarımdan görüntüler verilmişti. Eğer hatırlayan arkadaşlar varsa, tasarımda bir de Araçlar sayfası bulunuyordu. Bu sayfa da hazır, ancak bazı düzenlemeler gerektirdiği için şimdilik yayına almadık. Önümüzdeki günlerde neler olur bilmiyorum.

Eski Tema

Bir önceki tema hakkında da söylemek istediğim bazı şeyler var. Bu konuda çok fazla istek ve soru yöneltildiği için buna da değinmeyi düşündüm. Eski temayı yayınlamayı düşünmedik değil. Bir ara dağıtmak için girişimde bulunacaktık. Ancak sonradan bunun uygun olmayacağını düşündük. Tasarımda kullanılan logolar, grafikler vs. birçok bölüm CSS Sprite tekniği ile çağrıldığı için tema üzerindeki grafikleri değiştirmemiz ve dosyalarda düzenlemeler yapmamız gerekiyordu ve bu işlem zamanımızı alacaktı. Yani genel dağıtıma pek müsait değildi tema.

Bir de birçok arkadaşın bildiği copyright kısımlarına genelde bizim Türk insanımız müdahele etmeyi kendine meziyet olarak gördüğü için temayı dağıtmaktan vazgeçtik. –“Copyrightı siliyorum, hakkını helal et!” diye e-posta gönderen arkadaşlarımız var- Belki ileride ortak bir tasarım yapılırsa bunu ücretsiz olarak dağıtabiliriz, neden olmasın.

Son Olarak…

Konuya dipnot olarak şunları eklemek istiyorum. Aslında ben bu yazıyı hazırlamayacaktım. Ancak bir önceki yazıda Ali’nin emrivâki yapması yazmama neden oldu. “Yaz abi! Bilmeyenler, öğrenmek isteyenler için kaynak olur.” dediği için ve de haklı olduğu için yazmayı tercih ettim. Bu doğrultuda sorusu olan arkadaşlar için yardımcı olmaya her zaman hazırım.

Şimdilik görüşmek üzere, hoşçakalın…

Saygılarımla,
Hüseyin Emanet

37 yorum

This site uses Akismet to reduce spam. Learn how your comment data is processed.