Как создать простую веб страницу с помощью HTML

Опубликовал Admin

28-09-2016, 04:30

9 650

Несмотря на то, что вы можете создать веб-страницу и без знания HTML, вам все равно придется изучить этот язык разметки для того, чтобы решать все проблемы, которые неизбежно возникнут. Существует множество отличных веб-сайтов, которые помогут вам в изучении HTML, данная же статья поможет вам ознакомиться с основами сайтостроения. Ознакомившись с основами, вы вскоре сможете создавать веб-страницы с чистого листа!

Использование HTML

Ознакомьтесь с понятием HTML. HTML – это язык разметки документов для создания веб-страниц. Чтобы узнать, как он выглядит, откройте свой браузер, щелкните правой кнопкой мыши и выберите опцию "Посмотреть исходный код". В открывшемся окне вы увидите строки кода, это и есть HTML. Этот код именно то, что видит ваш браузер и трансформирует в веб-страницу.
- В Google Chrome, нажмите на F12.
- В Mozilla Firefox, нажмите на Ctrl + U, чтобы посмотреть исходный код странички.
- В Safari, выберите View - View Source (или Option + Command + U).
- В Internet Explorer, опция меню View - это "source".
Сделайте вашу первую веб-страницу как можно более простой. В противном случае вы рискуете запутаться в синтаксе и скриптовых языках.
- Важно помнить, что вы будете вносить всю информацию между открывающими и закрывающими HTML тегами. Открывающий тег выглядит так: <___>. Закрывающий же тег выглядит так: </___>. В процессе создания “___” заменяется соответствующим кодом.
Нажмите "Пуск", затем "Программы", а затем "Стандартные". Запустите приложение "Блокнот". Вам будет гораздо проще использовать Notepad++ (скачайте бесплатно с интернета) – как только выберите язык HMTL, ваш код будет отображаться в различных цветах, упрощая вашу работу и поиск будущих ошибок.
Сообщите браузеру об используемом языке. Введите <html>. Это первый тег, который необходимо напечатать, так как именно он сообщает компьютеру о том, что вы начинаете создание веб-страницы. Закрывать данный тег также следует в самом конце, сделать это вы сможете, введя </html>. Это сигнализирует окончание веб-страницы.
Добавьте заголовок страницы, как показано ниже.
Дайте своей странице название. Название веб-страницы очень важно, так как оно даст посетителям представление о ее содержании. Также, при добавлении сайта в закладки, именно название страницы отображается в их списке. Тег для добавления названия в HTML <title>. Не забудьте закрыть его после названия, введя </title>. Название будет показано в заголовке вкладки, однако оно не является названием всего веб-сайта.
Проработайте основное содержание страницы. Введите <body> для того, чтобы обозначить начало "тела" документа. Для того, чтобы обозначить его конец введите закрывающий тег </body>. Основная информация для создания вашей веб-страницы будет находиться между этими двумя тегами.
- Для того, чтобы изменить цвет фона вашей веб страницы вы можете использовать слить. Для этого вместо простого тега <body> введите <body style="background-color:silver">. Это изменит цвет фона с белого на серебристый. Вы можете попробовать ввести другие цвета или использовать HEX-код. Слова после кавычек являются атрибутами. Атрибуты должны быть заключены в кавычки.
Введите какой-нибудь текст между тегами <body>.
- Для того, чтобы перенести часть текста на следующую строку (как после нажатия клавиши Enter), введите <br>.
- Хотите создать бегущую строку на экране? Просто введите <marquee>ТЕКСТ СООБЩЕНИЯ</marquee>
Добавьте изображения. Если вы хотите разместить на вашей веб-странице картинку из интернета, вам потребуется ввести следующий HTML код <img src="URL(адрес файла в интернете)">. Закрывающий тег </img> однако вводить его необязательно, вместо этого можно ввести символ / в конце открывающего тега.

Советы

Исправляйте найденные ошибки.
Неправильное расположение открывающих и закрывающих тегов выглядит следующим образом: <tag1><tag2> содержание </tag1></tag2>.
Используйте шаблон для тестирования изменений на ваших собственных веб-сайтах перед тем, как делать реальные изменения.
Данная статья рассказывает о том, как создавать веб-страницы. Для того, чтобы разместить свой сайт в интернете обратитесь за помощью к другим статьям на wikiHow.
Открывая каждый тег, помните, что вам его необходимо закрыть. Исключения составляют несколько специальных тегов таких, как <img> и <hr>. Если же у вас возникли сомнения на этот счет, то лучше перестраховаться и закрыть тег.
Хорошее приложение для работы с HTML – Espresso: упрощает написание кода, предоставляя различные ярлыки и возможность привью вашей странички без изменения тегов с .html на .txt!
Закрывающие тэги должны находится в правильном месте. Следите за тем, чтобы последний открытый тег был закрыт первым. Выглядит это так: <tag1><tag2> содержание </tag2></tag1>.
Если вам необходимо исправить исходный код, измените расширение вашего файла с .html на .txt. Также вы можете просто сохранить две копии файла, одну с расширением .html и другую с - .txt.
Многие люди неплохо зарабатывают разработкой веб-сайтов. Оттачивайте свои навыки, и вы сможете делать то же самое.
Для создания более продвинутых сайтов вы можете использовать специальные редакторы такие, как Microsoft Expression Web.
В интернете вы можете найти огромное количество учебных материалов по теме. Попробуйте поикать в Google учебники по HTML.
Для разработки веб страниц можно использовать Adobe Dreamweaver. Это программа укажет вам на допущенные вами ошибки и предложит способы их исправления.
Если ваша веб-страница не отображается должным образом, скопируйте пример кода из статьи и сохраните, следуя данным указаниям. Используйте этот код для изучения.
Научившись этому мастерству вы сможете удивить ваших друзей, создав веб-сайт в течении нескольких минут. Когда вы посетите одного из ваших друзей, предложите помочь с веб-сайтом, скорее всего, они будут очень удивлены.

Предупреждения

Атрибут bgcolor является устаревшим. Правильным способом изменения цвета фона элементов является использование CSS.
Тег <marquee> не является официальном HTML тегом в соответствии со стандартами W3C (Консорциумом Всемирной паутины) и может не поддерживаться некоторыми браузерами. Первоначально тег был предназначен только для Internet Explorer>, однако сегодня он поддерживается и другими браузерами.
Не забудьте добавить расширение .html или .htm при сохранении файла, а также в графе "тип файла" выберите "все файлы". Если этого не сделать, ваш файл не запустится.
Размещайте картинки и изображения с вашего сайта на специальных хостингах таких, как Photobucket, Flickr or Imageshack. Так вы сможете избежать напрасной траты ресурсов вашего хостинг-провайдера.