Bu tasarım için Photoshop'ta kesinlikle "işimiz bitmedi", ancak tarayıcıda bu tasarımı oluşturmaya başlamak için yeterince çalışmamız gerekiyor. Sonuçta, bu bir web sitesinin resmini oluşturduğumuz bir web sitesi değil (dedikleri gibi).
Bu proje için ana sayfa olacak bir klasör oluşturuyoruz ve ardından bir projenin tüm temel unsurlarını manuel olarak oluşturuyoruz: bir index.html dosyası, kaynak klasörleri ve benzerleri. HTML5 Boilerplate'i kullanabilirdik, ancak en iyisinin sıfırdan yazıp sonra geri dönüp gelecekte hiçbir şeyi kaçırmadığımızdan emin olmak için buna referans vermenin en iyisi olduğuna karar verdik.
Proje klasörümüzü izlemek için CodeKit'i kurduk. Bu şekilde, CodeKit'in bizim için yapacağı diğer harika şeylerin yanı sıra, istediğimiz önişlemci dillerinde çalışabiliriz. CodeKit, yeni derlenmiş CSS'yi bizim için doğrudan tarayıcıya otomatik olarak enjekte eder ve bu, geliştirme sırasında büyük bir hız yardımcısıdır.
Proje boyunca kullanacağımız Sass'ın en temel kavramlarını tanıtıyoruz.