Сучасній людині важко уявити собі життя без різних засобів зв'язку. Пошта, телефон, радіо та інші комунікації перетворили людство в єдиний "живий" організм, змусивши його обробляти величезний потік інформації. Підручним засобом для обробки інформації став комп'ютер.
Однак масове використання окремих, не взаємозв'язаних комп'ютерів породжує ряд серйозних проблем:

• як зберігати використовувану інформацію,
• як зробити її загальнодоступною,
• як обмінюватися цією інформацією з іншими користувачами,
• як спільно використовувати дорогі ресурси (диски, принтери, сканери, модеми) декільком користувачам.

Вирішенням цих проблем є об’єднання комп’ютерів у єдину комунікаційну систему – комп’ютерну мережу.
Комп'ютерна мережа (KM) - Computer Network - це група комп'ютерів або інших пристроїв, що з'єднані між собою та можуть використовувати спільні інформаційні ресурси (файли, бази даних, Інтернет, принтери..). З'єднані комп'ютери можуть бути за допомогою проводів (кабелів) або за допомогою безпровідного зв'язку.

Загальна схема з'єднання комп'ютерів в локальній мережі називається топологією мережі.

ШИНА (горизонтальна)
Магістральна (шинна) топологія реалізується у вигляді пасивного моноканалу (магістралі).
Ця топологія найпоширеніша. Вона використовується у випадку, коли інформація передається рідко (в порівнянні з можливостями комп’ютерів), дані комплектуються в пакет, дістають адресу і після того, як магістраль стане доступною, відбувається передача повідомлення.

• Дані передаються в обох напрямках одночасно
• Нескладність управління
• Важко шукати несправності.
• Необхідно резервувати головну шину.

 

ЗІРКА
Центральний вузол відповідає за маршрутизацію даних через себе та локалізацію несправностей.

 

 

 

КОЛО (кільце)

Кільцева топологія передбачає послідовне з’єднання абонентів з каналами передачі даних, внаслідок чого утворюється замкнуте кільце.
Кожен абонент відіграє роль ретранслятора повідомлення з невеликою часовою затримкою.

Звичайно дані поширюються в одному напрямку, від станції до станції.

При відмові каналу між двома станціями відмовляється працювати вся мережа.

Характеристики	Зірка	Кільце	Шина
Вартість розширення	Незначна	Середня	Середня
Необхідність виключення при розширенні	Ні	Так	Ні
Під’єднання абонентів	Пасивне	Активне	Пасивне
Розміри системи	Будь-які	Будь-які	Обмежені
Захищеність від прослуховування	Добра	Добра	Незначна
Вартість під’єднання	Незначна	Незначна	Висока
Поведінка системи при високих навантаженнях	Хороша	Задовільна	Погана
Розводка кабелю	Добра	Задовільна	Добра
Обслуговування	Дуже хороше	Середнє	Середнє
Характер відмови	Повна	Повна	Часткова

За територіальною ознакою КМ поділяються на: локальну, регіональну та глобальну (Інтернет).
Локальна мережа - це група об'єднаних ПК, які розташовані в одній будівлі чи одній організації (наприклад, школі, університеті, магазині, банку).
В літературі часто зустрічаються назви або скорочення:

• ЛОМ - Локальна обчислювальна мережа,
• ЛВС - локальная вычислительная сеть,
• LAN - Local Area Network.

Найпростішим прикладом ЛОМ є два ПК з'єднані між собою за допомогою спеціального кабелю.

Для об'єднання трьох та більше ПК потрібен спеціальний пристрій - комутатор (switch).

Локальні мережі дозволяють виконувати:

• колективну обробку інформації користувачами, підключених в мережу, і обмін даними між користувачами (спільне використання документів, зображень, музики, фільмів та баз даних);
• спільне використання периферійних пристроїв (принтерів);
• спільне використання ресурсів мережі Інтернет та електронної пошти.
• спілкування в мережі в режимі реального часу (у текстовому режимі або голосом)
• адмініструвати - дозволяти або обмежувати доступ до певних мережевих ресурсів (папок)

