DVKuklin.ru

Учебник по программированию.

Создание сайтов. Первые шаги.

 

 

Учебник по программированию. Первые шаги. Язык программирования PascalABC.NET.
Назад в содержание Следующий параграф

§1. Общие сведения. Наша первая страничка.

Общие сведения.

В этом разделе информация будет приведена в виде тезисов. После их прочтения у вас должна сформироваться единая картина всего, что связано с созданием сайтом.

Как было уже сказано в разделе «От автора» некоторые понятия могут быть не совсем точными. Однако воспринимайте их именно в таком виде. На данном этапе нет необходимости обращать внимание на некоторые сложные нюансы. Со временем в практической деятельности вы сами во всём разберётесь.


Интернет сайт или просто сайт – это совокупность интернет страниц и файлов, связанных между собой и размещённых в Интернете.

Интернет страница – текстовый файл, написанный на языке html и имеющий расширение html.

Интернет страницы (файлы с расширением html) отображаются на мониторе цифрового устройства с помощью программы, которая называется браузером. Если вы пользуетесь операционной системой Windows, то у вас должен быть уже браузер Internet Explorer. Существуют и другие: Opera, Firefox, Google Chrome, Яндекс Браузер и др. В дальнейшем они все вам понадобятся, т.к. в каждом из них страница может отображаться по-разному. Именно поэтому вам придётся проверять вашу страницу в различных браузерах и переделывать её до тех пор пока она ни начнёт отображаться корректно во всех.

Размещение сайта в Интернете означает, что эта совокупность страниц и файлов находится на каком-либо сервере, который, в свою очередь, подключён к Интернету и который может отправлять эти страницы и файлы другим компьютерам.

Сервер – «огромный компьютер», который принимает информацию из Интернета, обрабатывает её и отправляет нужные файлы обратно в Интернет.

Интернет – совокупность всех компьютеров, серверов, а так же любых цифровых устройств, соединённых между собой проводами или с помощью устройств передающих информацию без проводов, по средствам электромагнитных волн. У каждого компьютера, сервера или устройства, подключённого к Интернет есть свой индивидуальный адрес (IP – адрес). В рамках данной книги не буду вдаваться в подробности и расписывать что это такое, на данном этапе для Вас главное знать, что он есть у каждого устройства и он у каждого свой.

Так вот, передача информации в Интернете происходит следующим образом: допустим, что компьютеру с адресом 1 необходимо передать информацию компьютеру с адресом 122. Напрямую они ни как не соединены. Однако они могут установить связь через другие компьютеры, например с адресами 33 и 45. Для наглядности приведу рисунок:

передача информации в Интернете

Как поступит компьютер с адресом 1 в таком случае. Для начала он разобьёт всю информацию на небольшие кусочки (пакеты). Далее к этим пакетам он прикрепит адрес компьютера, которому предназначена эта информация (в нашем случае 122). Затем он пакет за пакетом отошлёт информацию компьютеру с адресом 33. Тот в свою очередь перешлёт эти пакеты компьютеру с адресом 45, а тот компьютеру 122. Получив все пакеты, компьютер 122 соберёт их вместе.

Совокупность правил, по которым информация разбивается на пакеты и передаётся от компьютера к компьютеру, называется протоколом передачи информации.

На практике компьютеры связаны между собой не «одной линией» а множеством. Если каждый компьютер обозначить маленькой точкой и соединить их линиями, то получится рисунок похожий на паутину. Отсюда и появился термин «Всемирная паутина».

Для того, что бы скачать какой-либо файл с какого-либо сервера необходимо знать IP-адрес сервера и путь к файлу. На практике это не очень неудобно. А так как сайт – не что иное, как совокупность файлов, то у каждого сайта есть своё доменное имя, которому соответствует определённый IP-адрес и путь. Список доменных имён и соответствующих им IP-адресов и путей к файлам хранится на определённом сервере. В тот момент, когда мы набираем в адресной строке браузера доменное имя и нажимаем «Enter» браузер вначале «отправляется» на этот сервер и узнаёт соответствующий IP-адрес и путь к файлам.

Соответственно для просмотра того или иного сайта необходимо ввести его доменное имя в адресную строку браузера и нажать «Enter». На следующем рисунке показан браузер Opera, в котором загружен сайт «Яндекс». Так же на нём адресная строка обведена красным овалом и в ней набрано доменное имя «www.yandex.ru».

Адресная строка в браузере

При вводе доменного имени, мы сначала попадаем на главную страницу сайта. Как было уже сказано, интернет страница – это текстовый файл с расширением html. Как правило, любая главная страница любого сайта должна иметь имя «index.html».

