optomall24.ru

Первый сайт без технического опыта

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

Мы идём маленькими шагами: сначала разметка, потом оформление через CSS, затем сборка готового сайта на конструкторе. В каждом уроке есть результат, который можно проверить сразу.

Схема HTML-страницы: теги заголовка, абзаца и ссылки, нарисованные тонкими зелёными линиями

С чего начать

Четыре направления, из которых складывается первый сайт. Их можно проходить по порядку или выбрать то, что нужно прямо сейчас.

Основы HTML

Теги, атрибуты и структура документа. Учимся размечать заголовки, списки, ссылки и картинки.

CSS и оформление

Цвета, шрифты, отступы и сетки. Превращаем голую разметку в аккуратную страницу.

Конструкторы сайтов

Как выбрать конструктор, собрать страницы из блоков и где пригодятся знания HTML.

Первый проект

Собираем личную страницу от чистого листа до публикации в интернете.

Свежие уроки

Основы веб-разработки

Лучшие инструменты для старта в веб-разработке без программирования

Когда ко мне приходит заказчик, который хочет «просто попробовать сделать сайт сам», я никогда не отправляю его сразу учить HTML. Это бессмысленно. Сначала нужно понять, как вообще устроена страница, из каких блоков она собирается, почему кнопка должна быть именно здесь, а форма — там. И только потом, если появится желание копнуть глубже, браться за код.

Инструменты […]

Открыть урок
Основы веб-разработки

Что нужно знать перед изучением HTML и CSS

Если вы только собираетесь разбираться в вёрстке, полезно сразу понять одну вещь: HTML и CSS — это не «сложные языки для программистов», а базовые инструменты, на которых держится почти любой сайт. Но прежде чем открывать первый урок, стоит разобраться, как вообще устроена веб-страница, зачем нужны эти технологии и с чего лучше начать, чтобы не запутаться […]

Открыть урок
Основы веб-разработки

Азбука заказчика: чем верстка отличается от дизайна

Когда обсуждают создание сайта, слова «дизайн» и «верстка» часто смешивают в одну кучу. Из-за этого заказчик не понимает, за что именно платит, на каком этапе находится проект и почему «красиво нарисовано» еще не значит «сайт уже готов». Я регулярно сталкиваюсь с этим в работе: клиент показывает макет и спрашивает, когда сайт заработает, хотя по факту […]

Открыть урок

Сайт начинается с одного тега

Не нужно знать всё сразу. Напишите <h1>, сохраните файл, откройте его в браузере — и у вас уже есть страница. Всё остальное вырастает из этого шага.

Сделай первый шаг — собери свою страницу

Возьмите первый урок и за один вечер создайте страницу с заголовком, текстом и ссылкой. Понадобятся только браузер и блокнот.