Изучение верстке сайтов на HTML/CSS/JS. С чего начинать, если основы уже к тебя в кармане.

# Введение в профессию
 
• «Создание веб–сайта. Курс молодого бойца»
   habrahabr.ru/post/273795/
• «Вёрстка — это не тупо»
   webmasters.teamdev.com
• «Что должен уметь HTML-верстальщик?»
   github.com/crecotun/ui-developer-skills
• «Как стать начинающим верстальщиком»
   glivera-team.github.io/how-to/2016/05/02/how-to-start.html

 
# Путеводители

• “HTML & CSS The Right Way.”
   htmlcsstherightway.org
• “JavaScript The Right Way”
   jstherightway.org/ru-ru/
• «Хочу стать frontend разработчиком: базовые знания и план обучения»
   tproger.ru/curriculum/intro-to-frontend-development/
• «Как стать профессиональным веб-разработчиком: практическое руководство»
   habr.com/post/303896/
• «От нуля до героя фронтенда»
   medium.com/russian/от-нуля-до-героя-front-enda-часть-1-f524d668f328
   medium.com/russian/от-нуля-до-героя-фронтенда-часть-2-25f19e56eb29
• «Краткий план по изучению фронтенда, или #100ДнейКода»
   medium.com/@ABatickaya/100daysofcode-7584c0ddfc1a
• “Front-End Developer Handbook 2017”
   github.com/FrontendMasters/front-end-handbook-2017
• “Front-End Developer Handbook 2018”
   frontendmasters.com/books/front-end-handbook/2018/
• “Front-End Developer Handbook 2019”
   frontendmasters.com/books/front-end-handbook/2019/

 
# Обучение
 
• Джош Кауфман «Первые 20 часов. Как научиться чему угодно... быстро»
• ru.learnlayout.com
• htmlacademy.ru/program
• w3schools.com
• flexbox.ninja
• freecodecamp.com
 
 
# «Песочницы»

• jsfiddle.net
• codepen.io
• codesandbox.io
• jsbin.com
• cssdeck.com/labs
• jsdo.it
• railsdotnext.com/experiment/jssandbox.html
• thimble.mozilla.org/ru/
• stackblitz.com
 
 
# Видеокурсы HTMLAcademy
 
• htmlacademy «Базовый HTML и CSS»
   coursehunters.net/course/bazovyy-html-i-css-18-2017
• htmlacademy «Продвинутый HTML и CSS»
   coursehunters.net/course/prodvinutyy-html-i-css-potok-2017
• htmlacademy «Профессиональный HTML и CSS Уровень 1»
   coursehunters.net/course/professionalnyy-html-i-css-uroven-1-potok-26-fevralya-4-aprelya-2018
• htmlacademy «Профессиональный HTML и CSS Уровень 2»
   coursehunters.net/course/professionalnyy-html-i-css-uroven-2-potok-15-yanvarya-21-fevralya-2018
 
 
# Справочники
 
• htmlbook.ru
• webref.ru
• cssreference.io
• developer.mozilla.org/ru/
 
 
# Выполнение заданий
 
• flukeout.github.io (изучение селекторов в CSS)
• flexboxfroggy.com/#ru (изучение flexbox в CSS)
• flexboxdefense.com (изучение flexbox в CSS)
• dmitrylavrik.ru/training/process/flexbox-grid (создание сетки на flexbox)
• cssgridgarden.com/#ru (изучение gridbox в CSS)
 
 
# Задачи для практики
 
• htmlbook.ru/practical
• cssbattle.dev
 
 
# Макеты для практики
 
• drive.google.com/drive/u/0/folders/0B8LYygUI_oGeSGticGREcUtkeGs
• freebiesbug.com/psd-freebies/website-template/
• symu.co/freebies/templates-4/
• dcrazed.net/free-photoshop-psd-website-templates/
 
 
# Задать вопрос по теме

• ru.stackoverflow.com
• toster.ru
 
 
# Поиск интересных решений

• codepen.io
 
 
# Контроль версий

• Lynda.com — Git (Essential Training)
• Git Book git-scm.com/book/ru/v1/

 
# Советы

• «Что поправить в верстке перед выпуском в продакшн?»
   habr.com/post/319664/
• «Как HTML-верстальщику поднять свой уровень»
   krekotun.ru/level-up/

Во-первых. Выключи торопыгу или, без обид, открывай учебник русского языка.
Во-вторых. Неплохой совет на счет книги Влада Мержевича.
В-третьих. Как вариант, Интернет в помощь.
В-четвертых. Совет от меня на счет инструментов (программ) можешь прочесть здесь http://html.sme55.ru/ на первой странице.

После HTML обычно изучают CSS.
Потом обычно изучают JavaScript. Затем изучают jQuery (это, как бы, такой аналог CSS для JavaScript).
Потом изучают PHP и MySQL.
Потом Ajax и API.

Вот такая у меня для тебя программа.

Прочитай книгу Влада Мержевича