Şimdi ise kullandığım ve etraftan topladığım faydalı LESS mixin’lerini birinin faydası olur diye buraya yazıyorum.

İlk önce Bootstrap;

Twitter’ın CSS framework’ü Bootstrap bir süredir .css dışında LESS dosyayısı olarak dağıtılıyor. Dolayısı ile Bootstrap kulllanmasanız bile less dosyaları içinde işinize yarayacak bir sürü şey var. Özellikle mixins.less dosyası içinde işinize yarayabilecek bir sürü mixin var.

Örneğin aşağıdaki CSS3 mixinleri bu dosyadan. Bu mixinler sayesinde her seferinde satırlarca kod yazmaktan kurtulup tarayıcı desteğinden de ödün vermemiş olacaksınız.

Örnek;

Bootstrap LESS için tıklayın.

Bunun haricinde LESS Elements oldukça popüler ve sık kullanılabilecek mixinleri içeren bir proje.

Buna ek olarak Paul Mist diye bir arkadaş da responsive.less diye birkaç mixin yaratmış. Özellikle responsive web design ile uğraşıyorsanız. Buradaki bir kaç mixin oldukça zaman kazandırabilir.

Örneğin
px tabanlı padding’i %’ye çevirmek için
Yukarı aşağı 10px, yanlar 15px olan 480px genişliğinde bir eleman için

En son olarak da Semantic Grid System adında proje var. Adından da anlaşılacağı üzere HTML5 ve semantik üzerine kurulu bir grid sistemi. Klasik grid sistemlerinin aksine daha temiz bir layout sağlıyor. Üstüne üstlük de responsive!

a

Öncelikle “mobil”; Mobil cihazların gittikçe arttığı bir dünyada mobil cihazlar için sitenizi optimize etmek oldukça mantıklı ama “responsive web design”ın tek hedefi mobil cihazlar değil. Eninde sonunda web sitesinizin mobil bir versiyonu yapıp mobil cihaz kullanıcılarını bu siteye yönlendirebilirsiniz. Veya belki de sitenizi bir uygulama haline getirebilirsiniz. Öyleyse derdimiz ne? Responsive Web Design ile neden uğraşalım?

İşte nedeni;

Uyumlu (adaptive), responsive web siteleri yaratmanın amacı her geçen gün sayısı artan tonla web uyumlu cihaz ve koşulda en iyi kullanıcı deneyimini sunabilmektir. Yoksa yapılması gereken ya da yapması eğlenceli olan bir şey olduğundan, yada modaya uygun olduğundan dolayı değil.

Bugün bir çok mobil tarayıcı aslında “tam web sitelerini” göstermekte oldukça iyi iş yapıyorlar. Ama bu çeşitlilikte sitenize rahatça arkanıza yaslanıp gelen ziyaretçilerin mobil tarayıcılarının web sitenizin “full” tasarımı göstereceğinden emin olamazsınız.

Artık sadece masaüstü web sitelerinin çağı geçti. Web’e bağlanabilen cihazların sayısı ve tipi çoğalmaya ve değişmeye devam ediyor. Dolayısı ise kendilerine web tasarımcı ve web geliştirici diyen bizlerin de bunu göz ardı etmemesi gerekiyor. Daha çevresinin ve şartların farkında olan daha esnek web siteleri ve uygulamaları yapmalıyız.

Herşeyden önce akılda tutulması gereken bir şey varsa o da responsive web design, adaptive layouts,  progressive enhancement gibi afilli kelimelerin özünde önemli olan tek bir şey var “Kullanıcı Deneyimi”.

Responsive Design’ı dert etmenizin en büyük nedenlerinden biri de bu.

a

Starcraft oynayanlar bilir, bilmeyenler içinse Starcraft oyunununda Zerg ırkı kalabalık saldırı ile ünlüdür. Google’da Zerg’leri konu alan bir easter egg yapmış.

Google’a “Zerg Rush” yazdığınız zaman Google’ın “O” ları aynı Starcraft oyununda olduğu gibi her bir yönden arama sonuçlarınıza saldırıyorlar. Tabii sizde bu “O” ların üzerine tıklayarak arama sonuçlarınızı savunabilirsiniz.

a

Bundan yaklaşık bir, bir buçuk sene önce bir çok kişi herkesin uygulamalara geçtiği için web’in

öldüğü konusunda hemfikirdiler.

Apple’ın bugünkü gücünde uygulamaların büyük bir yeri var. Uygulama ekonomisindeki yüksekliş Apple gibi uygulamaları onaylayan dağıtan ve bundan büyük pay alan Apple gibi firmaların gücüne güç kattı.

