Розробка інформаційного веб-сайту з використанням мови програмування PHP

Реферат сервер сайт комп’ютерний мережа Розробка інформаційного веб-сайту з використанням мови програмування PHP // Дипломний проект // Melkiy.te.ua Володимир Романович // Тернопільський національний технічний університет імені Івана Пулюя, факультет комп’ютерно-інформаційних систем і програмної інженерії, група СІ-52 // Тернопіль 2014.

Ключові слова: web-сайт, сайт-візитка, сайт, PHP, MYSQL, HTML, CSS, PHPMYADMIN, APACHE, LAMP.

Об'єкт проектування — розробка інформаційного веб-сайту з викорстанням мови програмування PHP.

Проект складається з п’яти розділів.

Перший розділ присвячено побудови апаратної структури для серверу, встановленню і налаштуванню операційної системи і програмного забезпечення, а також розробка веб-сайту.

Другий розділ представляє собою засоби для перевірки якості сайту.

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

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

П’ятий розділ — це екологічна частина. Висвітлено найбільші загрозливі екологічної фактори, що впливають на довкілля, та проаналізовано методи їх усунення.

Перелік умовних позначень, символів, одиниць, скорочень і термінів ПК — персональний комп’ютер;

HTML — Hyper Text Markup Language — мова розмітки гіпертекстових сторінок;

HTTP — Hyper Text Transfer Protocol — протокол передачі гіпертекстових сторінок;

PHP — Hypertext Preprocessor — гіпертекстовий препроцесор; — скриптова мова програмування, була створена для генерації HTML-сторінок на стороні веб-сервера; Personal Home Page.

CSS — Cascading Style Sheets — таблиці каскадних стилів;

MySQL — система керування базами даних;

XML — Extensible Markup Language — розширювана мова розмітки;

БД — база даних.

Зміст Вступ.

1. Основна частина.

1.1 Постановка задачі.

1.1.1 Сервер

1.1.2 Типи серверів.

1.1.3 Ролі серверів.

1.2 Підбір та встановлення апаратного забезпечення.

1.2.1 Вимоги до сервера.

1.2.2 Характеристики наявного комп’ютера.

1.3 Встановлення та налаштування операційної системи.

1.3.1 Вільна операційна система Убунту.

1.3.2 Встановлення GNU Ubuntu 12.04 Server.

1.3.3 Оновлення та налаштування GNU Ubuntu 12.04.3 Server.

1.4 Встановлення та налаштування програмного забезпечення.

1.4.1 Створення суперкористувача root.

1.4.2 Встановлення веб-сервера Apache.

1.4.3 Встановлення інтерпретатора PHP.

1.4.4 Встановлення бази даних MySQL.

1.4.5 Зв’язка встановлених сервісів.

1.4.6 Встановлення веб-застосунку phpmyadmin.

1.4.7 Встановлення Samba file server.

1.4.8 Встановлення OpenSSH.

1.4.9 Встановлення dns-серверу bind.

1.4.10 Встановлення серверу електронної пошти sendmail.

1.4.11 Встановлення FTP серверу.

1.5 Створення інформаційного веб-сайту.

1.5.1 Розробка структури веб-сайту.

1.5.2 Створення нового віртуального хоста.

1.5.3 Веб-сторінка.

1.5.3.1 Створення веб-сторінки за допомогою HTML.

1.5.3.2 Створення веб-сторінки за допомогою CSS.

1.5.3.3 Створення веб-сторінки за допомогою javascript.

1.5.3.4 Створення та вставка графічних об'єктів.

1.5.3.5 Створення веб-сторінки за допомогою PHP.

1.5.3.6 Створення веб-сторінки із використанням бази даних.

1.5.4 Створення шаблону.

1.5.5 Створення сторінки-вітрини.

1.5.6 Створення сторінок сайту і їх наповнення.

1.6 Створення сайту на основі системи управління вмістом.

1.6.1 WordPress.

1.6.2 Eleanor CMS.

1.7 Налаштування комп’ютера.

1.7.1 Конфігурація.

1.7.2 Оновлення ПЗ.

1.7.3 Веб-інтерфейс.

1.7.4 FTP-доступ.

1.7.5 Samba.

1.7.6 DLNA/UPn-сервер

1.7.7 Torrent.

1.8 Реєстрація домену та хостингу.

1.8.1 Домен.

1.8.2 Хостинг.

2. Спеціальна частина.

2.1 Використомвність.

2.1.1 Веб-використомвність.

2.1.2 Критерії оцінювання ресурсів інтернету.

2.1.3 Способи оцінювання ресурсів інтернету.

2.2 Оптимізація сайту.

2.2.1 Внутрішня оптимізація сайту.

2.2.2 Перевірка якості сайту.

2.3 Сервіси для оцінювання якості web-ресурсів.

2.3.1 Ping-Admin.Ru.

2.3.2 mysitecost.ru.

2.3.3 validator. w3.org.

3. Організаційно-економічна частина.

3.1 Визначення стадій технологічного процесу та загальної тривалості проведення НДР.

3.2 Визначення витрат на оплату праці та відрахувань на соціальні заходи.

3.3 Розрахунок матеріальних витрат.

3.4 Розрахунок витрат на електроенергію.

3.5 Розрахунок суми амортизаційних відрахувань.

3.6 Обчислення накладних витрат.

3.7 Складання кошторису витрат та визначення собівартості НДР.

3.8 Розрахунок ціни програмного продукту.

3.9 Визначення економічної ефективності і терміну окупності капітальних вкладень Висновок.

4. Охорона праці та безпека в надзвичайних ситуаціях.

4.1 Охорона праці.

4.2 Оцінка надійності захисту персоналу об'єкту у воєнний час.

5. Екологія.

5.1 Стратегія і тактика збереження й розвитку життя на землі.

5.2 Методи визначення якості та обсягу забруднень.

5.3 Стаcтичне оцінювання екологічного стану навколишнього середовища Висновки Перелік посилань Додатки.

Вступ В останнє десятиліття завдяки бурхливому розвитку Інтернету прогресує і Web-програмування. Кожна поважаюча себе компанія вже має своє Web-представництво — свій сайт.

Сайт — сукупність веб-сторінок, доступних у глобальній мережі інтернет об'єднані як за змістом, так і навігаційно. Фізично сайт може розміщуватися як на одному, так і на кількох серверах.

Цілей створення Web-сайту може бути дуже багато. Наприклад, сайт може бути просто візитною карткою, елементом фірмового стилю. Також сайт може сприяти просуванню торгової марки, продукції та послуг — створення інтернет-магазину. Сайт може бути ефективним інструментом, який організовує роботу між клієнтами та партнерами, між співробітниками однієї або декількох корпорацій, так званий — внутрішньокорпоративний сайт.

Завдання які вирішуються при наявності Web-сайту:

· оповіщення своїх клієнтів про новинки та цікаві для них події;

· збереження довідкової інформації для своїх потенційних або вже існуючих клієнтів, або для співробітників однієї корпорації;

· прийом замовлень на товари і послуги;

· здійснення електронних платежів.

1. Основна частина.

1.1 Постановка задачі.

Головною метою дипломного проекту є розробка інформаційного веб-сайту з використанням мови програмування PHP.

Були поставлені вимоги щодо структури веб-сайту та його дизайну.

Було вирішено, що сайт буде розміщуватися на сервері, створеного із настільного комп’ютера.

1.1.1 Сервер Семрвер (англ. Server — «служка») — у комп’ютерній термінології термін може стосуватися окремого комп’ютера чи програми. Головною ознакою в обох випадках є здатність машини чи програми переважну кількість часу працювати автономно, без втручання людини реагуючи на зовнішні події відповідно до встановленого програмного забезпечення. Втручання людини відбувається під час встановлення серверу і під час його сервісного обслуговування. Часто це роблять окреміадміністратори серверів з вищою кваліфікацією.

Перші сервери з’явилися в середині 1960;х років. У цей час сервери були дуже великими і складними машинами, які могли б обслуговувати тільки висококваліфікований персонал.

1.1.2 Типи серверів Семрвер, як комп’ютер — це комп’ютер у локальній чи глобальній мережі, який надає користувачам свої обчислювальні і дискові ресурси, а так самодоступ до встановлених сервісів; найчастіше працює цілодобово, чи у час роботи групи його користувачів.

Семрвер, як програма — програма, що надає деякі послуги іншим програмам (клієнтам). Зв’язок між клієнтом і сервером зазвичай здійснюється за допомогою передачі повідомлень, часто через мережу, і використовує певний протокол для кодування запитів клієнта і відповідей сервера. Серверні програми можуть бути встановлені як на серверному, так і на персональному комп’ютері, щоразу вони забезпечують виконання певних служб (наприклад, сервер баз даних чи веб-сервер).

Комп’ютер або програма, що установлена на цьому комп’ютері, здатні автоматично розподіляти інформацію чи файли під керуванням мережної ОС або у відповідь на запити, прислані у режимі on-line користувачами, і таким чином надавати послуги іншим комп’ютерам мережі (клієнтам).

1.1.3 Ролі серверів Роль — це функція сервера (наприклад почтовий, контролер домена тощо). Один сервер може відігравати декілька ролей одночасно. При реєстрації адміністратора на сервері майстер «Manage Your Server» допомагає добавити нові ролі або змінити існуючі.

Файловий сервер англ. File Server.

Додавання ролі файлового сервера оптимізує сервер для підтримки спільних папок і зберігання файлів. Після додавання ролі файл-сервера, ви зможете призначати користувачам дискові квоти, використовувати службу індексації для пошуку файлів і навіть робити пошук документів у різних форматах на різних мовах, використовуючи в меню Start інструмент Search або новий веб-інтерфейс пошуку. WS2K3 пропонує масу нових можливостей для поліпшення обслуговування файлів: Тіньове копіювання (Shadow copy) — Резервне побайтове копіювання ранніх версій документів, що дозволяє користувачам скасовувати зроблені зміни в документах, що зберігаються на сервері. Покращена розподілена файлова система DFS — дозволяє створювати єдине логічне іменоване простір для безлічі загальних папок, розташованих на різних серверах. Тепер користувачам не потрібно запам’ятовувати, на яких серверах розташовані часто використовувані ними спільні папки. DFS в WS2K3 також надає службу реплікації файлів з вибором топології, що було недоступне в Win2K. Крім того, сервери WS2K3 можуть обслуговувати кілька коренів DFS. Служба тіньового копіювання томів (Volume shadow copy service) — Створює копію оригінальних загальних даних на заданий момент часу. Програми резервного копіювання можуть використовувати цю копію, щоб зробити папку загального доступу статичної, поки змінюються поточні документи. Крім того, ви можете переміщати тіньові копії на інші сервера для резервного зберігання, тестування та аналізу даних.

Сервер друку англ. Print Server.

Сервери друку використовуються для надання та управління доступом до принтерів. Роль сервера друку дозволяє управляти принтерами через веб-оглядач, друкувати через URL принтера, використовуючи протокол IPP, а також підключати принтери, використовуючи Point and Print. Microsoft зробила ряд розширень служби друку в WS2K3: Підтримка кластерів друку — автоматична реплікація драйверів принтерів по всіх серверів в кластері. Розширення в Active Directory — адміністратори можуть виносити на загал принтери в AD, щоб користувачі могли шукати принтери в залежності від місця розташування, кольору і швидкості. Поліпшення безпеки — групові політики, що дозволяють адміністратору запобігати доступу клієнтів до спулера, якщо сервер не обслуговує друк.

Сервер застосунків англ. Application Server.

Коли ви налаштовуєте сервер в якості сервера застосунків, ви встановлюєте Internet Information Services (IIS) 6.0 і цілий ряд компонентів, наприклад, COM+ і ASP.NET. Microsoft оптимізувала IIS 6.0 з точки зору стабільності, керованості, швидкої розробки додатків і безпеки. Роль сервера застосунків WS2K3 забезпечує підтримку нових веб-служб і платформи .NET, зокрема служби Universal Description, Discovery and Integration (UDDI), а також Simple Object Access Protocol (SOAP) і Web Services Description Language (WSDL). Сервери застосунків часто конфігурують включаючи наступне:

· Злиття ресурсів (Resource pooling).

· Управління розподіленими транзакціями.

· захист.

· відмовостійкість Поштовий сервер англ. Mail Server.

Дозволяє обслуговувати базові поштові скриньки ваших користувачів і дозволяє приймати і відправляти пошту з сервера. Вхідна пошта може зберігатися на сервері, а потім забиратися користувачем по протоколу POP3. Для ролі поштового сервера ви повинні мати: Активне з'єднання з інтернет Зареєстроване доменне ім'я Запис MX у провайдера для вашого поштового домену Термінальний сервер англ. Terminal Server.

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

Remote Access/VPN Server.

Сервери віддаленого доступу і VPN надають точку входу в вашу мережу для віддалених користувачів. Використовуючи роль Remote Access / VPN Server, ви можете реалізувати протоколи маршрутизації для середовищ LAN і WAN. Ця роль підтримує модемні з'єднання і VPN через інтернет.

Domain Controller.

Контролер домену містить базу даних Active Directory. Контролери домену надають служби аутентифікації для користувачів і комп’ютерів, а також керують доступом до мережевих ресурсів. Роль контролера домену замінює інструмент DCPROMO, який був в Win2K. Ця роль дозволяє додати контролер домену до існуючого домену, створити новий домен, створити нове дерево.

DNS Server.

Служба DNS дозволяє перетворювати доменні імена (FQDN) в адреси IP. Версія DNS в WS2K3 включає службу динамічного DNS (DDNS), яка дозволяє комп’ютерам самим реєструватися в базі даних DNS.

DHCP Server.

Сервер DHCP дозволяє клієнтам отримувати свій IP за потребою. Сервер DHCP також надає додаткову інформацію для конфігурації мережі - адреса серверів DNS, WINS і т.п.

Streaming Media Server.

Потоковий сервер надає служби Windows Media Services мережевим клієнтам. Windows Media Services використовуються для управління і доставки мультимедійного контенту — потокового відео та аудіо — через інтранет або інтернет.

WINS Server.

WINS дозволяє клієнтам NetBIOS перетворювати імена комп’ютерів в адреси IP. На відміну від DNS, що вимагає доменні імена, WINS спроектована для внутрішньої інтрамережі для дозволу простих імен NetBIOS. Хоча можна мати мережу Windows без NetBIOS і WINS, багато утиліти все ще залежать від бази даних WINS. Багато типів записів, наявні в WINS, відсутні в DNS. Ці типи дозволяють легко знаходити в мережі сервери, які виконують специфічні служби (включаючи Terminal Services). Такий утилітою є Terminal Server Administration. Без WINS вам доведеться вручну вказувати сервер для управління.

Ігровий сервер

Ігровий сервер (англ. game server від англ. game — гра і англ. to serve — служити) — програмний компонент обчислювальної системи, що забезпечує зв’язок між різнимиклієнтами, надаючи їм можливість комунікації один з одним в рамках програмної оболонки конкретної гри.

1.2 Підбір та встановлення апаратного забезпечення Апаратне забезпечення (англ. hardware) — комплекс технічних засобів, який включає ЕОМ: зовнішні пристрої, термінали, абонентські пункти тощо, які необхідні для функціонування тієї чи іншої системи; фізична частина ЕОМ.

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

Апаратно-програмний комплекс — сукупність технічних і програмних засобів, що дозволяє автоматизувати виконання комплексу завдань і забезпечує функціонування електронних інформаційних ресурсів та інформаційних систем.

1.2.1 Вимоги до сервера Вимоги до обладнання для серверів варіюються залежно від сервера додатків. Абсолютна швидкість процесора не настільки важлива для сервера, як і для настільного комп’ютера. Обов’язки сервера надавати послуги багатьом користувачам по мережі призводять до різним вимогам, таких як швидке підключенням до мережі та висока пропускна спроможність. Так як сервери, як правило, доступні по мережі, вони можуть працювати без монітору. Процеси, які не потрібні для функції сервера не використовуються. Багато серверів не мають графічного інтерфейсу користувача.

Крім того, аудіо-та USB інтерфейси можуть бути опущені. Сервери часто працюють протягом тривалого часу без перерви, тому надійність обладнання і довговічність надзвичайно важлива. Хоча сервери можуть бути побудовані з частин комп’ютера, критично важливі корпоративні сервери не можливі без використання спеціалізованого устаткування з низьким рівнем збою в цілях максимального часу безперебійної роботи, оскільки навіть короткострокові невдачі можуть коштувати дорожче, ніж покупка і установка системи. Наприклад, це може зайняти всього декілька хвилин часу простою на національній фондовій біржі, щоб виправдати рахунок повністю замінити системи з чимось більш надійним. Сервери можуть включати в себе більшу ємність жорстких дисків, більше комп’ютерних вентиляторів або водяного охолодження, щоб допомогти усунути тепло і джерела безперебійного живлення, які забезпечують роботу сервера в разі збою живлення. Ці компоненти забезпечують більш високу продуктивність і надійність за відповідно більш високою ціною.

Приклад сервера Сервер HP Micro AMD N40L (658 553−421).

Рисунок 1.1 — серверна стійка HP Micro AMD N40L.

Характеристики серверної стійки:

Таблиця 1.1 — Характеристики серверної стійки HP Micro AMD.

1.2.2 Характеристики наявного комп’ютера Веб-сайт, який розробляється у ході виконання пимломного проекту буде знаходитися на домашньому комп’ютері-сервері Lenovo B560 з наступними характеристиками:

Таблиця 1.2 — Характеристики Lenovo B560.

Рисунок 1.2 — Lenovo B560.

1.3 Встановлення та налаштування операційної системи Операцімйна системма, скорочено ОС (англ. operating system, OS) — це базовий комплекс програмного забезпечення, що виконує управління апаратним забезпеченням комп’ютера або віртуальної машини; забезпечує керування обчислювальним процесом і організовує взаємодію з користувачем.

Операційна система звичайно складається з ядра операційної системи та базового набору прикладного програмного забезпечення.

1.3.1 Вільна операційна система Убунту Отже у мене є комп’ютер, який я використаю, як сервер. Але ще не має операційної системи. Я вибрав для свого проекту операційну систему GNU Ubuntu 12.04.3 Server.

Ubuntu — операційна система для робочих станцій, лептопів і серверів. Він є найпопулярнішим у світі дистрибутивом GNU. Серед основних цілей Ubuntu — надання сучасного і водночас стабільного програмного забезпечення для пересічного користувача із сильним акцентом на простоту встановлення і користування. Ubuntu надає користувачу мінімальний набір програм загального призначення: багатовіконне стільничне середовище, засоби для перегляду Інтернету, організації електронної пошти, офісні програми з можливістю читати і записувати файли в форматі Microsoft Office, редактор зображень, програвач компакт-дисків та інші. Спеціалізоване програмне забезпечення, потрібне досвідченішим користувачам, можна отримати із відповідних репозиторіїв. Серверний варіант системи включає також засоби, потрібні для організації сервера баз даних, веб-сервера, сервера електронної пошти, тощо. Інсталяційні диски Ubuntu не тільки безкоштовні, але й можуть бути безкоштовно доставлені практично у будь яку точку світу.

