bozilly

Базовые принципы вёрстки
copist.ru/blog/2015/08/29/web-layout-basics

Вот — sass-guidelin.es/ru/#section-52

Сейчас перехожу на сборщики проектов и можно так сказать, только блогадаря им наврное понял всю прелесть модульности проектов. Очень удобно полезно и т.д. Особенно когда делаешь шаблоны скажем под определную систему ( cms, сборку на фреймворке и т.д.) Перекидываешь модульные частик кода вместе с стилями, определенным html и js.

app/
-bower_components
-/less
--main.less
-/js
--main.js
-/img
--/icons
-/fonts
-/tpl
--такой подход позволяет мне перекидывать оформление различных блоков с проекта на проект.
--/header
---*.html
---*.js
---*.less
--/footer
---*.html
---*.js
---*.less
--...
--/search
---*.html
---*.js
---*.less
-index.html
-...
-inner-page.html
dev/
-тут не сжимаем картинки, не уменьшаем скрипты и т.д. Просто работаем, так как сжатие и т.д. порой замедляет процесс.
build/
-тут после окончания определенного этапа спринта и т.д. Сжатую версию кидаем на продакшен.
Такой метод наглядно отражает, куда надо зайти что бы поправить тот или иной модуль. Но думаю не каждому это подойдет, бывают специфические проекты. Там затачиваемся под проект :)

Sass можно закинуть в папку CSS, либо в Css создать папку Sass

А так должно быть так:

/img - все изображения
/css - тут файлы с оформлением
/libs - тут плагины js (слайдеры, анимашки, бутстрап, и т.д)
/js - сюда можно положить js файл где будут указаны параметры этих самых плагинов (common.js)

Лично у меня Sass лежат в папке CSS ибо Koala почему то дублирует файлы там где находятся файлы Sass и туда куда я указал компиляцию т.е в /css, получается каша, поэтому я все css, sass файлы кидаю в одну папку /css и всё нормально, но лучше конечно в CSS создать папку Sass если нету подобной проблемы. А вообще, разницы толком нету, делайте как удобно, главное что бы вы понимали что и где лежит.

А и ещё, в Brackets например при работе в Sass не заполняются ссылки на изображения, например когда пишешь в src="" - img т.е начинаешь заполнять src то редактор обычно сам предлагает пути к файлам а если sass лежит не в той же папке что и CSS то пути будут разными и писать нужно уже в ручную ибо будет уже не ../fonts/ а будет уже ../../fonts ибо папка Sass будет лежать не там куда компилируется CSS файл а внутри т.е /css/sass

Как то так

тут исходники
src
- sass
--- header
----- header.sass
--- footer
----- footer.sass
--- body
----- body.sass
--- style.sass
- js
--- jssrc

тут сгенерированные файлы
target
- style.css
- app.js

Шаблоны тем для wordpress обычно содежат исходные PSD-шки. В сети много постов о XX лучших бесплатных тем - можно погуглить по запросу вроде "free responsive wordpress themes"

Зачем тебе адаптивные psd? Берешь обычный, и пытаешься сделать из него мобильную/адаптивную версию. Ситуация прямо жизненная.

www.cssauthor.com/website-templates

codepen.io/anon/pen/bdOWze?editors=110
мне когда-то дали такую ссылку...
использую на все 100

<div class='wrapper'>
  <div class='content'>
  </div>
  <div class='sidebar'>
  </div>
</div>

float + width + calc + Media Queries - все что вам нужно, 100500 примеров в интернете

вот еще один неплохой сайт otranscribe.com

а здесь отличные для изучения английского www.myenglishteacher.eu/question/free-transcript-v...

Можно с помощью grunt-contrib-copy

copy: {
  dist: {
    files: [{
      expand: true,
      dot: true,
      cwd: 'dist',
      dest: 'dist/',
      src: [
        '{,*/}*.html'
      ],
      rename: function(dest, src) {
        return dest + src.replace('.html','.php');
      }
    }]
  }
},

копать в штакетник и немного в сжатие исходного кода, а если глубже то, выбросить вордпресс к чертям .