Ama artık diğerleri de uyandılar ve HTML5 uygulama pazarını tehdit ediyor ve spesifik platformlar (Apple, Android veya RIM) için “Native” uygulamalar kadar zengin, işlevsel web tabanlı uygulamalar yazmalarına olanak vererek içerik üreticilerinin eline tekrar güç veriyor.

Bunların en son örneklerinden biri bilinen oyun Cut The Rope‘un HTML5 sürümü. Cut the Rope şu ana kadar bir web tarayıcı için yazılmış uygulamalar arasında en iyilerden birisi belki de en iyisi.

Cut the Rope ve diğer benzeri uygulamalardaki gelişmneler sayesinde bu durum yakında değişecek.

Cut the Rope’u HTML5 destekleyen mobil bir cihazda denediğiniz zaman “native” sürümü ile arasında neredeyse bir fark olmadığını göreceksiniz. Bu da oyunu WebOS’da Windows Phone dq oynayabileceğiniz anlamına geliyor. Ya da HTML5 destekleyen herhangi bir tarayıcı da oynayabilirsiniz.

• Her ne kadar HTML5 şimdi tamamiyle hazır değilse de üç beş sene içinde “native” uygulamaların büyük kısmının yerine geçecek. Bunların en büyük sebepleri ise:
• HTML5 sadece oyunların değil online yazılımın ve içeriğin daha etkileşimli (interactive) olmasına olanak sağlıyor.
• HTML5 uygulamaları yaratması ve yayınlaması çok daha ucuz çünkü cross-platformlar. Uygulamayı bir kere geliştirebilir ve bütün platformlarda çalıştırabilirsiniz.
• HTML5 ve Javascript uygulamaları geliştirmek büyük çoğunluk geliştiriciler için daha kolay.
• HTML5 uygulamaların yayılması Apple gibi uygulamaları kontrol eden firmaların gücünü azaltacak ve içerik sağlayıcıların gücünü arttıracak.

Cut the Rope yeni bir teknolojini ilk örneklerinden olabilir ama gelecek HTML5′e ait.

a

LESS

Öncelikle SASS. Bence SASS’ın büyük problemi kullanıcı dostu olmamadı ve Ruby gerektirmesi. SASS kullanmak için ilk önce bilgisayarınıza Ruby kurmanız gerekiyor ve .less  dosyalarını komut satırından teker teker derlemeniz gerekiyor. Bana biraz fazla iş gibi gözüktü. Ne de olsa en başından beri CSS’lerimi kendim bir tekst editöründe yazıyorum. CSS’i oturup yazmak varken eden bu fazladan işlere katlanayım ki? Diğer bir kişisel neden ise Ruby’den pek hoşlanmamam. Peki o zaman LESS‘e gelelim, LESS Javascript tabanlı ama uzun süre o da pek ilgimi çekmedi.

İkinci bir neden ise bir çok geliştiricinin programcı olmaması. Programcı olmayan CSS guruları için değişkenler, mixinler ve diğer programlama yapıları pek rahat olmayabilir.

Peki ne değişti. Öncelikle web’in kendisi değişti. Artık fluid, responsive design gibi kelimeler var. CSS dosyaları daha kalabalık ve karmaşık. İkinci bir neden ise LESS’in ve programlarının gelişmesi. Kişisel bir olay da Twitter’ın Bootstrap’inin (ve daha sonra HTML5 Boilerplate’in) içinde bir .less dosyası bulunmasıydı. Bunları görünce konuya biraz daha eğilmeye karar verdim. İçine girdikçe de LESS son derece kullanışlı ve dahası vazgeçilmez bir araç olmaya başladı.

Öncelikle LESS için sayfanın içine gömülmüş bir Javascript derleyici veya Node.js gibi sunucu tarafında bir derleyici de kullanabilirsiniz. Fakat sayfa yüklenirken fazladan hem LESS javascript dosyasını yüklemek hem de bunu işlemek performans açısından çok iyi bir seçim değil. Öte yandan Node.JS kendi sunucunuz halinde pek de rahat bulunabilecek bri kurulum değil. Bu da bizleri LESS programlarına getiriyor. Bunlardan biri SimpleLESS. Mac, Windows ve Linux sürümleri mevcut. Benim şu anda kullandığım bir Mac programı olan LESS.app da diğer bir seçenek. İki program da odukça temiz tasarımlı ve kullanışlılar ve buna ek olarak derlenen CSS dosyalarını minimize de edebiliyorlar.

LESS ile kısa bir tanışma

Peki nedir bu LESS (ve CSS preprocessorlar) ve nasıl çalışır. Ufak bir giriş yapalım. Temel olarak LESS dosyasında CSS’e benzer bir dilde komutlar yazıyorsunuz ve LESS bunu sizin için CSS’e çeviriyor.

Değişkenler;

Değişkenler sık kullanılan özellikleri tek bir yerden yönetmenize izin verirler. Örneğin;