GNU (gnu, рекурсивне скорочення англ. «GNU's Not Unix») — вільна UNIX-подібна операційна система, що розробляється Проектом GNU.

Проект GNU започаткований у 1983 році Річардом Столменом з метою створення вільної операційної системи — яку назвали система GNU. Проектом GNU зараз опікується Фонд Вільних Програм (FSF, англ. Free Software Foundation).

В рамках проекту GNU було розроблено велику кількість високоякісного та поширеного вільного програмного забезпечення, включаючи текстовий редактор Emacs, збірку компіляторів GNU (GCC — англ. GNU Compiler Collection), і відлагодник GNU Debugger (GDB). Офіційним ядром операційної системи GNU є HURD. Але воно не закінчене, тому пакет програм GNU часто об'єднується з ядром Лінукс, що не є частиною проекту GNU, для утворення повністю робочої операційної системи. Цю систему звичайно називають «Лінукс», хоча FSF наполягає на назві «GNU/Linux» для зазначення вкладу проекту GNU.

Є також типовим встановлювати програми GNU на пропрієтарних UNIX системах, замість оригінальних програм UNIX, оскільки багато програм, написаних для проекту GNU, довели кращу якість за відповідники з UNIX. Часто, ці компонент узагальнено називають «Знаряддя GNU» (GNU Tools). Багато програм GNU також перенесено доMicrosoft Windows, Mac OS X, і деяких інших пропрієтарних платформ.

1.3.2 Встановлення GNU Ubuntu 12.04 Server.

Встановлення операційної системи Ubuntu:

1. Для встановлення ОС потрібно запустити комп’ютер-сервер.

2. Вставити диск з ОС в привід CD-ROM.

3. Відбувається запуск операційної системи Ubuntu. Вікно запуску має список мов, які можна використати для встановлення. В цьому вікні необхідно вибрати мову операційної системи.

Рисунок 1.3 — Вибір мови операційної системи.

4. Вибираю англійську мову, оскільки при встановленні української мови українські букви відображаються «квадратиками», що не є читабельним текстом. Це показано на рисунку 5.

Саме тому обираємо мову встановлення — Англійську.

Рисунок 1.4 — Відображення української мови в серверній системі.

5. Наступне вікно дає можливість зробити різні дії, такі як: тестування пам’яті, перевірка сумісності, перевірка системи без встановлення.

Вибираю пункт «Встановити Ubuntu Server» .

Рисунок 1.5 — Встановлення операційної системи.

6. У наступному вікні вибираю мову, якою буде встановлена операційна система.

Вибираю Англійську мову.

Рисунок 1.6 — Вибір мови.

7. Після вибору мови, необхідно зробити вибір країни. Це треба для вибору серверів під час оновлення операційної системи.

Так як немає нашої країни, то вибираємо пункт «Інша» .

Рисунок 1.7 — Вибір країни.

8. Оскільки я вибрав пункт «Інша», то тепер необхідно зробити вибір континенту.

Вибираю «Європа» .

Рисунок 1.8 — Вибір континенту.

9. Вибір країни проживання.

Вибираю «Україна» .

Рисунок 1.9 — Вибір країни.

10. Наступним кроком необхідно вибирати кодування. Можна вибрати кодування UTF-8.

Рисунок 1.10 — Вибір кодування.

11. Вибір автоматичної перевірки розкладки клавіатури. Вибираю «Ні», тому що достатньо у наступному вікні вибрати необхідну мову.

Рисунок 1.11 — Вибір автоматичної перевірки розкладки клавіатури.

12. Вибір мови клавіатури. Вибираю «Українська», тому що я є українцем. Але можна вибрати англійську мову, якщо не буде потреби друкувати українською мовою.

Рисунок 1.12 — Вибір мови клавіатури.

13. Після цього є вибір розкладки клавіатури. На вибір дається кілька різних версій, такий як: громофонна, стандартна, фонетична, з клавішами Win та інші.

Вибираю «Українська» .

Рисунок 1.13 — Вибір розкладки клавіатури.

14. Вибір комбінацій клавіш для переключення мови введення. Вибираю «Ctrl+Shift» .

Рисунок 1.14 — Вибір комбінацій клавіш для переключення мови введення.

15. Вибираю назву комп’ютера. Я вибрав «nykorchuk» .

Рисунок 1.15 — Вибір назви комп’ютера.

16. Вибираю облікове ім'я користувача. Я вибрав «volodymyr» .

Рисунок 1.16 — Вибір назву комп’ютера.

17. Повторяю ввід облікового імені користувача, для провірки на правильність.

Рисунок 1.17 — Повторяю ввід облікового імені користувача.

18. Ввожу пароль. Я попередньо вибрав собі пароль «sw6x4f6rer». Паролі можна згенерувати різними додатковими сервісами попередньо, або придумати самому.

Важливо знати, що логіни та паролі для доступу до облікових записів ні в якому разі не можна повідомляти іншим особам.

Рисунок 1.18 — Ввід паролю.

19. Тепер необхідно повторити ввід пароля ще раз. Це необхідно для перевірки правильності вводу пароля. Тому я ще раз ввожу свій пароль «sw6x4f6rer» .

Рисунок 1.19 — Повторення пароля.

20. Тепер не погоджуюся із шифруванням домашнього каталогу і продовжуємо встановлення операційної системи.

21. Наступний крок — розбивка жорсткого диску.

Маєю на вибір чотири варіанти: три стандартних і один ручний. Вибираю розбивку жорсткого диску «Вручну» .

Рисунок 1.20 — Вибір розбивки жорсткого диску.

22. Вибір жорсткого диску, на який буде встановлена операційна система.

Оскільки сервер має тільки один жорсткий диск, то вибираю його.

Рисунок 1.21 — Вибір жорсткого диску.

23. Оскільки на комп’ютері ще не було встановлено жодної операційної системи, то вибираю «Створити нову таблицю розділів» .

Рисунок 1.22 — Нова таблиця розділів.

24. Вибираю «вільне місце» і перехожу до наступного вікна, для створення першого диску.

Рисунок 1.23 — Вибір вільного місця.

25. Створюю новий розділ.

Рисунок 1.24 — Створюю новий розділ.

26. Задаю розмір нового диску.

Цей диск буде використовуватися для файлів операційної системи. Я виділив 5 Гб вільного місця. Цього є достатньо.

Рисунок 1.25 — Виділення вільного місця для нового диску.

27 Задаю місцезнаходження диску — «Початок» .

Рисунок 1.26 — Вибір місцезнаходження диску.

28. Продовжую створення нових дисків.

Рисунок 1.27 — Продовження створення нових дисків.

29. Задаю параметри диску:

Тип файлової системи — Ext4;

Точка монтування — /;

Опції монтування — за замовчуванням;

Зарезервовані блоки — 5%;

Інші дані - за замовчуванням.

Після цього маю три варіанти вибору: копіювати диск, видалити та закінчити налаштування диску.

Вибираю останній пункт — «Закінчити налаштування диску» .

Рисунок 1.28 — Параметри диску.

30. Створення першого диску закінчено. Оскільки треба ще створити два диски, то я вибираю вільне місце і продовжую їх створення.

Рисунок 1.29 — Вибір вільного місця.

31. Створюю ще один новий розділ.

Рисунок 1.30 — Створення нового розділу.

32. Задаю розмір нового диску. Цей диск буде використовуватися для файлу підкачки. Я виділив 3 Гб. Цього буде достатньо.

Рисунок 1.31 — Виділення вільного місця для нового диску.

33. Задаю місцезнаходження диску — «Початок» .

Рисунок 1.32 — Вибір місцезнаходження диску.

34. Продовжую створення нових дисків.

Рисунок 1.33 — Продовження створення нових дисків.

35. Задаю параметри диску Рисунок 1.34 — Параметри диску.

36. Створення другого диску закінчено. Знову вибираю вільне місце.

Рисунок 1.35 — Вибір вільного місця.

37. Створюю новий розділ.

Рисунок 1.36 —Створюю новий розділ.

38. Задаю розмір нового диску. Я виділив для цього диску усе вільне місце, тому що цей диск буде використовуватися для файлів.

Рисунок 1.37 — Виділення вільного місця для нового диску.

39. Задаю місцезнаходження диску — «Логічний» .

Рисунок 1.38 — Вибір місцезнаходження диску.

40. Задаю параметри диску:

Тип файлової системи — Ext4;

Точка монтування — /home;

Опції монтування — за замовчуванням;

Зарезервовані блоки — 5%;

Інші дані - за замовчуванням.

Після цього є три варіанти вибору: копіювати диск, видалити та закінчити налаштування диску.

Вибираю останній пункт — «Закінчити налаштування диску» .

Рисунок 1.39 — Параметри диску.

41. Завершую розбивання жорсткого диску.

Рисунок 1.40 — Завершення розбивання жорсткого диску.

42. Записую зміни на диск, для цього вибираю «Так» .

Рисунок 1.41 — Запис змін на диск.

43. Відбувається процес встановлення операційної системи.

Рисунок 1.42 — Процес встановлення.

44. Налаштування HTTP-проксі. Залишаю його порожнім.

Рисунок 1.43 — Налаштування HTTP-проксі.

45. Відбувається продовження встановлення операційної системи. Через кілька хвилин продовжую вибирати параметри операційної системи.

46. Вибираю спосіб оновлення операційної системи.

Рисунок 1.44 — Спосіб оновлення операційної системи.

47. Програма встановлення операційної системи має можливість встановити програмне забезпечення. На вибір програм для автоматичного встановлення є такі популярні програми для серверу:

· OpenSSH server (OpenSSH — відкрита реалізація клієнта і сервера для роботи за протоколами SSH та SFTP, набір програм, що надають шифрування сеансів зв’язку у комп’ютерних мережах. Він був створений під керівництвом Teo де Раадта як відкрита альтернатива власницькій реалізації від SSH Communications Security);

· DNS server (DNS-сервер — програма, призначена для відповідей на DNS-запити за відповідним протоколом. Також DNS-сервером можуть називати хост, на якому запущено відповідну програму);

· LAMP server (LAMP — абревіатура набору вільного ПЗ з відкритим кодом, в який входять ОС Linux, веб-сервер Apache, СКБД MySQL, та інтерпретатор Perl/PHP/Python — основні компоненти для побудови життєздатного багатоцільового веб-сервера);

· Mail server (Поштовий сервер, або сервер електронної пошти — в системі пересилки електронної пошти так зазвичай називають агент пересилання повідомлень (англ. mail transfer agent, MTA). Це комп’ютерна програма, яка передає повідомлення від одного комп’ютера до іншого. Зазвичай поштовий сервер працює «за лаштунками», а користувачі мають справу з іншою програмою — клієнтом електронної пошти);

· PostgreSQL database (PostgreSQL — об'єктно-реляційна система керування базами даних (СКБД). Є альтернативою як комерційним СКБД (Oracle Database, Microsoft SQL Server, IBM DB2 та інші), так і СКБД з відкритим кодом (MySQL, Firebird, SQLite));

· Print server (Принт-сервер — програмне забезпечення, що дозволяє групі користувачів мережевих і бездротових мереж спільно використовувати принтер вдома або в офісі. Має високошвидкісний порт USB 2.0, LPT або COM порти для підключення принтера. Як правило, оснащене інтерфейсом 10/100BASE Ethernet і часто — високошвидкісним інтерфейсом бездротових мереж 802.11g. Підтримуючи безліч мережевих операційних систем, надає високий рівень гнучкості та продуктивності процесу друку);

· Samba file server (Server Message Block (SMB) — протокол прикладного рівня (в моделі OSI), зазвичай використовується для надання розділеного доступу до файлів, принтерів, послідовних портів передачі даних, та іншої взаємодії між вузлами в комп’ютерній мережі. Також надає можливості міжпроцесної взаємодії з аутентифікацією. Зазвичай, використовується на комп’ютерах з Microsoft Windows: в середовищі Microsoft, часто позначається як «Microsoft Windows Network»);

· Tomcat Java server (Apache Tomcat — контейнер сервлетів, розроблений Apache Software Foundation. Повністю написаний мовою програмування Java та реалізує специфікацію сервлетів і Java Server Pages від Sun Microsystems, що є стандартами для розробки веб-застосунків на Java);

· Virtual Machine host;

· Manual package selection.

Рисунок 1.45 — Програми для автоматичного встановлення.

48. Встановлення завантажувача операційної системи GRAB.

GRAB — це завантажувач операційної системи від проекту GNU. GRUB дозволяє користувачеві мати кілька встановлених операційних систем і при включенні комп’ютера вибирати одну з них для завантаження.

Рисунок 1.46 — Встановлення завантажувача GRAB.

49. Закінчення встановлення.

Після закінчення встановлення операційної необхідно вибирати пункт «Перезавантаження» .

Рисунок 1.47 — Закінчення встановлення.

50. Після перезавантаження ввожу свій логін і пароль для входження в операційну систему.

Рисунок 1.48 — Вхід в операційну систему Процес встановлення операційної системи успішно закінчено.

1.3.3 Оновлення та налаштування GNU Ubuntu 12.04.3 Server.

Після встановлення операційної системи її необхідно обновити.

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

Це робиться командою:

sudo apt-get update.

Тепер установлюю всі доступні оновлення:

sudo apt-get upgrade.

Рисунок 1.49 — Оновлення операційної системи.

1.4 Встановлення та налаштування програмного забезпечення Программне забезпемчення (ПЗ; англ. software) — сукупність програм системи обробки інформації і програмних документів, необхідних для експлуатації цих програм.

1.4.1 Створення суперкористувача root.

Для початку, необхідно створити користувача із розширеними правами — рут.

Root (від англ. root — корінь; читається «рут»), або суперкористувач — це спеціальний аккаунт в UNIX-подібних системах з ідентифікатором (UID, User IDentifier) 0, власник якого має право на виконання всіх без винятку операцій.

Суперкористувач UNIX-систем має логін «root» тільки за замовчуванням і легко перейменовується при необхідності.

Така схема була придумана для полегшення адміністрування. Приміром, на серверах Novell, де починаючі адміністратори нерідко припускаються помилок, даючи загальний доступ до каталогів (гублячи над ними всякий контроль); в UNIX подібне неможливо.

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

Рут створюється командою:

sudo passwd root.

Я вибрав пароль для користувача root «sw3x1f3rer» .

Рисунок 1.50 — Створення користувача root.

Для того щоб ввійти в root необхідно ввести команду:

su.

Рисунок 1.51 — Вхід в режим суперкористувача Для того, щоб вийти з root необхідно скористатися комбінацією клавіш Ctrl+D, або ввести команду exit.

1.4.2 Встановлення веб-сервера Apache.

Apache HTTP-сервер — відкритий веб-сервер Інтернет для UNIX-подібних, Microsoft Windows, Novell NetWare та інших операційних систем.

Apache розроблюється та підтримується спільнотою розробників відкритого програмного забезпечення під керівництвом Apache Software Foundation.

Web-сервер Apache є самостійним, некомерційним, вільно розповсюджуваним продуктом. Продукт підтримує безліч можливостей, багато з яких реалізовані як скомпільовані модулі, які розширюють основні функціональні можливості. Вони різняться від серверної підтримки мов програмування до схем аутентифікації. Існують інтерфейси для підтримки мов програмування Perl, Python, Tcl і PHP.

Популярні методи стискування на Apache включають зовнішній модуль mod_gzip, створений для зменшення розміру веб-сторінок, переданих по HTTP.

Функції віртуального хостингу дозволяють одній інсталяції Apache обслуговувати різні веб-сайти. Наприклад, одна машина, з однією інсталяцією Apache може одночасно містити www.example.com, www.test.com, test47. test-server.test.com і так далі.

Для встановлення необхідно використати команду:

sudo apt-get install apache2.

Рисунок 1.52 — Встановлення веб-сервера Після нажимання клавіші «Y» веб-сервер Apache успішно встановлюється.

1.4.3 Встановлення інтерпретатора PHP.

PHP (англ. PHP: Hypertext Preprocessor — PHP: гіпертекстовий препроцесор), попередня назва: Personal Home Page Tools — скриптовамова програмування, була створена для генерації HTML-сторінок на стороні веб-сервера. PHP є однією з найпоширеніших мов, що використовуються у сфері веб-розробок (разом із Java, .NET, Perl, Python, Ruby). PHP підтримується переважною більшістю хостинг-провайдерів. PHP — проект відкритого програмного забезпечення.

PHP інтерпретується веб-сервером в HTML-код, який передається на сторону клієнта. На відміну від скриптової мови JavaScript, користувач не бачить PHP-коду, бо браузер отримує готовий html-код. Це є перевага з точки зору безпеки, але погіршує інтерактивність сторінок. Але ніщо не забороняє використовувати РНР для генерування і JavaScript-кодів які виконуються вже на стороні клієнта.

PHP — мова, яка може бути вбудована безпосередньо в html-код сторінок, які, в свою чергу коректно будуть оброблені PHPінтерпретатором. Механізм РНР просто починає виконувати код після першої екрануючої послідовності (<?) і продовжує виконання до того моменту, коли він зустріне парну екрануючу послідовність (?>).

Велика різноманітність функцій PHP дають можливість уникнути написання багаторядкових призначених для користувача функцій на C або Pascal.

Для встановлення цього інтерпретатора ввожу команду:

sudo apt-get install php5.

Рисунок 1.53 — Встановлення інтерпретатора PHP.

Інтерпретатор мови PHP успішно встановлений.

1.4.4 Встановлення бази даних MySQL.

Системма керування бамзами дамних (СКБД) — комп’ютерна програма чи комплекс програм, що забезпечує користувачам можливість створення, збереження, оновлення, пошук інформації та контролю доступу в базах даних.

MySQL — вільна система керування реляційними базами даних.

MySQL був розроблений компанією «ТсХ» для підвищення швидкодії обробки великих баз даних. Ця система керування базами даних (СКБД) з відкритим кодом була створена як альтернатива комерційним системам. MySQL з самого початку була дуже схожою на mSQL, проте з часом вона все розширювалася і зараз MySQL — одна з найпоширеніших систем керування базами даних. Вона використовується, в першу чергу, для створення динамічних веб-сторінок, оскільки має чудову підтримку з боку різноманітних мов програмування.

Для встановлення цієї бази даних пишу команду:

sudo apt-get install mysql-server.

Розпочалося встановлення системи управління базами даних.

Рисунок 1.54 — Встановлення бази даних MySQL.

У процесі встановлення необхідно ввести пароль для доступу до бази даних.

Рисунок 1.55 — Ввід пароля до бази даних.

Далі необхідно ввести ще раз пароль, для перевірки на правильність.

Рисунок 1.56 — Повторне введення паролю Система управління базами даних MySQL успішно встановлена.

1.4.5 Зв’язка встановлених сервісів Головні сервіси на сервері уже встановлені, але тепер їх необхідно зв’язати, щоб вони коректно працювали один з одним.

Для цього ввожу одразу кілька команд:

sudo apt-get install libapache2-mod-php5.

sudo apt-get install libapache2-mod-auth-mysql.

sudo apt-get install imagemagick.

sudo apt-get install php5-mysql.

Після установлення, я перезавантажую веб-сервер:

sudo /etc/init.d/apache2 restart.

Робота з домашньої папки.

Для зручності роботи хотілося, щоб сайти, які я створюю розташовувалися в домашній папці, наприклад в папці projects.

Робиться це так:

Відкриваю файл зі списком віртуальних хостів.

sudo gedit /etc/apache2/httpd.conf.

і додаю наступний запис:

NameVirtualHost 127.0.0.2.

<VirtualHost 127.0.0.2>

ServerName site1.

DocumentRoot «/home/user/projects/site1» .

</VirtualHost>

Для додавання декількох віртуальних хостів просто необхідно клонувати цей запис потрібну кількість разів.

Після цього відкриваю файл.

sudo gedit /etc/hosts.

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

# My Virtual Hosts.

127.0.0.2 site1.

Тепер необхідно перезапустити сервер Apache. Робиться це наступною командою:

sudo sudo /etc/init.d/apache2 restart.

Якщо Apache видав повідомлення [ОК], то все пройшло вдало і тепер створена своя папка для кожного сайту.

Якщо є помилка, то необхідно повторити процедуру заново.

Для того, щоб подивитися версію php і взагалі запустився він чи ні, можна створити в папці /home/user/projects/site1 файл info. php:

<?php.

php_info ();

?>

Відкрити цей файл із браузера: http://site1/info.php. Якщо PHP установлений правильно й все працює, то появиться інформація про версію й підключені бібліотеки.

Адміністрування бази даних Щоб одержати доступ до сервера баз даних і створити бази для наших сайтів необхідно запустити phpmyadmin. У рядку адреси браузера необхідно ввести:

127.0.0.1/phpmyadmin.

Ім'я користувача — root, пароль — зазначений при установці (пустий).

Чисті посилання — mod rewrite.

Більшість CMS підтримують так звані «чисті» посилання. Для їхнього включення необхідно включити модуль mod_rewrite.

sudo a2enmod rewrite.

Після цього знову необхідно перезапустити сервер Apache.

На цьому встановлення та налаштування закінчено.

1.4.6 Встановлення веб-застосунку phpmyadmin.

PhpMyAdmin — сукупність скриптів написаних на PHP, і забезпечуючих повноцінну, у тому числі віддалену роботу з базами даних MySQL через веб інтерфейс.

Так як, phpMyAdmin дозволяє в багатьох випадках обійтися без безпосереднього введення команд SQL, то робота з базами даних стає цілком посильною задачею навіть для людини досить поверхово знайомою з MySQL.

phpMyAdmin — веб-застосунок з відкритим кодом на мові PHP із графічним веб-інтерфейсом для адміністрування СКБДMySQL. phpMyAdmin дозволяє через браузер здійснювати адміністрування сервера MySQL, запускати запити SQL, переглядати та редагувати вміст таблиць баз даних.

Ця програма користується великою популярністю у веб-розробників, оскільки дозволяє керувати СКБД MySQL без безпосереднього вводу SQL команд через дружній інтерфейс і з будь-якого комп’ютера під'єднаного до інтернету без необхідності встановлення додаткового програмного забезпечення.

На сьогоднішній день phpMyAdmin широко застосовується на практиці. Останнє пов’язано з тим, що розробники інтенсивно розвивають свій продукт, з огляду на всі нововведення СКБД MySQL.

Переважна більшість українських провайдерів використовують цей застосунок як панель керування для того, щоб надати своїм клієнтам можливість адміністрування виділених їм баз даних.

Програма розповсюджується під ліцензією GNU General Public License і тому деякі інші розробники інтегрують його у свої розробки, наприклад XAMPP, Denwer.

Ініціатором є німецький розробник Тобіас Ратшіллер (Tobias Ratschiller) і базується, так само як і phpPgAdmin, на аналогічному застосунку MySQL-Webadmin, що виник у 1997 році.

Проект локалізовано понад 50-ма мовами.

Для встановлення phpmyadmin необхідно ввести команду:

sudo apt-get install phpmyadmin.

Так як репозиторій свіжий, то пакет phpmyadmin в процесі установки запитає пароль для доступу до бази даних mysql (там він створює свої таблиці з налаштуваннями) і логін і пароль для свого постійного використання.

Рисунок 1.57 — Встановлення паролю для phpmyadmin.

Після цього перезапускаю апач командою:

sudo /etc/init.d/apache2 restart.

провіряю:

http://localhost/phpmyadmin.

Усе працює.

1.4.7 Встановлення Samba file server.

Samba — вільна реалізація мережевого протоколу SMB/CIFS. Samba випускається під ліцензією GNU. Назва Samba походить від SMB — назви протоколу, який використовується Microsoft Windows для мережевої файлової системи. Головною перевагою Samba є те, що з її допомогою можливо використовувати у мережі одночасно комп’ютери з операційними системами Windowsта Unix, організовувати обмін файлами між ними без окремого Windows-сервера.

Починаючи з третьої версії Samba надає служби файлів і друку для різних клієнтів Microsoft Windows, і може інтегруватися з Windows Server: або як Основний контролер домену (PDC), або як член домену. Вона також може бути частиною домену Active Directory. З версії 3 Samba підтримує файлові сервіси та сервіси для друку.

Виконується на більшості Юнікс-подібних систем, таких як: Linux, Solaris, BSD, Mac OS X Server. Входить до більшості дистрибутивів Лінукс. В OS/2 портований samba-клієнт, плагіном до віртуальної файлової системи NetDrive.

Головною відмінністю від серверних версій Windows є відсутність підтримки для групових політик (непряма підтримка в принципі можлива) і налаштувань профайлів користувачів і комп’ютерів.

Встановлення Samba file server відбувається командою:

sudo apt-get install samba.

Рисунок 1.58 — Встановлення Samba file server.

Встановлення успішно завершене.

1.4.8 Встановлення OpenSSH.

OpenSSH — відкрита реалізація клієнта і сервера для роботи за протоколами SSH та SFTP, набір програм, що надають шифрування сеансів зв’язку у комп’ютерних мережах. Він був створений під керівництвом Teo де Раадта як відкрита альтернатива власницькій реалізації від SSH Communications Security.

Встановлення відбувається командою:

sudo apt-get install openssh-server.

Рисунок 1.59 — Встановлення OpenSSH.

Все, тепер ssh-сервер встановлений та запущений.

Щоб його зупинити/запустити/запустити знову треба ввести команду:

sudo /etc/init.d/ssh stop | start | restart.

Для того щоб під'єднатися до серверу через ssh треба в терміналі ввести:

ssh user@host.

де user — ім'я користувача.

host — ім'я, або IP-адреса сервера.

Для підключення з windows необхідно використати PuTTY.

Конфігураційний файл openssh-server знаходиться:

/etc/ssh/sshd_config.

1.4.9 Встановлення dns-серверу bind.

//лабораторна робота № 2 ТНТУ 10.

Доменна система імен (Domain Name System, DNS) — це розподілена база даних, яка містить інформацію про комп’ютери (хости), підключені до мережі Інтернет. Найчастіше інформація включає ім'я машини, ІР-адресу та дані для маршрутизації пошти.

Для звернення до хостів в мережі Інтернет використовуються 32-розрядні ІР-адреси, що однозначно ідентифікують будь-який комп’ютер в цій мережі. Однак для користувачів застосування ІР-адрес при звертанні до хостів є незручним. Тому було створено систему перетворення імен, яка дозволяла б комп’ютеру у випадку відсутності у нього інформації про відповідність імен та ІР-адрес отримати необхідні відомості від DNS-сервера, ІР-адреса якого зберігається в налаштуваннях підключення до Інтернет.

Таким чином, основне завдання DNS — перетворення імен комп’ютерів в ІР-адреси і навпаки.

Для реалізації системи DNS було створено спеціальний мережений протокол DNS. В мережі також є спеціальні виділені інфомаційно-пошукові сервери — DNS-сервери.

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

DNS-клієнт — це будь-який мережений вузол, який звернувся до DNS-сервера для перетворення імені вузла в ІР-адресу чи, навпаки, ІР-адреси в ім'я вузла.

Основою DNS є уявлення про ієрархічну структуру доменного імені. Кожен сервер, відповідальний за ім'я, може передавати відповідальність за наступну частину домена іншому серверу (з адміністративної точки зору — іншій організації чи людині). Це дозволяє скласти відповідальність за актуальність інформації на сервери різних організацій (людей), що відповідають тільки за «свою» частину доменного імені.

Характеристики DNS:

· Розподіленість адміністрування (відповідальність за різні частини ієрархічної структури несуть різні люди чи організації).

· Розподіленість зберігання інформації (кожен вузол мережі в обов’язковому порядку повинен зберігати тільки ті дані, як івходять в зону його відповідальності і (можливо) адреси кореневих DNS-серверів).

· Кешування інформації (вузол може зберігати деяку кількість даних не із своєї зони відповідальності для зменшення навантаження на мережу).

· Ієрархічна структура (усі вузли об'єднані в дерево, і кожен вузол може або самостійно визначати роботу розміщених нижче вузлів, або передавати їх іншим вузлам).

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

Як працює DNS. Для перетворення імен машин в ІР-адреси програми прикладного рівня, такі як Netscape Navigator і т. п., викликають підпрограму gethostbyname. Якщо конфігурація машини передбачає використання DNS, gethostbyname запитує адресу в сервера імен, ІР-адреса якого вказана в налаштуваннях підключення до Інтернет.

Сервери імен бувають рекурсивними та нерекурсивними. Нерекурсивний сервер діє наступним чином: якщо у нього є адреса, кешована з попереднього запиту, або якщо вона авторитетна для домена, до якого відноситься ім'я, то він дає відповідну відповідь. В протилежному випадку замість правильної відповіді він відсилає до авторитетних серверів іншого домена, які повинні знати відповідь.

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

Проте у відслідковуванні сервером відсилань є один побічний ефект: у його кеш надходить інформація про проміжні домени. Серверу домена високого рівня (такого як com чи ua) не рекомендується зберігати інформацію, що запитується машиною, розміщеною на кілька рівнів нижче. Його кеш швидко наповниться, і через додаткові затрати часу на обробку рекурсивних запитів пропускна здатність сервера знизиться.

У зв’язку з цим сервери імен нижчих рівнів зазвичай є рекурсивними, а сервери вищих рівнів (верхнього чи частково другого) — нерекурсивними.

Динамічний DNS — технологія, що дозволяє інформації на DNS-сервері оновлюватися в реальному часі, і (за бажанням) в автоматичному режимі. Вона застосовується для присвоєння постійного доменного імені пристрою (комп'ютеру, мереженому накопичувачу) з динамічною ІР-адресою. Це може бути ІР-адреса, отримана по DHCP чи по IPCP в РРР-з'єднаннях (наприклад, при віддаленому доступі через модем). Інші машини в Інтернеті можуть встановлювати з'єднання з цією машиною по доменному імені і навіть не знати, що ІР-адреса змінилася.

Динамічна DNS також часто застосовується в локальних мережах, де клієнти отримують ІР-адресу по DHCP, а потім реєструють свої імена в локальному DNS-сервері.

Приклади управління службою DNS:

· установка служби DNS;

· створення основної та додаткової зони прямого перегляду;

· створення зони оберненого перегляду;

· виконання динамічної реєстрації вузлів в зоні.

Зона прямого перегляду (forward lookup zone) — зони, які служать для перетворення імен вузлів в ІР-адреси. Найчастіше для цього використовуються записи типу A, CNAME, SRV.

Зона оберненого перегляду (reverse lookup zone) — зони, які служать для визначення імені вузла за його ІР-адресою. Основний тип запису PTR.

Порядок встановлення DNS серверу:

Ввожу команду для встановлення:

sudo apt-get install bind9.

Рисунок 1.60 — Встановлення DNS сервера Bind.

Судячи по документації та порадах багатьох системних адміністраторів, bind настійно рекомендують запускати в chroot середовищі. Для цього спочатку треба зупинити bind:

/etc/init.d/bind9 stop.

Щоб вказати серверу, що він повинен запускатися в chroot середовищі потрібно відредагувати такий файл /etc/default/bind9 командою:

nano /etc/default/bind9.

Змінивши в ньому стрічку OPTIONS="-u bind" на OPTIONS="-u bindt /var/lib/named" .

Тепер потрібно створити всі необхідні для роботи bind в chroot середовищі директорії:

mknod /var/lib/named/dev/null c 1 3.

mknod /var/lib/named/dev/random c 1 8.

chmod 666 /var/lib/named/dev/null /var/lib/named/dev/random.

chownR bind: bind /var/lib/named/var/*.

chownR bind: bind /var/lib/named/etc/bin.

Тепер потрібно видалити налаштування bind з apparmor, так як apparmor стає непотрібним, при запуску bind в chroot середовищі:

rm /etc/apparmor.d/usr.sbin.named.

Перезапускаю apparmor:

/etc/init.d/apparmor restart.

Запускаємо bind9:

/etc/init.d/bind9 start.

Якщо все зроблено правильно, то помилок бути не повинно. Якщо bind раптом не запустився, то варто перевірити /var/log/syslog на наявність помилок:

tail/var/log/syslog.

Якщо все працює правильно, то потрібно приступити до налаштування зони для мого домену domain.com.

Створюю файл конфігурації зон:

nano /var/lib/named/etc/bind/zones.conf.

З наступним змістом:

zone «domain.com «{.

type master;

file «/etc/bind/domain.com » ;

} ;

Встановлюю його власника:

chown bind: bind/var/lib/named/etc/bind/zones.conf.

Редагую файл конфігурації bind, щоб він чіпляв конфігурацію зон:

nano/var/lib/named/etc/bind/named.conf.

Додаю в нього рядок include «zones.conf » ;

Залишилося лише створити файл зони domain.com:

nano/var/lib/named/etc/bind/domain.com.

З наступним змістом:

$ TTL 86 400.

@ IN SOA ns1.domain.com. root.domain.com. (.

2 010 081 301; Serial.

3600; Refresh.

900; Retry.

604 800; Expire.

86 400; Minimum.

) ;

@ IN NS ns1.domain.com .

@ IN A 192.168.1.1.

ns1 IN A 192.168.1.1.

ns2 IN A 192.168.1.1.

www IN CNAME @.

domain.com — відповідно ім'я вашого домену. Поміняйте значення перед параметром; Serial на поточну дату. Останні цифри в рядку з датою (01) позначають скільки разів раз зона редагувалася за поточну добу. Так само не забудьте поміняти IP адреса, з яким ви пов’язуєте свій домен (192.168.1.1).

Після збереження файлу виставляємо його власника:

chown bind: bind/var/lib/named/etc/bind/domain.com.

Все готово. Тепер залишилося оновити конфігурацію bind командою.

rndc reload.

І перевірити роботу сервера:

nslookup domain.com 127.0.0.1.

Якщо все працює вірно, то відповідь сервера буде виглядати:

Server: 127.0.0.1.

Address: 127.0.0.1 # 53.

Nonauthoritative answer :

Name: domain.com.

Address: 192.168.1.1.

На цьому налаштування DNS серверу завершена.

1.4.10 Встановлення серверу електронної пошти sendmail.

Поштовий сервер, сервер електронної пошти — в системі пересилки електронної пошти так зазвичай називають агент пересилання повідомлень (англ. mail transfer agent, MTA). Це комп’ютерна програма, яка передає повідомлення від одного комп’ютера до іншого. Зазвичай поштовий сервер працює «за лаштунками», а користувачі мають справу з іншою програмою — клієнтом електронної пошти (англ. mail user agent, MUA).

Наприклад, в поширених конфігураціях клієнтом пошти користувача є Outlook Express, повноцінна версія Microsoft Outlook, або Mozilla Thunderbird. Коли користувач набрав повідомлення і посилає його одержувачу, поштовий клієнт взаємодіє з поштовим сервером, використовуючи протокол SMTP. Поштовий сервер відправника взаємодіє з поштовим сервером одержувача (безпосередньо або через проміжний сервер — релей). На поштовому сервері одержувача повідомлення потрапляє в поштову скриньку, звідки за допомогою агента доставки повідомлень (англ. mail delivery agent, MDA) доставляється клієнту одержувача. Часто останні два агенти суміщені в одній програмі (наприклад, sendmail), хоча є спеціалізовані MDA, які в тому числі займаються фільтрацією спаму. Для фінальної доставки отриманих повідомлень використовується не SMTP, а інший протокол — часто POP3або IMAP — який також підтримується більшістю поштових серверів. Хоча у найпростішій реалізації MTA досить покласти отримані повідомлення в особисту теку користувача уфайловій системі центрального сервера («поштова скринька»).

Часто поштовий сервер включає програмне забезпечення для організації розсилок електронної пошти.

Sendmail — один з найстаріших агентів передачі пошти (MTA — mail transfer agent). Програма розробляється Sendmail Inc. та розповсюджується безплатно разом з сирцевим кодом. Існують версії програми для практично всіх операційних систем іапаратних платформ.

Delivermail, програма, яка послужила основою для sendmail, була створена в 1979 і йшла в комплекті з 4.0 і 4.1 BSD і дещо пізніше дороблена Еріком Оллманом (Eric Allman).

Sendmail вперше був включений до складу 4.1c BSD (перша версія BSD, в яку був включений стек протоколів TCP/IP).

Встановлення серверу електронної пошти відбувається наступним чином:

Ввожу команду.

sudo apt-get install sendmail.

Рисунок 1.61 — Встановлення сервера електронної пошти Потім ввожу команду.

sudo sendmailconfig.

після цього вводяться зміни в наступні файли.

/etc/mail.sendmail.conf.

/etc/cron.d/sendmail.

/etc/mail/sendmail.mc.

1.4.11 Встановлення FTP серверу Протокол передачі файлів (англ. File Transfer Protocol, FTP) — дає можливість абоненту обмінюватися двійковими ітекстовими файлами з будь-яким комп’ютером мережі, що підтримує протокол FTP. Установивши зв’язок з віддаленим комп’ютером, користувач може скопіювати файл з віддаленого комп’ютера на свій, або скопіювати файл з свого комп’ютера на віддалений.

При розгляді FTP як сервісу Інтернет мають на увазі не просто протокол, а саме сервіс — доступ до файлів, які знаходяться у файлових архівах.

FTP — стандартна програма, яка працює за протоколом TCP, яка завжди поставляється з операційною системою. Її початкове призначення — передача файлів між різними комп’ютерами, які працюють у мережах TCP/IP: на одному з комп’ютерів працює програма-сервер, на іншому — програма-клієнт, запущена користувачем, яка з'єднується з сервером і передає або отримує файли через FTP-сервіс. Все це розглядається з припущенням, що користувач зареєстрований на сервері та використовує логін та пароль на цьому комп’ютері.

Ця риса послужила причиною того, що програми FTP стали частиною окремого сервісу Інтернету. Справа в тому, що доволі часто сервер FTP налаштовується таким чином, що з'єднатися з ним можна не тільки під своїм ім'ям, але й під умовним іменем anonymous — анонім. У такому випадку для користувача стає доступною не вся файлова система комп’ютера, а лише деякий набір файлів на сервері, які складають вміст серверу anonymous FTP — публічного файлового архіву. Отже, якщо користувач хоче надати у вільне користування файли з інформацією, програмами і т. і., то йому достатньо організувати на власному комп’ютері, включеному в Інтернет, сервер anonymous FTP. Створення такого серверу — процес доволі простий, програми-клієнти FTP вельми розповсюджені, — тому сьогодні публічні файлові архіви організовані в основному як сервери anonymous FTP. Перелік інформації, яка міститься на таких серверах, включає всі аспекти життя: від звичайних текстів домультимедіа.

Не зважаючи на розповсюдженість, у FTP є багато недоліків. Програми-клієнти FTP не завжди зручні і прості у користуванні. Користувач не завжди може зрозуміти який файл перед ним, чи той що необхідно, чи ні. Окрім того, не існує простого і універсального засобу для пошуку на серверах anonymous FTP, — хоча для цього і існує спеціальний сервіс archie, але це незалежна програма, вона не універсальна і не завжди її можна ефективно застосовувати. Програми FTP доволі старі і деякі їхні особливості, які були потрібні в часи їхнього створення, не зовсім зрозумілі і потрібні зараз. Наприклад, для передачі файлів існує два режими — двійковий та текстовий, і, якщо користувач неправильно обрав режим передачі, то файл, який необхідно передати, може бути пошкодженим. Опис файлів на сервері видається у форматі операційної системи серверу, а список файлів операційної системи UNIX не завжди з розумінням сприймається користувачами DOS. Сервери FTP нецентралізовані, — звідси випливають ще деякі проблеми. Але незважаючи на все це, сервери anonymous FTP сьогодні — це стандартний шлях організації публічних файлових архівів в Інтернеті.

FTP — сервіс прямого доступу, який вимагає повноцінного підключення до Інтернету, але є можливість доступу і через електронну пошту — існують сервери, які пересилають за допомогою електронної пошти файли з будь-яких серверів anonymous FTP. Проте цей шлях отримання інформації - досить незручний, оскільки такі сервери можуть бути сильно завантажені і запит доволі довго чекатиме своєї черги. Крім того, великі файли при пересилці діляться сервером на частини обмеженого обсягу і, якщо одна з частин загубиться і буде пересланою із пошкодженнями, то весь файл стане непридатним.

Встановлення та налаштування:

1. Встановлюється пакет proftpd за допомогою команди.

sudo aptitude install proftpd.

Рисунок 1.62 — Встановлення ftp.

Якщо FTP-сервер не використовуватиметься постійно відповісти на питання, що з’явилося, про спосіб запуску, необхідно: «самостійно» .

2. Відкриваю файл /etc/shells командою:

sudo nano/etc/shells.

3. Додаю в нього рядок.

/bin/false.

4. Створюю в /home каталозі папку FTP-shared командою:

sudo mkdir /home/FTP-shared.

5. Створюю користувача з ім'ям userftp командою.

sudouseradd userftp — p pass — d /home/FTP — shared — s /bin/false.

де «pass» — пароль.

6. В папці FTP-shared створюю дві вкладені папки:

sudo mkdir /home/FTP-shared/public.

sudo mkdir /home/FTP-shared/upload.

7. Присвоюю потрібні права створеним текам командами.

sudo chmod 755 /home/FTP-shared.

sudo chmod 755 /home/FTP-shared/public.

sudo chmod 777 /home/FTP-shared/upload.

8. Переіменовую наявний конфігураційний файл proftpd. conf і створюю новий:

sudo mv /etc/proftpd/proftpd.conf.

/etc/proftpd/proftpd.conf.old.

sudo nano/etc/proftpd/proftpd.conf.

9. Якщо треба зробити анонімний доступ, слід закоментувати обидві секції для donet і розкоментувати секцію для аноніма.

10. Cервер вже запущений, але з параметрами за замовчуванням. Його необхідно перезапустити:

sudo /etc/init.d/proftpd restart.

11. Для перевірки синтаксису створеного конфіг-файлу можна виконати:

sudo proftpd — td5.

12. Щоб взнати, хто підключений до фтп-серверу в даний момент використовується команда ftptop (клавіша t міняє відображення, q — вихід) можна також використати команду ftpwho.

13. Фтп-сервер з двома папками, одна з них (public) доступна тільки для читання, інша (upload) — для запису.

1.5 Створення інформаційного веб-сайту Сайт або веб-сайт (від англ. website, місце, майданчик в інтернеті) — сукупність веб-сторінок, доступних у мережі (Інтернеті), які об'єднані як за змістом, так і навігаційно. Фізично сайт може розміщуватися як на одному, так і на кількох серверах.

Сайтом також називають вузол мережі Інтернет, комп’ютер, за яким закріплена унікальна ІР-адреса, і взагалі будь-який об'єкт в Інтернеті, за яким закріплена адреса, що ідентифікує його в мережі (FTP-site, WWW-site тощо).

Набір зв’язаних між собою інформаційних онлайнових ресурсів, призначених для перегляду через комп’ютерну мережу за допомогою спеціальних програм — браузерів. Веб-вузол може бути набором документів в електронному вигляді, онлайновою службою.

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

Структурне розположення усіх php, javascript, html, css-файлів та зображень:

Папка public_html — коренева папка.

· index. php — головна сторінка.

· about. php — про компанію.

· services. php — послуги компанії.

· contact. php — контакти.

· help. php — FAQ.

· addmessage. php — скрипт додавання нового коментаря.

· favicon. png — іконка, яка відображається поряд із заголовком сайту Папка css — папка для збереження файлів css.

· general-style.css — головний CSS-стиль сайту.

· menu-style.css — CSS-стиль головного меню сайту Папка javascript — папка для збереження файлів javascript.

· welcome. css — скріпт привітання на сайті.

Папка include — папка для збереження підключаючих файлів.

· footer. php — підвал сайту.

· general-menu.php — головне меню сайту.

· header. php — шапка сайту.

· left-block.php — ліва частина сайту Папка images — папка для збереження картинок.

· back-to-top.png — кнопка підняття на початок сайту.

· polytech-logo.png — логотип сайту Даний сайт містить 6 php-сторінок, 3 CSS-файли, 1 javascript-код, 3 зображення, 4 підключаючі файли.

1.5.2 Створення нового віртуального хоста Починаю створення сайту.

Для цього спочатку створюю новий віртуальний хост:

1. Добавляю відруальний хост. Для цього відкриваю файл зі списком віртуальних хостів:

sudo gedit /etc/apache2/httpd.conf.

і додаю наступний запис:

NameVirtualHost 127.0.0.5.

<VirtualHost 127.0.0.5>

ServerName mylocalhost.

DocumentRoot «/home/user/webservers/mylocalhost» .

</VirtualHost>

2. Записую новий хост до списку хостів. Відкриваю файл:

sudo gedit /etc/hosts.

і додаю наступний рядок:

127.0.0.5 mylocalhost.

3. Заходжу в каталог /home/user/webservers/ та створюю нову папку mylocalhost.

4. Тепер необхідно перезапустити сервер Apache. Робиться це наступною командою:

sudo sudo /etc/init.d/apache2 restart.

Новий сайт доступний у браузері за адресою: http://mylocalhost/.

1.5.3 Веб-сторінка Веб-сторінка (англ. Web-page) — інформаційний ресурс доступний в мережі World Wide Web (Всесвітня павутина), який можна переглянути у веб-браузері. Зазвичай, інформація веб-сторінки записана в форматі HTML, XHTML, або рідше wml (для wap-сторінок).

HTML — Мова розмітки гіпертекстових документів. Cтандартна мова розмітки веб-сторінок в Інтернеті. Більшість веб-сторінок створюються за допомогою мови HTML (або XHTML). Документ HTML оброблюється браузером та відтворюється на екрані у звичному для людини вигляді.

HTML є похідною мовою від SGML, успадкувавши від неї визначення типу документу та ідеологію структурної розмітки тексту.

HTML разом із каскадними таблицями стилів та вбудованими скриптами — це три основні технології побудови веб-сторінок.

Типовий Web-документ складається з текстових блоків, рисунків, таблиць, ліній, гіперпосилань. Більш складні Web-документи містять фрейми (вкладені Web-сторінки), елементи керування та вводу інформації(кнопки, перемикачі, поля вводу тексту), динамічні об'єкти (Java Applet, Java Script, ActiveX).

Є три типи текстових блоків: текстові абзаци, списки, таблиці. За замовчування текст відображається чорним кольором, але при потребі можна змінити колір, розмір, стиль та шрифт тексту. Абзаци на сторінці за замовчуванням розмежовуються переводом рядка і не мають відступів у першому рядку. Абзац може бути вирівняний до одного з країв або по центру вікна. Зручність перегляду Web-сторінок зумовлена тим, що броузер автоматично масштабує елементи по горизонталі, враховуючи розміри вікна, і при потребі відображає тільки вертикальну смугу прокрутки. інформація на сторінці традиційно відображається на білому фоні, але його колір можна змінити на інший або використати фонову картинку.

1.5.3.1 Створення веб-сторінки за допомогою HTML.

HTML (англ. HyperText Markup Language — Мова розмітки гіпертекстових документів) — стандартна мова розмітки веб-сторінок в Інтернеті. Більшість веб-сторінок створюються за допомогою мови HTML (або XHTML). Документ HTML оброблюється браузером та відтворюється на екрані у звичному для людини вигляді.

HTML є похідною мовою від SGML, успадкувавши від неї визначення типу документу та ідеологію структурної розмітки тексту.

HTML разом із каскадними таблицями стилів та вбудованими скриптами — це три основні технології побудови веб-сторінок.http://uk.wikipedia.org/wiki/HTML — cite_note-w3−1.

Перша сторінка буде написана на мові гіпертекстової розмітки HTML. Для початку запускаю звичайний текстовий редактор. Оскільки я користуюся операційною системою Ubuntu, тому я користуюся текстовим редактором Gedit.

Отже запускаю текстовий редактор і зберігаємо його в папці проектку з іменем index, та задаю розширення .html.

Документ HTML можна розглядати як сукупність вказівок (команд) і даних (як безпосередньо розміщених у документів, так і пов’язаних з ним посиланнями), які при інтерпретації програмою-броузером відтворюють вигляд сторінок документу. Документ HTML складається з так званих тегів.

Тег — це одиниця коду HTML, яка складається з «команди», поміщеної у кутові дужки < >. Теги бувають відкриваючими та закриваючими. Закриваючі теги починаються зі знаку /.

Усі документи починаються і закінчуються тегами, які позначають його початок та кінець: <HTML> та </HTML>. Тому все що я напишу в тегах <html></html> бравзер буде сприймати, як HTML. Усе що написано за цими тегами, не буде сприйматися браузером.

Пишу перші рядки коду:

<html>

</html>

В межах документу виділяються дві області - «заголовок» та власне «тіло документу». Заголовок оголошується тегами <HEAD> та </HEAD>. У межах заголовку можуть розміщуватись власне заголовок документу (відображається у верхній стрічці вікна браузера), він створюється тегами <TITLE> та </TITLE>; крім цього у заголовку документу може міститися тег <META>, який використовується для технічного опису документу (інформація для пошукових програм), а також тег <STYLE>, який використовується для опису стилів, які використовуються у документі.

Наступним розділом документу HTML є розділ «тіла документу». Він починається тегом <BODY>, а закінчується тегом </BODY>. Все що буде написане між цими тегами буде відображатися на екрані браузера.

Тепер наший код набув нового вигляду:

<html>

<head>

</head>

<body>

</body>

</html>

Спочатку пропишу в верхній частині сайту такий код:

<!DOCTYPE HTML PUBLIC «-//W3C//DTD HTML 4.01 Transitional//EN» «http://www.w3.org/TR/html4/loose.dtd» >

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

Валідація (англ. Validation) — процес підтвердження відповідності або надання законної сили. Валідація в програмуванні — процес, що дозволяє визначити, наскільки точно з позицій потенційного користувача деяка модель представляє задані сутності реального світу.

Тепер закінчу працювати із тегом <head> і запишу усі теги із якими буду працювати. А працювати я буду із тегами <title></title>, які відповідають за заголовок сторінки, який відображається у стрічці браузера. А ще скористаюся тегом <meta>. В цей тег можна прописувати багато речей, таких як ключові слова для пошуку, опис сайту, тип кодування та інше.

Оновлений код буде мати вигляд:

<html>

<head>

<title>ІТ-компанія «Політех» </title>

<meta http-equiv="Content-Type" content= «text/html; charset=utf-8» />

<meta name="description" content="Офіційний сайт компанії Політех" />

<meta name="keywords" content="хостинг, адміністрування" />

</head>

<body>

</body>

</html>

Пізніше у шапку сайту будуть дописані ще багато інших тегів, але зараз цього є достатньо.

Тепер можна приступати до роботи з тегами <body> </body>.

Отже, вирішено, що сайт буде складатися з верхньої частини, нижньої частини, а також лівою і основної частини. «Розбивання» сайту на «блоки» буду робити тегами <div>. Після змін, код сайту набуде таких змін:

<html>

<head>

<title>ІТ-компанія «Політех» </title>

<meta http-equiv="Content-Type" content= «text/html; charset=utf-8» />

<meta name="description" content="Офіційний сайт компанії Політех" />

<meta name="keywords" content="хостинг, адміністрування" />

</head>

<body>

<div><!—Головний блок—>

<div><!—Верхня частина сайту—>

Верхня частина сайту.

</div>

<div><!—Ліва частина сайту—>

Ліва частина сайту.

</div>

<div><!—Робоче поле—>

Робоче поле.

</div>

<div><!—Нижня частина сайту—>

Нижня частина сайту.

</div>

</div>

</body>

</html>

Оскільки код уже є досить великим, то я код коментую, використовуючи спеціальний коментар, який має вигляд: <!—Коментар—>.

А тепер необхідно у ліву частину сайту додати кілька блоків, таких як: головне меню, навігатор, статистика, друзі сайту.

Свій звичний вид цей блок отримає коли в код будуть вставлені зображення та прописані CSS-стилі, але перші записи робляться на HTML.

<div class="leftmenu" ><!—Ліва частина сайту—>

<center><b>Головне меню:</b></center><br>

<center><b>Навігатор:</b></center><br>

<center><b>Статистика:</b></center><br>

<center><b>Друзі сайту:</b></center><br>

</div>

А тепер трошки вдосконалю HTML-код. Оформлення задам за допомогою CSS:

<div class="leftmenu-block" ><b>Головне меню: </b></div><!—Блок —>

<br><div class="leftmenu-block" ><b>Навігатор: </b></div><!—Блок —>

<br><div class="leftmenu-block" ><b>Статистика: </b></div><!—Блок —>

<br><div class="leftmenu-block" ><b>Друзі сайту: </b></div><!—Блок —>

Тепер необхідно створити пункти головного меню. Виглядати головне меню буде так:

<div class="leftmenu-block" ><b>Головне меню:</b></div><!—Блок—>

<div class="diva" >

<p><div class="menu-point" ><a class="menu" href="http://melkiy.te.ua/" >Головна сторінка</a></div></p>

<p><div class="menu-point" ><a class="menu" href="http://melkiy.te.ua/" >Послуги</a></div></p>

<p><div class="menu-point" ><a class="menu" href="http://melkiy.te.ua/" >Про Компанію</a></div></p>

<p><div class="menu-point" ><a class="menu" href="http://melkiy.te.ua/" >Контакти</a></div></p>

<p><div class="menu-point" ><a class="menu" href="http://melkiy.te.ua/" >Питання-відповіді</a></div></p>

<p><div class="menu-point" ><a class="menu" href="http://melkiy.te.ua/" >Сторінка 6</a></div></p>

</div>

Після реєстрації у спеціальних сервісах, можна отримаємо код для лічильника, який буде розміщуватися на сайті і рахуватиме статистику. Хоча сам код статистики можна написати вручну за допомогою засобів PHP.

Категорію Друзі сайту створюю за допомогою маркерованого списку. Виглядати код буде так:

<br><div class="leftmenu-block" ><b>Друзі сайту: </b></div><!—Блок —>

<ul>

<li><a href="http://melkiy.te.ua/" target="_blank" > [melkiy] corporation</a></li>

<li><a href="http://melkiy.bz.ua/" target="_blank" > Офіційний melkiy сайт</a></li>

<li><a href="http://vmn70.te.ua/" target="_blank" > Блог Володимира Melkiy.te.uaа</a></li>

<li><a href="http://mi.ucoz.org/" target="_blank" > [melkiy] - інформаційний портал</a></li>

<li><a href="http://melkiy.at.ua/" target="_blank" > melkiy сайт</a></li>

</ul>

І ще необхідно доробити вигляд робочої області. Допишу заголовок та абзаци:

<div class="workarea" ><!—Робоче поле—>

<center><h1>Заголовок</h1></center>

<p>Абзаци</p>

<p>Абзаци</p>

</div>

При створенні сторінок ці записи будуть змінені.

Наступним кроком, треба прописати у нижній частині сайту copyleft, та посилання на автора сайту. Код нижної частини сайту буде виглядати так:

<div class="footer" ><!—Нижня частина сайту—>

<p>

Компанія «Політех» <a href= «http://melkiy.te.ua» >Розробив Володимир Melkiy.te.ua</a> Усі права вільні.

<span style="-webkit-transform: rotate (180deg); -moz-transform: rotate (180deg); -o-transform: rotate (180deg); -khtml-transform: rotate (180deg); -ms-transform: rotate (180deg); transform: rotate (180deg); display: inline-block;" >(c)</span><!—Copyleft—>

</p>

</div>

На цьому можна вважати, що каркас сайту готовий.

Сайт набув сирого вигляду.

Рисунок 1.63 — Вигляд сайту, написаного на HTML.

Решту контенту можна буде дописати згодом. А те, що сайт не має привабливого вигляду, це не проблема. Тому, що вирівнювати і зафарбовувати сайт буду за допомогою каскадних таблиць стилів — CSS.

1.5.3.2 Створення веб-сторінки за допомогою CSS.

Каскадні таблиці стилів (англ. Cascading Style Sheets або скорочено CSS) — спеціальна мова, що використовується для відображення сторінок, написаних мовами розмітки даних.

Найчастіше CSS використовують для візуальної презентації сторінок, написаних HTML та XHTML, але формат CSS може застосовуватися до інших видів XML-документів.

Специфікації CSS були створені та розвиваються Консорціумом Всесвітньої мережі.

CSS має різні рівні та профілі. Наступний рівень CSS створюється на основі попередніх, додаючи нову функціональність або розширюючи вже наявні функції. Рівні позначаються як CSS1, CSS2 та CSS3. Профілі — сукупність правил CSS одного або більше рівнів, створені для окремих типів пристроїв або інтерфейсів.

Наприклад, існують профілі CSS для принтерів, мобільних пристроїв тощо.

CSS (каскадна або блочна верстка) прийшла на заміну табличній верстці веб-сторінок. Головна перевага блочної верстки — розділення змісту сторінки (даних) та їхньої візуальної презентації.

Тег у CSS має такий запис:

тег.

{.

властивість1:значення1;

властивість2:значення2;

}.

Стильових ефектів є досить багато. З їх допомогою можна оформити веб-сторінку оригінально, різноманітніше, ніж за допомогою звичайних тегів. Наприклад ефектами оформлення можуть бути:

background — колір фону;

font-family — вид шрифта;

font-size — розмір шрифта;

color — колір шрифта;

text-align — вирівнювання тексту;

text-decoration — оздоблення тексту;

font-weight — жирність шрифта;

margin-top — відстань від верхнього рядка;

line-height — висота рядка.

Перше, що треба зробити, це в робочій папці створити ще одну папку і задати їй ім'я CSS. У цю папку будуть зберігатися усі CSS-файли. Для цього запускаю блокнот і зберігаю його з іменем general-style і розширенням .css. У цей файл буду записувати теги для форматування зовнішнього вигляду сторінки.

Створюю перший стиль, який застосовую до усієї сторінки:

body.

{.

}.

Внесу перші властивості та значення. Фонова заливка має бути світло персиковою, тому пишу властивість background-color: та задаю значення у шістнядцятковому форматі, який означатиме фоновий колір: faf3ba;. В результаті код набуде вигляду:

body.

{.

background-color: faf3ba;

}.

Тепер задаю колір тексту. Із стандартного чорного виберу зелений. Запишу властивість color: та задам йому значення green або 5 906;, що означатиме колір.

Тепер код набуває вигляду:

body.

{.

background-color: faf3ba;

color: 5 906;

}.

Для того, щоб побачити зміни, які відбулися після зміни коду CSS, необхідно підключити стиль до сторінки. Підключаються стилі в «шапку» сайту. Виглядає цей код так:

<head>

<title>ІТ-компанія «Політех» </title>

<link href="/css/general-style.css" rel="stylesheet" type="tsxt/css" >

</head>

Стиль body застосовується автоматично до «робочої області» сайту. Інші стилі необхідно підключати вручну. Робиться це так:

<div class="mainframe" >вміст блоку</div>

mainframe — це назва стилю і вона повинна бути унікальною.

Тепер, по аналогії до стилю mainframe, створюю інші стилі для кожного div-блоку. Усього буде п’ять схожих між собою стилів.

Стиль загального блоку:

.mainframe/*головний блок ||| усі блоки взяті в один загальний блок*/.

У цьому стилі задані загальні параметри для сайту, такі як: вирівнювання (посередині), ширина і бордюр (в ньому є потреба при розробці, щоб добре бачити границі сайту. Після закінчення створення сайту, це значення можна видалити).

Стиль верхнього блоку (шапка сайту):

.header.

потім видалити. потрібен для розмітки*/.

text-align: center;/*розміщення тексту = по центру*/.

Стиль лівого блоку:

.leftmenu.

Стиль робочого поля:

.workarea.

Стиль нижньої частини сайту:

.footer.

border: 1px solid red;/*бордюр

Тепер коли сайт набув необхідного вигляду, необхідно дописати блоки лівого меню. Задаю йому заокруглені рамки, колір тексту, та фон.

Код матиме такий вигляд:

.leftmenu-block.

{.

border: 1px solid red;/*бордюр*/.

overflow: hidden;/*заборона показувати контент, якщо він виходить за межі блоку (щоб не з'їхав шаблон)*/.

padding: 10px;/*відступ вмісту блоку від границь блоку*/.

text-align: center;/*розміщення тексту = по центру*/.

border-radius: 8px;/*заокруглені краї*/.

color:black;/*колір тексту*/.

background-color: gold;/*колір заливки*/.

}.

На цьому робота із каркасом закінчена. Ще кілька дописів і шаблон сайту буде готовий.

Окремо варто виділити головне меню сайту. Я його css-стиль роблю окремим файлом. Для цього треба в папці створити ще один CSS-файл. Запускаю блокнот і зберігаю його з іменем menu-style і розширенням .css. У цей файл буду записувати коди для форматування головного меню сайту.

Після створення файлу, його необхідно підключити до сторінки. Підключаються стилі в «шапку» сайту. Виглядає цей код так:

<head>

<title>ІТ-компанія «Політех» </title>

<link href="/css/menu-style.css" rel= «stylesheet» type="tsxt/css" >

</head>

В створену таблицю стилів ввожу коди для форматування пунктів головного меню:

.menu.

{.

border: 1px solid green;

padding: 5px;

text-decoration: none;/*підкреслення*/.

color: red;

}.

.menu:hover.

{.

color:black;

background-color: gold;

}.

.diva.

{.

align: center;

}.

Із підключеними стилями сайт має вигляд.

Рисунок 1.64 — Вигляд сайту з використанням CSS.

В результаті було створено і підключено дві каскадні таблиці стилів.

1.5.3.3 Створення веб-сторінки за допомогою javascript.

JavaScript — назва реалізації стандарту мови програмування ECMAScript компанії Netscape, базується на принципах прототипного програмування. Найпоширеніше і найвідоміше застосування мови — написання сценаріїв для веб-сторінок, але, також, використовується для впровадження сценаріїв керування об'єктами вбудованими в інші програми.

Незважаючи на схожість назв, JavaScript та мова програмування Java мають дуже мало спільного. Права на назву Java належать компанії Sun Microsystems.

JavaScript розроблений у компанії Netscape. На сьогоднішній день підтримується більшістю браузерів. Текст програми включається безпосередньо в HTML-документ і інтерпретується самим браузером (точніше, вбудованим у браузер рушієм JavaScript). Застосовується в основному для часткової автоматизації обробки і маніпуляції даними, які використовує сторінка.

Тепер напишу маленький JavaScript-код і підключу його до сайту.

В першу чергу, що я зроблю, це в робочій папці створюю ще одну папку і задаю їй ім'я javascripts. У цю папку будуть зберігатися усі скріпти. Для створення першого скрипту, запускаю блокнот і зберігаємо його з іменем welcome і розширенням .js. У цей файл запишу один простенький javascript-код, який буде виводити вітання відвідувачам на сайті і розказувати про послуги, які надає компанія.

Код має вигляд:

function message () {window.alert ('Вітаю Вас на сайті ПОЛІТЕХУ. У нас Ви можете замовити послуги: хостингу, адміністрування, створення та розкрутка сайту. Детальніше в розділі «Послуги» ')}.

Для того, щоб побачити роботу коду, його необхідно підключити до сторінки. Підключаються скріпт в «шапку» сайту. Виглядає цей код так:

<head>

<title>ІТ-компанія «Політех» </title>

<script type="text/javascript" src="welcome.js" > </script>

</head>

Скріпт уже написаний і підключений. Тепер його треба тільки вставити в код сторінки.

Уже вирішено, що код розміщуватиметься в лівому блоці. Одразу після блоку головного меню, буде створений ще один блок — навігатор.

У код сайту пишемо:

<div class="leftmenu-block" ><b>Інформація: </b></div><!—Блок —>

<p onclick="return message ()" >Вітання!!!</p>

Тепер напишу ще один javascript-код, який буде виводити повідомлення про те, на якій сторінці знаходиться відвідувач.

function message2() {window.alert ('Ви знаходитеся на шаблоні сайту')}.

Код розміщується в шапці сайту, між тегами <head></head> і має вигляд:

<script type="text/javascript" >

<!-;

function message2() {window.alert ('Ви знаходитеся на шаблоні сайту')}.

—>

</script>

А тепер необхідно вставити код в сторінку сайту.

<div class="leftmenu-block" ><b>Навігатор: </b></div><!—Блок—>

<center><p onclick="return message2()" >Щоб дізнатися на якій Ви сторінці, просто натисніть тут</p></center>

Із підключеними скраптами сайт має вигляд.

Рисунок 1.65 — Вигляд сайту з використанням скрапів В результаті було створено і підключено два javascript — скріпти.

1.5.3.4 Створення та вставка графічних об'єктів Тепер треба в сторінку сайту вставити зображення, які би доповнили дизайн сайту.

Перш ніж приступати до створення зображення варто знати, що зображення є векторними та растровими.

Вемкторна грамфіка (також геометричне моделювання або об'єктно-орієнтована графіка) — створення зображення вкомп’ютерній графіці з сукупності геометричних примітивів — (точок, ліній, кривих, полігонів), тобто об'єктів, які можна описати математичними виразами.

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

Рамстрова грамфіка (англ. Raster graphics) є частиною комп’ютерної графіки, який має справу зі створенням, обробкою та зберіганням растрових зображень. Растрове зображення є масивом кольорових точок (пікселів). Обробка растрової графіки здійснюється растровими графічними редакторами. Растрові зображення зберігаються у різних графічних форматах.

Я ж буду користуватися векторною графікою.

Три найпопулярніші типи зображення які використовуються в WEB: jpg, gif i png.

JPEG (Joint Photographic Experts Group) — растровий формат збереження графічної інформації, що використовуєстиснення з втратами.

При необхідності дуже сильного стиснення втрати можуть бути переглянуті за допомогою модуля Matrixmuster (матричний зразок, матричний малюнок). Втрати і спотворення інформації через ступінь стиснення можуть проявлятися вже в призначених для користувача програмах. Допустимий рівень стиснення залежить від характеру зображення та існує, як правило, в межах 1:10. Формат JPEG часто використовується як формат даних в цифрових камерах. У Інтернеті формат JPEG застосовується для відображення напівтонових ілюстрацій та графічної інформації з плавним переходом тонів. Формат JPEG, на відміну від GIF і PNG, не підтримує ні анімацію, ні прозорість. Область застосування формату досить вузька — розповсюдження високоякісної напівтонової графіки в Інтернеті. Формат підтримується практично всіма сучасними графічними програмами та веб-браузерами.

Алгоритм стиснення даних, що використовується у форматі, базується на алгоритмі дискретного косинусного перетворення.

Найбільша роздільна здатність, яку підтримує формат JPEG/JFIF є 65 535Ч65535.

PNG (Portable Network Graphics) — растровий формат збереження графічної інформації, що використовує стиснення без втрат. PNG був створений для заміни формату GIF, графічним форматом, який не потребує ліцензії для використання. Зазвичай файли формату PNG мають розширення .png і використовують позначення MIME-типу image/png.

Формат PNG зберігає інформацію у стиснутому вигляді, при чому стиснення проводиться без втрат якості, на відміну від формату JPEG. Формат PNG спроектований для заміни застарілого і простішого формату GIF, а також у деякій мірі, для заміни складнішого формату TIFF.

GIF (від англ. Graphics Interchange Format — «формат обміну зображеннями») — 8-бітний растровий графічний формат, що використовує до 256 чітких кольорів із 24-бітного діапазону RGB. Формат було розроблено компанією CompuServe у 1987 році, і з того часу набув широкої популярності у всесвітній павутині завдяки своїй відносній простоті та мобільності. Одними із головних особливостей формату є підтримка анімаціїта прозорості.

Для стискання файлів використовує LZW-компресію.

А малювати векторні зображення для сайту я буду малювати в графічному редакторі GIMP, який був стрений проектом GNU і розповсюджується за вільною ліцензією GPL.

GIMP (The GNU Image Manipulation Program) — растровий графічний редактор, із деякою підтримкою векторної графіки. Проект розпочали 1995 року Spencer Kimball і Peter Mattis як навчальний проект в Берклі. В 1997, після закінчення нимиуніверситету GIMP став частиною проекту GNU. Програма підтримується та розвивається товариством добровольців, ліцензована за умовами GNU General Public License версії 3+, починаючи з релізу 2.8. Символом GIMP є койот Вілбер (Wilber). Програма працює на системах Microsoft Windows, Gnu/Linux, FreeBSD (або OpenBSD), MacOS X, OpenSolaris.

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

Першим створеним малюнком необхідно створити favicon.

Favicon («вибрана позначка»; цей термін походить від слова «Favorites» — меню вибраних посиланнь) — спеціальна іконка, котра відображається поряд з адресою сайту в адресному рядку браузера, закладках (favorites).

Традиційно використовується зображення розміром 16Ч16 пікселів формату ICO, яке розташоване в корені сайту під назвою favicon. ico, хоча розширення можна задати різні (png, jpg чи навіть анімований gif).

Для створення зображення favicon необхідно запустити графічний редактор GIMP і створити нове зображення. Задамо розмір зображення 16 на 16 пікселів.

Вирішено, що favicon-зображення буде зроблений у патріотичних тонах і буде схожим на національний прапор України.

Тепер розділюю створене зображення на дві рівні частини. Верхню частину заливою синім кольором, а нижню жовтим.

Тепер збережу зображення з іменем favicon, та задам йому розширення .png.

Перше зображення створено і воно має наступний вигляд Рисунок 1.66 — Вигляд зображення favicon.

Підключається favicon-зображення спеціальним тегом, який розміщується між тегами <head> і </head>:

<link rel="shortcut icon" href=" favicon. png" type= «image/png» >

Обновляю сторінку і дивлюся на закладку у браузері. Біля назви сайту появився синьо-жовтий прапор України.

Тепер малюю логототип компанії.

Наперед вирішено, що логотип буде у формі блок-схеми і міститиме назву компанії, яка написана англійською мовою «POLITECH» .

Для цього запускаю графічний редактор GIMР. Створюю нове зображення і зберігаю з назвою polytech-logo та задаю розширення PNG.

Тепер малюю два еліпси (як початок і кінець у блок-схемі), а також домальовуємо два квадрати і один ромб (які відповідають за елементи та перемикачі у блок-схемі). Після цього усі елементи від «початку» і до «кінця» з'єдную між собою стрілками.

Наступний крок — це розмальовування готового зображення. Елементи заливаю синім кольором, щоб воно підійшло до шаблону, а букви замалюю червоним кольором.

Результат роботи буде мати вигляд.

Рисунок 1.67 — Логотип Тепер необхідно розмістити логотип у папці з зображеннями та приєднати його до сторінки сайту.

Логотип поміщується у папку images.

На сайті логотип розміщується у шапці сайту.

Код матиме вигляд:

<div class="header" ><!—Верхня частина сайту—>

<a href="http://melkiy.te.ua/" ><img src= «images/polytech-logo.png» alt="logo" ></a>

</div>

Тепер малюємо стрілку «back to top», яка буде піднімати на початок сайту, якщо відвідувач буде низько на сторінці сайту і захоче перейти на початок сайту.

Для цього запускаю графічний редактор GIMР. Створюю нове зображення і зберігаю з назвою back to top та задаю розширення PNG.

Тепер намалюю стрілку, яка буде прозорою. На сайті у стрілці буде відображатися вміст сайту. А також домальовую темно-сірий чотирикутник із заокругленими краями.

Зберігаю зображення.

Виглядає зображення так.

Рисунок 1.68 — Зображення back to top.

Отримане зображення переміщую в папку сайту у папку images.

Тепер необхідно вставити картинку в сторінку сайту. Робиться це тегом картинки, який поміщений у тег посилання. Код матиме вигляд:

<div style="position: fixed; bottom: 40px; right: 80px;" >

<a href="template.php#top" title="Піднятися до верху" >

<img src="images/back-to-top.png" alt="back-to-top" >

</a>

</div>

Даний блок знаходиться у самому низу сайту після div-блоку footer.

Більше не рекомендовано використовувати зображення, тому що вони впливають на швидкість завантаження сторінки.

1.5.3.5 Створення веб-сторінки за допомогою PHP.

PHP (англ. PHP: Hypertext Preprocessor — PHP: гіпертекстовий препроцесор), попередня назва: Personal Home Page Tools — скриптова мова програмування, була створена для генерації HTML-сторінок на стороні веб-сервера. PHP є однією з найпоширеніших мов, що використовуються у сфері веб-розробок (разом із Java, .NET, Perl, Python, Ruby). PHP підтримується переважною більшістю хостинг-провайдерів. PHP — проект відкритого програмного забезпечення.

PHP інтерпретується веб-сервером в HTML-код, який передається на сторону клієнта. На відміну від скриптової мовиJavaScript, користувач не бачить PHP-коду, бо браузер отримує готовий html-код. Це є перевага з точки зору безпеки, але погіршує інтерактивність сторінок. Але ніщо не забороняє використовувати РНР для генерування і JavaScript-кодів які виконуються вже на стороні клієнта.

У шаблон запишу кілька кодів PHP. Так, як каркас, шаблон і дизайн пишуться на HTML i CSS, то PHP-коди виводитимуть тільки додаткову інформацію. Перший запис запишу в лівий блок в категорію Інформація, яку ще можна назвати Статистика. Перший такий код виводитиме поточний час. Виглядає код так:

<div class="leftmenu-block" ><b>Інформація:</b></div> <!—Блок —>

<?

echo 'Зараз ';

echo date ('H:i');

echo ' година';

?>

Для того, щоб код виводив на екран монітора точну годину, треба сторінку зберегти з розширенням .php.

Тепер створюю простенький код, для того щоб порахувати кількість відвідувачів. Код має вигляд:

<p><?php.

$counter = 0;

$counter++;

echo «Сьогодні було відвідувачів: $counter» ;

?></p>

Решта кодів можна буде дописати згодом.

1.5.3.6 Створення веб-сторінки із використанням бази даних База даних (скорочено — БД) — впорядкований набір логічно взаємопов'язаних даних, що використовуються спільно та призначені для задоволення інформаційних потреб користувачів. У технічному розумінні включно й система керування БД.

Головне завдання БД — гарантоване збереження значних обсягів інформації (так звані записи даних) та надання доступу до неї користувачеві або ж прикладній програмі. Таким чином, БД складається з двох частин: збереженої інформації та системи керування нею.

З метою забезпечення ефективності доступу записи даних організовують як множину фактів (елемент даних).

У базу даних я буду записувати повідомлення із книги гостей.

Спочатку створюю нову базу даних з іменем guestbook і створюю в ній таблицю. Це можна зробити за допомогою додатку, для керування базою даних phpmyadmin, а можна зробити безпосередньо в командному рядку. Код запису буде мати вид:

create table guestbook.

(.

guestbook_id integer not null auto_increment primary key,.

guestbook_user_name varchar (100),.

guestbook_message_text text,.

guestbook_data date.

);

Тепер створюю код, який вставиться на сторінку сайту і в який буде вводитися повідомлення до книги відвідувачів, а також відображатимуться записи, залишиних відгуків іншими користувачами раніше.

<center><h1>Книга відвідувачів</h1></center>

<div style="width: 600px; margin: 0 auto;" >

<form action="addMessage.php" method="post" >

Ваше ім'я:<br>

<input type="text" name="guestName" placeholder="Ваше ім'я" style="width: 100%;" ><br><br>

Текст Вашого повідомлення в книзі відвідувачів:<br>

<textarea name="messageText" placeholder="Текст повідомлення" style="width: 100%; height: 100px;" >

</textarea><br><br>

<input type="submit" value="Залишити повідомлення в книзі відвідувачів!" style="width: 100%;" >

</form>

<?php.

// подключення до бази даних.

$connect = new mysqli ('localhost', 'root', '', 'guestbook');

// отримуємо список всіх повідомлень.

$result = $connect->query («select * from guestbook»);

// вираховуємо кількість отриманих записів.

$countMessage = $result->num_rows;

// якщо кількість записів в базі даних більше, то її виводимо.

if ($countMessage > 0).

{.

// переглядаємо весь масив отриманих даних.

for ($i = 0; $i < $countMessage; $i++).

{.

echo '<div style="border: 1px solid green;" >';

// витягаю дані.

$message = $result->fetch_object ();

// виводжу дані у потрібному виді.

echo «<b>» .$message->guestbook_user_name.": </b><br>" ;

echo $message->guestbook_message_text." <br>" ;

echo «Дата: „.$message->guestbook_data.“ <br>» ;

echo '</div><br>';

}.

}.

?>

</div>

Тепер необхідно створити ще один PHP-файл з назвою addmessage. В цьому файлі будуть скріпти, які записують повідомлення в базу даних.

Код матиме вид:

<?php.

// отримую і обролюю ім'я і текст коментаря.

$guestName = addslashes (htmlspecialchars ($_POST['guestName'], ENT_QUOTES));

$messageText = addslashes (htmlspecialchars ($_POST['messageText'], ENT_QUOTES));

// виведення сьогодньошньої дати.

$date = date («Y.m.d»);

// якщо користувач ввів своє ім'я і текст повідомлення, то додати все це в базу даних.

if ($guestName ≠ «» && $messageText ≠ «»).

{.

// з'єднуємо з базою даних.

$connect = new mysqli ('mylocalhost', 'root', '', 'guestbook');

// якщо запит виконаний успішно, то вивести повідомлення «повідомлення відправлено» .

if ($connect->query («insert into guestbook values (0, '$guestName', '$messageText', '$date')»)).

echo «<center><a href='index.php'>Повідомлення відправлено.</a></center>» ;

// якщо при виконанні запиту є помилка, то вивести повідомлення про неї.

else.

echo «<center><a href='index.php'>Виникла помилка при відправленні повідомлення. Спробуйте пізніше.</a></center>» ;

}.

// якщо користувач не ввів своє ім'я, або текст повідомлення.

else.

echo «<center><a href='index.php'>Необхідно заповнити усі поля! Поверніться на попередню сторінку.</a></center>» ;

?>

Перевірюю код на роботоздатність і введу в форму ім'я і текст повідомлення і відправлю його.

Рисунок 1.69 — Результат роботи книги гостей.

1.5.4 Створення шаблону Шаблон сайту — сукупність оформлених і верстаючих в HTML сторінок, графічних і службових файлів, які можуть використовуватися для створення типового сайту будь-якої спрямованості.

Як правило, шаблони сайтів складаються з графічних файлів дизайну поширених форматів (PNG, JPEG, GIF), поміщених в окрему папку; статичних html-сторінок і файлів таблиці стилів (CSS), а в деяких випадках ще й Flash.

Метою появи шаблонів, цілком може вважатися бажання веб-майстрів спростити процес створення великої кількості типових сайтів. Так одного разу створений шаблон сайту може бути використаний безліч разів. Для цього створюється шаблон з нейтральним дизайном, не належать до певної тематики, в такому випадку дизайн шаблону залишається незмінним, а для різних сайтів замінюють тільки контент сторінок.

Якісні шаблони сайтів розробляються професійними дизайнерами і html-верстальниками. Такі шаблони готуються для використання в html-редакторах і розраховані на початківців веб-майстрів, і можуть послужити зразками для створення сайтів.

Тепер коли сторінка повністю готова, її можна розбити на частини. Але для початку треба створити у кореневій папці, ще одну папку — include, де будуть зберігатися підключаючі файли.

Тепер відкриваю в новостворену папку і створюю нові PHP-файли:

· header. php — тут будуть зберігатися коди, які зберігаються у div-блоці, що відповідає за шапку сайту;

· general-menu.php — тут будуть зберігатися коди, які зберігаються у div-блоці, що відповідає за головне меню сайту;

· left-block.php — тут будуть зберігатися коди, які зберігаються у div-блоці, що відповідає за ліву частину сайту;

· footer. php — тут будуть зберігатися коди, які зберігаються у div-блоці, що відповідає за нижній блок сайту.

Тепер необхідно вирізати блок верхньої частини сайту і помістити його у файл header.php.

Файл header. php має вид:

<div class="header" ><!—Верхня частина сайту—>

<a href="http://melkiy.te.ua/" ><img src="images/polytech-logo.png" alt="logo" ></a>

</div>

Далі вирізую головне меню сайту і поміщую його у файл general-menu.php.

Файл general-menu.php має вид:

<div class="leftmenu-block" ><b>Головне меню:</b></div><!—Блок—>

<div class="diva" >

<p><div class="menu-point" ><a class="menu" href="http://melkiy.te.ua/" >Головна сторінка</a></div></p>

<p><div class="menu-point" ><a class="menu" href="http://melkiy.te.ua/" >Послуги</a></div></p>

<p><div class="menu-point" ><a class="menu" href="http://melkiy.te.ua/" >Про Компанію</a></div></p>

<p><div class="menu-point" ><a class="menu" href="http://melkiy.te.ua/" >Контакти</a></div></p>

<p><div class="menu-point" ><a class="menu" href="http://melkiy.te.ua/" >Питання-відповіді</a></div></p>

<p><div class="menu-point" ><a class="menu" href="http://melkiy.te.ua/" >Сторінка 6</a></div></p>

</div>

Далі вирізую лівий блок сайту і поміщую його у файл left-block.php.

Файл left-block.php має вид:

<div class="leftmenu-block" ><b>Інформація:</b></div><!—Блок —>

<p>

<?

echo 'Зараз ';

echo date ('H:i');

echo ' година';

?>

</p>

<p>

<?php.

$counter = 0;

$counter++;

echo «Сьогодні було відвідувачів: $counter» ;

?>

</p>

<div class="leftmenu-block" ><b>Друзі сайту:</b></div><!—Блок —>

<ul>

<li><a href="http://melkiy.te.ua/" target="_blank" >[melkiy] corporation</a></li>

<li><a href="http://melkiy.bz.ua/" target="_blank" >Офіційний melkiy сайт</a></li>

<li><a href="http://vmn70.te.ua/" target="_blank" >Блог Володимира Melkiy.te.uaа</a></li>

<li><a href="http://mi.ucoz.org/" target="_blank" >[melkiy] - інформаційний портал</a></li>

<li><a href="http://melkiy.at.ua/" target="_blank" >melkiy сайт</a></li>

</ul>

Далі вирізую блок нижньої частини сайту і поміщую його у файл footer.php.

Файл footer. php має вид:

<div class="footer" ><!—Нижня частина сайту—>

<p>

Компанія «Політех» <a href="http://melkiy.te.ua" target="_blank" >Розробив Володимир Melkiy.te.ua</a> Усі права вільні.

<span style="-webkit-transform: rotate (180deg); -moz-transform: rotate (180deg); -o-transform: rotate (180deg); -khtml-transform: rotate (180deg); -ms-transform: rotate (180deg); transform: rotate (180deg); display: inline-block;" >(c)</span><!—Copyleft—>

</p>

</div>

<div style="position: fixed; bottom: 40px; right: 80px;" >

<a href="template.php#top" title="Піднятися до верху" >

<img src="images/back-to-top.png" alt="back-to-top" >

</a>

</div>

Тепер треба підключити нові файли. Підключати буду кодом include. Вставляти цей код буду на місцях, які вирізав з сторінки.

На місці, де був код шапки сайту, необхідно вставити код підключення файлу header.php.

<?php.

include 'include/header.php';

?>

На місці, де був код головного меню сайту, необхідно вставити код підключення файлу general-menu.php.

<?php.

include 'include/general-menu.php';

?>

Потім залишаю частину коду, яка буде іншою на кожній сторінці сайту.

<div class="leftmenu-block" ><b>Навігатор: </b></div><!—Блок—>

<center><p onclick="return message ()" >Щоб дізнатися на якій Ви сторінці, просто натисніть тут</p></center>

На місці, де був код лівої частини сайту, необхідно вставити код підключення файлу left-block.php.

<?php.

include 'include/left-block.php';

?>

На місці, де був код підвалу сайту, необхідно вставити код підключення файлу footer.php.

<?php.

include 'include/footer.php';

?>

Після введених змін, шаблон сайту набув вигляду:

<html>

<head>

<title>ІТ-компанія «Політех» </title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8″ />

<meta name="description" content="Офіційний сайт компанії Політех" />

<meta name="keywords" content="хостинг, адміністрування" />

<link href="/css/general-style.css" rel="stylesheet" type="tsxt/css" >

<link href="/css/menu-style.css" rel="stylesheet" type="tsxt/css" >

<script type="text/javascript" src="/javascripts/navigator.js" ></script>

<link rel="shortcut icon" href="favicon.png" type= «image/png» >

</head>

<body>

<div class="mainframe" ><!—Головний блок—>

<?php.

include 'include/header.php';

?>

<div class="leftmenu" ><!—Ліва частина сайту—>

<?php.

include 'include/general-menu.php';

?>

<div class="leftmenu-block" ><b>Навігатор:</b></div><!—Блок—>

<center><p onclick="return message ()" >Щоб дізнатися на якій Ви сторінці, просто натисніть тут</p></center>

<?php.

include 'include/left-block.php';

?>

</div>

<div class="workarea" ><!—Робоче поле—>

<center><h1>Заголовок</h1></center>

<p>Абзаци</p>

<p>Абзаци</p>

</div>

<?php.

include 'include/footer.php';

?>

</div>

</body>

</html>

Тепер шаблон готовий. Можна приступати до створення лендінгу та створення інших сторінок сайту.

1.5.5 Створення сторінки-вітрини Сторімнка-вітримна, «вітринка», цільова сторінка (англ. Landing page) — це веб-сторінка, яка відкривається при натисканні на рекламне оголошення чи ланку (лінк). «Вітринка» є логічним продовженням рекламного оголошення або посилання. Часто «вітринки» пов’язані з соціальними медіа, розсилками по електронній пошті або маркетинговими кампаніями пошукових двигунів з метою підвищення ефективності реклами. «Вітринка» може бути будь-якою сторінкою сайту або спеціально створеною окремою сторінкою. Загальна мета «вітринки» перетворення (конверсія) відвідувачів сайту в потенційних покупців, тому її ще часто називають «приманка для клієнтів» .

В залежності від маркетингової стратегії, процес перетворення, передбачає виконання користувачем певних дій, як-от:

· оформити замовлення на покупку.

· продати конкретний продукт в конкретній ситуації (розпродаж, промоакція).

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

· підписатися на розсилку.

· реєстрація на сайті.

· інформація для інших користувачів / оголошення про цільову сторінку.

· віра в бренд — витратити достатньо часу на сайті, дивитися фільми, читати листівки.

· завантажити або встановити якусь програму Відсоток конверсії відвідувачів є показником ефективності сторінки-вітрини, в залежності від галузі він коливається в межах 2−3 відсотків. Це означає, що, наприклад, 1000 осіб, які відвідали «вітринку» 20−30 зробили якусь із вищевказаних дій.

Створення сторінки-вітрини.

Запускаю файл template і зберігаємо його з іменем index. php у кореневій папці сайту. Це буде головна сторінка сайту.

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

Код головної сторінки має вигляд:

<center><h1>Вітаємо Вас на нашому сайті:</h1></center><hr>

<h2>Вітаємо Вас на сайті ІТ-компанії «Політех» </h2>

<p>Якщо Ви потрапили на цю сторінку, значить Ви хочете створити собі web-сайт.</p>

<p>Наша компанія працює у сфері web-розробки з 2006 року.</p>

<p>Ми пропонуємо самі найнижчі ціни на послуги по створенню, підтримці та обслуговуванню сайтів</p>

<p>Серед наших клієнтів є такі компанії, як [melkiy] corporation та VVcompany</p>

<hr>

Рисунок 1.70 — Вигляд головної сторінки.

1.5.6 Створення сторінок сайту і їх наповнення Тепер створюю інші сторінки сайту.

Запускаю файл template і зберігаємо його з іменем about. php у кореневій папці сайту. Тут буде інформація про компанію.

Тепер ввожу дані в робочу область.

Код має вигляд:

<center><h1>Про нас:</h1></center><hr>

<h2>Історія нашої компанії:</h2>

<h4>Створення:</h4>

<p>Наша компанія була створена у 1991 у місті Тернополі.</p>

<h4>Перший успіх:</h4>

<p>Перший успіх до компанії прийшов, коли ми вийшли на Європейський ринок у 2006 році.</p>

<hr>

Рисунок 1.71 — Вигляд сторінки з інформацією про компанію.

Запускаю файл template і зберігаємо його з іменем services. php у кореневій папці сайту. Тут буде інформація про послуги компанії.

Тепер ввожу дані в робочу область.

Код має вигляд:

<div class="workarea" ><!—Робоче поле—>

<center><h1>Ми надаємо послуги:</h1></center><hr>

<h2>Наша компанія надає ряд послуг:</h2>

<p>Послуга #1 — <i>Створення web-сайту.</i></p>

<p>Створення веб-сайтів різної складності.</p>

<br>

<p>Послуга #2 — <i>Адміністрування існуючого сайту</i></p>

<p>Супровід, наповнення, виявлення критичних помилок коду</p>

<br>

<p>Послуга #3 — <i>Розкручування сайту</i></p>

<p>Ріст сайту у рейтингах та у видачі результатів пошуковців</p>

<hr>

</div>

Рисунок 1.72 — Вигляд сторінки з послугами Запускаю файл template і зберігаємо його з іменем contact. php у кореневій папці сайту. Тут буде інформація про контакти для зв’язків з компанією.

Тепер ввожу дані в робочу область.

Код має вигляд:

<center><h1>Наші контакти:</h1></center><hr>

<h2>Наша компанія розташовується за адресою:</h2>

<pre>

м. Тернопіль вул. Руська 53.

ЗАТ Політех.

</pre>

Наший сайт — <a href="http://melkiy.te.ua" target="_blank" >http://melkiy.te.ua/</a>

<hr>

Рисунок 1.73 — Вигляд сторінки з контактами Запускаю файл template і зберігаємо його з іменем help. php у кореневій папці сайту. Тут будь найпопулярніші питання і відповіді.

Тепер ввожу дані в робочу область.

Код має вигляд:

<center><h1>Питання — Відповіді:</h1></center><hr>

<h2>Часті питання та відповіді:</h2>

<p><b>1. У Вас є тестовий період?</b></p>

<p><i>Так. 14 днів.</i></p>

<p><b>2. Які Ваші гарантії?</b></p>

<p><i>Наша компанія є учасником і переможцем багатьох ІТ-конкурсів, що підкреслює професіоналізм наших програмістів. Окрім цього, якщо ми не виконаємо поставлене завдання, то повернемо Вам гроші.</i></p>

<p><b>3. У Вас є інтернет-магазин?</b></p>

<p><i>Ні.</i></p>

<hr>

Рисунок 1.74 — Вигляд сторінки з питаннями і відповідями Запускаю файл template і зберігаємо його з іменем guestbook. php у кореневій папці сайту. Тут буде розміщуватися книга відвідувачів.

Тепер ввожу дані в робочу область.

Код має вигляд:

<center><h1>Книга відвідувачів</h1></center><hr>

<h2>Тут ви можете залишити відгук про роботу нашої компанії:</h2>

<div style="width: 100%; margin: 0 auto;" >

<form action="addMessage.php" method="post" >

Ваше ім'я:<br>

<input type="text" name="guestName" placeholder="Ваше ім'я" style="width: 100%;" ><br><br>

Текст Вашого повідомлення в книзі відвідувачів:<br>

<textarea name="messageText" placeholder="Текст повідомлення" style="width: 100%; height: 100px;" >

</textarea><br><br>

<input type="submit" value="Залишити повідомлення в книзі відвідувачів!" style="width: 100%;" >

</form><hr><br>

<?php.

// подключення до бази даних.

$connect = new mysqli ('localhost', 'root', '', 'guestbook');

// отримуємо список всіх повідомлень.

$result = $connect->query («select * from guestbook»);

// вираховуємо кількість отриманих записів.

$countMessage = $result->num_rows;

// якщо кількість записів в базі даних більше, то її виводимо.

if ($countMessage > 0).

{.

// переглядаємо весь масив отриманих даних.

for ($i = 0; $i < $countMessage; $i++).

{.

echo '<div style="border: 1px solid green;" >';

// витягаю дані.

$message = $result->fetch_object ();

// виводжу дані у потрібному виді.

echo «<b>» .$message->guestbook_user_name.": </b><br>" ;

echo $message->guestbook_message_text." <br>" ;

echo «Дата: „.$message->guestbook_data.“ <br>» ;

echo '</div><br>';

}.

}.

?>

</div><hr>

Рисунок 1.75 — Вигляд книги відвідувачів На цьому створення сторінок сайту завершене.

1.6 Створення сайту на основі системи управління вмістом Також можна скористатися не власними сторінками, а спеціальними «двигунами» — системами керування вмісту.

Системма керувамння вмімстом (СКВ; англ. Content Management System, CMS) — програмне забезпечення для організації веб-сайтівчи інших інформаційних ресурсів в Інтернеті чи окремих комп’ютерних мережах.

Існують сотні, а може, навіть й тисячі доступних CMS — систем. Завдяки їхній функціональності їх можна використовувати в різних компаніях. Незважаючи на широкий вибір інструментальних та технічних засобів, наявних в CMS, існують загальні для більшості типів систем характеристики.

Перші СКВ були розроблені у великих корпораціях для організації роботи з документацією. У 1995;му від компанії CNET відокремилася окрема компанія Vignette, яка започаткувала ринок для комерційних СКВ. З часом діапазон продукції розширювався і все більше інтегрувався у сучасні мережеві рішення аж до популярних веб-порталів.

Багато сучасних СКВ поширюються як безкоштовні і легкі у встановленні (інсталяції) програми, які розробляються групами ентузіастів під ліцензією GNU/GPL.

Системи управління веб-сайтом часто розраховані на роботу у певному програмному середовищі. Наприклад, система MediaWiki, під управлінням якої працює Вікіпедія, написана мовою програмування PHP і зберігає вміст і налаштування у базі даних типу MySQL або PostgreSQL; тому для її роботи потрібно, щоб на сервері, де вона розміщена, були встановлені веб-сервер (Apache, IIS чи інший), підтримка PHP та системи керування базами даних MySQL або PostgreSQL, а також, в разі необхідності, додаткові програми для обробки зображень чи математичних формул. Такі вимоги є досить типовими для відкритих СКВ.

1.6.1 WordPress.

WordPress — це проста у встановленні та використанні система керування вмістом з відкритим кодом, яка широко використовується для створення веб-сайтів. Сфера застосування — від блогів до складних веб-сайтів. Вбудована система тем і плаґінів в поєднанні з вдалою архітектурою дозволяє конструювати на основі WordPress практично будь-які веб-проекти.

Написана на мові програмування PHP з використанням бази даних MySQL. Сирцевий код поширюється на умовах ліцензії GNU General Public License.

Розпочинаю встановлення CMS WordPress:

1. Для початку необхідно завантажити CMS WordPress із офіційного сайту з українською локалізацією http://uk.wordpress.org/.

Рисунок 1.76 — Завантаження CMS WordPress.

2. Після завантаження архіву його необхідно розпакувати.

Рисунок 1.77 — Розпаковування архіву.

3. Файл-конфігурації.

Рисунок 1.78 — Початок встановлення WordPress’у.

4. Початок встановлення WordPress’у.

Перед початком потрібно ввести необхідну інформацію в базу даних. Де потрібно знати наступні речі.

· ім'я бази даних;

· ім'я користувача бази даних;

· пароль до бази даних;

· адреса сервера бази даних;

· префікс таблиць (якщо ви хочете запустити більш ніж один WordPress на одній базі).

Рисунок 1.79 — Установлювач CMS.

5. Паралельно у іншому вікні браузера необхідно створити таблицю, користувача та задати пароль в phpmyadmin. Ці дії також можна зробити зі допомогою команд MySQL.

Рисунок 1.80 —Створення таблиці в phpmyadmin.

6. На цій сторінці необхідно ввести свої дані, які я вводив в phpmyadmin.

Тепер необхідно ввести:

· ім'я бази даних (ім'я бази даних, до якої треба встановити WP);

· ім'я користувача (MySQL логін);

· пароль (пароль до MySQL);

· хост бази даних (це поле потрібно заповнити коли localhost спрацьовує);

· префікс для таблиць (якщо є необхідність одночасно мати кілька інсталяцій WordPress’у в одній базі даних).

Рисунок 1.81 — Введення даних.

7. Перевірка введених даних. Це повідомлення вказує, що усі дані введено коректно і можна продовжити і розпочати встановлення CMS WordPress.

Рисунок 1.82 — Перевірка введених даних.

8. Далі необхідно ввести дані про сайт. Такі як:

· заголовок сайту;

· логін;

· пароль;

· перевірка паролю;

· електронний адрес пошти;

· приватність.

Рисунок 1.83 — Введення даних про сайт.

9. На цьому встановлення закінчено.

Рисунок 1.84 — Закінчення встановлення Тепер можна ввійти на свій новостворений сайт, або в адмін-панель.

На головній сторінці міститься:

Ліве меню, яке має:

· Заголовок сайту;

· Останні публікації;

· Останні коментарі;

· Архіви;

· Категорії.

А також є робоча область, на якій розміщуються блоги. За замовчуванням система створює один тестовий блок з назвою Привіт світ.

Рисунок 1.85 — Стандартний вигляд сайту В панелі адміністратора містяться:

Консоль — у цей розділ користувач попадає після того, як увійде на панель керування.

· Відновлення — даний підрозділ дозволяє обновити WordPress, плагіни та теми.

Записи — перегляд всіх записів, можливість швидкого редагування й сортування.

· Додати нову — ви можете оформляти й публікувати нові пости.

· Рубрики — відкриває редактор рубрик.

· Мітки — відкриває редактор міток (тегів).

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

· Бібліотека — перегляд всіх медіафайлів блога, можливість швидкого редагування й сортування.

· Додати новий — завантаження нових медіафайлів, можливість завантажити відразу кілька файлів.

Посилання — перегляд всіх посилань, можливість швидкого редагування й сортування. Щоб посилання були видні, можна скористатися віджетом «Посилання» .

· Додати нову — додавання нових посилань.

· Рубрики посилань — угруповання посилань із розбивкою їх на рубрики.

Сторінки — перегляд всіх сторінок, можливість швидкого редагування й сортування.

· Додати нову — оформлення й публікування нових сторінок. Відкриває редактор сторінок, такий же як редактор постів.

Зовнішній вигляд — перегляд всіх шаблонів оформлення.

· Віджети — настроювання й керування віджетами, незалежними блоками-елементами бічного стовпчика.

· Меню — надає можливість зібрати свій зміст із окремих елементів (посилань, рубрик, довільного коду) і використати в бічному стовпчику за допомогою виджета довільне меню.

· Довільне тло — можливість настроїти тло теми оформлення. Варто відзначити, що більшість шаблонів не призначені для редагування їхніх фонів й у цьому випадку такої можливості немає .

· Редактор — можливість редагувати код шаблона. Перед тим як редагувати код теми, варто зберегти її резервну копію.

Плагіни — перегляд всіх плагінів, можливість включення, відключення й сортування плагінів, це незалежні програмні модулі, що розширюють функціонала.

· Додати новий — можливість завантажити в блог новий плагін.

· Редактор — можливість редагувати програмний код завантажених плагенів.

Користувачі — перегляд всіх зареєстрованих користувачів. У нашому випадку користувач блогу буде тільки один.

· Додати нового — можливість додати нового користувача.

· Ваш профіль — можливість відредагувати ваш профіль, додати інформацію про себе й настроїти її відображення.

Інструменти — додаткові інструменти й можливості WordPress.

· Імпорт — посилання на плагіни для завантаження вмісту з інших ваших блогів. Можна використати, щоб перенести ваш блог із блогохостингу на платформу WordPress.

· Експорт — дозволяє завантажити XML-файл із текстовим умістом.

Параметри — настроювання блогу.

· Загальні — основні настроювання WordPress, його назва, підзаголовок, настроювання дати й часу.

· Написання — настроювання різних способів публікації постів. У нашому випадку вони неактуальні, ми будемо користуватися класичним способом публікації.

· Читання — настроювання, що впливають на відображення вмісту.

· Обговорення — настроювання коментування й відображення коментарів.

· Медіафайли — настроювання обробки медіафайлів при завантаженні.

· Приватність — установлення заборони пошуковим системам індексувати блог.

· Постійні посилання — можливість настроїти структуру посилань, це дуже важливе настроювання.

Рисунок 1.86 — Вигляд адмін-панелі.

1.6.2 Eleanor CMS.

Eleanor CMS — нова безкоштовна система управління сайтом. Під час розробки даної CMS автор в остаточному підсумку хотів побачити досить потужний модуль, управляти яким зміг би й такий користувач, що абсолютно не знаком з мовами програмування й іншими супровідній подібній роботі складностями.

Результатом став повністю модульний проект, і модифікуючи Eleanor CMS будь-який розроблювач повною мірою може виявити свій креатив, діючи так, як порахує потрібним.

Варто відзначити ряд важливих нюансів, передбачуваних споконвічно й потім реалізованих під час розробки Eleanor CMS.

Досить важливо було організувати безпеку роботи, і крім зручності користування, даний фактор стає пріоритетом при виборі оптимальної системи керування сайтом. Ця CMS характеризується тим, що в ній практично не використаються SQL-ін'єкції та інші складні хитрості, у зв’язку із чим робота з базою даних приносить аж ніяк не нервування, а виняткове задоволення.

Незважаючи на це, Eleanor здатна дуже легко інтегруватися з будь-якими скріптами, а генеруючі з її допомогою посилання цілком зрозумілі будь-якій людині, і плюс до всього підтримують кириличний алфавіт.

Окремо варто сказати про реалізовану в даній системі підтримці кеш-машин; cms здатна підтримувати з них п’ять позицій. Варто згадати й відмінний шаблонизатор. Шаблон — це по суті особа сайту, тому при розробці Eleanor це було прийнято в увагу, і убудований у не шаблонизатор дозволяє при необхідності підібрати практично будь-який шаблон. .

Однозначним плюсом EleanorCMS можна назвати простоту установки й абсолютно доступний модельний код, розібратися в якому не важко буде навіть починаючому веб-мастеру, не прибігаючи ні до чиєї допомоги.

У той же час якщо питання все-таки виникнуть, на сайті розроблювача є спеціальний форум, де можна одержати відповідь на будь-яке питання.

Враження від використання даної системи залишаються винятково приємні, і не можна не відзначити величезний її потенціал. Безсумнівно радує й той факт, що творець даного проекту і його співавторів постійно проводять усілякі поліпшення, обов’язково з огляду на при цьому думки користувачів свого продукту. Регулярно публікуються обновлені версії, у яких реалізуються всі побажання й зауваження. Однак блоги й чаты в проекті найближчим часом чекати не коштує. Якщо є необхідність, то можна відвідати для одержання додаткової інформації відвідати офіційний сайт цієї CMS за адресою eleanor-cms.ru, а скачати систему можна по наступному посиланню.

Автори проекту зупинятися на досягнутому не збираються, і заявляють про те, що Eleanor стане згодом тільки вдосконалюватися, роблячи роботу із сайтом ще більш якісної й комфортної.

З основних достоїнств Eleanor CMS можна виділити наступні:

· Повна модульность системи: ви зможете без проблем нарощувати функціональну частину Вашого сайту.

· Продумана мультимовність: один матеріал можна публікувати на різних мовах, а не кілька матеріалів, кожний на своїй мові. Це значить, що рейтинг матеріалу, перегляди й коментарі будуть однаковими для різних перекладів одного матеріалу. Крім того, мультиязычность зачіпає не тільки назва й текст публікації, але також й URL і позначка поля. У стандартну комплектацію входить 3 мови: російський, український й англійський. Система без проблем може бути переведена й на інші мови.

· Мультисайтовість із кроссдоменной системою авторизації. Завдяки Eleanor CMS, ви зможете створити кілька сайтів із загальною базою користувачів. Існує можливість «зв'язати» сайти таким чином, щоб при вході на один із сайтів, користувач автоматичних входив і на інших сайтах. Причому зв’язуванню піддаються сайти, на різних доменах і серверах.

· Мультисесійність. Кожен користувач може працювати на сайті з різних пристроїв.

· Система не створює зайвого навантаження на сервер. І прекрасно працює навіть на безкоштовних хостингах.

· Зручність публікації медиаматериалов. Якщо необхідно опублікувати картинку, відеоабо аудиоматериал — просто завантажите його, використовуючи зручний завантажник і дивитеся/слухайте прямо на сайті. Система підтримує швидку вставку відео із всіх популярних видеосервисов, досить лише вставити посилання, і вона сама зрозуміє що це за сервіс й як з ним працювати.

Розпочинаю встановлення CMS Eleanor:

1. Для початку необхідно завантажити CMS Eleanor із офіційного сайту http://eleanor-cms.ru/.

Рисунок 1.87 — Завантаження CMS Eleanor.

2. Із офіційного сайту завантажується CMS Eleanor у архіві. Тому тепер розпаковую архів Рисунок 1.88 — Розархівування CMS Eleanor.

3. Початок встановлення. В стрічці адреси в браузері пишу адрес хоста http://eleanorhost/.

Завантажується вікно вибору встановлення CMS Eleanor. На вибір дається три варіанти встановлення трьома різними мовами:

· Встановлення українською мовою;

· Встановлення англійською мовою;

· Встановлення російською мовою.

Вибираю «Встановити українською мовою» .

Рисунок 1.89 — Встановлення CMS Eleanor.

4. Наступним кроком є підтвердження ліцензійної згоди на використання CMS Eleanor.

Мені необхідно відмітити галочкою пункт «Я приймаю умови ліцензійної угоди» і натиснути кнопку «Далі» .

Рисунок 1.90 — Ліцензійна згода.

5. Наступним кроком є продовження підтвердження ліцензійної згоди на використання CMS Eleanor. Цей пункт названий «Санкції» .

Мені необхідно відмітити галочкою пункт «Я приймаю умови санкцій» і натиснути кнопку «Далі» .

Рисунок 1.91 — Санкції.

6. В наступному вікни є інформація про системні вимоги, які необхідні для роботи CMS Eleanor. Також є інформація про статус сервера, чи відповідає він вимогам.

Нижче є на вибір дві дії: «Встановлення» CMS Eleanor та «Оновлення» програмного забезпечення на сервері.

Оскільки сервер відповідає вимогам, то вибираю пункт «Встановлення CMS Eleanor» .

Рисунок 1.92 — Системні вимоги.

7. Заходжу в phpmyadmin і створюю нову базу даних eldb. Потім треба створити ще користувача, для доступу до бази даних і задати йому пароль. Створюю користувача eluser і задаю йому пароль elpass.

8. В інсталяторі CMS Eleanor необхідно ввести дані, для зв’язку з базою даних та інших налаштувань:

Сервер бази даних — localhost.

Назва бази даних — eldb.

Користувач — eluser.

Пароль — elpass.

Префікс таблиць — el_.

Назва сайту — ІТ-компанія «Політех» .

Базовий e-mail — [email protected].

Увімкнути ЧПУ? — Так Часовий пояс — Київ Додаткові мови — Англійська та російська Рисунок 1.93 — Збирання даних.

9. Підготовка до встановлення.

У цьому вікні розміщується інформація для перевірки. Фактично, вона повторяє пункт 8.

На вибір є дві кнопки: «Назад», якщо є якісь помилки і «Встановити», якщо усі дані введені правильно.

Вибираю «Встановити» .

Рисунок 1.94 — Підготовка до встановлення.

10. Відбувається процес встановлення Рисунок 1.95 — Процес встановлення.

11. Створення облікового запису адміністратора.

В цьому пункті треба ввести:

Логін — eladmin.

Пароль — eladmpass.

Повторіть пароль — eladmpass.

E-mail — [email protected].

Рисунок 1.96 — Створення облікового запису адміністратора.

12. Закінчення процесу встановлення.

Це останнє вікно встановлювача. У цьому вікні адміністратора повідомляється про те, що установлення CMS Eleanor успішно завершено. А також є повідомлення про роботу скріпта та рекомендації по підготовці до роботи.

" Ваша копія Eleanor CMS успішно встановлена і готова до роботи! Скрипт установки заблоковано файлом install/install.lock, тому якщо Ви бажаєте встановити систему ще раз — Ви повинні вручну видалити цей файл. Ми переконливо рекомендуємо видалити теку install з усім її вмістом виключно з міркувань безпеки." .

Рисунок 1.97 — Закінчення процесу встановлення.

13. Переходжу у свій сайт. Тепер можна зайти на сайт з правами адміністратора, або зареєструватися.

Головна сторінка сайту складається з шапки, підвалу, робочої області, а також лівого і правого блоку.

Рисунок 1.98 — Головна сторінка сайту Встановлення CMS Eleanor успішно завершено і готове до роботи.

1.7 Налаштування комп’ютера Отже, уже є готовий сервер і сайт, але вони доступні тільки локально. Тепер зробимо його доступним ззовні.

ПК із Ubuntu Server відставляємо і далі будемо працювати з ним через SSH. Я використаю для цього PUTTY.

1.7.1 Конфігурація У першу чергу необхідно налаштувати файл підкачування.

Для цього створюємо файл заповнений нулями:

sudo dd if=/dev/zero of=/swap bs=1M count=2048.

Підготовляємо його для використання як swap:

sudo mkswap /swap.

Додаємо у файл fstab наш створений файл для використання як файл підкачування:

sudo nano /etc/fstab/swap none swap sw 0 0.

Перезавантажуємося:

sudo shutdownr now.

1.7.2 Оновлення ПЗ Відразу ж обновляємо всі пакети, робиться це двома командами:

sudo apt-get update.

sudo apt-get upgrade.

1.7.3 Веб-інтерфейс Для керування системою через веб-інтерфейс необхідно мати пакет webim, але його на жаль у репозитарії немає, тому завантажую підготовлений пакет вручну:

wget http://prdownloads.sourceforge.net/webadmin/webmin₁.580_all.deb.

Для установлення webim будуть потрібні деякі залежні пакети.

sudo apt-get install libnet-ssleay-perl libauthen-pam-perl libio-pty-perl apt-show-versions.

Встановлення виконується командою:

sudo dpkg —install webmin₁.580_all.deb.

Все, можна заходити у веб-інтерфейс:

https://192.168.1.180:10 000.

1.7.4 FTP-доступ Для ftp я використаю pure-ftpd. Створюю публічну папку:

sudo mkdir /mnt/data/public.

Установлюю pure-ftpd з репозиторія:

sudo apt-get install pure-ftpd.

У принципі можна вже заходити під системним аккаунтом, але це не зовсім добре для повсякденного використання. Зроблю віртуальний аккаунт із доступом тільки до публічної папки:

sudo pure-pw useradd publicu localg nogroupd /mnt/data/public.

Обновлю базу даних:

sudo pure-pw mkdb.

Включу використання віртуальних користувачів:

sudo lns /etc/pure-ftpd/conf/PureDB /etc/pure-ftpd/auth/50pure.

Перезапускаю сервіс:

sudo service pure-ftpd restart.

1.7.5 Samba.

Налаштування доступу до сервера з windows-машин робиться командою:

sudo useraddd /home/PaulZis /bin/trueg users PaulZi.

Задаю пароль, такий же, як на windows:

sudo passwd PaulZi.

Додаємо створеного користувача до Samba:

sudo smbpasswda PaulZi.

Для керування розширеними правами, можна встановити утиліти:

sudo apt-get install acl > sudo apt-get install attr.

Для того, щоб samba працювала з ACL, необхідна файлова система з підтримкою POSIX ACL, ext4 цілком підходить, але за замовчуванням вона встановлена без цієї підтримки. Для включення цієї можливості додамю опцію «acl» у файл /etc/fstab. Але більше того, в Windows реалізована підтримка спадкування прав, щоб і це реалізувати в linux, потрібно щоб samba десь зберігала додаткові дані. Для цього необхідно включити розширені атрибути файлів, опція «user_xattr». Заодно треба заборонити виконання файлів на всьому розділі з даними, за допомогою опції «noexec» (для безпеки):

sudo nano /etc/fstab/dev/md0 /mnt/data ext4 defaults, noexec, acl, user_xattr 0 2.

Перезавантажую операційну систему:

sudo shutdownr now.

Редагую налаштування samba:

sudo nano /etc/samba/smb.conf.

[global] workgroup = Home netbios name = Server security = user # add settings admin users = PaulZi # дія цих користувачів будуть вироблятися від root map acl inherit = yes # включаємо спадкування acl store dos attributes = yes # включаємо зберігання dos атрибутів # відключаємо зберігання windows атрибутів: map archive = no map system = no map hidden = no map readonly = no # public share [public] comment = Public path = /mnt/data/public browseable = yes # кулі видна read only = no # включаємо можливість запису guest ok = yes # дозволяємо гостьовий доступ inherit permissions = yes # включаємо спадкування прав inherit acls = yes # включаємо спадкування windows-прав inherit owner = yes # включаємо спадкування власника hide unreadable = yes # ховати файли недоступні для читання Перезапускаю сервіс:

sudo service smbd restart.

1.7.6 DLNA/UPn-сервер Як DLNA-сервер я вибрав minidlna.

Установлення з репозиторія:

sudo apt-get install minidlna.

Редагую файл:

sudo nano /etc/minidlna.conf.

media_dir=/mnt/data/public friendly_name=Ubuntu.

Перезапускаю сервіс:

sudo service minidlna restart.

1.7.7 Torrent.

Я використаю Transmission, що успішно зарекомендував себе, як клієнт із веб-інтерфейсом.

Установлюю:

sudo apt-get install transmission-daemon.

Зупиняю сервіс, інакше всі зміни запишуться після завершення процесу:

sudo service transmission-daemon stop.

Редагую файл:

sudo nano /etc/transmission-daemon/settings.json.

" download-dir": «/mnt/data/public/torrents» «rpc-password»: «local» «rpc-username»: «local» «rpc-whitelist-enabled»: false.

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

Запускаємо сервіс:

sudo service transmission-daemon start.

Заходжу у веб-інтерфейс, переконуюся, що все добре:

http://192.168.1.180:9091/.

1.8 Реєстрація домену та хостингу Також створений сайт можна розміщувати не на власних серверах, а орендувати їх у компаній, які надають послуги хостингу і домену. Адже покупка власного фізичного сервера є досить дорогим, а послуги хостингу, які надають спеціальні компанії є значно дешевшеми, особливо це стосується сайтів-візиток та подібних сайтів.

1.8.1 Домен Доммен (англ. Domain) — частина простору ієрархічних імен мережі Інтернет, що обслуговується групою серверів доменних імен (DNS-серверів) та централізовано адмініструється.

DNS-сервери зберігають інформацію про вузли, імена яких належать домену і виконують трансляцію їх імен в адреси. Кожний домен має унікальне ім'я, а коженкомп’ютер, підключений до Інтернету, має, як правило, доменне ім'я. Домени мають між собою ієрархічні відношення. Два домени, що розташовані на сусідніх рівнях ієрархії, називаються відповідно доменом вищого та нижчого рівнів. Домени найвищого (верхнього) рівня можуть бути сформовані за організаційним або географічним ознаками. Домени, сформовані за географічним ознаками, об'єднують вузли, що належать конкретній державі. За географічними ознаками об'єднуються в основному комп’ютери, що містяться на території США.

Згідно зі звітом Verisign Domain Industry Brief найбільшого світового доменного реєстратора Verisign у кінці 2012 року кількість зареєстрованих по всьому світу доменних імен другого рівня перевищила 250 мільйонів, що на 12% більше, ніж роком раніше. Абсолютним лідером за кількістю реєстрацій є доменна зона .com, на яку припадає 40% всіх доменів. Серед інших популярних для реєстрації доменних зон Verisign виділяє зони .net, .uk, .org, .info, .cn, .nl і .uа.

На сьогодні існують дві кореневі українські доменні зони це — UA та УКР В доменній зоні .ua розрізняють приватні та публічні домени другого рівня. Серед публічних доменних зон вирізняють окремий підвид доменних зон — регіональні доменні зони. Прикладом регіональної доменної зони може бути .rv.ua, прикладом публічної доменної зони другого рівня може служити .com.ua та приватної .bz.ua.

Домменна системма імемн (англ. Domain Name System, DNS) — розподілена система перетворення імені хоста (комп'ютера або іншого мережевого пристрою) в IP-адресу.

Кожен комп’ютер в Інтернеті має свою власну унікальну адресу — число, яке складається з чотирьох байтів. Оскільки запам’ятовування десятків чи навіть сотень — не досить приємна процедура, то всі (чи майже всі) машини мають імена, запам’ятати які (особливо якщо знати правила утворення імен) значно легше.

Уся система імен в Інтернеті — ієрархічна. Це зроблено для того, щоб не підтримувати одне централізоване джерело, а роздати владу на місця.

Красиве доменне ім'я, що запам’ятовується — це візитна картка сайту. Зареєструвати його можна за допомогою фірми посередника (реєстратора) або самостійно.

Мені необхідно виконати три операції: зареєструвати доменне ім'я; створити записи в DNS серверах; розмістити сайт на сервері хостера.

Отже, для реєстрації:

1. Переходжу на сайт http://bz.ua/;

2. Вибираю «Реєстрація» ;

3. Вводжу особисті дані:

· Логін;

· Адреса електронної пошти;

· Прізвище;

· Ім'я;

· Країна;

· Індекс;

· Область;

· Місто;

· Вулиця;

· Телефон;

· Погоджуюся на умови договору;

· Підтверджую капчу;

4. Тепер нажимаю «Готово» ;

5. Після цього на пошту прийде повідомлення про реєстрацію;

6. Тепер треба провести реєстрацію на хостингу.

1.8.2 Хостинг Хостинг (англ. hosting) — послуга, що надає дисковий простір для розміщення фізичної інформації на сервері.

Зазвичай під поняттям послуги хостингу мають на увазі, як мінімум, послугу розміщення файлів сайту на сервері, на якому запущене ПЗ, необхідне для обробки запитів до цих файлів (веб-сервер). Як правило, до послуг хостингу вже входить надання місця для поштової кореспонденції, баз даних, DNS файлового сховища тощо, а також підтримка функціонування відповідних сервісів, однак вони можуть надаватися і окремо. Розрізняють безкоштовний та платний хостинг. Безкоштовні «хостери» заробляють на тому, що розміщують рекламу на своїх сайтах.

Види хостингу:

Повнофункціональний хостинг:

· віртуальний сервер — надається місце на диску для розміщення веб-сайтів, середовище виконання веб-сервісів єдине для багатьох користувачів, ресурси розподілені між усіма користувачами на одному сервері, де може розміщуватись від 50 до 1000 користувачів;

· віртуальний виділений сервер (VPS або VDS) — послуга, в рамках якої користувачеві надається так званий віртуальний виділений сервер;

· виділений сервер — надається сервер цілком. Використовується для реалізації нестандартних завдань (сервісів), а також розміщення «важких» веб-проектів, які не можуть співіснувати на одному сервері з іншими проектами і вимагають під себе всі ресурси сервера;

· колокація (Collocation) — надання місця в дата центрі провайдера для обладнання клієнта (зазвичай шляхом монтажу в стійці) і підключення його до Інтернету.

Обмежений або хостинг певних програм (послуг):

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

· е-mail хостинг — представляє собою інтернет-хостинг, який працює з серверами електронної пошти;

· DNS хостинг — являє собою сервіс, який працює з сервером доменних імен;

· ігровий хостинг — програмний компонент обчислювальної системи, що забезпечує зв’язок між різними клієнтами, надаючи їм можливість комунікації один з одним в рамках програмної оболонки конкретної гри;

За умовами надання хостинг часто розділяється на платний і безкоштовний. Зазвичай компанія, що надає безкоштовний хостинг, заробляє шляхом показу реклами на сторінках, розміщених на ньому. Безкоштовний хостинг, як правило, повільніше платного, надає тільки базові послуги і ненадійний. Приватні особи для своїх домашніх сторінок на початковому етапі їх розвитку використовують безкоштовний хостинг. Громадські організації можуть використовувати як платний хостинг, так і безкоштовний. Комерційні організації практично завжди користуються послугами платного хостингу.

Тепер проводимо реєстрацію на хостингу:

1. Переходжу на сайт хостера http://www.hostinger.com.ua/;

2. Вибираю «Реєстрація» ;

3. Вводжу дані, необхідні для реєстрації:

· Логін;

· Адреса електронної пошти;

· Пароль;

· Підтвердження паролю;

· Вводимо символи, що зображені на картинці;

· Погоджуємося на умови договору.

4. Вибираю «Створити аккаунт» ;

5. Після цього перевіряю пошту, на яку приде повідомлення про реєстрацію;

6. Тепер входжу в свій профіль на сайті і беру з нього три нейм-сервери:

ns1.hostinger.com.ua.

ns2.hostinger.com.ua.

ns3.hostinger.com.ua.

7. Тепер ці нейм-сервери необхідно ввести на сайті, на якому був зареєстрований домен;

8. Після цього необхідно зачекати кілька годин, щоб сайт був зареєстрований на DNS-серверах, та створені усі профілі;

9. Коли усі записи закінчені, заходжу на хостинг і вибираю «Файловий менеджер». Через файловий менеджер будуть завантажені усі файли на хостинг.

10. Тепер завантажую файли на хостинг.

11. Одразу після завантаження файлів, вони стануть доступними і відвідувачі можуть відвідувати сайт компанії.

2. Спеціальна частина.

В спеціальні частині висвітлені питання, які стосуються проблем та способів оцінювання якості веб-сайтів.

2.1 Використомвність Використомвність, часто Юзабіліті (англ. Usability — дослівно «зручність користування») — поняття в мікроергономіці, що визначає загальну степінь зручності предмета при використанні; термін схожий з терміном «ергономічність», але має іншу область поширення і відрізняється нюансами визначення. Використовується для комп’ютерної техніки, терміном юзабіліті називають концепцію розробки користувацьких інтерфейсів програмного забезпечення, орієнтовану на максимальну психологічну і зорову зручність для користувача. ISO визначає використовність як «Ступінь з якою продукт може бути використано визначеними користувачами для досягнення визначених цілей з ефективністю, продуктивністю та вдоволеністю для специфічного контексту використання» .

2.1.1 Веб-використомвність Веб-юзабіліті (англ. web-usability — дослівно «зручність користування веб») — це застосування принципів юзабіліті в тих областях, де перегляд веб-сторінок можна розглядати як загальну парадигму (або «метафору») для побудови GUI.

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

Деякі загальні цілі веб-юзабіліті:

2 Представити користувачеві інформацію в ясній і стислій формі.

3 Надавати користувачам можливість вибору найбільш очевидним шляхом.

4 Усунути будь-яку двозначність щодо наслідків дій (наприклад, кнопка /видалити/покупка).

5 Розміщення важливих елементів у відповідній області на веб-сторінці або веб-додатку В контексті веб-сайтів електронної комерції, сенс веб-юзабіліті звузився до ефективності: запуск продажів і/або виконання інших операцій які являються цінними для бізнесу. Увагу до веб-юзабіліті було підвищено тоді, коли багато ранніх сайтів електронної комерції потерпіли невдачу в 2000 році. На початку 90—х вважалося, що графічний дизайн повинен бути необхідною складовою частиною сайту для успішного ведення електронного бізнесу, але піонери веб-юзабіліті вважали інакше. Вони виступали за принцип KISS, який довів свою ефективність у приверненні уваги до сайту кінцевого користувача.

2.1.2 Критерії оцінювання ресурсів інтернету Часто виникає потреба визначити якість сайту. Ключову роль у цьому завдання відіграють критерії оцінки якості.

Щоб оцінити якість сайту є такі критерії:

Комфортність:

1. Чи відокремлений зміст сайту від інших елементів навігації?

2. Чи сумісний код сайту із популярними браузерами?

3. Наскільки сумісний сайт зі стандартами кодування W3C? Використовується HTML/CSS?

4. Чи вказані теги «alt» для всіх важливих картинок?

5. Чи є текстові описи, які передадуть важливу інформацію, у випадку обмежень на показ зображень чи мультимедійних файлів?

Навігація:

1. Чи використовується для посилань текст, який зрозуміло вказує, куди вони ведуть?

2. Глибина — скільки кліків потрібно зробити, щоб дістатися до сторінки в глибині сайту.

3. Якщо флеш-заставка або функції навігації забезпечуються за допомогою формату Java/JavaScript/Flash, чи є текстова альтернатива?

4. Чи видно по посиланнях, що вони клікабельні?

5. Наскільки просто користуватися сайтом? Значки чіткі чи ні? Чи розрізняються кнопки/посилання у вигляді тексту, які не клікабельні, і навпаки?

6. Чи є стиль шрифту чітким та зрозумілим. Чи достатній розмір шрифту для комфортного читання.

7. Чи чітко визначено призначення сайту? Призначення має визначатися протягом декількох секунд, без довгого вчитування або за відсутності тексту взагалі.

8. Чи доступна карта сайту? Якщо ні, чи можливо здійснити пошук за ключовими словами? Примітка: У великих сайтах (більше тисячі сторінок) обов’язково повинна бути форма пошуку.

Дизайн:

1. Чи є дизайн сайту естетично привабливим?

2. Чи кольори сайту гармонійні і логічно пов’язані?

3. Чи легко сприймаються вибрані кольори? (Наприклад, чи достатньо вони контрастні, щоб дальтоніки і люди зі слабким зором могли користуватися сайтом?).

4. Чи відповідає дизайн аудиторії? Стандартний розмір шрифту повинен легко читатися відвідувачами, які не знають, як налаштувати браузер.

5. Шрифти повинні легко читатися, акуратно зменшуватися і добре виглядати на екранах з різним розширенням.

Контент:

1. Стиль текстів відповідає призначенню сайту і «говорить» з цільовою аудиторією?

2. Чи можна змінити розмір тексту в браузері, чи зміна розміру обмежена налаштуваннями CSS?

3. Чи достатній контраст між текстом і кольором фону для зручного читання?

4. Чи розділений текст на невеликі, зручні для читання абзаци і чи структурується він за допомогою заголовків, підзаголовків і виділеннь, які полегшують швидкий перегляд?

5. У статтях повинні бути посилання на більш детальний виклад матеріалу або визначення жаргонних слів. Чи дотримуєтеся ви цього?

6. Чи є на сайті розділ «Про сайт», де вказується хто автор проекту, та посилання на джерело контенту, автором якого власник сайту не є?

7. Чи регулярно оновлюється контент?

Безпека:

1. Чи є якісь очевидні слабкі місця у системі безпеки?

2. Наскільки форми пристосовані до спеціальних символів?

3. Чи захищені паролі приватних каталогів від доступу та індексування?

4. Чи зберігаються дані клієнтів на віддаленому сервері і чи надійно захищена база даних від зовнішнього доступу?

Інші технічні фактори:

1. Яка швидкість завантаження сайту?

2. Чи всі посилання (внутрішні та зовнішні) валідні та активні?

3. Чи є у скриптах помилки?

4. Чи захищений сайт від помилок з боку сервера?

Інші маркетингові фактори:

1. Чи достатньо сайт оптимізований під пошукові системи (виділені основні частини тексту (ключі)? Чи релевантні і контекстуально пов’язані теги заголовку, текст заголовку, що прописаний в тегу Н1, зовнішні посилання і т.д.).

2. Чи зацікавлює користувача головна сторінка сайту, щоб він захотів перейти на інші сторінки.

3. Чи містяться на сайті елементи, які розроблені для залучення потенційних відвідувачів (наприклад, новини, функція «розповісти другу», форум з можливістю підписки, стрічка RSS або що-небудь подібне)? Чи починаються заголовки сторінок з найбільш релевантної ключової фрази (в крайньому випадку, вона може бути другим або третім словом у заголовку), яка найкраще описує зміст або функцію сторінки? Якби вам потрібно було розповісти, про що ця сторінка, і ви могли використовувати 1−3 слова або ключових фрази, які б ви обрали?

4. Чи сформовано файл Robots. txt?

5. Чи доступна карта сайту?

6. Чи доступна кожна сторінка хоча б за простим HTML-посиланям (без JavaScript або Flash Link)?

7. Чи містить кожна сторінка сайту певний текст? (Скільки тексту залишиться на сторінці, якщо прибрати всі картинки, відео, Java-аплети і JavaScript код? Те, що залишилося, як і раніше розкриває суть сторінки?).

8. Чи кожна сторінка доступна тільки по одному URL посиланню?

Матеріал, що використовується на законних підставах / Гарантії / Легітимізація:

1. Чи є на вашому сайті сторінка контактів з дійсними адресами, безкоштовний номер телефону, форма контакту або доступний e-mail, зрозумілий і простий у використанні механізм зворотного зв’язку/контакту?

2. Чи є на вашому сайті повідомлення про авторське право? Чи доступна сторінка з умовами використання сайту, де ви детально перераховуєте, що і чому ви робите, і з чим повинні погодитися користувачі, якщо вони хочуть користуватися сайтом.

3. Чи проводите ви політику конфіденційності (особливо, якщо ви зберігаєте дані, електронну пошту, імена, куки)?

2.1.3 Способи оцінювання ресурсів інтернету.

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

Як оцінити відвідуваність сайту:

Для простої оцінки відвідуваності сайту можна скористатися стандартними сервісами, де в спеціальну форму треба ввести адресу сайту і натиснути «Отримати». Через секунду з’явиться статистика по обраному сайту: кількість відвідувачів за місяць, за останню добу і за поточний день.

Для більш «просунутої» оцінки відвідуваності сайту можна скористатися програмами Яндекс. Метрика і Google Analitycs — ці системи нададуть докладний аналіз не тільки по загальній відвідуваності, але і за відвідуваністю за вибраний відрізок часу, кількості відвідувачів сайту з різних країн і регіонів і навіть інформацію щодо кількості заходжень на ту чи іншу сторінку і завантажень тих чи інших файлів з сайту.

Як оцінити сайт онлайн:

Тут введимо ім'я сайту і тиснемо «Аналіз». Сервіс видасть наступну інформацію: назву, опис і ключові слова, по яких просувається сайт, скріншоти зі сторінками сайту, кількість сторінок сайту, індексованих пошуковими системами, рейтинги, виставлені сайту системами Яндекс і Google (Яндекс ТІЦ — тематичний індекс цитування і Google PR або Google Page Rank — така ж оцінка з боку Google). Є й такі показники, як процентне співвідношення на сторінках сайту текстової інформації і зображень із зазначенням на мови програмування, на яких написаний сайт, швидкість і час завантаження сторінок сайту, кількість посилань на сторінках і багато іншого. В цій же системі пункти «Система управління сайтом», «Сайти на одному IP», «Наявність IP в спам-базах» — ця інформація буде корисна, щоб оцінити ефективність сайту.

Яндекс ТИЦ і Google PR:

Системи цих оцінок трохи різняться, крім того, PR простіше для сприйняття, оскільки оцінка сайту в цій системі ведеться за 10-бальною шкалою — чим вище бал, тим якісніше і корисніше для користувачів сайт і тим вище сайт буде розташований на сторінках видачі в пошуковій системі Google по відповідних запитах. Щоб підвищити PR, потрібно розміщувати релевантний контент (вміст, відповідне заявленій тематиці сайту), розміщувати на сторінках сайту посилання на інші його сторінки (в помірній кількості) і, звичайно ж, сайт повинен бути вже досить «дорослим», щоб пошукова система почала йому «довіряти» .

Найвищі оцінки — від 8 до 10 можуть отримати тільки сайти дуже великих компаній. Так що якщо у вашого сайту оцінка від 5 до 7 — можна сказати, що він працює на «відмінно», 3−4 — це «добре», 2 — «задовільно». Якщо оцінка 1, то потрібно серйозно доопрацьовувати сайт, а ось нульова оцінка може свідчити про проблеми з індексацією сайту в Google.

Інші можливості оцінки сайту:

Тут є схожа інформація, проте розташована вона більш наочно. Як звичайно, для кожного сайту є рейтинги ТИЦ і PR, а також кількість проіндексованих сторінок в системах пошукових гігантів Google і Яндекс, кількість ресурсів, на які розміщені посилання на аналізований сайт. Є інформація і про наявність сайту в каталогах, віці сайту, IP сайту, хостерів і останнім пунктом тут йде PR-CY.Rank — рейтинг, розроблений співробітниками даної системи аналізу сайтів — можете порівняти рейтинги різних сайтів, щоб отримати їжу для роздумів.

Як оцінити якість сайту:

Що стосується того, як оцінити сайт з точки зору унікальності його вмісту (контенту), використовуємо програми-антіплагіатори. Відмінною програмою в цій категорії є «Advego Plagiatus» .

Відмінними вважаються показники від 95% і вище, хорошими — 90−95%, задовільними: 80−90%.

Якщо унікальність тексту нижче 80%, краще для нормальної індексації пошуковими його переписати так, щоб домогтися більш високого ступеня унікальності.

Всі наведені показники оцінки якості сайту допоможуть вам також оцінити вартість сайту та його розкрученість — хоча б приблизно, тому що справжню цінність сайту зможуть визначити тільки користувачі. Якщо сайт цікавий і корисний, їх кількість буде, як мінімум, не зменшуватиметься.

2.2 Оптимізація сайту Оптимізація сайту — це комплекс методів, який зробить сайт не тільки цікавим для користувача, але й зрозумілим та близьким для пошукових систем. Оптимізація сайту — це спосіб «примирення» пошукових систем з сайтом, який змусить пошукові системи «поважати сайт» і вибирати його, пропонуючи йому перші позиції у видачі, коли пошукова система дає відповідь на відповідний запиткористувача.

2.2.1 Внутрішня оптимізація сайту.

1. Перед тим, як оптимізувати сайт, потрібно визначитися із запитами, по яких планується просувати сайт. Це можна зробити через сервіс Яндекс Дірект (при просуванні в Яндексi).

2. Після визначення запитів підбираються найбільш релевантні сторінки під кожен запит.

3. Кожна сторінка сайту оптимізується під 1−2 запити.

4. Ключові слова мають бути присутніми в тайтлi і описі сторінки (у формі, зручній для прочитання користувачами, а не просто як перерахування ключовикiв).

5. Ключові слова мають бути прописані в заголовку <h1>, а також бути присутніми в тексті у вигляді різних словосполук. При цьому важливо дотримуватися мiри — шукачі уміють відрізняти тексти, просто «насичені» ключовиками.

6. Ключові слова мають бути присутніми в тегах <b> та <i>, а також в текстах (анкорах) внутрішніх посилань.

7. Ключові слова мають бути прописані в тегах alt і title до картинок.

8. Окрім верхніх/бокових меню, внутрішні сторінки сайту мають бути додатково перелінкованi у футерi — підвалі сайту (при цьому потрібно використовувати ключові слова), а також в текстах повних новин сайту (наприклад, після статті йде 5 посилань «Схожі матеріали» на схожі по темі сторінки сайту, що збільшує кількість переглядів сторінок).

9. Адреси сторінок сайту переважно робити у вигляді статичних сторінок.

10. Окрім особливих випадків всі зовнішні посилання (лічильники і таке інше) слід закривати від індексації через <noindex> і rel="nofollow", щоб не витікав PR і тІЦ.

11. Найцікавіші матеріали сайту мають бути на видному місці, наприклад, в розділі меню «Популярне» .

12. Навігація на сайті має бути у вигляді текстових посилань та без використання скриптів, що покращує індексацію. При графічній навігації пункти слід продублювати в тегах alt і title для тих відвідувачів, які відключають графіку в браузерi.

13. Всі сторінки сайту мають бути доступні в 2−3 кліка від головної.

14. Матеріали сайту повинні мати іконки для того, щоб відвідувачі могли додати вподобаний матеріал в соціальні мережі і сервіси соціальних закладок.

15. Оформлення сторінок має бути по максимуму винесене у файл CSS (каскадні таблиці стилів), щоб зменшити об'єм кодiв і прискорити час завантаження сайту.

16. Дизайн сайту має бути оптимізований як під Internet Explorer, так і під Mozilla Firefox, Opera і Safari. Не секрет, що частенько сайти в різних браузерах відображуються по-різному.

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

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

Ключові моменти оцінки якості веб-проектів Насправді, можна досить швидко прийняти рішення про якість інтернет-проекту, що здається, за допомогою безкоштовних інструментів. Що ж дійсно впливає на якість:

— Сумісність сайту з браузерами.

— Відповідність стандартам.

— Семантика HTMLкода.

— Доступність сайту для користувачів.

— Швидкість роботи на стороні сервера.

— Швидкість роботи на стороні браузеру.

Кросбраузернiсть сайту Перевіряємо за допомогою www.browsershots.org. Вибираємо найбільш поширені браузери для цільової аудиторії (Internet Explroer 6, 7 і 8, Firefox 2 і 3, Opera 9 і 10, Safari 3, Chrome 1). Отримуємо пару десятків зображень головної сторінки сайту, і вже по ній оцінюємо якість верстання: наскільки вона відповідає початковому дизайн-макету.

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

Перевіряємо за допомогою HTMLвалидатора: validator. w3.org (нам вистачає, щоб було не більше 25 помилок на сторінці. Рекомендується перевіряти декілька типових сторінок для усунення найбільш очевидних недоліків).

Відповідність стандартам доступності: WCAG. Перевіряємо за допомогою www.contentquality.com (досить відповідності першому рівню — A, WCAG Priority 1).

Доступність і семантика коду Відключення стилів і JavaScript у браузері дозволить «побачити» сайт таким, як він «виглядає» для пошукових і інших роботів. У Firefox це можна зробити за допомогою Web Developer Toolbar. У інших браузерах — в налаштуваннях відключення скриптів і з допомогою:

javascript:document.getElementsByTagName ('head')[0]. innerHTML='';void (0);

Запуск цій адреси у браузері усуне велику кiлькiсть стилів (або ж усi) із сторінки.

Додатково сторінка з відключеними стилями дозволить перевірити, наскільки семантично вірний HTMLкод. Якщо утримування на сторінці залишається зрозумілим для користувача, якщо ключові елементи взаємодії як і раніше доступні — то можна вважати, що сторінка верстає семантично вірно. Інакше треба усувати знайдені недоліки (наприклад, відсутнє меню або форму входу). Не варто шукати у сторінки з відключеними стилями повної відповідності дизайн-макету — його і не повинно бути. Але вміст такої сторінки має бути приємний для ока і доступний для використання. Це основне правило.

Швидкість роботи сайту Дуже часто швидкість роботи робить ключовий вплив на конвертацію відвідувачів в доход сайту. Особливо це характерно для інтернет-магазинів. Як ми можемо перевірити цю швидкість? Для серверної сторони існує інструмент host — tracker.com, за допомогою якого можна встановити характерний час доступу до сайту з різних точок земної кулі. Також він дозволяє оцінити характерний час створення сторінки на сервері (якщо мінімальний час доступу до сайту більше 1с, то вже варто бити тривогу).

Для перевірки відмовостійкості сайту варто скористатися сервісом Load Impact. Безкоштовний аналіз дозволяє перевірити до 50 одночасних відвідувань (кожне з яких може відкривати декілька десятків сторінок на сайті). Основним показником стійкості сайту до навантажень буде вид кривої, який вийде після проведення тесту. Якщо графік рівний або час відкриття сторінки дещо падає при рості відвідуваності - значить, з сайтом усе нормально. Якщо ні, то треба приймати рішення про оптимальний потік відвідувачів, яких сайт зможе обслужити.

Для перевірки якості швидкості завантаження клієнтською складовою можна скористатися або YSlow під Firebug для Firefox (оцінка має бути не менше 80, краще всього не менше 90), або ж безкоштовним інструментом webo. in (проста оцінка не нижче 70, краще — вище 80).

На що впливає якість сайту Це, в першу чергу, на тривалiсть часу, яка йде на його підтримку і розвиток. Сайт, зроблений грамотно і за усіма стандартами, набагато простіше розвивати, оскільки часу написання додаткового коду за наявності хорошої, стандартної бази йде значно менше. Це і масштабованість проекту, коли розробники передбачають великий «запас міцності» для щоденних відвідувань, і в пікові години сайт працюватиме в штатному режимі, не вимагаючи додаткового масштабування.

Швидкість створення HTMLсторiнок і загальний час завантаження дуже сильно впливає на доступність сайту.

Ключовим параметром тут є «завантаження за 4 секунди» і швидше завантаження, ніж у основних конкурентів.

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

Зараз на ринку існує декілька рішень, що дозволяють автоматизувати прискорення сайту на клієнтському рівні. Для ASP.NET — це GetRPO.com, для систем на базі PHP — це Web Optimizer.

2.3 Сервіси для оцінювання якості web-ресурсів.

Існують спеціальні сайти для оцінювання якості web-ресурсів мережі. Ці сайти визначають такі важливі показники, як: Ping (провірка доступності сайту / чи сайт в on-line), Проверка обратных ссылок (провірка, хто посилається на цей сайт) Проверка ТИЦ и PR (рейтинг сайту у пошуковиках). Окрім цього, ці сервіси стежать за роботою Вашого сайту і повідомляють Вас, якщо щось не працює, або працює неправильно.

2.3.1 Ping-Admin.Ru.

Ping-Admin.Ru — моніторинг сайтів і серверів. Перевірка роботи сайту.

Ping-Admin.Ru здійснює цілодобовий моніторинг на вашому сервері таких сервисов як: HTTP, HTTPS; FTP; MySQL, PostgreSQL; POP3, SMTP, IMAP; DNS, а також перевірки за допомогою Ping й Telnet. моніторинг сервера сайту сервісів перевірка доступності ping.

Сервіс надає наступні послуги:

Детальна разова перевірка сайту;

Ping;

Перевірка зворотних посилань;

Перевірка ТИЦ й PR.

Рисунок 2.1 — Результат перевірки сайту сервісом Ping-Admin.Ru.

Результати перевірки:

ТИЦ: 0; PR: 1.

IP вашого сервера 31.170.163.16.

Термін завантаження сайту 0,701 655 сек.

DNS 0,15 1359(21,57%).

швидкість завантаження 37 КБ/с.

2.3.2 mysitecost.ru.

mysitecost.ru — рахує вартість сайту, кількість відвідувачів, щоденний доход, перевіримо Google PageRank, індекс цитування від Яндекс, довідаємося інформацію про хостинге, покажемо соціальний індекс і багато чого іншого.

MysiteCost використає різні джерела інформації в Інтернеті для приблизного підрахунку вартості сайту й кількості щоденних відвідувачів.

Опис оцінювання сайту проектом mysitecost.ru.

Рисунок 2.2 — Результат перевірки сайту сервісом mysitecost.ru.

Результати перевірки:

Ця сторінка містить звіт про приблизну вартість сайту http://melkiy.te.ua. Цей сайт має Google PageRank 1. Мережний IP адреса 31.170. 163.16. Щоденний доход сайту з реклами біля $ 0.11. Ми проаналізували різні дані по цьому сайті й приблизно його оцінили в $ 161.5.

Інформація про сайт — Компанія «Веселощів студент» — Курсова робота Володимира Melkiy.te.uaа Приблизна інформація:

Переглядів у день: 84.

Щоденний доход: $ 0.11.

Хостів у день: 28.

Щомісячний доход: $ 3.3.

Контекстна реклама:

Google AdSense: Ні.

Яндекс Директ: Ні.

Пошуковий індекс:

Google Page Rank: 1/10.

Посилань в Google: 0.

Google Analytics: ;

Сторінок в Google: 2.

Alexa Рейтинг: 0.

Посилань в Alexa: 0.

Яндекс тиц: 0.

Яндекс Rang: 0/6.

Наявність у каталогах:

DMOZ Directory: ;

Yandex Каталог: ;

Yahoo! Directory: ;

Mail.ru Каталог: ;

Безпека сайту:

Перевірка від McAfee: ok.

Перевірка від Google: ok.

Інформація про хостинг і CMS:

IP: 31.170.163.16.

Місто: Немає даних Провайдер: Немає даних Веб Сервер: Apache.

Країна: United States.

CMS: Немає даних.

2.3.3 validator. w3.org.

W3C Markup Validation Service — це безкоштовна послуга, що надається в W3C. Дозволяє перевірити сумісність вашого HTML документа зі стандартами HTML або XHTML, і дозволяє веб-авторам знайти помилки.

Рисунок 2.3 — Результат перевірки сайту сервісом validator. w3.org.

Результати перевірки:

6 Помилки, 31 попередження Адреса: http://melkiy.te.ua/.

Кодування :UTF-8.

Doctype: HTML 4.01 Transitional.

Кореневий елемент: HTML.

3. Організаційно-економічна частина.

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

Для здійснення оцінки потрібно зробити розрахунки трудомісткості кожної операції, яка мала місце при створенні веб-сайту.

3.1 Визначення стадій технологічного процесу та загальної тривалості проведення НДР.

Витрати часу по окремих операціях технологічного процесу відображені в таблиці 3.1.

Таблиця 3.1 Операції технологічного процесу та час їх виконання.

3.2 Визначення витрат на оплату праці та відрахувань на соціальні заходи Відповідно до Закону України «Про оплату праці» заробітна плата — це «винагорода, обчислена, як правило, у грошовому виразі, яку власник, або уповноважений ним орган виплачує працівникові за виконану ним роботу» .

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

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

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

При розрахунку заробітної плати кількість робочих днів у місяці слід в середньому приймати — 24,5 дні/міс., або ж 196 год./міс. (тривалість робочого дня — 8 год.).

Місячний оклад кожного працівника слід враховувати згідно існуючих на даний час тарифних окладів. Рекомендовані тарифні ставки: керівник проекту — 4,5−8,0 грн./год., інженер — 3,0−5,0 грн./год., консультант — 3,5−5,5 грн./год., технік — 3,0−4,5 грн./год., лаборант — 2,0−3,5 грн./год.

Основна заробітна плата розраховується за формулою:

(3.1).

де Тс — тарифна ставка, грн.;

Кг — кількість відпрацьованих годин.

Оскільки всі види робіт в даному проекті виконує інженер, то основна заробітна плата буде розраховуватись тільки за однією формулою:

грн.

Додаткова заробітна плата становить 10−15% від суми основної заробітної плати.

(3.2).

де Кдопл. — коефіцієнт додаткових виплат працівникам, 0,1−0,15 (візьмемо його рівним 0,15).

грн.

Звідси загальні витрати на оплату праці (Во.п.) визначаються за формулою:

. (3.3).

грн.

Крім того, слід визначити відрахування на соціальні заходи:

6 фонд страхування на випадок безробіття — 1,3%;

7 фонд по тимчасовій втраті працездатності - 2,9%;

8 пенсійний фонд — 32,3%.

У сумі зазначені відрахування становлять 37,5%.

Отже, сума відрахувань на соціальні заходи буде становити:

(3.4).

де ФОП — фонд оплати праці, грн.

грн.

Проведені розрахунки витрат на оплату праці зведемо у таблицю 3.2.

Таблиця 3.2 Зведені розрахунки витрат на оплату праці.

3.3 Розрахунок матеріальних витрат Матеріальні витрати визначаються як добуток кількості витрачених матеріалів та їх ціни:

(3.5).

Де: qi — кількість витраченого матеріалу і-го виду;

рі - ціна матеріалу і-го виду.

Звідси, загальні матеріальні витрати можна визначити:

. (3.6).

Проведені розрахунки занесемо у таблицю 3.3.

Таблиця 3.3 Зведені розрахунки матеріальних витрат.

3.4 Розрахунок витрат на електроенергію Затрати на електроенергію 1-ці обладнання визначаються за формулою:

(3.7).

де W — необхідна потужність, кВт;

T — кількість годин роботи обладнання;

S — вартість кіловат-години електроенергії.

Вартість кіловат-години електроенергії слід приймати згідно існуючих на даний час тарифів (0,203 грн. + 20% ПДВ за 1 кВт). Отже, 1 кВт з ПДВ коштує 0,2436 грн.

Потужність мого комп’ютера — 400 Вт, кількість годин роботи обладнання згідно таблиці 4.1 — 105 годин.

Тоді,.

грн.

3.5 Розрахунок суми амортизаційних відрахувань Характерною особливістю застосування основних фондів у процесі виробництва є їх відновлення. Для відновлення засобів праці у натуральному виразі необхідне їх відшкодування у вартісній формі, яке здійснюється шляхом амортизації.

Амортизація — це процес перенесення вартості основних фондів на вартість новоствореної продукції з метою їх повного відновлення.

Комп’ютери та оргтехніка належать до четвертої групи основних фондів. Для цієї групи річна норма амортизації дорівнює 60% (квартальна — 15%).

Для визначення амортизаційних відрахувань застосовуємо формулу:

(3.8).

де, А — амортизаційні відрахування за звітний період, грн.;

БВ — балансова вартість групи основних фондів на початок звітного періоду, грн.;

НА — норма амортизації, %.

Для даного проекту засобом праці є комп’ютер. Його сума становить 4200 грн. Отже, амортизаційні відрахування будуть рівні:

грн.

Оскільки робота виконувалась 105 годин, то амортизаційні відрахування будуть становити:

грн.

3.6 Обчислення накладних витрат Накладні витрати пов’язані з обслуговуванням виробництва, утриманням апарату управління спілкою та створення необхідних умов праці.

В залежності від організаційно-правової форми діяльності господарюючого суб'єкта, накладні витрати можуть становити 20−60% від суми основної та додаткової заробітної плати працівників.

(3.9).

де НВ — накладні витрати.

Отже, накладні витрати:

грн.

3.7 Складання кошторису витрат та визначення собівартості НДР Результати проведених вище розрахунків зведемо у таблицю 3.4.

Таблиця 3.4 Кошторис витрат на НДР.

Собівартість (СВ) програмного продукту розрахуємо за формулою:

. (3.10).

Отже, собівартість програмного продукту дорівнює:

грн.

3.8 Розрахунок ціни програмного продукту Ціну НДР можна визначити за формулою:

(3.11).

де Ррен. — рівень рентабельності, 30%;

К — кількість замовлень, од. (встановлюється лише при розробці програмного продукту та мікропроцесорних систем);

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

ПДВ — ставка податку на додану вартість, (20%).

Так як мій програмний продукт не є прикладним, а він створений для WEB, то для розрахунку його ціни не потрібно вказувати коефіцієнти К та Ві.н, оскільки їх в даному випадку не потрібно.

Тоді, формула для обчислення ціни програмного продукту буде мати вигляд:

. (3.12).

Звідси ціна на програму складе:

грн.

3.9 Визначення економічної ефективності і терміну окупності капітальних вкладень Ефективність виробництва — це узагальнене і повне відображення кінцевих результатів використання робочої сили, засобів та предметів праці на підприємстві за певний проміжок часу.

Економічна ефективність (Ер) полягає у відношенні результату виробництва до затрачених ресурсів:

(3.13).

де П — прибуток;

СВ — собівартість.

Плановий прибуток (Ппл) знаходимо за формулою:

. (3.14).

Розраховуємо плановий прибуток:

грн.

Отже, формула для визначення економічної ефективності набуде вигляду:

. (3.15).

Тоді,.

Поряд із економічною ефективністю розраховують термін окупності капітальних вкладень (Тр):

(3.16).

Термін окупності дорівнює:

роки.

Висновок В цьому розділі дипломного проекту було розраховано основні техніко-економічні показники мого програмного продукту — веб-сайту (таблиця 3.5).

Таблиця 3.5 Техніко-економічні показники НДР.

Розраховане значення економічної ефективності становить 0,56, що є високим значенням.

Так само нормальним є термін окупності. Для мого продукту він становить 1.8 років.

Отже, даний програмний продукт може бути впроваджений та мати подальший розвиток, оскільки він є економічно вигідним за всіма основними техніко-економічними показниками.

4. Охорона праці та безпека в надзвичайних ситуаціях.

4.1 Охорона праці.

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

Основним нормативним документом, який регламентує норми і правила експлуатації електронно-обчислювальної техніки є НПАОП 0.00−1.28−10 «Правила охорони праці під час експлуатації електронно-обчислювальних машин». Правила встановлюють вимоги безпеки до обладнання робочих місць операторів ЕОМ. Вимоги НПАОП 0.00−1.28−10 є обов’язковими для роботодавців, операторів електронно-обчислювальних машин, операторів комп’ютерного набору, операторів комп’ютерної верстки, програмістів та працівників інших професій, які у своїй роботі застосовують ЕОМ з ВДТ і ПП.

Площа, на якій розташовується одне робоче місце, облаштоване комп’ютером, повинна становити не менше як 6 м², об'ємом не менше як 20 м³. Висота стель у приміщеннях, де розташовуються сервери становить 3,2 м, а розміщення комп’ютеризованих робочих місць розраховувалось у відповідності до вимог.

Робочі місця працівників, які використовують ПК, розташовуються на відстані від стін — на 1 м; а між собою на відстані не менше ніж 1,7 м, що відповідає вимогам до організації робочих місць, обладнаних комп’ютерами.

З метою запобігання нещасним випадкам та організації охорони праці на виробництві керівництвом установи, де експлуатуються ЕОМ, розроблено інструкції з охорони праці і техніки безпеки при використанні комп’ютерної техніки. Дія інструкції поширюється на всі структурні підрозділи даної установи.

До роботи на ПК допускаються особи, які пройшли спеціальне навчання, медичне обстеження, вступний інструктаж з охорони праці, інструктаж на робочому місці та інструктаж з пожежної безпеки. Хто із працівників не пройшов інструктажі, той не допускається до роботи із серверами.

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

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

Основними небезпечними та шкідливими виробничими факторами, які впливають на користувачів ПК є:

— підвищений рівень шуму на робочому місці (від вентиляторів процесорів та відеоплат);

— можливе підвищене значення напруги в електричному колі, замикання якого може статися через тіло людини;

— підвищений рівень статичної електрики;

— підвищений рівень електромагнітного випромінення;

— підвищена напруженість електричного поля;

— прямий та відбитий від екранів блиск; несприятливий розподіл яскравості в полі зору;

— фізичні перевантаження статичної та динамічної дії;

— нервово-психічні перевантаження (розумове перенапруження, перенапруження аналізаторів, монотонність праці, емоційні перевантаження).

При виборі кімнат для розміщення серверних стійок враховано ступінь відбиття світла на екранах дисплеїв, яке проходить через вікна і яке може викликати значне осліплення в тих, хто сидить перед ними, особливо влітку та в сонячні дні. Тому, сервери, ПК і оргтехніка розміщені біля стін, які не знаходяться біля вікон або навпроти них.

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

Розміщення робочих місць користувачів ПК відповідають ГОСТ 22 269–76 «Рабочее место оператора. Взаимное расположение злементов рабочего места.» .

Робочі місця з ПК при виконанні творчої роботи, яка потребує значної розумової напруги чи великої концентрації уваги, ізольовано одне від одного перегородкою висотою 1,6 м.

Поверхня підлоги у приміщеннях оздоблена керамічною плиткою і є рівною та зручною для очищення та вологого прибирання.

Штучне освітлення у приміщеннях даної установи виконано у вигляді комбінованої системи освітлення з використанням люмінесцентних джерел світла у світильниках загального освітлення, які розташовувати над робочими поверхнями у рівномірно-прямокутному порядку. Штучне освітлення забезпечує на робочих місцях з ПК освітленість 300−500 лк.

Для запобігання засвітленню дисплеїв ПК прямими світловими потоками лінії світильників розташовані з достатнім бічним зміщенням відносно рядів робочих місць, а також паралельно до світлових отворів. При цьому кожне вікно повинно мати світлорозсіюючі штори з коефіцієнтом відбивання 0,7.

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

Жодних cвітлових відблисків з клавіатури, екрана та від інших частин ВДТ у напрямку очей оператора не повинно бути. Тому усі робочі місця з ПК розташовано таким чином, щоб в поле зору користувача не потрапляли вікна або освітлювальні прилади.

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

Для запобігання засліпленню користувачів світильники місцевого освітлення молочного кольору. Захисний кут відбивача світильника становить 600.

Для оздоблення приміщень використано дифузно-відзеркалюючі матеріали з коефіцієнтами відбиття: стелі - 0,8; стін — 0,5; підлоги — 0,3, що відповідає чинним вимогам.

Вміст шкідливих хімічних речовин у приміщеннях з ПК не перевищує концентрацій вказаних у ГОСТ 12.1.005−88 «Общие санитарно-гигиенические требования к воздуху рабочей зоны» .

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

Для забезпечення точного і швидкого зчитування інформації поверхню екрана монітора ПК розташовано в оптимальній зоні інформаційного поля в площині, перпендикулярній нормальній лінії погляду користувача, який знаходиться в робочій позі. Допускається відхилення від цієї площини — не більше 45 градусів; допускається кут відхилення лінії погляду від нормального — не більше 30 градусів.

Розташування клавіатури на робочому столі відповідає вимогам ергономіки і становить 200 мм від краю стола ближче до працюючого. Положення клавіатури та кут її нахилу відповідає кут нахилу в межах 5−15°.

Робочі місця, обладнанні принтером, розташовані так, що доступ до нього користувача є зручним і максимальна відстань до клавіш управління принтером не перевищує довжину витягнутої руки.

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

Висота робочої поверхні столу регулюється у межах 680−800 мм. Ширина і глибина робочої поверхні забезпечують можливість виконання трудових операцій в межах моторного поля, межа якого визначається зоною в межах видимості приладів і досяжності органів керування. Поверхня столу має матове покриття з малим відбиттям та є теплоізолюючою.

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

4.2 Оцінка надійності захисту персоналу об'єкту у воєнний час Економіка країни відіграє вирішальну роль у збройній боротьбі держав. Вона визначає характер і способи ведення війни і справляє визначальний вплив на військову міць держави, на хід і результат війни в цілому. У сучасних умовах, коли науково-технічний прогрес у всіх областях виробництва досяг небачених масштабів і привів до створення новітніх видів зброї масового ураження, роль і значення економіки як найважливішого чинника підготовки і ведення війни зросли ще більше.

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

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

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

На об'єкті мають бути розроблені два плани: на воєнний та мирний час.

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

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

План на воєнний час складається з текстової частини і додатків. Текстова частина складається з трьох розділів.

Розділ 1. Оцінка обстановки, що може скластися на об'єкті в результаті дій противника.

У цьому розділі висвітлюються: коротка характеристика і оцінка обстановки, що може скластися на території об'єкта після несподіваного нападу і при плановому переведенні ЦЗ на воєнний стан; можливий ступінь руйнування виробничих дільниць і житлових будинків; ступінь радіоактивного забруднення тварин, території; можливість виникнення і характер впливу осередків сильнодіючих ядучих речовин (СДЯР), лісових, торфових пожеж, зон затоплення; можливе зниження виробництва; можлива радіаційна, пожежна і хімічна обстановка; стан транспортних артерій, систем енерго-, газо-, водо-, теплозабезпечення, матеріально-технічної бази, оповіщення, зв’язку і управління; втрати сил і засобів ЦЗ і людей об'єкта та населеного пункту; втрати від повторних факторів ураження; обставини, які можуть скластися на території об'єкта і населеного пункту при використанні противником звичайних засобів ураження.

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

Розділ 2. Виконання заходів на об'єкті при планомірному переведенні на особливий період.

Виконання заходів при загрозі нападу противника: 1. Захист працюючих і членів їх сімей:

а) організація і порядок укриття їх у захисних спорудах: підготовка захисних споруд; організація будівництва ПРУ; будівництво найпростіших укриттів; використання підвалів, погребів та інших заглиблених приміщень для укриття населення і формувань; управління людьми, які знаходяться в захисних спорудах;

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

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

в) протирадіаційний і протихімічний захист: порядок роботи об'єкта в умовах радіоактивного забруднення. Режим протирадіаційного захисту населення; організація дозиметричного контролю; порядок видачі засобів індивідуального захисту; організація санітарної обробки людей і знезаражування техніки;

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

2. Заходи забезпечення стійкої роботи у воєнний час.

А. Захист сільськогосподарських тварин і продукції тваринництва:

а) протирадіаційний і протихімічний захист: порядок доведення сигналів ЦЗ до тваринницьких бригад під час випасу; строки переведення тварин на стійлове утримання; герметизація тваринницьких приміщень; режими протирадіаційного захисту й утримання тварин в умовах радіоактивного забруднення луків і пасовищ. Організація дозиметричного контролю; порядок проведення санітарно-ветеринарних профілактичних заходів; поповнення запасів медичних і ветеринарних засобів; створення запасів фуражу, засобів знезаражування, матеріалів для герметизації; порядок проведення ветеринарної обробки тварин, підготовка забійних пунктів. Організація забою уражених тварин, консервація і зберігання продукції тваринництва;

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

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

Б. Захист сільськогосподарських рослин і продукції рослинництва: організація спостереження за радіаційним забрудненням, хімічним ураженням посівів сільськогосподарських культур; порядок доставки проб ґрунту і рослин з осередків ураження в районну станцію захисту рослин і агрохімічну лабораторію; способи виклику підрозділів фітопатологічної розвідки в місця зараження; герметизація сховищ насіннєвого фонду, складів мінеральних добрив, овочесховищ; порядок поповнення запасів пестицидів, мінеральних добрив; організація переробки і тимчасового зберігання продукції рослинництва.

Заходи підготовки господарств до стійкої роботи в умовах війни розробляються в повному обсязі заходів згідно з додатком № 5 «План-графік нарощування заходів підвищення стійкості роботи сільськогосподарського об'єкта у воєнний час» .

В. Захист і знезаражування продуктів харчування, урожаю, кормів, води і джерел води: захист продовольства і зерна в складах і сховищах; захист кормів і урожаю в польових умовах; захист урожаю і фуражу при перевезеннях; захист продовольства, води в домашніх умовах; захист колодязів від ОР, РР і ВР; знезаражування урожаю, кормів і води в господарстві.

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

4. Організація забезпечення заходів ЦЗ.

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

Основні види забезпечення заходів: розвідка; транспортне, матеріальне і технічне забезпечення; гідрометеорологічна інформація; пожежне забезпечення та забезпечення громадського порядку.

5. Організація управління.

Управління об'єкта включає: організацію повідомлення керівного складу формувань, населення в місцях проживання; час розгортання ІГУ, склад обслуги, організація чергувань; організація зв’язку, у тому числі й рухомими засобами з виробничими дільницями, формуваннями, взаємодіючими організаціями; порядок подання донесень.

Розділ 3. Виконання заходів ЦЗ на об'єкті в умовах несподіваного нападу противника.

1. Дії за сигналом «Повітряна тривога» (ПТ): порядок і строки повідомлення працюючих і населення за сигналом «ПТ»; порядок видачі засобів індивідуального захисту (ЗІЗ), приладів розвідки і дозиметричного контролю, які знаходяться біля робочих місць і в ПРУ; організація безаварійної зупинки виробництва; укриття населення; управління населенням, яке знаходиться в укриттях.

2. Дії після нападу противника: заходи відновлення порушеного управління; приведення в готовність формувань ЦЗ; введення режимів захисту; організація прийому і розміщення евакуйованого населення; порядок розгортання і приведення до готовності сил і засобів ЦЗ; організація прискореного відновлення і будівництва ЗС; організація і ведення рятувальних та інших невідкладних робіт на території об'єкта; порядок відновлення боєздатності об’ектових сил і засобів, що потерпіли.

5. Екологія.

5.1 Стратегія і тактика збереження й розвитку життя на землі.

Сталий ромзвиток (англ. Sustainable development) — загальна концепція стосовно необхідності встановлення балансу між задоволенням сучасних потреб людства і захистом інтересів майбутніх поколінь, включаючи їх потребу в безпечному і здоровому довкіллі.

Ряд теоретиків і прихильників сталого розвитку вважають його найперспективнішою ідеологією 21 століття і навіть усього третього тисячоліття, яка з поглибленням наукової обґрунтованості, витіснить усі наявні світоглядні ідеології, як такі, що є фрагментарними, неспроможними забезпечити збалансований розвиток цивілізації.

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

Варто відзначити, що досягнення оптимального варіанта розвитку декларують ряд країн, у кожної країни свій шлях розвитку. В одних цей шлях тільки починається, у інших вже розпочався, треті вже стали на шлях сталого економічного розвитку. Існує багато і таких країн, яким не до сталого розвитку і вони його не сприймають. На перше місце вони ставлять одну стратегічну мету — вижити. Саме такі країни провокують загрози, що поширюються до інших держав та їхніх регіонів. Досягти сталого розвитку регіонів надзвичайно важко, адже близьке сусідство з іншими державами формує загрозу екологічної небезпеки, а глобалізація, що стрімко набрала обертів, сприяє утворенню та загостренню економічних та соціальних небезпек, що зрештою торкаються регіонального розвитку.

Термін «сталий розвиток» є офіційним українським відповідником англійського терміну «англ. sustainable development», дослівний переклад якого з урахуванням контексту може бути «життєздатний розвиток» а за сенсом — «самопідтримуваний розвиток», інколи цей термін тлумачать як всебічно збалансований розвиток. За визначенням Комісії ООН зі сталого розвитку, його мета — задовольняти потреби сучасного суспільства, не ставлячи під загрозу здатність майбутніх поколінь задовольняти свої потреби. Теорія сталого розвитку є альтернативою парадигмі економічного зростання, яка ігнорує екологічну небезпеку від розвитку за екстенсивною моделлю.

Парадигма сталого розвитку включає в себе вимоги до захисту довкілля, соціальної справедливості та відсутності расової й національної дискримінації. У країнах, де на державному рівні зазначені вимоги ігноруються, в поняття сталого розвитку намагаються вкласти «зручний» зміст, вихолощуючи справжній. Так в Україні термін «сталий розвиток» часто вживають для означення лише неухильного зростання економічних показників країни, її регіонів, міст, сіл та окремих галузей економіки. Інколи до цього додають здійснення безсистемних заходів щодо збереження довкілля та поліпшення санітарних умов проживання й праці людей. Таке тлумачення терміну розкритиковане Ґ. Дейлі і є не лише грубою помилкою, але і його профанацією.

Концепція сталого розвитку ґрунтується на п’яти головних принципах:

1. Людство дійсно може надати розвитку сталого і довготривалого характеру, для того щоб він відповідав потребам людей, що живуть зараз, не втрачаючи при цьому можливості майбутнім поколінням задовольняти свої потреби.

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

3. Необхідно задовольнити елементарні потреби всіх людей і всім надати можливість реалізувати свої надії на благополучніше життя. Без цього сталий і довготривалий розвиток просто неможливий. Одна з головних причин виникнення екологічних та інших катастроф — злидні, які стали у світі звичайним явищем.

4. Необхідно налагодити стан життя тих, хто користується надмірними засобами (грошовими і матеріальними), з екологічними можливостями планети, зокрема відносно використання енергії.

5. Розміри і темпи росту населення повинні бути погоджені з виробничим потенціалом глобальної екосистеми Землі, що змінюється.

Приклади впровадження концепції.

· Будівництво доріг, будівель має супроводжуватися відповідним зростанням зелених насаджень — щоб не погіршувати стан довкілля.

· Зростання виробництва зерна не повинно супроводжуватися виснаженням чи іншим погіршенням якості ґрунту.

· Видобування корисних копалин (наприклад металевих руд, вугілля) має супроводжуватися створенням підприємств, що не залежать від цього видобутку. Таким чином, щоб після вичерпання майбутні покоління (а часто й поточні) не мали економічних проблем.

· У приватному сенсі — заробітна плата повинна компенсувати витрати на відновлення здоров’я, погіршене через виконувану роботу.

5.2 Методи визначення якості та обсягу забруднень Забруднення — це зміна якості навколишнього середовища, що призводить до негативних наслідків.

Розрізняють природні й антропогенні забруднення. Природне виникає в результаті природних причин — виверження вулканів, землетрусів, катастрофічних повеней, пожеж. Антропогенне забруднення — результат людської діяльності.

В даний час загальна потужність джерел антропогенного забруднення в багатьох випадках перевершує потужність природних. Природні джерела окису азоту викидають 30 млн т на рік, а антропогенні - 35−50 млн т; двоокису сірки відповідно 30 і більше 150 млн т. У результаті діяльності людини свинцю потрапляє в біосферу в 10 разів більше, ніж у процесі природних забруднень.

За масштабами, забруднення поділяють на:

а) глобальні (планетарні): озонові дірки, кислотні дощі, парниковий ефект, підвищення рівня радіації і забруднення Світового океану;

