Давай так.
Бери PSD шаблон небольшого лендинга.
Открываешь в фотошопе, сохраняешь все картинки из него.
Делаешь папку проекта где будут index.html style.css и папка с картинками.
В голове делишь на блоки - верхнее меню, слайдер, первый блок, второй блок. Делаешь код html для меню, делаешь для него стили в style.css и так по очереди. Описал один блок в html, написал для него css.
Сейчас тебе больше ничего не надо, только картинки, html и css на самом базовом уровне, никакой адаптации, никаких saas less gulp b прочего не надо.
Качаешь для хрома расширение pixel perfect и выравниваешь все блоки как в дизайне.
Так ты делаешь один лендинг, один корпоративный сайт и один интернет магазин. Сам функционал тебе делать надо.
Каждый проект заканчиваешь до конца, пока все не будет по дизайну. Будут вопросы пиши на тостер. Закончишь пиши на тостер, проси оценить верстку, только выкладывай куда-нить на бесплатный хостинг, работаешь над тем, что посоветует.
Далее уже только после всего этого можешь на лофтблог посмотреть, там есть уроки по разным технологиям фронтэнда