Mixin’ler

Mixin’ler kısaca bir class’ın özelliklerini başka bir class içinde kullanmanıza olanak verirler. Örneğin;

İçiçe Kurallar (Nested Rules)

Fonksiyon ve İşlemler

Buraya kadar LESS’in temel olarak nasıl çalıştığını ve kısaca ne işe yaradığını görmüş oldunuz. Hemen denemeye başlayabilirsiniz. Eminim bir kere kullanmaya başladıktan sonra sizinde hayatınızı kolaylaştıracak.

a

Bu sene endüstrinin büyüklerinden bazıları aramızdan ayrılmaya başladı. Steve Jobs hakkında söylenmemiş bir şey kalmadı. C’nin babası Dennis Ritchie‘de geçen sene aramızdan ayrıldı. Bugün’de Commodore’un kurucu Jack Tramiel öldü.

Aslında bu insanlar hakkında her yerde bir sürü yazı var ama ben gene de Jack hakkında bir kaç satır yazmak istedim. Çünkü Commodore 64′ün hayatımdaki yeri oldukça büyük.

Jack Tramiel’in hayatı oldukça ilginç bir hikaye. Jacek Trzmiel adı ile Polonya’da yahudi bir ailenin cocuğu olarak dünyaya geliyor. Zaman İkinci Dünya Savaşı zamanı, Polonya Hitler’in orduları tarafından işgal ediliyor  ve eninde sonunda milyonlarca insanların gaz odalarında öldürüldüğü Auschwitz toplama kampına gönderilir. 1945 yılında Amerikalılar Auschwitz’i kurtardıkları zaman Jack özgür kalır. Daha sonra da Amerika’ya gider. Amerikan ordusuna yazılır. Orada ofis makinelerinin tamirini öğrenir. Ordudan ayrıldıktan sonra da Amerikan Ordusu’nun verdiği kredi ile Commodore şirketini kurar. Amacı daktilo üreten bir şirket kurmaktır. Jack şirketine Commodore ismini koyar çünkü askeri bir isim aramaktadır ama Amiral, General gibi diğer isimler başkaları tarafından alınmıştır.

Commodore daktilolar üretmek üzere kurulmasına rağmen o sıradaki ekonomik durumlar yüzünden bir süre hesap makineleri ve LED saatler üretir. Daha sonra o efsanevi 1977 yılında (yani Apple II’nin ve Star Wars’un ortaya çıktığı) ilk bilgisayarları olan Commodore PET‘i piyasaya sürer. PET, Apple II ve Radio Shack TSR-80 ile birlikte bilgisayarları bir tüketim ürünü haline getiren kutsal üçlünün bir ayağıdır.

Her ne kadar Commodore PET önemli bir bilgisayar olsa da Jack Tramiel aslında hep bir bilgisayarla hatırlanacak; Efsanevi Commodore 64.

Commodore 64, 1982 yılında piyasaya sürüldü. 64KB gibi o zaman için oldukça cömert bir hafıza ile ortaya çıktı ve çok kısa bir süre içinde PC tarihinin en fazla satan bilgisayar modeli oldu.

Commodore’un ürünleri arasında bir efsanede Amiga. Commodore bugün PC devriminin en önde gelen biri. Jack Tramiel bir anlamda Steve Jobs’ın tam aksiydi. PC’lerin ucuz ve kullanışlı olması gerektiğini düşünüyordu ve zariflik ve güzellik konuları ile pek ilgisi yoktu. Dolayısı ile Commodore 64′te bu görüşü yansıtır bir şekilde gösterişsiz, ucuz ama son derece kullanışlıydı. Uzun süre diğer üreticiler Commodore ile yarışmak için fiyatlarını aşağıya çekip durdular.

En önemlisi Tramiel PC’lerin herkesin ulaşabileceği bir ürün haline gelmesi için yaptıkları. Bir etkinlikte Woz’a (Steve Wozniak) şöyle demiş; “Siz sınıflar için bilgisayarlar yaptınız — ben onları kitleler için ürettim”

Naziler’in toplama kamplarından kurtulan biri için hiç de fena değil.

a

Comodo Secure DNS :

• 8.26.56.26
• 8.20.247.20

Google Public DNS :

• 8.8.8.8
• 8.8.4.4

Level 3 Communications :

• 4.2.2.1
• 4.2.2.2
• 4.2.2.3
• 4.2.2.4
• 4.2.2.5
• 4.2.2.6

OpenDNS :

• 208.67.222.222
• 208.67.220.220

OpenNIC Public DNS Servers :