6) регіональні: забруднення окремих частин країни, басейну окремої річки, моря;

в) локальні: невеликих масштабів від локальних джерел забруднення: вихлопна труба конкретного автомобіля, викид газоподібних чи твердих відходів окремого підприємства.

За видами, забруднення поділяються на:

1. Механічні - це забруднення навколишнього середовища механічними відходами без хіміко-фізичних наслідків.

2. Хімічні - це зміна хімічних властивостей середовища, що спричиняє негативний вплив на екосистеми і техногенні системи.

З. Фізичні - це зміна фізичних параметрів навколишнього середовища, що призводить до негативних наслідків.

4. Біологічні - це проникнення в екосистеми чи техногенні системи живих істот, ворожих даним співтовариствам.

Для визначення ступеня забруднення довкілля та впливу того чи іншого забруднювача на біоту й здоров’я людини, оцінки шкідливості забруднювачів, проведення екологічних експертиз стану середовища або окремих об'єктів чи районів, нині в усьому світі користуються такими поняттями, як гранична допустимі концентрації шкідливих речовин, граничне допустимі викиди (ГДЗ) забруднювачів, гранично допустимі екологічні навантаження (ГДЕН), максимально допустимий рівень (МДР), кризисні екологічні ситуації, санітарно-захисні зони (СЗЗ) тощо.

