Тёмный

HTML5 для начинающих / Урок #2 - Файл «index.html». Отображение сайта 

Школа itProger / Программирование
Просмотров 292 тыс.
50% 1

За урок мы создадим наш первый проект и добавим внутрь него файл «index.html». Мы рассмотрим основную структуру HTML разметки, узнаем что такое теги и научимся отображать HTML файлы в браузере.
✅ Полезные ссылки:
✏️ Урок на сайте itProger: itproger.com/course/html/2
⏰ Тайм коды:
00:00 - Начало
00:22 - Создание папки проекта
00:55 - Добавление основного файла
01:33 - Теги в HTML
02:37 - Основная структура HTML
05:50 - Открываем файл в браузере
06:22 - Название страницы - «title»
07:55 - Установка кодировки
10:35 - Установка DOCTYPE
12:11 - Заключительная часть
✔ Сообщество программистов: itproger.com/
✔ -------------
Вступай в группу Вк - prog_life 🚀
Группа FaceBook - goo.gl/XW0aaP
Инстаграм itProger: / itproger_official
Instagram: / gosha_dudar
Telegram: t.me/itProger_official
Twitter - / goshadudar
- Уроки от #itProger 👨🏼‍💻
- Все уроки по хештегу #itprogerLessons

Опубликовано:

 