• 58.6.115.42 (Queensland, Australia)
• 202.83.95.227 (Queensland, Australia)
• 119.31.230.42 (Victoria, Australia)
• 217.79.186.148 (Germany)
• 27.110.120.30 (New Zealand)
• 89.16.173.11 (United Kingdom)
• 216.87.84.211 (Colorado, United States)
• 2001:470:8388:10:0:100:53:20 (Colorado, United States)
• 69.164.208.50 (New Jersey, United States)
• 69.164.211.225 (New Jersey, United States)
• 64.0.55.201 (New York, United States)
• 66.244.95.20 (Indiana, United States)
• 2001:470:1f10:c6::2 (Indiana, United States)
• 72.14.189.120 (Texas, United States)
• 2001:470:1f0f:48e::2 new (Texas, United States)
• 69.164.196.21 (Texas, United States)

DNS Advantage :

• 156.154.70.1
• 156.154.71.1

ScrubIT :

• 67.138.54.100
• 207.225.209.66

a

Steve Jobs’ın “Thoughts on Flash” (Flash Üzerine Düşünceler) adlı yazısında çok güzel bir şekilde anlattığı gibi Apple’ın Flash’ı iPhone’a (ve iPad’e) koymasının altı nedeni var.

1. Flash açık değil
   Flash söylenenlerin aksine açık bir platform değil, tamamen Adobe tarafından kontrol ediliyor. HTML5 ise herkese açık
2. Tüm Web
   iPhone ve iPad’ler çoğu videoyu görüntüleyebilmekte H.264 ve diğer açık kaynakları videolar web’in her yerinde. Artık kimse video için Flash’a muhtaç değil.
3. Güvenilirlik, Güvenlik ve Performans
   Flash’ın güvenlik ve performans sorunları sadece MAC’ler için değil bir çok platformlar için problem.
4. Pil Ömrü
   Web’in mobil bir dünyaya kaydığı zamanlarda pil ömrü çok önemli. Flash ise videoları “decode” ederken çok pil harcıyor.
5. Dokunma
   Flash eski ve dokunmatik ekranlar öncesi bir çağa ait.
6. Üçüncü Partiler
   Bir düşünün Apple iPhone’unuzun üçüncü bir parti bir şirkete  bağımlı olması ne kadar hoşunuza giderdi?

Apple, ta 2007 yılında Flash’ı cihazlarında kullanmayacağını açıklağında bir sürü geliştirici bir şeylerin değiştiğini anlamıştı ve Jobs’ın “Thoughts on Flash” yazısı sadece son darbe oldu.

Aslında Apple sadece ileriyi öngörmüştü. Web’in geleceği artık Flash’ın değil HTML5′in. Flash’ın bir boşluğu doldurduğu dönemler sona erdi. Görevini tamamladı ve tarih sahnesindeki yerini almalı. Geliştiriciler ve tasarımcılar olarak bizim de görevimiz geleceği benimsemek. Artık HTML5′in Flash’ın yapabildiği bir şeyi yapmama durumu yok.

Geleceğe adım atın ve Flash ile yollarınızı ayırın.

a

a

Query Cache’i kullanmak.

Çoğu veritabanı gibi MySQL’in de kendine ait bir query cache’i (sorgu tamponu var). Temel olarak bu işlem sayesinde veritabanı aynı sorgular için her seferinde ayrı arama yapmak yerine daha önceki sonuçlardan kullanıyor. Ama MySQL’in bu özelliği kullanmasını sağlamak üzere bir noktaya dikkat etmekte fayda var.

Curdate() gibi sonucu belli olmayan fonksiyonlar kullanıldığı zaman query cache devreye girmiyor.

EXPLAIN kullanmak

Çoğu zaman karmaşık sorgular için “explain”  kullanmak performansı artırabilir. Bunun sebebi EXPLAIN komutunun sorguları hızlandırması değil, sorgunun nasıl yapıldığını göstermesi. Bu sayede sorgunuzu gerektiği gibi optimize edebilirsiniz.

Özgün sonuçlarda LIMIT 1

Belirli durumlarda tek bir özgün sonuç arıyor olabilirsiniz. Ya da sadece WHERE koşullarına uygun kayıtlar olup olmadığını kontrol ediyor olabilirsiniz. Her iki durumda da LIMIT 1 kullanmak sorgu hızını arttırabilir.

Bu durumda MySQL ilk sonuçla karşılaştığı zaman aramayı bırakacaktır.

ORDER by RAND() kullanmamak

Kısa ve temiz bir kod olmasına rağmen bu tarz bir sorgu çoğu zaman sorgu hızında problemlere yol açabilir. Bunun sebebi aranan her satır için RAND() fonksiyonun tekrar tekrar çağırılmasıdır. LIMIT 1 kullanılsa bile MySQL size tek bir satır vermeden önce muhtemel bütün satırlar için RAND() fonksiyonunu çağırarak işlemciyi yoracaktır.

Şimdilik bu kadar.

a