Гранично допустимі концентрації встановлюються головними санітарними інспекціями в законодавчому порядку або рекомендуються відповідними установами, комісіями на основі результатів складних комплексних наукових досліджень, лабораторних експериментів, а також відомостей, одержаних після різних аварій на виробництвах, військових дій, природних катастроф (вивержень вулканів, землетрусів, великих пожеж, падіння метеоритів) з використанням матеріалів тривалих медичних обстежень людей на шкідливих виробництвах у хімічних та ливарних цехах, на АЕС, у шахтах і кар'єрах.

В Україні стан довкілля сьогодні контролюється кількома відомствами. Основний контроль здійснюють Міністерства охорони здоров’я та природи, санітарно-епідеміологічні служби, республіканська гідрометеослужба та її відділи в районах і областях. Допоміжний екологічний контроль здійснюється службами міністерств комунального господарства, рибнагляду, геології, товариства охорони природи, «зеленими» службами Управління екологічного моніторингу Міністерства охорони навколишнього природного середовища.

5.3 Стаcтичне оцінювання екологічного стану навколишнього середовища Екологічна статистика — галузь статистики природних ресурсів і навколишнього середовища. Включає дані про стан забруднення. природних об'єктів — атмосферного повітря, природних водних об'єктів, ґрунтів, одержувані на підставі моніторингу. Якість природних об'єктів оцінюється показниками: кількість вимірів, середня концентрація, максимальна концентрація, повторюваність концентрації шкідливих домішок вище гранично припустимої концентрації. Дані екологічної статистики використовуються в соціально-економічному аналізі для оцінки результатів заходів щодо зниження шкідливих викидів в атмосферу, забруднених стоків у природні водні об'єкти, визначення взаємозв'язку якості навколишнього середовища і станів здоров’я населення, а також визначення економічного збитку від забруднення навколишнього середовища в зв’язку зі зниженням врожайності сільськогосподарських культур, погіршенням продуктивності у тваринництві, підвищеним зносом будинків, споруджень і т. д.

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

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