Для об'єднання комп'ютерів в локальну мережу необхідно мати для налаштування:
Апаратні засоби:

	Мережева плата (карта) - networkadapter - пристрій в ПК для прийому/передачі інформації
	Комутатор (switch) - пристрій, куди підключаються всі ПК мережі. У великих мережах може бути кілька комутаторів, що в свою чергу з'єднані між собою.
	Мережевий кабель (вита пара) - спеціальний (8-ми жильний) кабель, що може мати максимальну довжину 100м. між двома пристроями. На обох кінцях кабелю є спеціальні роз'єми - конектори (від англ. connect - з'єднання).

 

 

Також налаштувати програмно ПК:

Задаємо ім'я та робочу групу ПК ПКМ на піктограмі  «Мой компьютер» - Свойства - закладка «Имя компьютера». Ім'яПК - довільне слово на англійській мові. Іншої такої назви в локальній мережі бути не повинно Робоча група - англійське слово, яке у всіх ПК в локальній мережі повинно співпадати.

Встановлюємо IP-адресу ПК ПКМ «Сетевое окружение» - Свойства - ПКМ «Подключение по локальной сети» - Свойства - виділяємо «Протокол Интернета (TCP/IP) » - кнопка Свойства Вказуємо IP-адрес - адрес повинен виглядати 192.168.0.Х, де «X» - довільна цифра, яка не співпадає з іншим ПК в мережі Маска подсети - слід вказати таку, як на малюнку. Основной шлюз та DNS-сервер можна не вказувати (для локальних мереж)

При роботі в мережі кожному комп'ютеру відводиться певна роль. Одні ПК надають інформаційні ресурси (сервери) - інші їх використовують (робочі станції).
Робоча станція (workstation) - рядовий ПК в мережі, що використовує мережеві ресурси.
Сервер (server) - комп'ютер, що зберігає, обробляє та надає інформаційні ресурси для інших ПК в мережі. У невеликих мережах може не бути чітко виділеного сервера, в середніх - серверів може бути 1,2,3. У великих мережах серверів є багато.
ПК, що виконує роль сервера має потужну конфігурацію - швидкий процесор, великий об'єм оперативної пам'яті, велика та швидка дискова система та інше. Сервери, як правило, не використовуються в якості робочих місць користувачів. До них потрібен авторизований доступ (користувач, пароль). Сервери, які забезпечують роботу з цінними даними, часто розміщують в ізольованому приміщенні, доступ до якого мають лише спеціально уповноважені люди (як в банківське сховище), які називаються адміністраторами мережі.
Безпровідне підключення (Wireless, WiFi, WiMax) - спеціальна технологія, що дозволяє об'єднувати ПК в безпровідну мережу (без кабелів). Перевага технології в ЇЇ зручності особливо у готелях, аеропортах, виставках (можна мати підключення до Інтернет любому місці будівлі). Регіональна мережа - це сукупність декількох локальних мереж, об'єднаних між собою, в межах певної територіальної одиниці (наприклад міста, району, області).
Прикладом регіональної мережі є:

• мережа, що об'єднує користувачів, які проживають в сусідніх будинках чи в межах одного району міста (досить поширені на сьогодні в густонаселених районах міста);
• мережа підприємства, яке має філіали, що розташовані на відстані десятків або сотень кілометрів один від одного.

NetMeeting (net - мережа, meeting - зустріч) - програма, що дозволяє спілкуватися по мережі в режимі реального часу.
Програма NetMeeting встановлена на кожному ПК, де є операційна система Windows ХР.
Для запуску програми потрібно зайти в папку «..\Program Files\NetMeeting» та запустити файл «conf.exe».
Програма може працювати в локальній мережі та в мережі Інтернет.
Підтримується з'єднання з декількома ПК одночасно (2 та більше ПК між собою).
Основні можливості програми NetMeeting:

• Обмін текстовими та графічними повідомленнями
• Обмін звуком, голосом (при наявності мікрофона та навушників або колонок)
• Обмін відео (потрібна наявність Веб-камери - маленької відео камери на ПК)
• Доступ до «Робочого столу» та працюючих програм з іншого ПК

Увага! Перед використанням програми, потрібно та виконати початкове налаштування з наступними параметрами:

