Мы, конечно, не «закончили» в Photoshop этот дизайн навсегда, но у нас есть достаточно, над чем можно поработать, чтобы приступить к созданию этого дизайна в браузере. В конце концов, это веб-сайт, который мы создаем, а не изображение веб-сайта (как говорится).
Мы создаем папку, которая будет домашней для этого проекта, а затем вручную создаем все основные элементы проекта: файл index.html, папки ресурсов и тому подобное. Мы могли бы использовать HTML5 Boilerplate, но решили, что было бы лучше написать с нуля, а затем вернуться и ссылаться на него, чтобы убедиться, что мы ничего не пропустим в будущем.
Мы настроили CodeKit, чтобы следить за нашей папкой проекта. Таким образом, мы можем работать с любыми языками препроцессора, которые захотим, а также с другими интересными вещами, которые CodeKit сделает за нас. CodeKit автоматически внедряет недавно скомпилированный CSS прямо в браузер, что является огромным помощником в скорости разработки.
Мы представляем самые основные концепции Sass, которые мы будем использовать на протяжении всего проекта.