Основними ознаками середовища є:

— екологічний стан середовища;

— варіація властивостей і стосунків в середовищі;

— екологічні зв’язки (стосунки) в середовищі;

— динаміка і тенденція змін стану середовища;

Таким чином, екологічний стан середовища — це природна ситуація, яка виникла внаслідок дії фізичних, хімічних і біологічних чинників. Його можна встановлювати вимірюванням і оцінкою двох основних параметрів: продуктивності і забруднення природного середовища.

Висновки.

У даному дипломному проекті було розроблено інформаційний веб-сайт.

Даний сайт було реалізовано засобами мов HTML, CSS, JavaScript, PHP. Тестування та випробовування web-сторінок проводилось при наявності установленого web-сервера Apache. Для тестування використовувались програми-браузери.

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

Графічний матеріал для сайту підготовлено в GIMP.

У найближчому майбутньому планується удосконалення даного сайту. Саме тому під час розробки даного дипломного проекту була закладена можливість оновлення і покращення його характеристик та функціональності.

Дипломний проект виконано у повній відповідності із завданням і всіма нормативними вимогами.

У ході написання дипломного проекту було створено сайт, який успішно пройшов тести на роботоздатність.

Перелік посилань.

1. Мержевич В. (22 сентября 2010). Основы CSS. Свойства текста [WWW документ]. URL http://htmlbook.ru/content/svoystva-teksta (28 листопада 2012).

