Создание сайта

Верстка сайта с нуля на HTML | CSS / #1 – Разработка крутого веб-сайта для начинающих

Верстка сайта с нуля на HTML | CSS / #1 – Разработка крутого веб-сайта для начинающих

Курс для начинающих, что поможет вам создать веб-сайт с нуля, используя HTML, CSS и JavaScript. Мы начнем с пустой страницы и дойдем до сайта с дизайном и анимациями, следуя макету из Figma. Курс отлично подходит всем желающим, кто хочет научиться веб-разработке.

Видеоурок

Полезные ссылки:


Из чего состоит сайт?

Любой веб-сайт состоит из набора нескольких основных технологий: HTML, CSS и JavaScript. Независимо от жанра сайта или уровня сложности его построения, этот каркас присутствует в любом веб-сайте. С помощью HTML можно базово описать, где и какие элементы будут располагаться на странице. С помощью CSS можно добавить стили к этим элементам, а JavaScript позволяет определить пользовательские функции, которые срабатывают при взаимодействии пользователя с различными элементами на странице.


Это базовый каркас, к которому можно добавить серверный язык программирования для описания функций на сервере, таких как авторизация на сайте, работа с куки, сессиями и прочее. Также можно интегрировать работу с базой данных и настроить облачные сервисы. Всё это добавляет функциональность сайту, но когда мы говорим конкретно о дизайне сайта и том, что увидит пользователь, то речь идет лишь о HTML, CSS и JavaScript.


Современные фреймворки

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



Если за внешний вид отвечают исключительно HTML и CSS, то за добавление функций может отвечать JavaScript и сотни его фреймворков и библиотек. Если вы только начинаете изучать эту тему, то вам может быть сложно сразу разобраться, с чего начать в контексте JavaScript. Здесь есть React JS, Vue JS, Angular и многие другие фреймворки, которые, по сути, выполняют одну и ту же задачу, но делают это по-разному.


Мы рекомендуем на старте хорошо изучить HTML, CSS, сам JavaScript и затем перейти к изучению, например, Vue JS. 


План курса

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


Макет сайта

В качестве дизайна для нашего сайта мы воспользуемся бесплатным макетом. Для работы с макетом мы будем использовать программу Figma, которая является аналогом Photoshop, но более современным и удобным для работы с различными дизайн-проектами, включая макеты веб-сайтов и приложений.



Программа обучения

Также на нашем сайте есть более углубленные курсы HTML, что будут пройдены в программе по изучению разработки веб сайтов. Ознакомится с программой обучения по Front-end можно по этой ссылке и с программой обучения Full Stack по этой ссылке.


Онлайн редактор кода

Загрузка...

Большое задание по курсу

Вам необходимо оформить подписку на сайте, чтобы иметь доступ ко всем большим заданиям. В задание входит методика решения, а также готовый проект с ответом к заданию.
PS: подобные задания доступны при подписке от 1 месяца

Также стоит посмотреть

Создание сайта с нуля | Полноценная верстка сайта
11 уроков
Видеокурс по PHP, MySQL / Создание динамического сайта
Создание адаптивного сайта
4 урока
Современная вёрстка адаптивного веб-сайта
Изучение HTML5 для начинающих!
18 уроков
Изучение технологии Bootstrap (верстка сайта)
16 уроков
Комментарии
Добавить комментарий

Пока комментариев нет