Yazar: Volkan Görgülü | Yayın Tarihi: 12 Ağustos 2008 | Yorumlar: 27 Yorum
Kategori: Röportajlar

Merhaba arkadaşlar, Fatih Turan, Selçuk Koyuncu ve Süleyman Sönmez ile yaptığım röportajlardan sonra CSS-Tricks‘den Chris Coyier ile yaptığım röportaja hoşgeldiniz.

Aslında Chris ile Skype üzerinden röportaj yapmaya başlamıştık ama açıkçası çok zorlandım ve röportajı tamamlayamadım Çünkü o an hem Chris’i anlamaya çalışıyordum ve aynı anda bir sonraki sorumun telafuzuna kendimi hazırlıyordum ama dediğim gibi çok zorlandım. Chris’de bunu anlayışla karşıladı ve kendisine soruları e-posta ile gönderebileceğimi söyledi.

Okuyacağınız bu röportajda CSS-Tricks’den, Script & Style‘a, anlamlı HTML etiketleri kullanarak kod geliştirmekten, jQuery kullanımına kadar bir çok konu var. Faydalı olması dileği ile

Röportaj

Chris, CSS Tricks (Hileleri) fikri nereden çıktı? Planladıklarını yapabildin mi ve CSS Tricks için geleceğe dair planların nelerdir?

CSS’yi öğrenmeye başladığımda, çok fazla yeni bilgiyi çok hızlı bir şekilde öğreniyordum. Başka web sitelerinden bir çok bilgi ediniyordum, işte o zamanlarda fikir bir anda oluşuverdi. Ben de kendime bir websitesi açıp, öğrendiklerimi paylaşabilirdim.

Site, öğrendiğim teknikleri yazıya döktüğüm, sıkıştığımda dönüp bakabileceğim güzel bir kaynak haline geldi ve yazılarımı eğitici bir formatta yazıyordum. Bir bilgiyi öğretirken (ya da öğretmeye çalışırken), siz o konuda kendinizi çok daha fazla geliştiriyorsunuz.

Bugüne kadar aslında yaptığım bu ve devam etmeyi planlıyorum, yazı yazmak ya da video çekmek veya hangi formatta olursa olsun.

Peki Chris, sana başka bir soru sormak istiyorum, CSS-Tricks’i Türkiyeden kaç kişi ziyaret ediyor?

Şimdi baktım ve görünüşe göre trafiğimin %1′i Türkiye’den geliyor. Bana sorarsanız, Türkiye’ye hiç gelmediğimi ve Türkçe yazılar yayınlamadığımı düşünürseniz, bu gayet iyi bir oran.

Chris, eskiden sende bir çok geliştirici gibi tablolu kodlama mı yapıyordun?

Evet, tablolu kodlama ile başladım ama aslında şöyle oldu, ilk bir kaç websitemde HTML için Photoshopu kullandım, Photoshop’un önceki sürümlerinde direk tasarımı HTML olarak kaydedebilme özelliği vardı ve direk size tablolar ve resimler ile dolu bir HTML dosyası oluşturuyordu, şimdi düşününce çok komik geliyor aslında.

Sonra ne oldu ve CSS’yi öğrenmeye başladın? Tablolu kod geliştirmeye dair bilgilerin var ise onlardan nasıl kurtuldun ve yeni bilgileri öğrendin?

Ben diğerleri gibi tablolu kod kullanarak onlarca web sitesi geliştirmedim ve dolayısı ile CSS’yi öğrenmek için tablolu kod geliştirme alışkanlığını unutmaya çalışma gibi bir durumum olmadı.

Web Tasarımcısı olmaya karar verdiğimde heryerde CSS’den bahsediliyordu, bende o yolda devam ettim ve çabucak öğrendim.

Beni en çok CSS’nin background-image (arkaplan resmi) özelliği etkiledi, çünkü bu özellik sayesinde önceden yaptığım herşeyi yapabiliyordum ama birde resimlerin üzerine metin yazabiliyordum

Nasıl pratik yapma imkanı buluyordun, o zamanlar CSS-Tricks’in Ekran Çekimleri yoktu?

Çalıştığım yerde çok fazla pratik yapma imkanım oluyordu. Bir çok müşterimiz vardı ve web ile ilgilenen bir tek bendim. Devamlı, yayında olan web siteleri üzerinde iyileştirme çalışmaları yapıyordum ve yeni müşteriler için yeni web siteleri üzerinde çalışıyordum. Kısacası pratik bilgilerimin çoğu bahsettiğim işteki tecrübelerimden geliyor.