2. Глушаков С. В., Жакин И. А., Хачиров Т. С. Программирование Web-страниц. — Харьков: «Фолио», 2005.-390 с.

3. Vol III: Client-Server Programming and Applications. — Department of Computer Sciences, Purdue University, West Lafayette, IN 47 907: Prentice Hall, 1993. — P. 11d. — ISBN 0−13−474 222−2.

4. Teaching Web Evaluation, http://lrs.ed.uiuc.edu/wp/credibility/ page4. html, Date Last Modified: 7/01/2002.

5. Как оценить достоверность результатов поиска? [Электронный ресурс] - Режим доступа: http://shperk.ru/v-seti/servisy/kak-ocenit-dostovernost-rezultatov-poiska.html.

6. Мержевич В. (1 октября 2010). Фиксированная ширина, float плюс margin [WWW документ]. URL http://htmlbook.ru/layout/fiksirovannaya-shirina-float-plyus-margin (28 листопада 2012).

7. Мержевич В. (22 сентября 2010). Основы CSS. Свойства текста [WWW документ]. URL http://htmlbook.ru/content/svoystva-teksta (28 листопада 2012).

8. Глушаков С. В., Жакин И. А., Хачиров Т. С. Программирование Web-страниц. — Харьков: «Фолио», 2005.-390 с.

