0:00
В предыдущих видео я рассказал вам,
что такое html и из каких элементов он состоит.
В этом видео я хочу вам показать, как создать первый html-файл.
Если вы уже знаете, как это делать, вы можете просто пропустить это видео.
Для того чтобы удобно писать код,
нужно воспользоваться каким-то редактором с подсветкой синтаксиса.
Мы предлагаем несколько: WebStorm, Sublime Text и Atom.
Все ссылки для скачивания вы можете увидеть на слайде.
Последующие примеры я буду показывать в редакторе Sublime Text.
Для того чтобы запустить html-файл, нужен бразуер.
На слайде вы можете увидеть самые популярные в России.
В работе фронтендера часто приходится проверять верстку в нескольких браузерах,
поэтому поставьте некоторые из них, для того чтобы запускать ваш код.
Открываем редактор Sublime Text, и мы видим,
что открыт пустой файл неопределенного формата.
Нам нужно указать, что код, который мы будем писать, будет в формате html.
Для этого нужно в правом нижнем углу выбрать формат.
Сейчас он установлен как plain text.
Давайте выберем html.
Итак, редакторы кода удобны тем,
что в них встроены различные удобства для быстрого набора.
Как я показывал в предыдущих видео,
каждый html-файл состоит из стандартного набора тегов.
Для того чтобы каждый раз их не писать,
в редакторе Sublime встроены специальные шаблоны.
Достаточно набрать html и нажать кнопку Tab, и стандартный набор элементов создан.
Но первое время я бы рекомендовал вам все-таки набирать эти теги руками,
чтобы лучше запомнить.
Давайте добавим заголовок этой страницы.
В элементе title наберем этот заголовок.
И теперь в самом документе мы добавим заголовок первого уровня.
Для этого мы набираем тег h1, нажимаем кнопку tab,
и автоматически устанавливаются открывающий и закрывающий тег.
Очень удобно.
И напишем сюда какой-нибудь текст.
Еще давайте дополнительно добавим кодировку,
чтобы браузер понимал, в какой кодировке у нас находится документ.
В Sublime мы просто набираем слово meta,
нажимаем Tab и автоматически подставляется нужный нам тег с кодировкой.
Итак, html мы создали, теперь давайте откроем его в браузере.
Чтобы открыть в браузере, нужно сначала этот файл сохранить.
Нажимаем File, «Сохранить как», набираем название index.html,
и в данном случае я сохраняю на рабочий стол.
Все отлично, сохранили.
В операционных системах по умолчанию установлены какие-то браузеры.
У меня в данном случае установлен Яндекс.Браузер,
и я открываю файл, и по умолчанию он открывается в Яндекс.Браузере.
Как мы видим, title установлен в качестве заголовка, и то, что у нас
указано в теге h1, указано в самом окне браузера, то есть в рабочей области.
Итак, в этом видео я показал вам, как можно просто создать html-страничку
при помощи редактора Sublime и запустить ее в браузере.
Мохов Олегразработчик интерфейсов, Яндекс
Артем Кувалдинразработчик интерфейсов, Яндекс
Олег Семичевразработчик интерфейсов, Яндекс