Peki içerik ve sunumu ayırmanın faydasını yani anlamlı HTML etiketleri kullanmanın faydaları üzerine söylemek istediklerin neler? Bize gerçek dünyadan birkaç örnek verebilirmisin?

Ben anlamlı kod geliştirmeyi, web sitesindeki bir içeriği tanımlamak için kullanabileceğiniz en iyi HTML etiketini kullanmak olarak düşünüyorum. Bunu yapmanın avantajları çok büyük, bir paragrafa kesinlikle sığdıramam, fakat işte size gerçek dünyadan bir örnek.

Eğer çok yoğun bir web geliştiricisiyseniz ve günde 5-10 web sitesi ile uğraşıyorsanız, bir web sitesinden diğerine geçiş yaparken, yeni web sitesine alışma süreciniz, eğer anlamlı ve organize bir format ile geliştirildi ise, çok kısa oluyor. Böylelikle zaman kazanmış oluyorsunuz, uzun bir alışma süreci geçirmiyorsunuz, sadece bu bile herşeyi en baştan doğru yaparken harcadığınız zamana değer.

Halen tablolu kod kullanan geliştiricilere buradan bir mesaj göndermek istiyormusun?

Tabiki, DURUN. Günümüz webinde bir siteyi tablolu kodlar kullanarak geliştirmek, tamamen zaman ve emek kaybı. Günümüz internet tarayıcılarında CSS desteği çok sağlam. Tamam, bazı sorunlar oluyor ama bunlar çok küçük ve başa çıkması çok kolay. Eğer CSS, MSNBC, Digg, BBC, Yahoo ve AOL için yeterince iyi ise, sizin için de yeterince iyidir

Makalen “What a good HTML looks like (Doğru bir HTML dosyası örneği)” aslında bize içeriği, sunumu ve etkileşimi ayırmak hakkında pek çok bilgi veriyor. Ben geliştiricilerin bu ayrımın önemini anladıklarında, XHTML ve CSS kullanmada daha hakimleşeceklerini düşünüyorum.

Evet, anlamlı kodlar kullanarak HTML geliştirmenin tüm güzelliği, içerik, tasarım ve etkileşimin ayrılması. Bir web sitesinin yeniden tasarlanma zamanı geldiğinde, bu ayrım konusunda iyi bir iş çıkardıysanız, yeniden tasarım süreci çok kolay geçecektir. İşimde önümüzdeki yılın bir an evvel gelmesini bu sebepten dolayı çok istiyorum.

Bir çok müşterimiz için yeni tasarım sürecine gireceğiz ve biliyorumki bu süreç çok kolay geçecek çünkü 1 senedir tüm sitelerin kodlarını temizlemek ve belirlediğim yüksek kalite standardına ulaştırmak için çabalıyorum.

Bence jQuery bilgisi, XHTML ve CSS bilgilerinin yanına çok yakışıyor. Sen de benim gibi mi düşünüyorsun?

Kesinlikle. jQuery’inin tasarımcılara çok çekici gelmesinin sebebi şu, eğer CSS’yi biliyorlarsa, jQuery’yi öğrenme sürecinin çok kısa olması çünkü jQuery, CSS ile aynı seçicileri kullanıyor.

Sayfadaki bir elemanın tıklandığında yok olmasını sağlamak gibi bir tanımlamayı, yapmayı öğrenmek neredeyse hiç zamanınızı almıyor. Bu bahsettiğim tanımlamayı yapmanın kodu çok kısa ve son derece İngilizce

Bildiğim kadarı ile jQuery ve MooTools birer JavaScript kütüphanesi, aralarındaki farklar arasında bizlere neler söyleyebilirsin?

Evet, jQuery bir çok JavaScript kütüphanesi seçeneğinden sadece bir tanesi. Diğerleri hakkında çok fazla bir bilgim yok, dolayısı ile aralarında karşılaştırma yapabilecek kişi ben değilim.

Ama biliyorumki jQuery, CSS seçicilerini kullanan tek kütüphane. Ve duyduklarıma göre jQuery çok hafif ve diğer kütüphaneler ile gerektiğinde kolay bir şekilde kullanılabiliyor.

Aslında MooTools için de söyleyebileceğim bir şey var, bence MooTools ile tanımlanan animasyonlar çok daha hoş gözüküyor, ya da en azından benim gözüme öyle geliyor