9. Морзе Н. В. Методика навчання інформатики: Навч. посіб.: У 4 ч. / За ред. акад. М.І. Жалдака. — К.: Навчальна книга, 2003. — Ч. ІІІ: Методика навчання основних послуг глобальної мережі Інтернет. — 196 с.

10. Рамський Ю. С., Рєзіна О. В. Вивчення інформаційно-пошукових систем мережі Інтернет: Навч. посіб. — К.: НПУ імені М. П. Драгоманова, 2004. — 60с.

Додатки.

Додаток А. Технічне завдання.

МІНІСТЕРСТВО ОСВІТИ І НАУКИ, МОЛОДІ ТА СПОРТУ УКРАЇНИ.

ТЕРНОПІЛЬСЬКИЙ НАЦІОНАЛЬНИЙ ТЕХНІЧНИЙ УНІВЕРСИТЕТ.

ІМЕНІ ІВАНА ПУЛЮЯ.

ЗАТВЕРДЖУЮ.

Завідувач кафедрою КС.

_______________.

Лупенко С. А.

" ___" __________ 2013 р.

ТЕХНІЧНЕ ЗАВДАННЯ.

до дипломної роботи.

на тему: «Інтернет-магазин мережевого устаткування» .

Узгоджено:Виконавець:

Керівник дипломної роботи студент групи СІ-41.