Назва параметру	Значення параметру
«Личные сведения - Имя»	Номер ПК в мережі (наприклад Соmp01). Подивитися можна натиснувши ПКМ «Мой комп.-Свойства», закладка «Имя комп'ютера - Полное имя».
«Личные сведения - Фамилия»	Номер ПК в мережі (наприклад, Соmp01)
«Личные сведения - Электр. Почта»	Номер ПК в мережі (наприклад, Соmp01)
«Пропускная способность»	Локальная сеть
«Виводить значок на Робочий стол»	Так
«Виводить значок на Панель запуска»	Так

Для зміни параметрів надалі можна скористатися пунктом «Сервис-Параметры»

Основні операції в програні NetMeeting (призначення основних кнопок):

Назва кнопки	Призначення
«Вызвать»	3 кнопки «Вызвать» починається вся робота в програмі. У вікні виклику потрібно ввести назву ПК (наприклад Comp02 або Comp03). В полі «Используя» вибрати «Сеть». Примітка: Підключення до іншого ПК відбудеться тільки при умові, що там відкрита програма NetMeeting.
«Конец вызова»	Використовується для закінчення з'єднання з іншими ПК.
«Общие приложения»	Кнопка дає можливість іншим ПК переглядати працюючі програми та «Робочий стіл» на Вашому ПК.
«Разговор»	Обмін текстовими повідомленнями (репліками) в режимі реального часу. Такий спосіб спілкування ще називають «Chat» (чат).
«Доска»	Обмін графічними ескізами. Якщо потрібно схематично щось показати або намалювати при спілкуванні (схему розташування, форму предмету). Або можна просто пограти по мережі «хрестики-нулики».
«Передача файлов»	Використовується для передачі файлів по мережі з одного ПК на інший. Файли отримані з іншого ПК знаходяться в папці «..\Program Fiies\NetMeeting\Received Files». Корисно для пересилання файлів, до яких не даний мережений доступ.

Контрольні запитання

1. В якій папці знаходиться програма NetMeeting, та хто її виробник?
2. Назвати призначення програми?
3. Перерахуйте основні можливості програми?
4. Які пристрої потрібно підключити до ПК для передачі звуку та відео?
5. Показати або описати процедуру з'єднання з іншими ПК в мережі.
6. Розказати про призначення кнопок нижнього ряду «Общие приложения» та «Разговор».
7. Розказати про призначення кнопок нижнього ряду «Доска» та «Передача файлов».

ІНТЕРНЕТ (Inter - між, net - мережа) - глобальна (міжнародна) комп'ютерна мережа. Об'єднання мереж та окремих ПК між собою в одну дуже велику мережу світового масштабу.
Праобразом мережі Інтернет була мережа, призначена для швидкої та надійної передачі даних на випадок війни. Вона була створена в 1969р. спеціалістами і називалася ARPANET.
Об'єднувала між собою 4 наукові центри на різних кінцях США. З кожним роком ARPANET розвивалася І з часом до неї вже було підключені тисячі комп'ютерів.
В 1971р. до мережі були підключені перші іноземні організації Великобританії та Норвегії. В таких умовах ні про яку секретність інформації військових говорити вже не доводилось, тому було прийнято рішення про розподіл ARPANET на суто військову мережі MilNet та загальну науково і просто суспільну мережу.
Додатковим поштовхом до цього стала створення протоколу TCP/IP в 1983, який, окрім того, що визначав правила передачі даних між ПК в мережі, дозволив користувачам дуже легко підключатися до мережі за допомогою звичайної телефонної лінії.
Слід відмітити, що на початку свого існування використовувався лише як засіб пересилання електронних листів, так тривало до кінця 70-х років минулого століття. І лише на початку 90-х років Інтернет набув вигляду подібного до того, якого ми звикли тепер.

Принципи передачі даних. ПРОТОКОЛИ.
В основі передачі даних по мережі Інтернет лежить так званий пакетний принцип. Під час пересилання повідомлень, інформація автоматично розбивається на частини, які називаються пакетами. Усі пакети нумеруються. В заголовок пакета записується його номер, інформація про відправника та одержувача. Пакети пересилаються від одного комп'ютера до іншого, доки не дійдуть до адресата. Проміжні пристрої або ПК, через які проходять пакети, називаються маршрутизаторами. Маршрутизатор визначає, які на даний момент з'єднання існують і які найкраще підходять (менш завантажені) для транспортування пакета. Тому пакети не завжди пересилаються єдиним шляхом. Вони можуть передаватися різними маршрутами. Коли всі пакети дійдуть до місця призначення, спеціальна програма аналізує їхні заголовки, об'єднує пакети й інформація набуває первинного вигляду. Такий спосіб пересилання інформації:

