01. Знакомство с версткой
Данный уровень предназначен для людей, которые никогда не верстали и не имеют представления о верстке, CSS и HTML.
- Прочитайте курс webref.ru/course/introduction
- Прочитайте курс webref.ru/course/html-basics
- Прочитайте курс webref.ru/course/html-content
- Прочитайте курс webref.ru/course/css-basics
- Прочитайте курс webref.ru/course/css-text
- Прочитайте курс webref.ru/course/box-model
- Прочитайте курс webref.ru/layout/learn-html-css
- Изучите справочник размеров webref.ru/css/value/size
- Изучите справочник селекторов everstudent.ru/blog/htmlcss/30-css-seletors-to-memorize/
- Изучите справочник цветов vvz.nw.ru/Lessons/HTML_Colors/HTMLcolors_HSB.htm
02. Базовая верстка
Данный уровень предназначен для людей, имеющих базовые представления о верстке, CSS и HTML.
- Прочитайте курс webref.ru/layout/diveintohtml5
- Прочитайте курс webref.ru/layout/howtocodeinhtml
- Прочитайте курс webref.ru/layout/html5-css3
- Прочитайте курс webref.ru/layout/magic-of-css
- Прочитайте курс webref.ru/layout/advanced-html-css
- Прочитайте статью habrahabr.ru/post/144003/
- Прочитайте статью habrahabr.ru/post/150071/
- Прочитайте статью habrahabr.ru/company/pechkin/blog/255819/
- Изучите справочник webref.ru/html
- Изучите справочник webref.ru/css
03. Современные технологии верстки
Данный уровень предназначен для людей, имеющих представления о верстке и желающих изучить новые технологии и подходы к верстке.
- Прочитайте статью habrahabr.ru/company/pechkin/blog/256853/
- Прочитайте статью habrahabr.ru/company/pechkin/blog/257397/
- Прочитать документацию css-tricks.com/snippets/css/a-guide-to-flexbox/
- Прочитайте курс webref.ru/layout/font-awesome
- Прочитайте статью habrahabr.ru/post/256109/
- Прочитайте документацию ru.bem.info/methodology/key-concepts/
- Просмотрите видео www.youtube.com/watch?v=hTmxbJF2Tts
- Пройдите курс www.udacity.com/course/browser-rendering-optimization--ud860
- Изучите справочник csstriggers.com
04. Надстройки над HTML и CSS
Метаязыки являющиеся надстройками над HTML CSS.
- Прочитайте курс webref.ru/layout/sass
- Прочитайте документацию sass-scss.ru/documentation/sassscript/
- Прочитайте курс webref.ru/layout/less
- Прочитайте документацию jade-lang.com/tutorial/
05. Фреймворки для верстки
Готовые фреймворки для верстки макетов.
- Прочитайте курс webref.ru/layout/bootstrap
- Прочитайте документацию getbootstrap.com/2.3.2/getting-started.html
- Прочитайте документацию foundation.zurb.com/sites/docs/installation.html
- Прочитайте документацию getskeleton.com/#intro
06. Автоматизация разработки
Данный уровень предназначен для людей, имеющих глубокие представления о верстке и желающих изучить способы оптимизации и автоматизации своей работы.
- Прочитайте курс webref.ru/dev/grunt-getting-started
- Прочитайте курс webref.ru/dev/building-with-gulp
- Прочитайте курс webref.ru/dev/automate-with-gulp
07. Материалы по дизайну
Данный раздел, является дополнением с примерами фишек, иконок, шрифтом и статьями по материалам.
- Примеры дизайнов //dribbble.com/
- Иконки //ionicons.com/
- Иконки //pictos.cc/
- Иконки //picons.me/
- Иконки //thenounproject.com/