Яцишин В. В. __________ Ууууууууууу Ю.Є. __________.

" ___" __________ 2013 р." ___" __________ 2013 р.

Тернопіль, 2014.

1. НАЗВА ДИПЛОМНОЇ РОБОТИ І ПІДСТАВА ДЛЯ ВИКОНАННЯ.

1.1 Назва: Розробка інформаційного web-сайту з використанням мови програмування PHP.

1.2 Підставою для виконання дипломної роботи є наказ по університету на затвердження теми дипломного проекту.

2. ВИКОНАВЕЦЬ ДИПЛОМНОЇ РОБОТИ.

2.1 Студент Melkiy.te.ua В. Р., групи СІ-52 кафедри комп’ютерної інженерії, факультету комп’ютерно-інформаційних систем і програмної інженерії, Тернопільського національного технічного університету імені Івана Пулюя.

3. МЕТА ДИПЛОМНОЇ РОБОТИ.

Метою дипломної роботи є розробка інформаційного web-сайту, що включає в себе:

— вибір апаратного забезпечення для хостингу;

— вибір програмного забезпечення для хостингу;

— вибір доменного імені для хостингу;

— розробка сайту на мові web-програмування;

4. ТЕХНІЧНІ ВИМОГИ.

4.1 Вимоги по призначенню:

4.1.1 Сайт повинен задовольняти універсальні вимоги по сайтобудуванню;

4.1.2 Сайт повинен заміняти будь-які CMS.

4.2 Вимоги до параметрів:

4.2.1 Використання процесора PHP;

4.2.2 Використання бази даних MySQL;

4.2.3 Використання серверу Apache.

4.3 Вимоги до надійності:

4.3.1 Сайт повинен функціонувати 24/7.

5. ЕКОНОМІЧНІ ПОКАЗНИКИ.

5.1 Собівартість економічної ефективності впровадження. Обґрунтування.

5.2 Собівартість сайту повинна бути не вищою 50 000 грн.

*Примітка: собівартість може змінюватися під час розрахунку в процесі розробки.

6. ВИМОГИ ДО ДОКУМЕНТАЦІЇ.

6.1 Конструкторська документація повинна відповідати вимогам ЄСКД та ДСТУ;

7. ПОРЯДОК ВИКОНАННЯ ДИПЛОМНОЇ РОБОТИ Стадії виконання дипломної роботи приведенні в таблиці 7.1.

Таблиця 7.1 — Стадії та етапи виконання ДР.

* - графік виконання дипломної роботи узгоджується з керівником дипломної роботи і з графіком виконання дипломної роботи.

8. ДОДАТКОВІ УМОВИ ВИКОНАННЯ ДИПЛОМНОЇ РОБОТИ.

8.1 Під час виконання дипломної роботи в дане технічне завдання можуть вноситися зміни та доповнення.

* Примітка: Технічне завдання — оформляється при проходженні технологічної практики і здається на затвердження завідуючому кафедрою до здачі звіту по технологічній практиці, оцінювання студента без затвердженого технічного завдання забороняється.

Додаток Б. Вихідні коди.

index.html.

<html>

<head>

<title>ІТ-компанія «Політех» </title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8″ />

<meta name="description" content="Офіційний сайт компанії Політех" />

<meta name="keywords" content="хостинг, адміністрування" />

<link href="/css/general-style.css" rel="stylesheet" type="tsxt/css" >

<link href="/css/menu-style.css" rel="stylesheet" type="tsxt/css" >

<script type="text/javascript" src="/javascripts/welcome.js" ></script>

<link rel="shortcut icon" href="favicon.png" type= «image/png» >

<script type="text/javascript" >

<!-;

function message2() {window.alert ('Ви знаходитеся на головній сторінці сайту')}.

—>

</script>

</head>

<body>

<div class="mainframe" ><!—Головний блок—>

<?php.

include 'include/header.php';

?>

<div class="leftmenu" ><!—Ліва частина сайту—>

<?php.

include 'include/general-menu.php';

?>

<div class="leftmenu-block" ><b>Навігатор:</b></div><!—Блок—>

<center><p onclick="return message2()" >Щоб дізнатися на якій Ви сторінці, просто натисніть тут</p></center>

<?php.

include 'include/left-block.php';

?>

</div>

<div class="workarea" ><!—Робоче поле—>

<center><h1>Вітаємо Вас на нашому сайті:</h1></center><hr>

<h2>Вітаємо Вас на сайті ІТ-компанії «Політех» </h2>

<p>Якщо Ви потрапили на цю сторінку, значить Ви хочете створити собі web-сайт.</p>

<p>Наша компанія працює у сфері web-розробки з 2006 року.</p>

<p>Ми пропонуємо самі найнижчі ціни на послуги по створенню, підтримці та обслуговуванню сайтів.</p>

<p>Обов'язково перегляньте наші <a href="services.php" title="Наші послуги" >послуги</a> і виберіть найкращий варіант.</p>

<p>Серед наших клієнтів є такі компанії, як [melkiy] corporation та VVcompany</p>

<hr>

</div>

<?php.

include 'include/footer.php';

?>

<div style="position: fixed; bottom: 40px; right: 80px;" >

<a href="index.php#top" title="Піднятися до верху" >

<img src="images/back-to-top.png" alt="back-to-top" >

</a>

</div>

</div>

</body>

</html>

services.html.

<html>

<head>

<title>ІТ-компанія «Політех» </title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8″ />

<meta name="description" content="Офіційний сайт компанії Політех" />

<meta name="keywords" content="хостинг, адміністрування" />

<link href="/css/general-style.css" rel="stylesheet" type="tsxt/css" >

<link href="/css/menu-style.css" rel="stylesheet" type="tsxt/css" >

<script type="text/javascript" src="/javascripts/welcome.js" ></script>

<link rel="shortcut icon" href="favicon.png" type= «image/png» >

<script type="text/javascript" >

<!-;

function message2() {window.alert ('Ви знаходитеся на сторінці послуг сайту')}.

—>

</script>

</head>

<body>

<div class="mainframe" ><!—Головний блок—>

<?php.

include 'include/header.php';

?>

<div class="leftmenu" ><!—Ліва частина сайту—>

<?php.

include 'include/general-menu.php';

?>

<div class="leftmenu-block" ><b>Навігатор:</b></div><!—Блок—>

<center><p onclick="return message2()" >Щоб дізнатися на якій Ви сторінці, просто натисніть тут</p></center>

<?php.

include 'include/left-block.php';

?>

</div>

<div class="workarea" ><!—Робоче поле—>

<center><h1>Ми надаємо послуги:</h1></center><hr>

<h2>Наша компанія надає ряд послуг:</h2>

<p>Послуга #1 — <i>Створення web-сайту.</i></p>

<p>Створення веб-сайтів різної складності.</p>

<br>

<p>Послуга #2 — <i>Адміністрування існуючого сайту</i></p>

<p>Супровід, наповнення, виявлення критичних помилок коду</p>

<br>

<p>Послуга #3 — <i>Розкручування сайту</i></p>

<p>Ріст сайту у рейтингах та у видачі результатів пошуковців</p>

<hr>

</div>

<?php.

include 'include/footer.php';

?>

<div style="position: fixed; bottom: 40px; right: 80px;" >

<a href="services.php#top" title="Піднятися до верху" >

<img src="images/back-to-top.png" alt="back-to-top" >

</a>

</div>

</div>

</body>

</html>

about.html.

<html>

<head>

<title>ІТ-компанія «Політех» </title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8″ />

<meta name="description" content="Офіційний сайт компанії Політех" />

<meta name="keywords" content="хостинг, адміністрування" />

<link href="/css/general-style.css" rel="stylesheet" type="tsxt/css" >

<link href="/css/menu-style.css" rel="stylesheet" type="tsxt/css" >

<script type="text/javascript" src="/javascripts/welcome.js" ></script>

<link rel="shortcut icon" href="favicon.png" type= «image/png» >

<script type="text/javascript" >

<!-;

function message2() {window.alert ('Ви знаходитеся на сторінці інформації про компанію')}.

—>

</script>

</head>

<body>

<div class="mainframe" ><!—Головний блок—>

<?php.

include 'include/header.php';

?>

<div class="leftmenu" ><!—Ліва частина сайту—>

<?php.

include 'include/general-menu.php';

?>

<div class="leftmenu-block" ><b>Навігатор:</b></div><!—Блок—>

<center><p onclick="return message2()" >Щоб дізнатися на якій Ви сторінці, просто натисніть тут</p></center>

<?php.

include 'include/left-block.php';

?>

</div>

<div class="workarea" ><!—Робоче поле—>

<center><h1>Про нас:</h1></center><hr>

<h2>Історія нашої компанії:</h2>

<h4>Створення:</h4>

<p>Наша компанія була створена у 1991 у місті Тернополі.</p>

<h4>Перший успіх:</h4>

<p>Перший успіх до компанії прийшов, коли ми вийшли на Європейський ринок у 2006 році.</p>

<hr>

</div>

<?php.

include 'include/footer.php';

?>

<div style="position: fixed; bottom: 40px; right: 80px;" >

<a href="about.php#top" title="Піднятися до верху" >

<img src="images/back-to-top.png" alt="back-to-top" >

</a>

</div>

</div>

</body>

</html>

сontacts.html.

<html>

<head>

<title>ІТ-компанія «Політех» </title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8″ />

<meta name="description" content="Офіційний сайт компанії Політех" />

<meta name="keywords" content="хостинг, адміністрування" />

<link href="/css/general-style.css" rel="stylesheet" type="tsxt/css" >

<link href="/css/menu-style.css" rel="stylesheet" type="tsxt/css" >

<script type="text/javascript" src="/javascripts/welcome.js" ></script>

<link rel="shortcut icon" href="favicon.png" type= «image/png» >

<script type="text/javascript" >

<!-;

function message2() {window.alert ('Ви знаходитеся на сторінці контактів')}.

—>

</script>

</head>

<body>

<div class="mainframe" ><!—Головний блок—>

<?php.

include 'include/header.php';

?>

<div class="leftmenu" ><!—Ліва частина сайту—>

<?php.

include 'include/general-menu.php';

?>

<div class="leftmenu-block" ><b>Навігатор:</b></div><!—Блок—>

<center><p onclick="return message2()" >Щоб дізнатися на якій Ви сторінці, просто натисніть тут</p></center>

<?php.

include 'include/left-block.php';

?>

</div>

<div class="workarea" ><!—Робоче поле—>

<center><h1>Наші контакти:</h1></center><hr>

<h2>Наша компанія розташовується за адресою:</h2>

<pre>

м. Тернопіль вул. Руська 53.

ЗАТ Політех.

</pre>

Наший сайт — <a href="http://melkiy.te.ua" target="_blank" >http://melkiy.te.ua/</a>

<hr>

</div>

<?php.

include 'include/footer.php';

?>

<div style="position: fixed; bottom: 40px; right: 80px;" >

<a href="contact.php#top" title="Піднятися до верху" >

<img src="images/back-to-top.png" alt="back-to-top" >

</a>

</div>

</div>

</body>

</html>

help.html.

<html>

<head>

<title>ІТ-компанія «Політех» </title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8″ />

<meta name="description" content="Офіційний сайт компанії Політех" />

<meta name="keywords" content="хостинг, адміністрування" />

<link href="/css/general-style.css" rel="stylesheet" type="tsxt/css" >

<link href="/css/menu-style.css" rel="stylesheet" type="tsxt/css" >

<script type="text/javascript" src="/javascripts/welcome.js" ></script>

<link rel="shortcut icon" href="favicon.png" type= «image/png» >

<script type="text/javascript" >

<!-;

function message2() {window.alert ('Ви знаходитеся на сторінці питання-відповіді')}.

—>

</script>

</head>

<body>

<div class="mainframe" ><!—Головний блок—>

<?php.

include 'include/header.php';

?>

<div class="leftmenu" ><!—Ліва частина сайту—>

<?php.

include 'include/general-menu.php';

?>

<div class="leftmenu-block" ><b>Навігатор:</b></div><!—Блок—>

<center><p onclick="return message2()" >Щоб дізнатися на якій Ви сторінці, просто натисніть тут</p></center>

<?php.

include 'include/left-block.php';

?>

</div>

<div class="workarea" ><!—Робоче поле—>

<center><h1>Питання — Відповіді:</h1></center><hr>

<h2>Часті питання та відповіді:</h2>

<p><b>1. У Вас є тестовий період?</b></p>

<p><i>Так. 14 днів.</i></p>

<p><b>2. Які Ваші гарантії?</b></p>

<p><i>Наша компанія є учасником і переможцем багатьох ІТ-конкурсів, що підкреслює професіоналізм наших програмістів. Окрім цього, якщо ми не виконаємо поставлене завдання, то повернемо Вам гроші.</i></p>

<p><b>3. У Вас є інтернет-магазин?</b></p>

<p><i>Ні.</i></p>

<hr>

</div>

<?php.

include 'include/footer.php';

?>

<div style="position: fixed; bottom: 40px; right: 80px;" >

<a href="help.php#top" title="Піднятися до верху" >

<img src="images/back-to-top.png" alt="back-to-top" >

</a>

</div>

</div>

</body>

</html>

guestbook.

<html>

<head>

<title>ІТ-компанія «Політех» </title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8″ />

<meta name="description" content="Офіційний сайт компанії Політех" />

<meta name="keywords" content="хостинг, адміністрування" />

<link href="/css/general-style.css" rel="stylesheet" type="tsxt/css" >

<link href="/css/menu-style.css" rel="stylesheet" type="tsxt/css" >

<script type="text/javascript" src="/javascripts/welcome.js" ></script>

<link rel="shortcut icon" href="favicon.png" type= «image/png» >

<script type="text/javascript" >

<!-;

function message2() {window.alert ('Ви знаходитеся на сторінці відгуків про роботу нашої компанії')}.

—>

</script>

</head>

<body>

<div class="mainframe" ><!—Головний блок—>

<?php.

include 'include/header.php';

?>

<div class="leftmenu" ><!—Ліва частина сайту—>

<?php.

include 'include/general-menu.php';

?>

<div class="leftmenu-block" ><b>Навігатор:</b></div><!—Блок—>

<center><p onclick="return message2()" >Щоб дізнатися на якій Ви сторінці, просто натисніть тут</p></center>

<?php.

include 'include/left-block.php';

?>

</div>

<div class="workarea" ><!—Робоче поле—>

<center><h1>Книга відвідувачів</h1></center><hr>

<h2>Тут ви можете залишити відгук про нашу роботу:</h2>

<div style="width: 100%; margin: 0 auto;" >

<form action="addMessage.php" method="post" >

Ваше ім'я:<br>

<input type="text" name="guestName" placeholder="Ваше ім'я" style="width: 100%;" ><br><br>

Текст Вашого повідомлення в книзі відвідувачів:<br>

<textarea name="messageText" placeholder="Текст повідомлення" style="width: 100%; height: 100px;" >

</textarea><br><br>

<input type="submit" value="Залишити повідомлення в книзі відвідувачів!" style="width: 100%;" >

</form><hr><br>

<?php.

// подключення до бази даних.

$connect = new mysqli ('localhost', 'root', '', 'guestbook');

// отримуємо список всіх повідомлень.

$result = $connect->query («select * from guestbook»);

// вираховуємо кількість отриманих записів.

$countMessage = $result->num_rows;

// якщо кількість записів в базі даних більше, то її виводимо.

if ($countMessage > 0).

{.

// переглядаємо весь масив отриманих даних.

for ($i = 0; $i < $countMessage; $i++).

{.

echo '<div style="border: 1px solid green;" >';

// витягаю дані.

$message = $result->fetch_object ();

// виводжу дані у потрібному виді.

echo «<b>» .$message->guestbook_user_name.": </b><br>" ;

echo $message->guestbook_message_text." <br>" ;

echo «Дата: „.$message->guestbook_data.“ <br>» ;

echo '</div><br>';

}.

}.

?>

</div><hr>

</div>

<?php.

include 'include/footer.php';

?>

<div style="position: fixed; bottom: 40px; right: 80px;" >

<a href="guestbook.php#top" title="Піднятися до верху" >

<img src="images/back-to-top.png" alt="back-to-top" >

</a>

</div>

</div>

</body>

</html>

addmessage.

<?php.

// отримую і обролюю ім'я і текст коментаря.

$guestName = addslashes (htmlspecialchars ($_POST['guestName'], ENT_QUOTES));

$messageText = addslashes (htmlspecialchars ($_POST['messageText'], ENT_QUOTES));

// виведення сьогодньошньої дати.

$date = date («Y.m.d»);

// якщо користувач ввів своє ім'я і текст повідомлення, то додати все це в базу даних.

if ($guestName ≠ «» && $messageText ≠ «»).

{.

// з'єднуємо з базою даних.

$connect = new mysqli ('mylocalhost', 'root', '', 'guestbook');

// якщо запит виконаний успішно, то вивести повідомлення «повідомлення відправлено» .

if ($connect->query («insert into guestbook values (0, '$guestName', '$messageText', '$date')»)).

echo «<center><a href='guestbook.php'>Повідомлення відправлено.</a></center>» ;

// якщо при виконанні запиту є помилка, то вивести повідомлення про неї.

else.

echo «<center><a href='guestbook.php'>Виникла помилка при відправленні повідомлення. Спробуйте пізніше.</a></center>» ;

}.

// якщо користувач не ввів своє ім'я, або текст повідомлення.

else.

echo «<center><a href='guestbook.php'>Необхідно заповнити усі поля! Поверніться на попередню сторінку.</a></center>» ;

?>

welcome.

function message () {window.alert ('Вітаю Вас на сайті ПОЛІТЕХУ. У нас Ви можете замовити послуги: хостингу, адміністрування, створення та розкрутка сайту. Детальніше в розділі «Послуги» ')}.

footer.

<div class="footer" ><!—Нижня частина сайту—>

<p>

Компанія «Політех» <a href="http://melkiy.te.ua" target="_blank" >Розробив Володимир Melkiy.te.ua</a> Усі права вільні.

<span style="-webkit-transform: rotate (180deg); -moz-transform: rotate (180deg); -o-transform: rotate (180deg); -khtml-transform: rotate (180deg); -ms-transform: rotate (180deg); transform: rotate (180deg); display: inline-block;" >(c)</span><!—Copyleft—>

</p>

</div>

general-menu.

<div class="leftmenu-block" ><b>Головне меню:</b></div><!—Блок—>

<div class="diva" >

<p><div class="menu-point" ><a class="menu" href="index.php" >Головна сторінка</a></div></p>

<p><div class="menu-point" ><a class="menu" href="services.php" >Послуги</a></div></p>

<p><div class="menu-point" ><a class="menu" href="about.php" >Про Компанію</a></div></p>

<p><div class="menu-point" ><a class="menu" href="contact.php" >Контакти</a></div></p>

<p><div class="menu-point" ><a class="menu" href="help.php" >Питання-відповіді</a></div></p>

<p><div class="menu-point" ><a class="menu" href="guestbook.php" >Книга відвідувачів</a></div></p>

</div>

header.

<div class="header" ><!—Верхня частина сайту—>

<a href="index.php" ><img src="images/polytech-logo.png" alt="logo" ></a>

</div>

left-block.

<div class="leftmenu-block" ><b>Інформація:</b></div><!—Блок —>

<p onclick="return message ()" >Вітання!!!</p>

<p>

<?

echo 'Зараз ';

echo date ('H:i');

echo ' година';

?>

</p>

<p>

<?php.

$counter = 0;

$counter++;

echo «Сьогодні було відвідувачів: $counter» ;

?>

</p>

<div class="leftmenu-block" ><b>Друзі сайту:</b></div><!—Блок —>

<ul>

<li><a href="http://melkiy.te.ua/" target="_blank" >[melkiy] corporation</a></li>

<li><a href="http://melkiy.bz.ua/" target="_blank" >Офіційний melkiy сайт</a></li>

<li><a href="http://vmn70.te.ua/" target="_blank" >Блог Володимира Melkiy.te.uaа</a></li>

<li><a href="http://mi.ucoz.org/" target="_blank" >[melkiy] - інформаційний портал</a></li>

<li><a href="http://melkiy.at.ua/" target="_blank" >melkiy сайт</a></li>

</ul>

general-style.

body/*вся сторінка*/.

{.

background-color: faf3ba;/*фоновий колір*/.

color: 5 906;/*колір тексту*/.

}.

mainframe/*головний блок ||| усі блоки взяті в один загальний блок*/.

/*border: 1px solid black; бордюр

.header.

/*border: 1px solid black; бордюр

.leftmenu.

/*border: 1px solid black; бордюр

.leftmenu-block.

{.

border: 1px solid red; /*бордюр*/.

overflow: hidden;/*заборона показувати контент, якщо він виходить за межі блоку (щоб не з'їхав шаблон)*/.

padding: 10px;/*відступ вмісту блоку від границь блоку*/.

text-align: center;/*розміщення тексту = по центру*/.

border-radius: 8px;/*заокруглені краї*/.

color: blue;/*колір тексту*/.

background-color: gold;/*колір заливки*/.

}.

.workarea.

.footer.

/*border: 1px solid black; бордюр

menu-style.

.menu-point.

{.

margin: 5px;

width: 100%;/*ширина блоку*/.

}.

.menu.

{.

border: 1px solid green;

overflow: hidden;/*заборона показувати контент, якщо він виходить за межі блоку (щоб не з'їхав шаблон)*/.

padding: 5px;

text-decoration: none;/*забираю підкреслення для посилання*/.

color: red;

border-radius: 4px;/*заокруглені краї*/.

}.

.menu:hover.

{.

color: blue;

background-color: gold;

}.

.diva.

{.

align: center;

/*border: 1px solid black;*/.

}.