• по-перше, прискорює пересилання файлів, оскільки малі за обсягом частини інформації (пакети) надходять швидко;
• по-друге, якщо на лінії десь виявилися неполадки, то немає потреби заново передавати всю інформацію, автоматично пересилаються лише ті пакети, які не дійшли до адресата.

За правильність поділу інформації на пакети, їх швидку та надійну доставку по зазначеній адресі та правильне об'єднання в кінцевого адресату відповідає протокол.

Протокол - це сукупність правил, у відповідності до яких відбувається передача інформації по мережі. Образно кажучи, це мова спілкування комп'ютерів між собою, яка є зрозумілою для них.

Можливості використання мережі Інтернет:

• Доступ до Інформації на будь-яку тему (наука, політика, спорт, мистецтво, розваги та ніше). Можливість отримання інформації в текстовому, графічному, звуковому та відео вигляді. Вона може бути подана різними мовами та з різною глибиною подачі.
• Постійне оновлення інформації та доступність її 24 години на добу 7 днів на тиждень.
• Швидкий та зручний пошук інформації з усього світу за допомогою спеціальних пошукових систем, що дозволяє значно економити час.
• Перегляд новин, гороскопів, прогноз погоди, курси валют, купівля товарів (книг, дисків) через мережу Інтернет.
• Пошук навчальних матеріалів та наукових робіт (реферати, курсові, дипломні роботи).
• Пошук людей, знайомства та спілкування в режимі реального часу незалежно від відстані. Обмін файлами (фото).
• Пересилання листів електронної пошти за лічені секунди в будь-яку точку планети.
• Проведення відео та звукових конференцій на великі відстані. Люди можуть бути далеко, але бачити та чути один одного.
• Телефонні дзвінки з мережі Інтернет на звичайний телефон в інші країни (значно дешевше). Відправка SMS з мережі Інтернет.
• ...

Для забезпечення цих можливостей існують спеціальні сервіси мережі Інтернет.
Деякі сервіси (служби) мережі Інтернет:

Назва сервісу		Призначення сервісу
WWW (WorldWideWeb - всесвітня мережева павутина)		Найбільш розповсюджений сервіс в мережі, який дозволяє отримати доступ до різноманітної інформації (текстової, графічної), яка представлена у вигляді Інтернет-сторінок, які, в свою чергу, об'єднуються в інтернет-сайти. Розповсюдженість даного сервісу пояснюється тим, що більшість інших сервісів надаються користувачам саме через інтернет-сторінки (спілкування - форуми, чати, пошукові системи, електронні магазини та інше).
E-mail (Electronic mail - Електронна пошта)		Найперший сервіс мережі Інтернет, дозволяє користувачам швидко та надійно отримувати та відсилати по мережі Інтернет електронні листи, які, крім звичайного тексту, можуть МІСТИТИ графічні зображення, відео, звукові повідомлення. Електронний лист може бути доставлений до адресата за кілька секунд, навіть якщо він знаходиться на іншому континенті. Доставка листів є досить надійною, якщо лист не знаходить адресата - він повертається назад. Основною небезпекою є отримання небажаної (рекламної) кореспонденції або повідомлень з вірусами.
Служба FTP (FileTransferProtocol - протокол передачі даних)		Сервіс призначений для передачі/прийому великих файлів з мережі Інтернет. В основному служить для завантаження музики, відео, програм, документації з Інтернет на власний ПК. Комп'ютер, де зберігаються такі дані називається FТР-сервер. Для використання даного сервісу на ПК має бути встановлена спеціальна програма - FТР-клієнт.

Основні поняття при роботі в Інтернет
• Веб-Сайт (Web-site) - інформаційний ресурс, що складається з певної кількості сторінок, що об'єднані певною темою або належать одному власнику. Кожен сайт має свою структуру та систему посилань (links), за допомогою якої можна легко переходити з однієї сторінки на іншу або переходити на інші сайти.
Наприклад, сайт звичайної фірми має наступні розділи:

