Для того, чтобы создать сайт, нужно изучать верстку: HTML и CSS, а затем и Javascript. Лучше начинать с чистого JS, а затем переходить к библиотекам и фреймворкам. Стоит изучить React или Vue, это самые востребованные библиотеки фронтенда.
В бэкенде больше популярных технологий, чем на фронтенде, и есть выбор, на каком языке писать. Чаще всего бэкендеры работают с PHP, Python, Ruby и NodeJS. Для этих языков есть свои фреймворки — например, для PHP это Symfony, Laravel и Yii, для Python - Django.
Учить технологии лучше на практике: писать код, запускать его в браузере или на сервере, отлаживать. Для этого нужно создать рабочее окружение - среду, в которой будет комфортно разрабатывать сайты.
В первую очередь, это редакторы кода или IDE (среда разработки), и инструменты разработчика в браузере, в которых можно посмотреть и отладить код сайта "на лету".
Вам обязательно нужно освоить Git — распределенную систему управления версиями. Звучит сложно, а по сути это отличный помощник веб-разработчика. С его помощью можно писать разные версии кода, а потом сливать их в единое целое; он позволяет откатиться на предыдущую версию, если что-то пошло не так. И, что особенно ценно, — это работает не только для одного разработчика, но и для целой команды. Используя Git, можно почти не бояться сломать код.
Фронтендеру нужно знать, как работать с макетом в графических редакторах. Все еще популярен Adobe Photoshop, но его постепенно вытесняют Figma и Zepplin. Для пользователей MacOS есть свой редактор, Sketch.
Чтобы отладить взаимодействие сайта с сервером, потребуется установить локальный сервер и создать базу данных. Не пугайтесь, в сети полно руководств, что это такое, и как это настроить.
Освоить технологии - это только начало. Дальше дело за инструментами и технологиями, которые помогут ускорить работу. Препроцессоры, система автоматизации и сборки проекта, методология БЭМ, виртуальная машина. Столько терминов… Чувствуете, что вы уже настоящий айтишник? )
Но и это еще не все. Веб-разработчик - ничто без знания библиотек и фреймворков. Библиотека или фреймворк - это надстройка над языком программирования, которая позволяет ускорить процесс разработки за счет того, что в ней прописаны уже готовые структуры проектов и готовые решения рутинных задач. Звучит отлично. Только для освоения этих инструментов надо приложить массу усилий и времени.
Ну и, наконец, английский язык. Вам придется много гуглить, читать документацию, искать решения самостоятельно. Без сносного знания английского будет сложно. На английском написана огромная часть документации, а также сайт stackoverflow.com — палочка-выручалочка разработчика в тех случаях, когда он не может сам найти решение.