Хостинг – услуга по размещению сайта на сервере. Когда ваш сайт будет готов, необходимо будет разместить его в Интернете. Для этого вы воспользуетесь услугами какой-либо компании, которая предоставляет хостинг. Плюсом к хостингу эта компания может зарегистрировать доменное имя вашего сайта. Стоит это не дорого. Так же она может предоставить вам бесплатное доменное имя, только в нём окажется слово из названия этой компании.

Учиться создавать сайты можно, и не размещая их в интернете. Сайт может располагаться и у вас на компьютере.

Для написания интернет страниц вам понадобится редактор кода. Хотя каждая интернет страница – всего лишь текстовый файл с расширением html, и вы можете использовать любой текстовый редактор, но гораздо удобнее пользоваться редактором кода, который будет выделять различными цветами определённые слова. Так же, как правило, любой редактор кода обладает ещё другими возможностями облегчающими работу. При написании учебника я буду пользоваться программой Notepad++. Распространяется она бесплатно, и скачать её можно на сайте http://notepad-plus-plus.org. Если у вас нет другого редактора кода, то рекомендую использовать именно её.

Помимо html для создания сайтов используются следующие языки:

  • CSS – язык стилей. С его помощью задаётся различный вид элементов интернет страницы (цвет, размеры, выравнивание и многое другое);
  • JavaScript – язык программирования, который позволяет интернет страницам реагировать на действия пользователя, а так же выполнять какие-либо необходимые действия. Т.е. делает их динамическими. Код программы на этом языке не требует компиляции и встраивается прямо в код интернет страницы, сама программа при этом выполняется браузером на компьютере пользователя;
  • Java – язык программирования, который так же как и JavaScript позволяет делать страницы динамическими. В отличии от JavaScript он обладает большими возможностями, поэтому в целях безопасности для того, что бы он заработал пользователь должен дать на это согласие, нажав соответствующую кнопку в появившемся окошке;
  • PHP – язык программирования, позволяющий выполнять какие-либо действия перед тем, как страница будет отправлена пользователю. В отличии от JavaScript сама php программа выполняется на сервере.


Ещё одно понятие, которое вы должны знать – это валидатор. Валидатор – программа, которая проверяет интернет страницы на ошибки и которая находится по адресу http://validator.w3.org. Когда вы будете создавать полноценные сложные интернет страницы, как раз с помощью него вы сможете проверить их на наличие ошибок.

Наша первая страничка.

Если у вас ещё нет какого-либо редактора кода, то откройте обычный Блокнот, который есть в любой операционной системе семейства Windows. Найти его можно по следующему пути: «Пуск -> Все программы -> Стандартные -> Блокнот».

Создайте новый документ и наберите «Привет всем!». Затем сохраните его под именем «index.html». Для этого нажмите пункт меню «Файл -> Сохранить как…». И в открывшемся окошке выберете или создайте свою папку и наберите index.html. В строке «Кодировка» выберете «UTF-8». Затем нажмите кнопку сохранить:

Кодировка UTF-8

Поздравляю, мы создали первую страницу! Теперь можно её открыть в браузере. Для этого щёлкните два раза по файлу. Вероятней всего у вас автоматически откроется интернет браузер, который покажет нашу страницу. Если этого не произойдёт, то откройте браузер сами и в адресной строке укажите полный путь к файлу. У вас должно получиться примерно следующее:

Наша первая страничка

Задание.

1. Разберитесь со всеми понятиями, приведёнными в данном параграфе. Это значит, что вы должны уметь рассказать кому-либо об этих понятиях своими словами. Для более глубокого понимания рекомендую, поискать информацию по этим понятиям в Интернете.

2. Если у вас нет редактора кода, то скачайте и установите Notepad++. Скачивайте с того сайта, который указан в параграфе, что бы не скачать вирус.

2. Скачайте и установите на свой компьютер следующие браузеры: Opera, Firefox, Google Chrome, Яндекс Браузер. А так же если у вас нет Internet Explorer, то установите и его. Браузеры скачивайте на официальных сайтах, что бы не нарваться на вирусы.

3. Подготовьте какой-либо текст в программе Microsoft Word. Это может быть какой-то реферат или контрольная работа. Затем создайте из него текстовый файл и сохраните с расширением html. Не забудьте изменить кодировку на UTF-8. Это необходимо для того, что бы в браузере русские буквы отображались корректно. Имя файла можете дать любое на ваше усмотрение. Этот текстовый файл мы будем использовать в последующих параграфах.

Совет: это задание проще выполнить следующим образом: выделите весь текст в программе Microsoft Word (либо мышкой, либо комбинацией клавиш «Ctr+A»). Далее нажмите клавиши «Ctr+C». Откройте блокнот или редактор кода и нажмите «Ctr+V». После этого ваш текст появится в блокноте (редакторе). Далее сохраните документ как это сделано в разделе «Наша первая программа».


Назад в содержание Следующий параграф