Создание сайта на HTMLЗдравствуйте, меня зовут Михаил Русаков! В этой статье я расскажу Вам о создании простейшего сайта. Кто знает, может быть, знания, которые Вы получите в этой статье, впоследствии станут началом Вашего успеха. Я склонен полагать, что у Вас имеется большое желание научиться создавать свои собственные сайты. Разумеется, крайне глупо пытаться познать эту науку с изучения какого- нибудь PHP. Гораздо разумнее начать с чего- нибудь попроще, а именно с HTML (Hyper. Text Markup Language - язык гипертекстовой разметки) - базового языка, на котором и построен любой, даже самый сложный сайт. Без этого языка не было бы ни одного сайта, более того, HTML - простейший язык, который может освоить даже школьник (яркий пример - Ваш покорный слуга, начавший осваивать HTML ещё в школе, причём весьма успешно). Ладно, хватит болтовни - пора приступать к созданию нашего с Вами первого сайта, и этот процесс будет называться: "Создание сайта на HTML". Первое, что нужно решить: где создавать сайт? Разумеется, можно и в обычном блокноте. Но это несерьёзно (мы так в школе писали), поэтому давайте лучше будем использовать что- нибудь "потяжелее". .то в результате пользователю выводится непонятный набор символов, особенно часто это происходит в старых почтовых программах. То же самое происходит и с HTML-страницами сайта. Если документ был сохранен, например, в кодировке UTF-8, а в самом документе.. Выберите кодировку : Поставьте ссылку на наш сайт! Программа попытается угадать кодировку, а если не получится, покажет примеры всех. Выберите кодировку . Поставьте ссылку на наш сайт! Программа попытается угадать кодировку, а если не получится, покажет примеры всех . Сегодня мы поговорим с вами про то, откуда берутся кракозябры на сайте и в программах, какие кодировки текста существуют и какие из них. Теги Font (Face, Size и Color), Blockquote и Pre — устаревшее форматирование текста в чистом HTML (без использования CSS).. Существует отличная программа Notepad++, которая позволяет полностью писать и изменять исходный код, и, в том числе, поменять кодировку сайта. Какая кодировка должна быть установлена – для нас теперь не вопрос. Для всех документов, в том числе HTML, кодировка.. Я остановил свой выбор на редакторе "Notepad++" - замечательная программа, которая позволяет писать код на огромном количестве языков, в том плане, что это будет весьма и весьма удобно. Не буду сильно её хвалить, потому что для написания кода для серьёзных языков (Java, C++ и т. Но для таких языков, как HTML, CSS, Java. Script и даже PHP - очень хороший выбор. Скачать Notepad++ можно, пройдя по этой ссылке: http: //notepad- plus. Устанавливаем и запускаем редактор. Сразу сохраняем страницу под именем index. Теперь пишем (пожалуйста, напишите, а не скопируйте!) в окне редактора: < html> < head> < /head> < body> < /body> < /html> Написали? Сохранили? Поздравляю Вас, Вы только что создали самую простую (но очень важную!!!) HTML- страницу! Теперь можно нашу страницу открыть в браузере. Так и поступим. Что- нибудь видите? Я уверен, что нет. И это неудивительно, ведь это самая элементарная страница. Вы можете посмотреть исходник страницы. Для этого в меню "Вид" выберите пункт меню "Просмотр HTML кода", "Исходный код страницы" или что- то в этом духе, в зависимости от Вашего браузера. Также можно просто нажать CTRL- U (в большинстве браузеров откроется исходный код страницы), и Вы увидите Ваш код. А теперь давайте обсудим, что мы здесь написали.< html> , < head> , < body> - это открывающие теги. Иногда их ещё называют дескрипторы, но я привык называть их тегами, поэтому далее так и буду писать.< /html> , < /head> , < /body> - это закрывающие теги. Теги бывают парные и одиночные. Парные теги - это теги, которые нуждаются в закрывающем, то есть все три тега, которые мы использовали являются парными, так как они открываются и потом закрываются. Одиночные теги - это теги, которые не требуют наличие закрывающего тега. Теперь что касается назначения данных тегов. Тег < html> означает начало HTML- документа. Тег < head> означает начало заголовка HTML- документа. Сюда могут входить, например, заголовок страницы, различные мета- теги. Обо всём об этом погорим чуть ниже. Тег < /head> означает конец заголовка HTML- документа. Тег < body> означает начало самого документа. То есть всё (текст, картинки, ссылки и т. Вы видите на страницах в Интернете - всё расположено в теге < body>. Тег < /body> означает конец содержимого документа. Тег < /html> означает конец HTML- страницы. Теперь давайте немного добавим в нашу страницу кода, уж, больно она примитивная у нас пока. Внутри тега < head> добавьте такой код: < title> Наша страница< /title> < meta http- equiv="Content- type" content="text/html; charset=windows- 1. Тег < title> определяет заголовок страницы, который будет отображён в заголовке окна браузера. Тег < /title> сообщает, что здесь заголовок заканчивается. Что касается тега < meta> , то здесь сначала я должен сообщить об атрибутах тегов. У тегов могут быть различные атрибуты, определяющие, например, вид их содержимого. Атрибуты ставятся внутри открывающего тега и имеют следующий вид: Название = "значение". Тег < meta> у нас определяет тип содержимого документа. Атрибут http- equiv и его значение Content- type определяет, что сейчас будет описан тип документа. Атрибут content и его значение text/html; charset = windows- 1. HTML- документом (text/html), и кодировка этого документа кириллица (windows- 1. Это был пример мета- тегов. Я думаю, что пока с ними хватит. Теперь займёмся содержимым документа. Надеюсь, что Вы уже поняли, что раз содержимое страницы - значит, будем писать что- то внутри тега < body>. Давайте напишем следующий код внутри тега < body> :< h. Заголовок 1- го уровня< /h. Заголовок 2- го уровня< /h. Заголовок 3- го уровня< /h. Заголовок 4- го уровня< /h. Заголовок 5- го уровня< /h. Заголовок 6- го уровня< /h. Теги < h. 1> , < h. Причём этот текст является заголовком, более того, чем больше цифра (от 1- го до 6- ти), тем менее крупным шрифтом будет выведен соответствующий текст. Таким образом, код Вашей страницы имеет вид: < html> < head> < title> Наша страница< /title> < meta http- equiv="Content- type" content="text/html; charset=windows- 1. Заголовок 1- го уровня< /h. Заголовок 2- го уровня< /h. Заголовок 3- го уровня< /h. Заголовок 4- го уровня< /h. Заголовок 5- го уровня< /h. Заголовок 6- го уровня< /h. Сохраните страницу и посмотрите на неё в браузере. Также можно добавить немного атрибутов и в тег < body>. Давайте добавим атрибут text со значением green (зелёный). И атрибут bgcolor со значением yellow (жёлтый). Таким образом, тег < body> выглядит так: < body text = "green" bgcolor = "yellow"> < h. Заголовок 1- го уровня< /h. Заголовок 2- го уровня< /h. Заголовок 3- го уровня< /h. Заголовок 4- го уровня< /h. Заголовок 5- го уровня< /h. Заголовок 6- го уровня< /h. Сохраните страницу и посмотрите на неё в браузере. Как видите, фон страницы стал жёлтым, а текст стал зелёным. Думаю, что на сегодня хватит для Вас материала. Очень полезно будет потренироваться в выводе разного текста, разными цветами. Увидимся в следующей статье! С уважением, Михаил Русаков. P. S. Бесплатный курс по HTML: http: //srs. Копирование материалов разрешается только с указанием автора (Михаил Русаков) и индексируемой прямой ссылкой на сайт (http: //myrusakov. Если у Вас остались какие- либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы. Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте).
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. Archives
December 2016
Categories |