• Головна (про фірму).
• Продукти та послуги.
• Персонал фірми.
• Контактна інформація.

• Веб-сторінка (Web-Page) - документ, що розміщений в Інтернет, переважно містить текстову та графічну інформацію. Одна сторінка може бути представлена текстовим файлом з розширенням *.htm (*.html), та кількома графічними файлами з розширеннями (*.jpg, *.gif, *.png).
• Адреса сайту (URL) - унікальний запис, що не повторюється, який потрібно ввести в спеціальну програму для відображення вмісту сторінки.
При вводі адреси не допускаються пробіли або кириличні букви. На відміну від паролів тут байдуже великі або маленькі букви.
Приклад адреси: http://www.intel.com

• http:// - необов'язкова службова приставка, що відображає назву протоколу передачі даних.
• www - WorldWideWeb - всесвітня мережева павутина {в окремих випадках не є обов'язковою)
• Intel - назва організації (фірми), якій належить даний сайт
• com - назва домену, що вказує на комерційну (commercial) діяльність даної фірми

• Домен (domain) - обов'язкова приставка до адреси сайту, що вказує на вид діяльності організації або на и територіальне розташування.

Типи доменів:

• за видом діяльності:
  • com - комерційні;
  • net - мережеві;
  • org - організації;
  • edu - освітні;
  • gov - урядові.
• за розташуванням:
  • ua - Україна;
  • ru - Росія;
  • uk - Об'єднане королів.;
  • de - Німеччина;
  • it -  Італія.
• змішані домени:
  • com.ua;
  • gov.ua
При переході «вглиб» сторінки до адреси може додаватися назва розділу або підрозділу. Наприклад: www.intei.com/products/cpu/ - ми перейшли в розділ «Продукти» - підрозділ «Процесори».

• Домашня сторінка (homepage) - сторінка, що завантажується відразу після відкриття браузера.
• Браузер (Browser) - програма призначена для завантаження та перегляду сторінок сайтів або для перегляду раніше завантажених *.htm файлів.
• Гіперпосилання (hyperlink, link) - текст або малюнок, при натисканні на який можна перейти на іншу сторінку або відкрити певний файл. Текст, що містить гіперпосилання називається гипертекстом. Особливістю посилання є те, що при наведенні курсор «мишки» перетворюється на руку.
• Мова HTML (HyperTextMarkupLanguage) - мова розмітки гіпертекстових сторінок. Наприклад, зайти на будь-яку сторінку та натиснути в браузері пункт меню «Вид - Исходный код/Просмотр кода».
• Технологія Flash (блискавка) - технологія анімації або інтерактивної анімації на інтернет-сторінках. Дозволяє краще оформляти сторінки та полегшувати навігацію по ним.
• Портал (portal) - багатофункціональний сайт, на якому знаходяться такі сервіси: пошук, тематичний каталог, новини, погода, афіша, чат, знайомства, електронний магазин, електронна пошта ...
• Пошукова система (searchsystem) - спеціальний сайт, за допомогою якого можна шукати інформацію (текстову, графічну, музику, відео). Наприклад, вводимо в спеціальне поле слово або фразу, а система видає список сайтів, де міститься потрібна нам інформація.
• Завантаження (Download) - процес завантаження файлів (програм, ігор, музики, відеороликів) з мережі Інтернет на власний ЛК. Часто виконується за допомогою FTP та програм Download manager.
• Банер (banner) - невеликий рекламний блок на інтернет-сторінці, що часто відволікає та сповільнює завантаження сторінки. Служить посиланням на іншу сторінку.
• Хостінг (hosting) - процес розміщення власної інтернет-сторінки на спеціальному сервері у провайдера, з метою забезпечення більш надійного та швидкого доступу користувачів до неї.

 

текст

текст

текст

текст

Практична робота 1. Спілкування в локальних мережах. Програма NetMeeting (Windows XP)

• Запустити програму NetMeeting
• Домовитися з учнем, що сидить біля Вас про з'єднання. Бажано це робити попарно
• З'єднати сусідні ПК за допомогою прогарами NetMeeting
• Використовуючи кнопку нижнього ряду «Разговор» обмінятися декількома фразами з іншим користувачем
• За допомогою кнопки Доска намалювати сусіду певне графічне послання або спробувати з ним зіграти «хрестики-нулики»
• Підготувати або знайти файл, який хочете переслати сусіду та за допомогою кнопки Передача файлов , та надіслати цей файл
• Відповідно подивитися, що він надіслав Вам. Згадати, в якій папці містяться файли, отримані за допомогою програми NetMeeting

 

Практична робота 2. Знайомство з Інтернет
Завдання 1. Навігація по Інтернет-сторінкам

• Завантажити програму Mozilla FireFox (або іншу програму перегляду Інтернет-сторінок)
• Перейти в рядок адреси (натиснути клавішу F6)
• Ввести адресу для переходу до ресурсів Google google.com.ua, та натиснути Enter
• Ознайомитись зі змістом відкритої сторінки;
• Натиснути на посилання «Новини»
  


• Натиснути кнопку Назад (...) для повернення до головної сторінки (або клавішу backspace)
• Перейти в рядок адресу (клавіша F6);
• Ввести адресу сторінки порталу Bigmir bigmir.net, та натиснути Enter
• Натиснути на посилання Погода
  


• Ознайомитись з прогнозом погоди на сьогоднішній день для міст: Київ, Обухів, Рівне, Варшава, ...
• Перейти в рядок адресу (F6) і ввести адресу іншого сайту, напирклад, meta.ua
• Натиснути посилання Гороскоп
  


• Ознайомитись із загальним гороскопом на сьогодні
• Ознайомитись з власним гороскопом на сьогодні, натиснувши ЛКМ по зображенню свого знаку зодіаку
• Подивитися власний гороскоп на місяць, натиснувши гіперпосилання Місяць
• Закрити програму-браузер

 

Завдання 2. Демонстрація можливостей мережі Інтернет

• Завантажити програму Mozilla FireFox (або іншу програму перегляду Інтернет-сторінок)
• Перейти в рядок адреси (F6)
• Ввести адресу порталу Ukr.net (ukr.net) та натиснути Enter
• Ознайомитись зі змістом відкритої сторінки
• Відкрити нову вкладку пунктом Файл - Нова вкладка, або натиснувши комбінацію клавіш Ctrl+T
• Відкрити ВСІ сторінки таблиці в нових вкладках та ознайомитися з їх вмістом
  (сторінки наглядно демонструють деякі можливості Інтернет та дають уяву про користування ним)
  
• Заповнити порожні комірки таблиці (таблицю можна створити як у власному зошиті, так і використовуючи довільний текстовий (табличний) редактор)
• Повідомити викладача про виконання завдання
• Закрити програму-браузер

 

Практична робота 4. Створення власної інтернет-сторінки
Використовуючи ресурс програми "Блокнот" створити інтернет-сторінку

Хід виконання:

1. Для виконання практичної роботи відобразити розширення файлів
2. Перейти на РОБОЧИЙ СТІЛ, та створити папку site
3. Перейти в папку site1, та створити текстовий документ (Блокнот), надати йому ім’я page1 (page1.txt)
4. Створити в папці site1 папку page1.files , (саме в цій папці будуть міститися всі додаткові графічні файли, що відображатимуться на Вашій сторінці).
   Файли для виконання практичної роботи можна взяти тут, або їх місце розташування задає викладач
5. Змінити розширення файлу page1.txt на page1.html, та відкрити його програмою-браузером (MozilaFirefox, Opera, GoogleChrome, ...)
6. Згорнути вікно браузера на панель задач
7. Відкрити файли page1.html за допомогою блокнота (ПКМ на файлі - Відкрити за допомогою - Блокнот)
   Всі правки щодо введення інформації на сторінку, проводимо в Блокноті, та вносимо зміни час від часу у файл (натискаємо комбінацію клавіш Ctrl+S), результат - переглядаємо в БРАУЗЕРІ, попередньо натиснувши клавішу F5
8. Так, як веб-документ завжди починається тегом < html> і закінчується < /html>, то введемо їх на сторінці, кожен з нового абзацу, попередньо прописавши < !DOCTYPE html PUBLIC>
   
9. Введемо ще два теги, які розділять область сторінки на дві частини:
   < head> ... < /head> - голова сторінки;
   < body> ...< /body> - тіло сторінки
   (рекомендовано перед введенням натиснути клавішу «Tab» для відступу рядків, які починають, та закінчують певні теги)
   
10. В «голову» сторінки пишемо:
    кодування сторінки:
    < meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
    заголовок сторінки (відображається на вкладці браузера)
    < title> Електромобілі < /title>
    
11. Заповнюємо «тіло» сторінки (всі записи ведуться між тегами < body> ...< /body>):
    • першим рядком вказуємо шрифт, його розмір, та колір < font face="Verdana,Sans-serif" size="2" color="#0000"> ... < /font> закриваючий тег < /font> пишеться вкінці (перед тегом < /body>), так як вказаний шрифт застосовується до всієї сторінки:
      • font face="Verdana,Sans-serif" – тип шрифтів (рекомендовано вказувати два і більше);
      • size="2" – розмір;
      • color="#0000" – колір (в даному випадку – чорний);
    • другим і наступними – власне починаємо записувати потрібну інформацію…
      Для правильного запису потрібно використовувати певні теги. Наприклад, в даній роботі використано
      (три крапки – Ваш текст):
      • < p> … < /p> – новий абзац без вирівнювання;
      • < p align="center"> … < /p> – новий абзац з вирівнюванням по центру
      • < p align="justify"> … < /p> – новий абзац з вирівнюванням по ширині
      • < b> … < /b> – напівжирний шрифт
      • < ul>
        < li> …< /li>
        < /ul> – маркірований список (якщо список нумерований, тег < ul > … < /ul > зміниться на тег < ol> …< /ol>)
      • < center> … < /center> – вирівняти по центру
      • < img border=0 src="page1.files/01.jpg" Width="650" Height="269" alt="Електромобілі"> – вставка картинки
        img border=0 – рамка, що окреслює картинку (товщина);
        src="page1.files/01.jpg" – розташування файлу (папка, та його назва);
        Width="650" Height="269" – розмір файлу по горизонталі, та вертикалі img border=0
        alt="Електромобілі" – текст, що буде відображатися, якщо картинка не завантажилась
        
      • < hr> - лінія, що відокремлює заголовок від основного тексту

    Тепер потрібно копіювати текст з файлу text.docx (в архіві разом з картинками), та помістити його між потрібними тегами (див. зразок)

    
    
12. Закінчивши редагування файлу page1.htmlв Блокноті, зберегти внесені зміни (Ctrl+S)
13. Перейти у вікно браузера (відкритий файл page1.html) та натиснути клавішу F5.
    Переконатись, що виконаний файл є таким же, як на ЗРАЗКУ.
14. Закрити програму Блокнот (якщо створений файл відповідає файлу "ЗРАЗОК")
15. Продемонструвати результат викладачу у БРАУЗЕРІ

 

Практична робота 5 Створення власної інтернет-сторінки з використанням таблиці
Використовуючи ресурс програми "Блокнот" створити інтернет-сторінку
(на відміну від попередьої роботи, тут ми спробуємо помістити інформацію в таблицю складної структури (ЗРАЗОК))

Хід виконання:

1. Для виконання практичної роботи відобразити розширення файлів
2. Перейти в свою папку, та створити папку site2.
3. Перейти в папку site2, та створити текстовий документ (Блокнот), надати йому ім’я index (index.txt)
4. Створити в папці site2 папку images, (в цій папці будуть міститися всі додаткові графічні файли, що відображатимуться на Вашій сторінці
   (ВСІ файли для виконання практичної роботи можна взяти тут, або їх місце розташування задає викладач)
   Якщо потрібно здійснити переклад тексту, рекомендовано використати відповідний сервіс Google)
5. Змінити розширення файлу index.txt на index.html, та відкрити його програмою-браузером (MozilaFirefox, Opera, GoogleChrome, ...)
6. Згорнути вікно браузера на панель задач
7. Відкрити файли index.html за допомогою блокнота (ПКМ на файлі - Відкрити за допомогою - Блокнот)
   Всі правки щодо введення інформації на сторінку, проводимо в Блокноті, та вносимо зміни час від часу у файл (натискаємо комбінацію клавіш Ctrl+S), результат - переглядаємо в БРАУЗЕРІ, попередньо натиснувши клавішу F5
8. Вкажемо, що ми створюємо html документ, прописавши перед рядком < html> тег < !DOCTYPE html PUBLIC>
9. Так, як веб-документ завжди починається тегом < html> і закінчується < /html>, то введемо їх на сторінці, кожен з нового абзацу
   
10. Введемо ще два теги, які розділять область сторінки на дві частини:
    < head> ... < /head> - голова сторінки;
    < body BGCOLOR="#FFFAFA"> ...< /body> - тіло сторінки
    (рекомендовано перед введенням натиснути клавішу «Tab» для відступу рядків, які починають, та закінчують певні теги)
• BGCOLOR="#FFFAFA" – колір фону сторінки;
11. В «голову» сторінки пишемо:
    кодування сторінки:
    < meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
    та заголовок сторінки (відображається на вкладці браузера)
    < title> історія розвитку АВТО < /title>
12. Заповнюємо «тіло» сторінки (всі записи ведуться між тегами < body BGCOLOR="#FFFAFA"> ...< /body>):
    • першим рядком вказуємо шрифт, його розмір, та колір < font face="Calibri,Verdana,Sans-serif" size="1" color="#00000"> ... < /font> закриваючий тег < /font> пишеться вкінці (перед закриваючим тегом < /body>),так як вказаний шрифт застосовується до всієї сторінки:
      • font face="Calibri,Verdana,Sans-serif" – тип шрифтів;
      • size="1" – розмір;
      • color="#0000" – колір шрифтів (в даному випадку – чорний);
    • другим і наступними – власне починаємо записувати потрібну інформацію…
      Для правильного запису потрібно використовувати певні теги. Наприклад, в даній роботі використано:
      • < table align="center" width="780"> … < /table> – новий абзац без вирівнювання (три крапки – Ваша інформація);
      • table align="center" – таблиця вирівняна по центру сторінки, width="780" шириною - 780т.;
      • < tr> … < /tr> – комірка таблиці;
      • < td> … < /td> – вміст комірки таблиці;
      • < td colspan="2">   < /td> – об'єднані комірки по горизонталі, число - вказує яка кількість комірок об'єднана";
      • < td width="233" rowspan="2" valign="top"> … < /td> – об'єднані комірки по вертикалі, число - вказує яка кількість комірок об'єднана, valign="top - вирівнювання (в даному випадку вверху);
      • < p> … < /p> – новий абзац без вирівнювання;
      • < p align="center"> … < /p> – новий абзац з вирівнюванням по центру
      • < p align="justify"> … < /p> – новий абзац з вирівнюванням по ширині
      • < b> … < /b> – напівжирний шрифт
      • < a href="#audi.html">AUDI> … < /a> – гіперпосилання на нову сторінку (в даному видадку, на сторінку - audi.html)
      • < ul>
        < li> …< /li>
        < /ul> – маркірований список (якщо список нумерований, тег < ul > … < /ul > зміниться на тег < ol> …< /ol>)
      • < center> … < /center> – вирівняти по центру
      • < img border=0 src="page1.files/01.jpg" Width="650" Height="269" alt="..."> – вставка картинки
        img border=0 – рамка, що окреслює картинку (товщина);
        src="page1.files/01.jpg" – розташування файлу (папка, та його назва);
        Width="650" Height="269" – розмір файлу по горизонталі, та вертикалі img border=0
        alt="..." – текст, що буде відображатися, якщо картинка не завантажилась
        
      • < hr> - лінія, що відокремлює заголовок від основного тексту

    Тепер копіюємо (друкуємо) потрібну інформацію між потрібними тегами (див. зразок)

    
13. Закінчивши редагування файлу index.html в Блокноті, збережіть внесені зміни (Ctrl+S)
14. Перейти у вікно браузера (відкритий файл index.html) та натиснути клавішу F5.
    Переконатись, що виконаний файл є таким же, як на ЗРАЗКУ.
15. Закрити програму Блокнот (якщо створений файл відповідає файлу "ЗРАЗОК")
16. Продемонструвати результат викладачу у БРАУЗЕРІ

текст