00:00
итак вы при своим приступая к созданию
00:02
наши первые веб-страницы для давайте мы
00:05
на рабочем столе
00:06
либо вы можете на любом сам диски на
00:09
компьютере задать папочку зовем ее
00:13
просто сайт можно по-русски можно
00:18
по-английски как вы тут вам уже удобнее
00:20
спроса обычной папкой на вашем
00:22
компьютере
00:23
открываем эту папку сдаем файлик на пути
00:27
текстовый документ но при этом мы
00:29
расширение к сети также будем менять с
00:32
мы это все мастера им и пишем индекс
00:35
точка html нажимаем enter и живем кнопку
00:40
да у нас появилась бился файлик файлика

00:44
в html 2 фарук формате традиционно так
00:49
сложилось что главная страница на сайте
00:52
всегда называется индекс но практически
00:54
всегда
00:55
дальше идет через . и расширение файла
00:58
если нас это html файл то разумеется у
01:01
нас это расширение htm и есть конечно
01:04
вариантом htm используя тоже html файл
01:06
вот но опять же это уже такой устаревший
01:09
вариант то есть называйте всегда html
01:11
файлы с расширением html на главной
01:16
странице у нас индекс второстепенные мы
01:18
внутренние страницы сайта мы же
01:20
называйте как вам угодно .
01:23
допустим там артикул html там или шов .
01:29
html там или как блок . что ль короче
01:33
как-то могут все тоже утренние страницы
01:34
то можно печь . html просто назвать как
01:37
угодно но главное все страхи называть
01:39
именно индекс это так наиболее грамотно
01:42
будет смотреться давайте мы ее откроем
01:46
откроем и вот-вот под плюс плюс у нас
01:49
тут если вы там делали а также какая
01:52
когда устанавливали на попытки вас такая
01:54
штука должна появиться контекстном меню
01:56
открываем его вот на сами открылся этот
01:59
файлик значит сразу что хочу ваше
02:01
внимание обратить
02:02
от в правом нижнем углу у нас это
02:05
имеется некая ansi это кодировка
02:09
кодировка кириллица
02:12
которую безусловно быть не должно то
02:15
есть вообще запомните что в
02:16
программировании создание сайтов в html
02:19
всегда используйте кодировку utf-8 без
02:23
bom
02:25
то есть всегда то есть когда вот вы
02:27
кровати файлик если вы видите тут ansi
02:30
там и преобразован в t8 бейсбол это
02:36
первый шнур сада дел то есть всегда
02:37
используйте unicode потому что иначе у
02:40
вас если вы будете использовать
02:42
кириллицу то вас возможно какие то
02:45
проблемы будут на самых различных
02:46
браузерах с разными языками и в итоге
02:49
ваш русский тех которые вы напишете
02:50
отображаться будет некорректно у
02:52
некоторых пользователей
02:54
поэтому всегда используют f8 и смело
02:57
пишите тут и русские буквы латинские
02:59
буквы какие хотите это все уже будет у
03:02
вас прекрасно работать теперь мы с вами
03:07
переходим к созданию к написанию кода
03:09
нашей первой странице так как я уже
03:11
говорил все начинается с doctype
03:13
для того чтобы дать понять браузеру либо
03:19
ком другом устройству который будет
03:20
отображать нашу страницу тут нас будет
03:23
отображаться страница формате html 5
03:28
дальше у нас идет обязательно
03:31
открывающий тег html
03:32
html это по сути содержимое вообще всей
03:35
страницу тут начинается html о нас так
03:38
парни поэтому его сразу же его и закроем
03:41
внутри тега html нас еще имеются два
03:44
таких тоже важных под тега это хит
03:47
который нас тоже является парным и body
03:52
которая тоже является парным хит нас
03:55
отвечает за голову документа то есть
03:58
внутри головы документ указывается
04:00
различные там заголовке страницы
04:02
ключевые слова странице описания страниц
04:04
и там автор страниц если хотите там
04:08
подключаются такие скрипты файлы стилей
04:11
то есть такие вот различные вещи которые
04:15
такие базовые которые относятся ко всей
04:16
страницы
04:17
что касается форматирование эти не
04:20
молчите тут сделал отступы
04:22
вот конкретно для тегов и body никогда
04:25
уступ
04:25
не делаю но для всех его других тегов я
04:28
живу цапа всегда делаю ничего не делать
04:31
для седана потому что ниже собой смысл и
04:33
чтобы отделить такой-то шт и мальте
04:34
весной стороны так вроде правильную
04:36
просто если мы начнем туда вглубь
04:38
углубляться пример там div там еще еще
04:42
один и еще одни в итоге получится все
04:45
отображен с такой-то те тоже справа
04:47
поэтому чтобы сэкономить чуть место я
04:50
всегда отступы именно для вот head &
04:54
body никогда не делаю то есть я приму
04:56
так вот пишу уже внутри этих этой банде
04:58
уже на каждый тег идет свой отступ
05:02
бойцами разберется тегом head
05:06
внутри тега hide
05:08
нужно обязательно всегда указывает
05:09
заголовок в теге tight вот аспекта ялта
05:13
ялта как пишется есть заголовок
05:15
antique у нас парный поэтому мы его
05:17
открыли а мы тут же мы его закрыли и
05:20
внутри этого тега то есть в этом
05:24
промежутке мы можем написать сами
05:25
абсолютно любое заголовок страницы
05:28
например наша первая
05:30
веб-страница дальше дальше же начинаются
05:36
всякие приколы у неопытных доставщик of
05:39
а дальше уже они как правило ничего не
05:41
пишет пишу то мастики стиле подключают
05:43
скрипты
05:44
вот но нет сначала мы сами должны
05:47
указать кодировку и тип страницы и
05:51
кодировку тип страницы делается с
05:56
метатег который у нас тут имеется
05:58
content type у атрибута наши т.п. киев
06:01
то есть опять же да так открывается
06:03
пишем внутри него все атрибуты пигмент у
06:06
нас одиночный сейчас я запишу все
06:14
и буду объяснять счет нас так мета он
06:16
одиночной подпитии тут его тут же и
06:17
закрыл через прямой слеш и закрыл вот он
06:21
открывается вот он тут же закрывается
06:23
future завезут нас атрибуты
06:25
что не значит начать то что с этой это т
06:27
который отвечает у нас за тип
06:29
содержимого указывать такую команду и
06:33
содержимое нас это wasd эмаль формате to
06:36
seduce того что эмаль формате написано и
06:38
кодировку utf8 ну собственно вот это
06:42
важный т.к. 5 если вы не укажете скорее
06:45
всего проблем с кодировку не будет в
06:47
большинстве браузеров но кит
06:48
определенную проблему тех нибудь браузер
06:50
кисямур старых браузеров обязательно
06:53
появится поэтому всегда всегда указаны
06:55
кодировку верстальщики или не вы этого
06:57
никогда не указывают разводилы которые
07:00
начал просто кроме просто лень это
07:02
делать и все вот но вы всегда указывайте
07:04
дальше давайте мы сами укажем еще один
07:07
метатег дискрипшн у него также имеет
07:13
определенное имя которой указывается эти
07:16
три бусины дискрипшн на в контенте мы
07:19
указываем просто некое описание обычном
07:23
описание нашей первый веб-страницы есть
07:27
некая просто к это писание своими
07:28
словами я вещь это важно и потому что
07:32
поисковики это все учитывают и они эту
07:34
штуку любит выставлять в качестве
07:37
описания веб-страниц и например на
07:39
выбери запрос там купить ноутбук и у вас
07:42
допустим там на пятой позиции ваш сайт
07:44
там ноутбук такой то и под этим
07:48
заголовком
07:49
у вас идет такое описание и красоту
07:51
штука целиком копируется с этой странице
07:53
не всегда такое бывает но частенько
07:56
поэтому всегда указывайте так чтобы это
07:57
было понятно что на этой странице вообще
08:00
имеется следующее вот я представлю сюда
08:05
от курса рыжему control g-shock дубли из
08:06
дублировать строку очень удобный
08:08
редактор ещё раз повторяю
08:10
тут указываю keywords
08:12
это ключевые слова общие слова это
08:16
определенно такие вот ключевые запросы
08:19
которые пользователь может водить и при
08:21
этом вы должны сказать что этот ваша
08:24
страница этим запросам соответствует
08:26
например там
08:28
веб-страница 1 выпуск
08:32
веб-страница ну и как бы просто в
08:37
признавать html
08:39
что-то такой ticket определенные
08:41
ключевые запросы которые который должен
08:44
wars отображаться опять же не
08:46
обязательно но я вас уверяю это важно то
08:51
есть поэтому точки зрения то брожение
08:54
сайта не как она это это не повлияет
08:55
идет экипаж у мышц написали то все будет
08:57
прекрасно работать и так но грамотно
09:01
верстальщики сюда вот это вот напишет
09:03
поэтому вы если вы хотите быть именно
09:04
грамотный верстальщика тот пожалуйста
09:06
тот используйте принципе пока нам для
09:11
самого такого минимум это будет уже
09:12
достаточно это было нас голова документу
09:15
есть текст внутри тега hide мы написали
09:17
несколько тегов давайте сами внутри тела
09:21
документа будем уже другие теги писать
09:26
например т.к. h1 усам будем все их все
09:28
проходить обязательно приду не
09:30
беспокойтесь этим тоже тут напишем
09:36
давайте заголовок нашей первый
09:40
веб-страницы допустим еще т.п. добавим
09:47
текст на нашей первый веб-страницы
09:51
то есть пока такой самый-самый минимум а
09:54
теперь сайте они попытаются это весьма
09:58
html документ открыть это просто берем
10:02
кликаем два раза нас открывается в
10:05
браузере и вот таким образом у нас
10:08
отображается сможем открыть исходники
10:10
control and увидим весь наш код который
10:13
мы написали и так что мы сами видим мыса
10:16
видишь наса переход тайтл от пожалуют он
10:21
тайтон это из-за голов купе страниц ведь
10:22
он оказывается еще раз говорю теги тайтл
10:24
на каждой странице всегда нужно его
10:27
указывать если мы например его не укажем
10:29
то принципе что такого страшного не
10:30
будет вот но просто заголовок 2 цена
10:32
а станет виде просто адреса страниц что
10:35
конечно же смотрится не очень хорошо
10:37
поэтому мы его возвращаем
10:40
а все вот эти метатеги нас тут никак не
10:42
отображаются служебные теги которые не
10:46
для пользователя это которые для
10:48
поисковых систем для браузеров которые
10:52
должны все это обрабатывать но никак не
10:53
будь то есть пользователю вот это все
10:55
вообще не видит ни как затем в теле
10:59
документ у нас выводится все то что
11:01
отображается на самой странице то есть
11:03
это вот все считать это все body тело
11:06
документ тут нас все это и выводится
11:10
сразу хочу отметить что вообще html это
11:13
язык который не отвечает за внешний вид
11:16
html отвечает только лишь за структуру
11:19
документа внешний вид как в этом узнаете
11:22
у нас отвечает css то есть любой там
11:24
цвет текста размер текста выравнивания
11:28
отступ и
11:30
фонда же страница это все относится к
11:32
css у нас html это не отвечать хотя
11:36
конечно же можно и раньше например там
11:38
лет 10 назад
11:39
писали там бггг color там чтобы даже
11:43
чтобы саша очень много лет это не писал
11:46
попробую вот видите получилось вот но
11:48
вот это все уберите не даже не сказать
11:50
этот кошмар то есть так писали еще лет
11:54
семьдесят был допустим и там или пять
11:55
назад
11:56
но сейчас конечно также писать не стоит
11:58
хотя черное все это работает и вы можете
12:00
это все использовать но просто не надо
12:02
заниматься потому что черт нужно
12:04
отделять структуру от внешний вид мы щас
12:06
просто в html описан структуру а
12:09
предстоит а все то есть мы с вами в этом
12:11
уроке познакомились с нашей первой
12:15
странице мы с вами научились писать
12:18
html-код научились создавать файлы html
12:21
а научились писать основные html теги
12:24
html
12:25
head & body нас три основных html-тега
12:29
ключевых которые есть на любой странице
12:31
на которые не должны быть и любой
12:34
грамотный верстальщик их обязательно
12:36
укажут хотя безусловно сам день часам
12:38
один эксперимент покажу на бы сейчас
12:40
сотру я ведь я вот так вот сделал стали
12:44
так вот эти теги — первых проблемы сразу
12:47
с котировкой возникли ну хорошо я
12:50
оставлю метатег
12:55
эти какой ты на самом деле важны вот эти
12:59
тасс
12:59
точки зрения внешний вид нас не снизойти
13:02
ничего мы тут стерли все-таки теги не шт
13:04
имели тут не doctype и нету ни бани
13:06
вообще ничего этого нету все прекрасно
13:08
все то же самое но так писать и не менее
13:11
нельзя еще раз говорю должно быть все
13:14
максимально грамотно вот я ведь такой
13:18
толстой чуть изменился но не суть уж я
13:21
думала это поняли и следующем уроке мы с
13:24
вами будем можно знакомиться с тегами
13:26
более подроб пока что с вами просто их
13:28
использовали но я пока и даже не
13:29
объяснял тысяч уроки сами будем
13:30
знакомиться с тегами заголовков а пока
13:33
спасибо за внимание