- Первые два урока можно назвать подготовительными. Теперь с помощью перечисленных редакторов кода попробуем набрать простейшую веб-страницу и разместить ее в сети Интернет. Свои обучающие курсы я всегда начинаю с этого, чтобы как то заинтересовать учеников, ведь изучение кода достаточно скучное занятие. В программе DreamWeaver Вы должны увидеть вот это:
- В браузере Вы должны увидеть вот это:
- Но все это Вы видите у себя на компьютере, а наша цель донести информацию до пользователей сети Интернет. Необходимо "арендовать" у хостера (провайдера) место для размещения своего сайта (хостинговый аккаунт) и доменное имя. Необязательно платить за это, в Интернете достаточно провайдеров, которые предоставляют доменные имена и аккаунт на третьем уровне бесплатно, либо на втором уровне дают тестовый период для того, чтобы Вы могли попробывать и оценить возможности их сервера. Можно арендовать на месяц, квартал или год по тарифам хостинговой компании.
- У каждого хостера аккаунты выглядят по разному, имеют свой интерфейс, при этом функционал идентичен. В любом случае Вы сначало регистрируетесь, потом получаете доступ к ресурсу. На сервере Вам надо найти директорию куда загрузить свой сайт, если не нашли, то спросите в тех.поддержке провайдера. Мне, например, из бесплатных и тестовых аккаунтов понравился размещенный по адресу домена beget.com, выглядит так (но можно найти еще с десяток в Google по запросу "бесплатный хостинг"):
- Будем считать, что Вы справились с задачей написания простенькой страницы в HTML-коде и загрузили ее на хостинг провайдера. Если что то не получается, если не видите результатов своего труда, ищите синтаксическую ошибку: где-то в коде недостает знака, проверяйте пути загрузки файлов, возможно, что фото расположено не в той директории, к которой указан путь в коде.
- Кстати совет: поменьше директорий, можно весь контент сайта сваливать в одну корневую папку, скорость загрузки от этого увеличивается.
Но имена файлов при этом следует называть так, чтобы легко было находить их в общей куче, например все иконки должны начинаться со слова icon_..., а графические кнопки со слова button_...