27 мар 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 209   
@stroke7227
@stroke7227 Месяц назад
Великолепно. У автора прирожденный талант к объяснению. Отличный курс, буду делать до конца))) Спасибо ☺
@miaxatt
@miaxatt Год назад
Очень понятно и доступно объясняешь
@user-so3ds4gr7j
@user-so3ds4gr7j 2 года назад
Прям шикарно. все очень разжованно и доходчиво изложено, что очень важно для новичка! кстати скорость 0.75 топ)
@user-ol3hj2cc1e
@user-ol3hj2cc1e 2 года назад
скорость 1.5 также😄
@MsVolkodav
@MsVolkodav Год назад
Только 0,5 или 2)))
@mskek1811
@mskek1811 11 месяцев назад
как уже опытный программист говорю, что весь плейлист очень поможет новичкам в изучении javascript
@jekuwatemirbekova4156
@jekuwatemirbekova4156 10 месяцев назад
Скажите пожалуйста,я правильно всё понял , сначала надо изучить HTML потом CSS и в конце уже JS? Последний вопрос, любой ноутбук подойдёт для изучения всего этого? Заранее спасибо
@clarsekyt3475
@clarsekyt3475 10 месяцев назад
​@@jekuwatemirbekova4156 Сначала html потом css и потом джава скрипт,насчёт ноутбука незнаю
@user-bu8lf7ic3c
@user-bu8lf7ic3c 10 месяцев назад
​@@jekuwatemirbekova4156 Конечно любой ноут,главное желание чтобы не пропало.
@jekuwatemirbekova4156
@jekuwatemirbekova4156 10 месяцев назад
@@user-bu8lf7ic3c Спасибо вам за совет
@user-sx4lz7wq7s
@user-sx4lz7wq7s 5 месяцев назад
​@@jekuwatemirbekova4156я изучал все вместе
@TheBigChannel_
@TheBigChannel_ Год назад
You are a great teacher 👍🏻 thank you very much 🙏🏻
@user-ut9xl9ph5c
@user-ut9xl9ph5c 2 года назад
Мне нравится этот канал! Спасибо большое вы мне очень помогаете.
@jozidayaharim7240
@jozidayaharim7240 2 года назад
Спасибо тебе большое,хорошо рассказываешь и обьясняешь, все очень понятно
@lhlebatinet
@lhlebatinet 11 месяцев назад
я пока только начала, но уже рада, что нашла такой курс, где рассказывают интересно и понятно :)
@mariannareinsalu39
@mariannareinsalu39 10 месяцев назад
Как успехи?
@VitalBotvi
@VitalBotvi 9 месяцев назад
на самом деле довольно быстро и сумбурно рассказывают совсем для новичков придется перематывать и перепрослушивать а в целом норм
@ZheKaYT
@ZheKaYT 7 месяцев назад
у меня нет кнопки команд где её найти? я не могу сохранить сайт!!👿
@user-sx4lz7wq7s
@user-sx4lz7wq7s 5 месяцев назад
​@@ZheKaYTctr+s
@Kirinnsenbon
@Kirinnsenbon 3 месяца назад
@@ZheKaYT жми ctrl левый нижний угол
@Roma.x
@Roma.x 7 месяцев назад
Очень нравится и все понятно спасибо большое буду слушать с радостью
@das_ten
@das_ten Год назад
пересматриваю курсы для закрепления информации
@user-bt8qp1ic6f
@user-bt8qp1ic6f 2 года назад
Мне понравился урок , благодарю ,понятно некоторые вещи очень хорошо
@user-rn5ou4hu1y
@user-rn5ou4hu1y Год назад
Привет, прошел год. Как успехи? Просто я новичок, и хочу спросить у тебя
@turbo7542
@turbo7542 7 месяцев назад
@@user-rn5ou4hu1y прошло 8 месяцев, а как твои успехи? Теперь просто я новичок)) :D
@LeshaGuitar
@LeshaGuitar Год назад
Спасибо за урок!
@fredifridman9039
@fredifridman9039 9 месяцев назад
По мне для меня это лучший курс из которых на нашол
@doom678
@doom678 3 года назад
Урок шикарен. Я десятки курсов перебрал и перепробовал, сюда забрел из-за курса по Jjango
@user-se3rp1wt8u
@user-se3rp1wt8u Месяц назад
Спасибо вам большое за урок!!!
@svetlanapolonets1147
@svetlanapolonets1147 9 месяцев назад
Понравилось видео, спасибо!
@XHuntingX
@XHuntingX 2 месяца назад
Однозначно лайк и подписка 👍 все понятно
@ThinManSix
@ThinManSix 4 месяца назад
большое спасибо за ваши старания
@thenerddd
@thenerddd 4 месяца назад
OOOhhhh this is the best I've seen in a while 😍 😍 😍
@ebyirtvoyeymamki
@ebyirtvoyeymamki 2 года назад
Георгий. Вы очень хорошо помогаете
@user-zn1zl8df3h
@user-zn1zl8df3h 2 года назад
В теге хед написал текст, и он всё равно виден, почему?
@evgeniyglushchenko9275
@evgeniyglushchenko9275 2 года назад
Курс вышел на мою днюху
@hearthstone5065
@hearthstone5065 Месяц назад
Спасибо! Пока очень все понятно😊
@vsratie1964
@vsratie1964 Месяц назад
Здравствуйте,огромное спасибо вам за ваши курсы,всё очень интересно и максимально понятно.
@SETTO_WOTBlitz
@SETTO_WOTBlitz 3 года назад
Как хорошо что я нашел ваш канал)
@gtxrtx815
@gtxrtx815 Год назад
как успехи брат ?
@alexpetrov521
@alexpetrov521 6 месяцев назад
Как уже это достало( Типичный комментарий побирашки. Ходят слоняются, ждут манну небесную. Что вы от него ждёте? Что бы он сказал, да чувак, залетай и мёд ложкой загребай, всё зае..сь и легко!? И каждый второй такой.
@nigarb1040
@nigarb1040 3 года назад
Новые уроки лучше. Нет лишней воды
@stern2936
@stern2936 3 года назад
если и тут нет лишней воды страшно представить что было в старых, то что можно объяснить в 5 слов объясняет в 15-20
@uniorblade817
@uniorblade817 2 года назад
@@stern2936 Потому что урок для новичков это раз, а во вторых для больших типов людей. Кто-то, кто хуже понимает нуждается в этих 15-20 словах вместо пяти, а тем, кому легко даётся, эти лишние слова не повредят, а может даже наоборот - помогут закрепить информацию
@muhammadjonxolmatov890
@muhammadjonxolmatov890 Год назад
Привет я из Узбекистана.Спассибо всем.
@KOLOBOK739
@KOLOBOK739 Год назад
шикарно, спасибо!!!
@user-sc5dw7ih3b
@user-sc5dw7ih3b Год назад
Отличный курс, автор вопрос, почему на itproger не представлен Ruby? Сейчас начал заниматься самостоятельно, а вернее изучать этот язык, а у Вас не много информации или я ошибаюсь?
@Burovasofia
@Burovasofia Год назад
спасибо за урок
@alexveha3467
@alexveha3467 Год назад
Бро ты лучший!
@parahumanoid
@parahumanoid Год назад
латиница = ascii, она в любом случае будет, не зависимо от выбранной кодировки. сказанул. варианты начинаются уже в верхней половине таблицы знаков. если она восмибитная.
@aori3076
@aori3076 Год назад
Мне вот интересно а в Atom, обязательно нужно писать стрелочки, слеш, или можно как в VS просто написать название тега и нажать таб?
@user-oy1pb9ne5r
@user-oy1pb9ne5r 2 года назад
Спасибо огромное
@user-sb1ge9xl5w
@user-sb1ge9xl5w Год назад
Спасибо огромное, всё понятно и разжевано
@morlulas1395
@morlulas1395 8 месяцев назад
Как успехи?
@bushmishmen
@bushmishmen Год назад
Thank you very much! Спс)
@RasXOD_Mercenary
@RasXOD_Mercenary 3 года назад
Слушай классно
@mirci5459
@mirci5459 8 месяцев назад
А что у Вас за плагин, который дает подсказки о том, что писать следующим и который показывает полное название тега, например, когда в body создаете абзац, Вы пишите "p", а справа показывается, что это сокращение от "paragraph"?
@abaikazak1656
@abaikazak1656 6 месяцев назад
а это информация до сих пор актуально
@ZXChaszer
@ZXChaszer Год назад
Как узнать какая версия HTML установлена через Visual Studio???
@electroparc4195
@electroparc4195 2 месяца назад
Спасибо
@faridmaqsudov2787
@faridmaqsudov2787 3 года назад
а что делать если выскакивает при скачивании atom ошибка с другими работать непонятно потому что видео другое а там другое
@anasteishn_
@anasteishn_ Год назад
Подскажите, пожалуйста, какой редактор и какую его версию скачать для windows 7 32-bit. Или как запустить код из блокнота. А то найти что-то подходящее для такого ноута это целый квест.
@naputivoina
@naputivoina Месяц назад
Mucho Gracias
@az09aqi17
@az09aqi17 3 года назад
В 14 году ты говорил "Бади", а сейчас "Боди", меняешься, чел..
@user-mc7zv9tg4g
@user-mc7zv9tg4g Год назад
и цсес
@user-mc7zv9tg4g
@user-mc7zv9tg4g Год назад
а сейчас сисес))
@exelione2229
@exelione2229 4 месяца назад
ориентированность на аудиторию же)
@ava_crey
@ava_crey 4 месяца назад
14 году? В него же сам канал создан 2020 году, наверно тф путаешь его кем-то
@user-nc5fp1fp8q
@user-nc5fp1fp8q 3 месяца назад
​@@ava_creyэто его не основной канал, его основной канал:Гоша дударь.
@nonot5181
@nonot5181 Год назад
Спасибо большое, обязательно оформлю подписку на вашем сайте, а по CSS и JavaScript у вас есть уроки?
@user-sw5cq7wk9h
@user-sw5cq7wk9h Год назад
Есть
@adilabasov9889
@adilabasov9889 2 года назад
А как сделать,чтобы указать,что 4-ая версия(например) 10:35
@user-hz9zf3ei4o
@user-hz9zf3ei4o 2 года назад
а в notepad на правую кнопу мыши нельзя добавить файлы в папку
@user-db3ku5vi1i
@user-db3ku5vi1i Год назад
За 1 ролик понял больше чем за 3-4пары
@flickzfn2167
@flickzfn2167 2 месяца назад
почему у меня на сайте главная страница и привет вместе в описании стоит а название вкладки ссылка сайта?
@user-lz2ep9ir4w
@user-lz2ep9ir4w 2 года назад
До конца дойдут только избранные) Ну что ж поехали)
@qqxfacts
@qqxfacts Год назад
в komodo ide 12 подчеркивается красным, это как понимать
@q1wizzy41
@q1wizzy41 Год назад
я программирую на brackets, все делаю по инструкции и когда захожу в папку меня выбивает в интернет с пустой страницей, что делать?
@alyonaap99
@alyonaap99 Год назад
*Помогите пожалуйста* у меня не получается работать с Атомом. После загрузки в окне открылось белое поле и на нём НИЧЕГО!!! Подвигала мышкой на секунду "засветилась" папка перенесённая с рабочего стола, и пропала, при нажатии на кнопки мыши выходят команды на английском - "новая папка" например, но при нажатии на команду опять ничего не происходит. Удалила программу Атом, удалила файл "setup" из папки загрузок, скачала заново, но результат тот же - белое окно и ничего.
@user-vl7hy3se2g
@user-vl7hy3se2g 11 месяцев назад
thanks
@user-pp3ko3xk3p
@user-pp3ko3xk3p 2 года назад
Спасибо большое за курс уроков...мне надо за месяц обучится верстачить сайты, надеюсь мне поможет ваш канал
@murou3968
@murou3968 2 года назад
Привет, как успехи, дружище?
@user-lm4nc1dl8o
@user-lm4nc1dl8o Год назад
Тоже интересно , месяц прошол)
@murou3968
@murou3968 Год назад
@@user-lm4nc1dl8o я уже сам научился немного верстать сайты, так что он точно справился
@user-lm4nc1dl8o
@user-lm4nc1dl8o Год назад
@@murou3968 надеюсь и я научусь))) Посмотрем что из этого выйдет )
@shkeldm
@shkeldm Год назад
@@user-lm4nc1dl8o что по итогу?)
@romanevdokimov3660
@romanevdokimov3660 2 года назад
У меня в браузере появляется символ < перед словом «привет». Как его убрать?
@nikolayermoshin6389
@nikolayermoshin6389 11 месяцев назад
Что делать если у меня в место привет выходит весь код в хроме(код написанный мной) Что делать, подскажите пожалуйста
@samserikbaev7706
@samserikbaev7706 3 года назад
привет ! как сделать расширения для автозаполнения ?
@muradbendaliyev3624
@muradbendaliyev3624 3 года назад
установи emmet.
@user-lp5yk3gu4y
@user-lp5yk3gu4y Год назад
Подскажите пожалуйста, при вводе Главная страница , название страницы прописывается на сайте, а не на вкладке страницы, что я делаю не так? Делала по видео точь-в-точь
@whateven2836
@whateven2836 10 месяцев назад
title одна т
@arcichhh
@arcichhh 9 месяцев назад
а есть какой нибудь онлайн редактор для 10 windows?
@muhammadjonxolmatov890
@muhammadjonxolmatov890 Год назад
ПРИВЕТ ВСЕМ Я ТОЖЕ ИЗУЧАЮ ЭТОТ КУРС.СПАСИБО ВСЕМ.
@skenz_gg1500
@skenz_gg1500 6 месяцев назад
как успехи?
@sergof2656
@sergof2656 2 года назад
👍👍👍
@EllimsElectric
@EllimsElectric Год назад
интересно а я смогу сделать курс при помощи html5¿
@imanofficial7802
@imanofficial7802 3 месяца назад
В браузере не показывает мой код и сайт. В чем проблема?( а в файле показона, что он пуст, хотя там огромный код)
@hd-my9fb
@hd-my9fb Год назад
Прошел курсы тестировщика - там щас жесть конкуренция по 100 человек на джуна, расплодилось их жесть, начал учить html далее css и потом планирую php, посмотрим что получится
@nikandrov
@nikandrov 7 месяцев назад
Лучше вместо PHP учи JS
@vladislav_1993
@vladislav_1993 Месяц назад
Как ваши успехи спустя 11 месяцев ?
@hd-my9fb
@hd-my9fb Месяц назад
@@vladislav_1993 инженером пто работаю по специальности, опять в планах продолжить обучение как уволюсь. Совмещать не получается.
@vladislav_1993
@vladislav_1993 Месяц назад
@@hd-my9fb я вот сейчас тоже задумался учиться на фронтенд, но не знаю получится ли…( нужно что то менять в жизни
@hd-my9fb
@hd-my9fb Месяц назад
@@vladislav_1993 согласен, я не хочу по вахтам ездить больше. Че делать нз, в крипте ещё попроьовать хочу как приеду, зарабатывают же люди, банк у меня будет не большой
@stanislavkruglyk4978
@stanislavkruglyk4978 Год назад
А еще мельче можно где то Н6 будет нормально , и желательно в самом верхнем углу.
@criminal1864
@criminal1864 Год назад
у меня не октрывается файл в браузере( что делать?
@user-pr1yf6gf3f
@user-pr1yf6gf3f Год назад
мне 14, все понял! Шикарно объясняете! Не думали начать праздновать день педагога?!
@azov1456
@azov1456 11 месяцев назад
Что ты высрал
@user-jp1sm6xl1h
@user-jp1sm6xl1h 3 года назад
Atom для Винды по другому устроен, у меня нет слева проводника, и я не могу понять как назвать файл который создал. Разжуйте как настроить вид подобный вашему на виндовс 10!?
@itproger
@itproger 3 года назад
Просто папку проекта перетащите в редактор и она откроется так же
@slavik9730
@slavik9730 2 года назад
Oldest Junior, вот посмотрите норм чувак, хотя где то потерялся
@Vlad-Ra
@Vlad-Ra 2 года назад
Nice
@notalent598
@notalent598 2 месяца назад
👍
@legoblox3793
@legoblox3793 2 года назад
1:20 я где-то читал, что есть расширение htm
@user-ex9cs8zi7e
@user-ex9cs8zi7e 2 месяца назад
😊😊😊😊😊😊
@mixgametv2373
@mixgametv2373 2 года назад
если у меня все нормально я могу не писать мета тег?
@Miraisgandarzada
@Miraisgandarzada 2 года назад
👍🏻
@mooteenn
@mooteenn 3 года назад
Была одна ошибочка, в теге Head отображается title пользователю
@risalatrasulova3186
@risalatrasulova3186 10 месяцев назад
у меня вопрос, я начинающая в этом, скажите пожалуйста имеют ли значения пробелы? Если да должна ли углубляться в этой теме? заранее спасибо🙂
@user-ou3ix4cp6v
@user-ou3ix4cp6v 9 месяцев назад
Для самого html не обязательно, но для лучшей читабельности, пробелы необходимы
@Nicolas-db3qo
@Nicolas-db3qo Год назад
Почему я пишу в body Привет а у меня ничего не отображается ????
@Mestniy389
@Mestniy389 4 месяца назад
Для начинающих облегчить работу подойдет Visual Studio Code-весь первоначальный блок html описывается одним символом ! плюс TAB
@Broneboyshik1311
@Broneboyshik1311 3 месяца назад
Скажите пожалуйста, у меня установлен вскод, если я хочу учится html по этому каналу ,то мне обязательно нужно устанавливать atom или я могу заниматься по этим урокам в вскоде?
@Mestniy389
@Mestniy389 3 месяца назад
@@Broneboyshik1311 вполне подойдёт вс как для начала так и для будущего.
@Broneboyshik1311
@Broneboyshik1311 3 месяца назад
@@Mestniy389 Вас понял, спасибо
@Mestniy389
@Mestniy389 3 месяца назад
@@Broneboyshik1311 Посмотрите видео по установке доп плагинов для удобства в работе вс
@Broneboyshik1311
@Broneboyshik1311 3 месяца назад
@@Mestniy389 Хорошо,а какие бы вы посоветовали?
@GmanKsen
@GmanKsen 3 года назад
Название сайта = названию страницы? Столкнулся с такой проблемой, когда в поисковике вбиваю имя сайта(не доменное, а например то которое указал в title или близкое к нему), а по запросу отображается имя доменное. Сайт уже был проиндексирован роботами.
@MohcheDD
@MohcheDD 5 месяцев назад
Нашли решение?
@drunk_daddy9268
@drunk_daddy9268 3 года назад
получается в папке WWW все файлы будут называться index.html?
@user-fd6il4we1g
@user-fd6il4we1g 3 года назад
Создается папка в которой будут находится все файлы и папки с необходимым содержимым. index.html называется главная страница, она всегда должна называться так, и никак иначе. Я не уверен, но кажется если назвать ее как-то по-другому, то что-то не будет работать.
@drunk_daddy9268
@drunk_daddy9268 3 года назад
@@user-fd6il4we1g спасибо
@KhzAlm
@KhzAlm 5 месяцев назад
like
@xeither289
@xeither289 2 года назад
☦❤💕❤🙏
@mooteenn
@mooteenn 3 года назад
Вы говорили что мы должны писать все в ручную без плагинов и т.дб и т.п. Но у меня установлен Emmet и можно ли его использовать или выключить?
@nigarb1040
@nigarb1040 3 года назад
Я не использовал его первые 5-7 уроков. Затем выучил как правильно писать теги и включил emmet.
@qqqu1ncy121
@qqqu1ncy121 3 года назад
@@nigarb1040Слушай а эммет только для Sublime Text вроде - бы ?
@CodeQuestRu
@CodeQuestRu 3 года назад
@@qqqu1ncy121 нет, Emmet есть для всех редакторов, где-то встроен, а где-то нужно установить
@dmytrodyakun6512
@dmytrodyakun6512 3 года назад
@@qqqu1ncy121 нет , я например Emmet для Vim юзаю
@sergeyhovakimyan176
@sergeyhovakimyan176 2 года назад
Ребят кто нибудь киньте источник где можно в кратце познакомиться со всеми тегами?
@evgeniyglushchenko9275
@evgeniyglushchenko9275 2 года назад
В блокнотик записывай так и запомниться лучше)
@Aldikkosh
@Aldikkosh Год назад
Я зделал как на видео но ничего не получился
@Dj-fh4kg
@Dj-fh4kg 2 месяца назад
Только начала смотреть ,не могу понять ,эти все тегги вы запоминаете ?Как вы понимаете когда каклй нужно написать ?
@user-me4vt3uy7r
@user-me4vt3uy7r 2 года назад
Через хром открывает нормально
@alikhankalmanbay4840
@alikhankalmanbay4840 3 года назад
у меня при открытии страницы код и сам текст не отображается, браузер сафари
@fish1314
@fish1314 3 года назад
я не експерт в етом, но вроде Сафари только для видео, бо раньше мне так говорили
@Krylowandrey
@Krylowandrey Год назад
Зачем существуют одинарные и парные теги? Почему не все теги парные или не все одинарные? Зачем они так отличаются? Это какая то необходимость? Если да, то какая?
@user-zo6pr9dt8b
@user-zo6pr9dt8b 4 месяца назад
как сделать скобочки в которые помещен тэг?
@guchigovavturkhan3547
@guchigovavturkhan3547 Месяц назад
Русские буквы Б и Ю, меняешь язык на английский shift + alt, и нажимаешь на кнопку где русская Б, нажав предварительно shift
@user-me4vt3uy7r
@user-me4vt3uy7r 2 года назад
Добрый день, подскажите пожалуйста в чем проблема, открываю документ в браузере сафари и выдает вместо привет такие символы: Привет
@evgeniyglushchenko9275
@evgeniyglushchenko9275 2 года назад
В видосе есть там где Установка кодироки
@minecraft-play.
@minecraft-play. Год назад
@@evgeniyglushchenko9275 чел прав или сафари не поддерживается
@huyhuyhuyhuyhuy6836
@huyhuyhuyhuyhuy6836 10 месяцев назад
Это выдает если ты написал на русском текст
@python_proger
@python_proger 7 месяцев назад
Ничего не запускается
@uebishnyi
@uebishnyi 2 года назад
у меня перед текстом в странице > Тестовый проект> Привет мир! вот код
@imacactus9187
@imacactus9187 Год назад
Ещё
@mixgametv2373
@mixgametv2373 2 года назад
ето важно в каком браузере открилос или нет
@itproger
@itproger 2 года назад
Нет
@raisiekudzero1961
@raisiekudzero1961 3 года назад
А в начале?!
@unknownunknown9510
@unknownunknown9510 3 года назад
да все верно
@anatole4582
@anatole4582 3 года назад
Разницы нет
@user-rl5xg4fx9r
@user-rl5xg4fx9r 3 года назад
Те боди а я Бодя
@specnaz.Levinho
@specnaz.Levinho 2 месяца назад
Shift + !, тогда не нужно будет писать вручную head,body,meta,title
@drunk_daddy9268
@drunk_daddy9268 3 года назад
предположим я хочу создать еще один файл в этой папке, я создал с таким же именем но мне отвечает что файл с таким именем уже существует
@alexandersobolev2769
@alexandersobolev2769 3 года назад
Другие файлы имеют другие имена. index.html - это просто _стартовый_ файл для сайта
Далее
Cucumber Pasta #shorts #food #howto
00:31
Просмотров 5 млн
Cucumber Pasta #shorts #food #howto
00:31
Просмотров 5 млн