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

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

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

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

Что вам понадобится

  • Текстовый редактор, такой как Блокнот (для Windows) или Textedit (на Mac).
  • Веб-браузер Mozilla Firefox или Safari .
  • Компьютер с интернет подключением
  • Файловый менеджер, такой как Windows Explorer (необязательно)
  • Веб-сайт для хостинга изображений, такой как Photobucket или Flickr.
Информация
Посетители, находящиеся в группе Guests, не могут оставлять комментарии к данной публикации.