Peki bize yeni websiten Script & Style hakkında biraz bilgi vermek istermisin?

Hep bir kominite bağlantıları kısmı açmak istemişimdir CSS-Tricks’de. Fakat sonra arkadaşım David bunun için ayrı bir site yapma fikri ile geldi ve bende bir çok açıdan çok mantıklı buldum. Aslında tüm mesele, komünitenin web üzerinde herhangi bir sitede, tasarımcılar ve geliştiricileri ilgilendiren bir yazıya rastladıklarında bunu gönderebilmeleri. Sonra gönderimler kalite amaçlı kontrole tabi tutuluyor ve yayınlanıyorlar. Böylelikle gün içinde insanların inceleyebilecekleri bir çok kaliteli yazı bir sayfada toplanıyor. Arşiv büyüdükçe, gelip faydalı makaleleri bulabileceğimiz bir kaynak haline gelecek.

CSS-Tricks’de gelecek günlerde bizleri neler bekliyor?

Yazılar yazmaya, kaliteli işleri derlemeye ve ekran kayıtlarına devam etmeyi düşünüyorum. Sitelerin radikal değişiklikler ile değilde sağlam adımlarla geliştirilmesinden yanayım. Bu nedenle önümüzdeki sene sitenin tasarımını geliştiriyor, yeni alanlar açıyor ve yeni projeler üzerinde çalışıyor olacağım. CSS Tricks’de neler olacağını görmek istiyorsanız, takip etmeye devam edin!

Benden bir forum açmamı isteyen bir çok ziyaretçim var bana önerilerde bulunmak istermisin?

Biliyormusun, forum konusunda çok mutluyum, çünkü siteme çok kolay ekleyebildim ve çok güzel gelişti herşey. Tüm yaptığım phpBB yi /forum klasörüne yüklemek ve tasarımı mevcut siteme göre düzenlemekti. Herşeyi olabildiğince çok basit yapmak istedim ve sadece 3 kategori açtım. phpBB gerçekten çok iyi. Harika bir arayüzü var, yönetimi kolay, yüklemesi kolay.

Aslında forumu açmamın sebebi, e-posta aracılığı ile insanlara verdiğim destekti. Yardımcı olmayı seviyorum ama herkese teker teker yardım etmek çok fazla zamanımı almaya başlamıştı. Artık, yardım isteyen e-postalar aldığımda, onları forumuma yönlendiriyorum.

Yanlış anlama insanları başımdan savmaya çalışmıyorum, sadece sorularına forumda cevap vermek istiyorum, böylece başka insanlarda, isterlerse cevap verebilirler ya da sunulan çözümden faydalanabilirler.

Ben bir forum aç derim! Forumun bir komünite oluşturmada büyük faydası var.

Çok teşekkürler Chris

Teşekkürler Volkan

The Original Interview

Chris, how did you have the idea of CSS Tricks, have you achieved what you have planned, and what are your plans for the future of CSS-Tricks?

When I first started learning CSS, I was learning a lot and I was learning fast. I was getting a lot from other websites, so the idea just kind of clicked to start my own website where I could share what I was learning.

It became a good place for me to document tricks I was learning for self-reference, but I wrote much of it up and a tutorial format. When you teach something (or attempt to) you learn it on a much deep level yourself.

That is what I’m still doing to this day, and plan to continue to do, be it in writing or in video or whatever other form takes shape.

So Chris, first of all I want to ask you a another question about the number of visits which comes from Turkey

I just took a look at and it looks like about 1% of my traffic comes from Turkey! I’d say that’s a pretty good percentage being that I’ve never even been to Turkey and don’t write in Turkish =)

Okey, Chris I think back in the day like everybody else you were developing tabled markup?

I did start designing with tables… but only in that my first few sites were probably just designed completely in Photoshop, “sliced” and then exported to HTML. Earlier versions of Photoshop let you straight up save out to HTML, which were just tables jammed with images. Kinda funny now, really.

Than what happened and you started to learn CSS, I mean, how you decided to unlearn all that knowledge, all those skills and learn something new?

I’m not like many others in that I didn’t design tons and tons of sites with tables and then need to fight those habits to learn CSS.

CSS was already heavily on the scene when I was starting to be a web designer, so I learned quickly that it was the way to go.

I give credit to the “background-image” property of CSS to being the one that really got me hooked. I was able to do anything I could do before, only I could put actual text on top now =)

