İ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
Bu güzel yazı ile blogumun ilk değerli konuğunu da ağırlamış olduk. :)
Yaklaşık 2 hafta süren bu güzel süreç ve Arslania için ayırdığı onlarca saatten dolayı bir kez de buradan teşekkür etmek istiyorum. Kendi sitene gösterdiğin ilgi gibi özenerek yapmış olduğun bir çalışma daha :)
Nice güzel projelerde ve çalışmalarda beraber olmak dileğiyle :)
Çok güzel bir anlatım olmuş ,
Klavyene sağlık .
Oyy yeni tema hayırlı uğurlu olsun. Blogunda paralanır inş.ltd.şti :)
Ayrıca ayıp yaa ben de yazacağım! :)
Teşekkür ederim Tuğba’cım. Seni kaybolmaya davet ediyorum. http://www.arslania.com/kayip Kaybol :))
evet bu temayı bende bekliyordum :) çok sevindim yeni temana çok güzel bir tema süper bir tasarım :) eline sağlık… gözlerim açıldı :D
Yeni teman güzel Hüseyin Emanet’in kodlamasıyla güzel iş çıkarmışsınız yeni temanla başarılar dilerim
Ali veya Hüseyin. Gözünüzü seveyim büyültün şu yazıları. Monitöre yapışacam. :D
İsmal biz de sıkıntı yok abi nasıl ufak sende böyle ya :)
Güzel yorumlarınız için teşekkürler arkadaşlar :)
@Usluer, Ben çok rahat okuyabiliyorum yazıları. Aslında temanın tasarımcısıyla konuştuktan sonra bu konuya karar vermek en mantıklısı sanırım. Teşekkür ederim.
Şuana dek gördüğüm en muhteşem tema kesinlikle ama kesinlikle bu olmuş, tebrikler Enes Ateş, tebrikler Hüseyin Emanet ve doğal olarak tebrikler Ali Arslan.
Ancak Usluer’e katılmadan da edemeyeceğim, tek sorunu yazı boyutunun çok fazla küçük olması, bu sorunu da ortadan kaldırırsanız sahiden tadından yenmez.
Alicim gerçekten çok güzel tema . Şevkini kırmamak için eleştirimi yapmayacağım burada. Ben telefondan söylerim sana sonra ;) Eline sağlık Hüseyin ve Ali :)
Enes bekliyorum ;) Yazı büyüklüğü konusunda en uygunu 11px diğer boyutlarda bi dengesizlik oluyor. Bunu Hüseyin’le denedik; ama sizin okuyabilmeniz daha önemli. Uygun bir yapıya getirmek için uğraşacağız. :)
Tebrik ederim,
Gerçekten çok güzel bir tema olmuş,Hatta son zamanlarda gördüğüm en kullanışlı temalardan biri.Emeği geçen herkesin eline sağlık…
Arslania gerçekten görsel ve kullanış yönünden harika bir web site…
Tema gerçekten güzel olmuş hatta gördüğüm en güzel wordpress temalarından diyebilirim. Okuyamayan arkadaşlara önerim CTRL+Scroll’u yukarı doğru oynatmak. :)
çok güzel bi tema olmuş.
Harika! Tek kelimeyle. 404 sayfası da pek bi şirin. :)
Hayırlı olsun hocam :) Yeni ifadeler de daha bi karizmatik duruyo :D
hocam temanız çok güzel olmuş hayırlı olsun. Satışa sunacakmısınız talibiyim :)
Uğurcan, Arslania icin tasarlanan tüm arayuzler satış amaçlı yapılmadığından dolayı satılık değil. Satış durumu söz konusu ise sadece bir tek web sitesine satılır. İlgin icin teşekkürler :)
Temayı paylaşmıcaksın neden burda tanıtım yapıyorsun? satacakcak açıkca söyle kimse ümitlenmesin. Copyrightı silmeyenlere haksızlık oluyor bu tutumunuz.
@okan,
Okan Bey, temayı paylaşırız veya paylaşmayız. O kısmı bizim bileceğimiz iş. Paylaşmayacağımızı zaten yazmışım. Yorum yaparken kullandığınız üsluba biraz özen gösterin, rica ediyorum.
hocam tabiki senin bileceğin iş paylaşıp paylaşmamak çünki emek veren sensin… tabiri caizse bu bazı kızların yaptığı fiile benziyor hani derler ya; annem göster ama elletme dedi. sende paylaşmıcaksın ne diye yazdın tasarımı hadi yazdın madem paylaşmıcaksın neden gösteriyorsun. üstelik ben choprihgt silmeden kullanan bir kullanıcınım :)
Örnek bir dokuman olsun diye yaziyi yazmıştık. Kusura bakmayın yazdigimiz her tema yazısında temayı dagitacagimizi bilmiyorduk.
tema gerçekten güzel Enes arkaşımızın eline sağlık
yazdığım yorum işinize gelmedi sildin :)annem göster ama elletme dedi misali tema yap yayınla sonrada dağıtmıcaz de :) sırf bu tutumunuzdan dolayı bende temanızı kullanmıyorum.
Burada hersey seffaf kimseyi kimseden de ayirmiyoruz. Uslubunuza dikkat ederseniz mutlu olurum.
Tema çok başarılı. İyi günlerde kullanın.
Temanız çok güzel. Okanın yazdıkları benim sinirimi bozu. Çok gereksiz konuşuyor. İnsanlar kendisi kullanmak için tema yapma hakkına sahip. Dağıtması gerektiğine nereden karar veriyor ve ahkam kesiyor anlamıyorum. Neyse çok gıcık oldum bu arkadaşa. Başarılar diliyorum temanızda tekrar.
Yeni temanız gerçekten çok başarılı. Tebrik ederim.
Güzel tema pastel tonlar ağırlıkta arkadaşında bahsettiği gibi yazı biraz daha büyük olsaydı daha rahat okunabilirdi yine okunmakta ama sitenin tamamına hakim olan açık tok yazıdaki okunabilirliği azaltmakta :) başarılar daim olsun arkadaşlar.
Hocam tema çok açık renk gri olmuş, okuldaki bilgisayarda neredeyse yazılar görünmüyor :) CSS’den bunu halledebilme şansımız var mıdır yoksa direk tasarım resimleriyle mi oynamam gerekiyor?
Arslania v1 kullanıyordum. Yeni tema çıktı diye görünce de inanılmaz sevinmiştim. Lakin paylaşılmıyormuş içimde kaldı doğrusu. Grafiksel arayüzü oldukça hoş olmuş. İyi çalışıldığı aşikar. Internette yüzlerce tema olmasına rağmen hiçbiri beklediğimiz gibi değil. Benim gibi bu tarz işlerden anlamayan arkadaşlar için de herkese açık bir çalışma yapabilirseniz mest oluruz doğrusu. Emekleriniz değer görsün. Tebriklerimle.
Yeni Teman hayırlı olsun Ali :)
temanız hayırlı olsun. Slideshow olarak kullandığınız modülün tam olarak adı nedir *
@Fahri,
O bir modül değil. Manuel olarak değiştirilebilen ve herhangi bir yerle bağlantısı olmayan bağımsız bir yapı.
gerçekten hoş ama fontlarda mı sıkınt var desem ya da demesem,daha iyisini yapamadan eleştirmek olmaz :)