Как и где учится верстке самостоятельно 🛗

Как и где учится верстке самостоятельно 🛗
Максим Штиль
Дизайнер получается

Предисловие

Верстка макета с помощью кода, то есть с использованием языка разметки HTML, стилизации CSS — это абсолютно рутинная работа. Здесь важно понимать, что верстка не равно программирование. Потому что ты не создаешь ничего нового, ты не пишешь программы, все что ты делаешь, это переносишь дизайн в код с помощью стандартных технологий, суть которых не менялась десятилетиями

Процесс

Процесс переноса макета в код очень линейный:

  1. Знакомишься с задачей
  2. Изучаешь макет — какие там блоки, есть ли анимация, какая сетка и тд
  3. Открываешь чуть ли не блокнот, по крайней мере раньше я делал именно так, сейчас кнч есть VS Code, а дальше начинаешь верстать

Верстка — перевод картинок на понятный браузеру язык (HTML, CSS, JS)

Путь изучения

В первую очередь я бы рекомендовал ознакомиться с общей картиной, что там в этой верстке есть:

Конечно сначала идет изучение основ HTML, с совмещением CSS, забегать к изучению JS я не советую.

А где учиться самому?

Я собрал подборку полезных сайтов, на которых я еще лет 5 назад учился + новые ресурсы:

  • freecodecamp — древний ресурс, но с нормально выстроенной программой обучение, и как следует из названия – там все бесплатно
  • geeksforgeeks – хороший сайт с множеством советов и бесплатных курсов
  • w3schools – прям база для новичков, там много тестов, документации, интерактивных статей и есть русский язык
44
1 комментарий

верстка не равно программирование. Потому что ты не создаешь ничего нового, ты не пишешь программы, все что ты делаешь, это переносишь дизайн в код с помощью стандартных технологийА программеры все как один создают новое целый день, не используют стандартные технологии и не копируют код. Ахахаха.

1
Ответить