How did you practice? back in the days there were no screencast of CSSTricks?

Practice mostly comes through work. We have lots of clients and I’m the sole web guy. I am constantly working on existing sites, make them better, and then working on new sites for new clients. Pretty much all of my practice comes from those experiences.

What can you tell us about the benefits of seperating content and presentation. Can you give us some examples from the real world?

I think of semantics as using the best possible HTML tags as you possibly can to describe what the content is on a web page. The benefits for doing this are huge, and too much to get into in a single paragraph, but here is an example from the real world.

If you are a busy web developer and are in and out of 5-10 websites a day (like many are) you will find it much, much easier to re-acquaint yourself quickly to the site you are currently working on if the site was coded with good formatting and semantics. These time-savings alone are worth the time it takes to do it right up front.

Do you want to give a message to all those people who still use tables?

Sure. Stop. It is simply just a waste of time and effort in today’s web world to design a new site with tables. CSS Support in browsers today is solid. Yes, there are quirks, but they are minor and not too difficult to handle. If CSS is good enough for MSNBC, Digg, BBC, Yahoo, and AOL, it’s good enough for you =)

Your article What a good HTML looks like tells us a lot about seperating the content, the presentation and the behaviour, I think when people get this ideas of seperation they will understand why they need to use XHTML, CSS

Yep, that’s the real beauty of doing good semantic coding, is the seperating between content, design, and behavior. When it comes time to redesign a site, if you did a good job of seperating these things, the redesign will be easy.  I’m really looking forward to this next year at work for this very reason.

When we head in to refresh the designs for many of our clients, I know it’s going to be a breeze because I’ve spent the last year getting all these sites cleaning up their code and getting it to the high quality standard I set.

I think the knowledge of JQuery works great with XHTML and CSS, Do you agree?

Absolutely. What makes jQuery so attractive to designer-types is that it uses the same selectors as CSS does, so the learning curve is a lot shorter.

It hardly takes any time at all to learn how to do something fairly simple like target an element on the page and have it fade away when it’s clicked on. The syntax for something like that is very short and “plain English”.

As far as I know JQuery and MooTools are both a javascript library, what can you tell us about the differences between them?

Yes, jQuery is just one of many choices in JavaScript libraries. I don’t know very much at all about any of the others, so I am not the person to ask about an in-depth comparison.

I do know that jQuery is the only one that uses the CSS selectors. I also hear that it’s the lightest weight and plays well with other libraries if need be.

One thing I can say for MooTools though, is that is seems like the animations done with MooTools are much smoother, at least to my eye.

Would you like to tell us a little bit about your new web site Script & Style?

I’ve always wanted to have a “community links” section on CSS-Tricks. But then my friend David came to me with the idea of doing it on a seperate site and it seemed to make sense for a lot of reasons. The idea is that the entire community can submit articles they find around the web that are of interest to designers and developers. Then the submissions are moderated for quality and then published. So there is a stream of links throughout the day for people to check out. As the archive grows, it will become a good place to come and search for articles as well.

What is the future of CSS-Tricks what will happen what is waiting us?

There is always stuff coming down the line… but  most importantly, more of the same!  I plan to continue writing tutorials and rounding up good stuff and shooting the screencasts. I’m a big fan of evolving websites slowly instead of big radical changes. So over the next year I’m sure I will be evolving the design of the site, releasing new areas, and working on new projects. You’ll just have to stay tuned to CSS-Tricks to see what happens!

I am thinking of opening a forum like you did in CSS Tricks, what do you recommend

I’m happy to say that the forums were one of the easiest things I’ve ever added to the site and they have gone very well. All I did was install phpBB in the /forums directory of my site and then wrap the design in the “skin” of the site that I had already created. I wanted to make it as simple as possible, hence only the three categories. phpBB has been great. Nice interface, easy administration, easy install.

The reason I did it in the first place was all the email support I was giving people. I love to help out, but it was becoming an awful lot of work just to help out single people. So now, when I get emails asking for help, I can direct them to my forums for help instead.

I’m not trying to get rid of people, I just want to answer their questions on the forum instead so that other people can have the chance to pop in and help as well and others can benefit from the solution. So I’d say go for it! A forum can really help build a community.

Thanks for joining us today

Thank you Volkan!

Başka bir paylaşımımı inceleyebilirsiniz

« EBGBVS – Bölüm 2 – Video 1

Twitter Nedir? Ne değildir? »