IT-школа "Понятно"
Обучение IT для начинающих c 8 лет и до ∞


Видеокурс по верстке сайтов

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

Самый простой и надёжный вход в IT – это изучение верстки сайта. Почему? Во-первых, это просто в освоении, как с технической, так и с теоретической точки зрения. Для начала веб-разработки достаточно любого компьютерного железа, бесплатного редактора кода и основных навыков работы с персональным компьютером. Во-вторых, результат работы верстальщик может увидеть сразу. Не нужно ждать компиляции файла, обработки его и т.д. Успехи и ошибки максимально наглядны – это сразу приучает к порядку в работе с программным кодом. В-третьих, изучение HTML и СSS – максимально полезно для понимания того, подходит ли для обучающегося путь программиста или нужно искать свое призвание дальше. Именно с веб-разработки начинается знакомство с программированием на первых курсах профильных колледжей и вузов.

В данном курсе мы познакомимся с основами веб-технологий и с такими языками разметки и стилизации документов, как HTML и CSS, а также попробуете себя в роли верстальщика и фронтендера. Курс состоит из простых, последовательных уроков. На каждом уроке мы учимся добавлять какие-то новые функции в наш проект. Вы можете с первого урока начать создавать свой собственный сайт и наращивать его функционал в процессе обучения. Домашним заданием в конце каждого урока является внедрение изученных возможностей в свой проект.

 Cкачать конспект занятий, для удобства повторения тем

Видеоуроки:

  1. Знакомимся с программой Visual Studio Code
  2. Изучаем первые теги
  3. Подключаем css и делаем текст красивым
  4. Классы и идентификаторы
  5. Добавляем картинки на веб-страницу
  6. Учимся работать с блочными элементами
  7. Продолжаем тему блоков и создаем структуру сайта
  8. Изучаем гиперссылки
  9. Верстка меню в виде кнопок
  10. Адаптивные страницы и медиа запросы
  11. Верстка веб-страниц с помощью сеточной системы
  12. Mobile first & Desctop first
  13. Семантические теги