Розробка персонального блогу з використанням технології СSS3 i jQuery

Размещено на http://www.allbest.ru/

Размещено на http://www.allbest.ru/

ВСТУП

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

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

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

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

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

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

1. ОСНОВНА ЧАСТИНА

1.1 Аналітичний огляд існуючих рішень

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

Повна назва дипломного проекту: «Розробка персонального блогу з використанням технологій СSS3 і jQuery». Всі сторінки сайту написані на мові програмування HTML і PHP. Всі файли сайту розміщенні у папці Site. Сайт повинен бути виконаний в легкій і зрозумілій формі для того, щоб з ним працювати достатньо володіти базовими навиками при роботі з ПК.

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

Вимоги до сайту:

1) Задачі, які повинен вирішувати веб-сайт:

- сайт повинен мати зручний інтерфейс;

- пошук даних має бути виконаний у зручній формі;

- працювати в діалоговому режимі;

- передбачити введення-виведення даних з клавіатури;

2) Вимоги до мови програмування:

- для реалізації статичних сторінок і шаблонів повинні використовуватися мови HTML 4.0 і CSS. Вихідний код повинен розроблятися відповідно до стандартів W3C (HTML 4.0);

- для реалізації динамічних сторінок повинна використовуватися мова PHP;

- всі дані сайту повинні зберігатися в структурованому вигляді під управлінням СКБД;

3) Вимоги до ілюстрацій та об'єму однієї сторінки, організації гіперпосилань:

- всі малюнки і фото обсягом більше 1 kb (крім елементів дизайну сторінки) повинні бути виконані з текстом. Всі малюнки повинні бути в форматі gif або jpg;

- обсяг однієї стандартної сторінки сайту в середньому не повинен перевищувати 170 kb;

- всі посилання на сайті повинні бути відносними (за винятком зовнішніх);

4) Вимоги до ергономіки та технічної естетики, лінгвістичного забезпечення:

- cайт повинен бути оптимізований для перегляду при розширенні монітора 1024x768, без горизонтальної смуги прокрутки;

- елементи управління повинні бути згруповані однотипно - горизонтально або вертикально - на всіх сторінках;

1.2 Аналіз інформаційної інфра структури

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

Для розміщення сайту у всесвітній мережі Інтернет необхідно зареєструвати доменне ім'я, а також обрати веб-сервер (хост).

У більшості випадків в Інтернеті одному сайту відповідає одне доменне ім'я.

Термін Доменне ім'я (англ. Domain name) має кілька значень:

1. Ім'я, що ідентифікує комп'ютер або комп'ютери у мережі Інтернет. Це ім'я виглядає як частина web-адреси, наприклад uk.wikipedia.org.

2. Продукт, котрим реєстратори доменних імен забезпечують споживачів. Такий продукт часто називають зареєстроване доменне ім'я.

3. Імена, що використовуються для інших цілей, наприклад спеціальне ім'я яке стоїть після @ у адресі електронної пошти.

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

Кожне доменне ім'я відповідає одній або декільком IP-адресам, і одній IP-адресі можуть відповідати декілька доменних імен. Якщо на одне доменне ім'я приходиться більше однієї IP-адреси, це означає, що за даною адресою знаходяться декілька серверів, які ділять між собою потік повідомлень; якщо ж декілька доменних імен присвоєні одній IP-адресі, то це може означати, що власник сервера зареєстрував для себе декілька доменних імен або що декілька клієнтів спільно використовують один сервер.

Доменне ім'я може мати, наприклад, такий вигляд: cki.ipri.kiev.ua. Як правило, доменне ім'я (його ліва частина) збігається з назвою організації, компанії або торговельної марки.

1.2.1 Аналіз інформаційної інфра структури

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

Такий підхід забезпечує вирішення трьох важливих завдань:

-аЗменшенняанавантаженняанаамережу.

-аЗменшенняавимогадоакомп'ютерів-клієнтам.

- Підвищення надійності і збереження логічної цілісності бази даних.

Тут додатки також виконуються, в основному, на робочих станціях. Додаток включає модулі для організації діалогу з користувачем і транзакції. Ядро СКБД є загальним для всіх робочих станцій і функціонує на сервері. Оператори звернення до СКБД (SQL-оператори), закодовані в транзакції, не виконуються на робочій станції, а пересилаються для обробки на сервер. Ядро СКБД транслює запит і виконує його, звертаючись для цього до індексів та іншим посередником даними. Назад на робочу станцію передаються тільки результати обробки оператора.

В сучасних СКБД на сервері можуть запускатися так звані збережені процедури і тригери, які разом з ядром СКБД утворюють сервер бази даних. До збереженх процедур можна звертатися з додатків на робочих станціях. Це дозволяє скоротити розмір коду прикладної програми і зменшити потік SQL-операторів з робочої станції, так як групу необхідних SQL-пропозицій можна закодувати в збереженій процедурі. Тригери - це програми, які виконуються ядром СУКД перед або після оновлення (UPDATE, INSERT, DELETE) таблиці бази даних. Вони дозволяють автоматично підтримувати цілісність бази даних. Модель сервера бази даних (БД) підтримують наступні СКБД: MySQL Oracle, Sybase, Informix, Ingress, Progress та ін.Причому на перші три СКБД припадають понад 80% ринку. СКБД розглянутого класу мають наступні переваги:

- Системи, розроблені на основі цих СКБД, мають високу продуктивність, так як по шині передаються тільки SQL-запити і результати з виконання; запити виконуються на високошвидкісних серверах.

- СКБД підтримують розподілену обробку.

- В рамках цих СКБД пропонується велика кількість сервісних продуктів, що полегшують розробку програм і створення розподіленої системи.

Дійсно, тепер сервер БД (у разі реляційних баз даних званий SQL-сервером) повертає клієнтського додатку те, що він переглянув в базі, а вона, в загальному випадку, дійсно становить малу частину від загального обсягу. Тому в мережі не спостерігається різкого збільшення навантаження при збільшенні числа клієнтів. Клієнтські ж програми можуть виконуватися на менш потужних (в порівнянні з сервером) комп'ютерах завдяки тому, що їм практично не потрібно виконувати ніякої додаткової обробки отриманих від сервера результатів запиту (хоча, звичайно ж, це не заборонено). Побічним ефектом зменшення навантаження на мережу є підвищення швидкості виконання додатків клієнтів. Крім того, система легше масштабується - легше і дешевше замінити один сервер на більш потужний, ніж десятки робочих станцій. Але ці СКБД мають і недоліки:

- Вони набагато дорожче СКБД попереднього класу, складні в освоєнні,

- Для ефективної роботи цих СКБД потрібні високошвидкісні (а тому і дорогі) сервери та мережі.

Але найбільш важливим результатом переходу в архітектуру клієнт-сервер є гарантоване збереження логічної цілісності бази даних, тобто система стає більш стійкою і більш захищеною. Досягається це завдяки можливості перекласти турботу про збереження цілісності бази на сервер. Для цього "хороші" сервери володіють великим набором вбудованих механізмів, що захищають систему від невірних дій клієнтів. Серед цих механізмів можна назвати такі як обмеження цілісності, декларативна посилальна цілісність, тригери, віртуальні таблиці (подання), авторизація користувачів і ін.[15]

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

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

- для функціонування сайту необхідно наступне програмне забезпечення:

- Операційна система - Windows XP і Windows Server 2003;

- Веб-сервер - Apache версії не нижче 1.3.26;

- СКБД - MySQL версії не нижче 3.23;

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

- Opera 10.0 і вище;

- Mozilla Firefox 9.0 і вижче;

- Chrome 18.0 і вижче;

- cайт повинен бути працездатний (інформація, розташована на ньому, повинна бути доступна) при відключенні в браузері підтримки flash і JavaScript.

Вимоги до технічного забезпечення:

- для функціонування сайту необхідно наступне технічне забезпечення з наступними мінімальними характеристиками:

- Процесор - Intel Pentium III 1 Ghz;

- Оперативна пам'ять - 512 Mb RAM;

- Жорсткий диск - 20 Gb HDD;

1.2.2 Особливості взаємодії компонентів інформаційної системи

Для пересилки даних по Інтернету використовується особливий набір правил, званий протоколом

Мережемвий протокомл в комп'ютерних мережах - заснований на стандартах набір правил, що визначає принципи взаємодії комп'ютерів в мережі. Протокол також задає загальні правила взаємодії різноманітних програм, мережевих вузлів чи систем і створює таким чином єдиний простір передачі. Хости (будь-який вузол мережі що відправляє або приймає дані через мережу називають хостом (host)) взаємодіють між собою. Для того, щоб прийняти і обробити відповідним чином повідомлення, їм необхідно знати як сформовані повідомлення і що вони означають. Прикладами використання різних форматів повідомлень в різних протоколах можуть бути встановлення з'єднання з віддаленою машиною, відправка повідомлень електронною поштою, передача файлів. Зрозуміло, що різні служби використовують різні формати повідомлень.

HTTP - протокол передачі даних, що використовується в комп'ютерних мережах.

Основним призначенням протоколу HTTP є передача веб-сторінок (текстових файлів з розміткою HTML), хоча за допомогою нього успішно передаються і інші файли, які пов'язані з веб-сторінками (зображення і застосунки), так і не пов'язані з ними (у цьому HTTP конкурує з складнішим FTP).

HTTP припускає, що клієнтська програма - веб-браузер - здатна відображати гіпертекстові веб-сторінки і файли інших типів в зручній для користувача формі. Для правильного відображення HTTP дозволяє клієнтові дізнатися мову і кодування веб-сторінки і/або запитати версію сторінки в потрібних мові/кодуванні,

HTTP - протокол прикладного рівня, схожими на нього є FTP і SMTP. Обмін повідомленнями йде за звичайною схемою «запит-відповідь». Для ідентифікації ресурсів HTTP використовує глобальні URI. На відміну від багатьох інших протоколів, HTTP не зберігає свого стану. Це означає відсутність збереження проміжного стану між парами «запит-відповідь». Компоненти, що використовують HTTP, можуть самостійно здійснювати збереження інформації про стан пов'язаний з останніми запитами і відповідями. Браузер, що посилає запити, може відстежувати затримки відповідей. Сервер може зберігати IP-адреси і заголовки запитів останніх клієнтів. Проте згідно з протоколом клієнт та сервер не мають бути обізнаними про попередні запити і відповіді, в протоколі не передбачена внутрішня підтримка стану і він не ставить таких вимог до клієнта та сервера.[17]

Кожен запит/відповідь складається з трьох частин:

1. Стартовий рядок;

2. Заголовки;

3. Тіло повідомлення, що містить дані запиту, запитаний ресурс або опис проблеми, якщо запит не виконано.

Обов'язковим мінімумом запиту є стартовий рядок. Починаючи з HTTP/1.1 обов'язковим став заголовок Host: (щоб розрізнити кілька доменів, які мають одну і ту же IP-адресу).

TCP/IP - це абревіатура терміну Transmission Control Protocol / Internet Protocol (Протокол керування передачею / міжмережевий протокол). Фактично TCP/IP не один протокол, а декілька. Саме тому ви часто чуєте, як його називають набором, або комплектом протоколів, серед яких TCP і IP - два основних. Фактично TCP/IP представляє цей базовий набір протоколів, відповідальний за розбивання вихідного повідомлення на пакети (TCP), доставку пакетів на вузол адресата(IP) і збирання (відновлення) вихідного повідомлення з пакетів (TCP).

Simple Mail Transfer Protocol (Простий Протокол Пересилання Пошти) -це протокол, який використовується для пересилання електронної пошти до поштового сервера або з клієнта-комп'ютера, або між поштовими серверами.

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

1.2.3 Аналіз програмних платформ робочих станцій та серверів

HTTP-сервер Apache, як правило, називають Apache є веб-сервер.

Apache розробляється і підтримується відкритим співтовариством розробників під егідою Apache Software Foundation. Сервер доступний для широкого спектру операційних систем, включаючи Unix, FreeBSD, Linux, Solaris, Novell NetWare, Mac OS X, Microsoft Windows, OS / 2, TPF і eComStation. Випущений під ліцензією Apache, Apache з відкритим вихідним кодом.

Apache підтримує безліч функцій, багато реалізовані у вигляді модулів, які розширюють базову функціональність. Вони можуть варіюватися від серверної підтримки мови програмування до схем аутентифікації. Деякі загальні мовні інтерфейси підтримують Perl, Python, Tcl і PHP. Популярні модулі аутентифікації включають mod_access, mod_auth, mod_digest і mod_auth_digest, mod_digest.Іінші функції включають протокол Secure Sockets Layer і Transport Layer Security підтримки (mod_ssl), проксі-модуль (mod_proxy), URL переписувачем (mod_rewrite), призначені для користувача файли журналів (mod_log_config) і фільтрація підтримки (mod_include і mod_ext_filter).

Популярні методи Apache включають зовнішній модуль розширення, mod_gzip, реалізована, щоб допомогти зменшити розмір (вагу) веб-сторінок,. ModSecurity є відкритим модулем виявлення вторгнень для веб-додатків. Apache - журнали можуть бути проаналізовані за допомогою веб-браузера з використанням вільних сценаріїв, таких як AWStats/W3Perl або відвідувачів.

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

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

Він підтримує аутентифікацію за паролем і цифрових сертифікатів. Apache має вбудовану пошукову систему і підтримує і HTML, FTP.

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

1.3 Аналіз предметної області

1.3.1 Сутність та атрибути предметно області

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

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

1. За способом сприйняття

2. За формою подання

3. За призначенням

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

Дата - це ознака інформації, яка визначає ступінь актуальності інформації в конкретних умовах.

Текст - загалом зв'язана i повнiстю послiдовна сукупнiсть знакiв. Мовлення як вид людської діяльності завжди зорієнтоване на виконання певного комунікативного завдання. Висловлюючи думки і почуття, людина ставить конкретну мету - щось повідомити, про щось переконати тощо. Існує багато визначень тексту.

Автор - це фізична особа, творчою працею котрої створено інформацію.

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

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

1.3.2 Побудова та характеристика зв'язків між сутностями

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

Для людини інформація поділяється на види залежно від типу рецепторів, що сприймають її:

1. Візуальна - сприймається органами зору. Ми бачимо все довкола.

2. Аудіальна - сприймається органами слуху. Ми чуємо звуки.

3. Тактильна - сприймається тактильними рецепторами.

За формою подання інформація поділяється на такі види:

1. Текстова - що передається у вигляді символів, призначених позначати лексеми мови;

2. Числова - у вигляді цифр і знаків, що позначають математичні дії;

3. Графічна - у вигляді зображень, подій, предметів, графіків;

4. Звукова - усна або у вигляді запису передачі лексем мови аудіальним шляхом.

За призначенням:

1. Масова - містить тривіальні відомості і оперує набором понять, зрозумілим більшій частині соціуму.

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

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

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

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

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

клієнтський комп'ютер серверний abobe dreamviewer

1.3.3 Визначення можливих станів об'єкта

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

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

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

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

Стани в яких перебуває користувач:

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

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

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

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

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

1.3.4 Побудова та аналіз ER - діаграми бази данних

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

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

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

Реляційна база даних- база даних, основана на реляційній моделі даних.. Для роботи з реляційними БД застосовують реляційні СКБД. Інакше кажучи, реляційна база даних - це база даних, яка сприймається користувачем як набір нормалізованих відношень різного ступеню. На рисунку 1.1 зображена реляційна схема бази данних, а на рисунку 1.2 її структурна схема



Рисунок 1.1 Реляційна схема бази данних

Рисунок 1.2 Структурна схема бази данних

Таблиця settings призначена для зберігання інформації яка буде статичною . Її структура описана в таблиці 1.1.

Таблиця 1.1-Структура таблиці settings

№ п/п	Назва	Тип	Опис	Призначення
1	id	int(5) (a_i) (primary key)	Номер сторінки	Номер сторінки в БД
2	page	varchar(255)	Назва сторінки	Назва сторінки в БД
3	title	varchar(255)	Назва(заголовок)	Заголовок сайту в БД
4	meta_d	varchar(255)	Опис сторінки	Опис сторінки сайту
5	meta_k	varchar(255)	Ключові слова	Ключові слова для сторінки сайту
6	text	text	Текст сторінки	Текст сторінки сайту

Таблиця categories призначена для зберігання інформації по категоріям. Поля таблиці categories та їх опис зведені в таблиці 1.2.

Таблиця 1.2 - Структура таблиці categories

№ п/п	Назва	Тип	Опис	Призначення
1	id	int(5) (a_i) (primary key)	Номер категорії	Номер категорії в БД
2	title	varchar(255)	Назва	Заголовок категорії в БД
3	meta_d	varchar(255)	Опис сторінки	Опис категорії
4	meta_t	varchar(255)	Ключові слова	Ключові слова
5	text	text	Текст	Текст категорії

Таблиця data призначена для зберігання інформації яка буде з неї витягуватися.Також з цієї бази данних інформацію будуть витягувати інші елементи навігації. Поля таблиці data та їх опис зведені в таблиці 1.3.

Таблиця 1.3 - Структура таблиці data

№ п/п	Назва	Тип	Опис	Призначення
1	id	int(5) (a_i) (primary key)	Номер стрінки	Номер стрінки в БД
2	date	varchar(255)	Дата	Дата розміщення
3	title	varchar(255)	Назва	Заголовок новини в БД
4	meta_d	varchar(255)	Опис сторінки	Опис сторінки новини
5	meta_t	varchar(255)	Ключові слова	Ключові слова
6	text	text	Текст	Текст новини
7	discription	varchar(255)	Опис	Короткий опис новини
8	cat	varchar(255)	Категорія	Категорія новини
9	view	varchar(255)	Перегляди	Кількість переглядів
10	author	varchar(255)	Автор	Автор новини

Таблиця comments призначена для зберігання коментарів, які розміщують користувачі. Поля таблиці comments та їх опис зведені в таблиці 1.4.

Таблиця 1.4-Структура таблиці categories

№ п/п	Назва	Тип	Опис	Призначення
1	id	int(5) (a_i) (primary key)	Номер	Номер коментаря в БД
2	post	int(5)	Номер новини	Номер новини в БД
3	author	varchar(255)	Автор	Автор коментаря
4	date	date	Ключові слова	Ключові слова
5	text	text	Текст	Текст коментаря

Таблиця comments_settings призначена для зберігання розміщення місця і суми з контрольної картинки. Поля таблиці comments_settings та їх опис зведені в таблиці 1.5.

Таблиця 1.5-Структура таблиці comments_settings

№ п/п	Назва	Тип	Опис	Призначення
1	id	int(5) (a_i) (p key)	Номер	Номер картинки в БД
3	img	varchar(255)	Картинка	Розміщення картинки
4	sum	int(5)	Сумма	Контрольна сумма

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

Таблиця 1.6-Структура таблиці userlist

№ п/п	Назва	Тип	Опис	Призначення
1	id	int(5) (a_i) (primary key)	Номер	Номер користувача в БД
3	user	varchar(255)	Корисутвач	Користувач
4	pass	varchar(255)	Пароль	Пароль користувача

Таблиця blogroll призначена для зберігання посилання на блоги-друзі. Поля таблиці blogroll та їх опис зведені в таблиці 1.7.

Таблиця 1.7-Структура таблиці blogroll

№ п/п	Назва	Тип	Опис	Призначення
1	id	int(5) (a_i) (primary key)	Номер	Номер посилання в БД
3	link	varchar(255)	Посилання	Посилання на сайт
4	title	varchar(255)	Заголовок	Заголовок сайту

1.3.5 Розробка специфікації вимог до програмної системи

Специфікація вимог до програмного забезпечення - це повний опис поведінки системи що розробляється. Вона включає множину прецедентів які описують всі взаємодії, які користувачі мають з програмним забезпеченням. Прецеденти також відомі як функціональні вимоги. На додачу до прецедентів специфікація також включає нефункціональні (чи додаткові) вимоги. Нефункціональні вимоги є вимогами які накладають обмеження на проект, чи реалізацію (такі як вимоги інженерії продуктивності, стандарти якості, чи обмеження проектування).[18]

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

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

Виявлення вимог: задача комунікації з користувачами для визначення їх вимог.

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

Запис вимог: Вимоги можуть документуватись в різних формах, таких як опис звичайною мовою, прецедентами, користувацькими історіями, чи специфікаціями процесу.

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

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

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

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

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

Етапу розробки вимог, можливо, передувало техніко-економічне обгрунтування, або концептуальна фаза аналізу проекту. Фаза розробки вимог може бути розбита на виявлення вимог (збір, розуміння, розгляд та з'ясування потреб зацікавлених осіб), аналіз (перевірка цілісності і закінченості), специфікація (документування вимог) та перевірка правильності.

1.4.2 Аналіз існуючих рішень щодо побудови архітектури програмного забезпечення

Архітектурні шаблони програмного забезпечення -- це шаблони програмного забезпечення, що являють собою звіт «добрих практик» вирішення архітектурних проблем розробки програмного забезпечення. Архітектурні шаблони виражають фундаментальну схему структурної організації певної програмної системи. Така схема складається із визначених наперед підсистем, а також точно визначає їхні сфери відповідальності та взаємовідносини.[16]

На відміну від шаблонів проектування, архітектурні шаблони мають ширший масштаб. Основними елементами структури архітектурних шаблонів є не класи й об'єкти, а умовні частини (підсистеми) програмної системи.

- Приклади архітектурних шаблонів:

- Модель-вид-контролер

- Представлення-абстракція-управління

- Клієнт-серверна архітектура

- Три-ярусна архітектура

- Сервісно-орієнтована архітектура

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

У комп'ютерних технологіях трирівнева архітектура, синонім триланкова архітектура (англ. three-tier або Multitier architecture) передбачає наявність наступних компонент програми: клієнтський додаток (зазвичай говорять «тонкий клієнт» або термінал), підключений до сервера застосунків, який в свою чергу підключений до серверу бази даних.

Переваги:

1. У порівнянні з клієнт-серверною або файл-серверною архітектурою можна виділити наступні переваги трирівневої архітектури:

2. Масштабованість

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

4. високий рівень безпеки

5. висока надійність

6. низькі вимоги до швидкості каналу (мережі) між терміналами і сервером додатків

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

Недоліки

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

1. Більш висока складність створення додатків

2. Складніша у розгортанні і адмініструванні

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

4. високі вимоги до швидкості каналу (мережі) між сервером бази даних і серверами додатків.

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

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

Мета шаблону -- гнучкий дизайн програмного забезпечення, який повинен полегшувати подальші зміни чи розширення програм, а також надавати можливість повторного використання окремих компонент програми. Крім того використання цього шаблону у великих системах призводить до певної впорядкованості їх структури і робить їх зрозумілішими завдяки зменшенню складності.[16]

Архітектура клієнт-сервер є одним із архітектурних шаблонів програмного забезпечення та є домінуючою концепцією у створенні розподілених мережних застосувань і передбачає взаємодію та обмін даними між ними. Вона передбачає такі основні компоненти:

- набір серверів, які надають інформацію або інші послуги програмам, які звертаються до них;

- набір клієнтів, які використовують сервіси, що надаються серверами;

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

Сервери є незалежними один від одного. Клієнти також функціонують паралельно і незалежно один від одного. Немає жорсткої прив'язки клієнтів до серверів. Більш ніж типовою є ситуація, коли один сервер одночасно обробляє запити від різних клієнтів; з другого боку, клієнт може звертатися то до одного сервера, то до іншого. Клієнти мають знати про доступні сервери, але можуть не мати жодного уявлення про існування інших клієнтів.

Модель клієнт-серверної взаємодії визначається перш за все розподілом обов'язків між клієнтом та сервером. Логічно можна виокремити три рівні операцій:

1. Рівень представлення даних, який по суті являє собою інтерфейс користувача і відповідає за представлення даних користувачеві і введення від нього керуючих команд;

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

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

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

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

2. Модель товстого клієнта, в якій сервер тільки керує даними, а обробка інформації та інтерфейс користувача зосереджені на стороні клієнта. Товстими клієнтами часто також називають пристрої з обмеженою потужністю: кишенькові комп'ютери, мобільні телефони та ін.

Типовим прикладом клієнт-серверної взаємодії є WWW. Існує величезна кількість веб-серверів, на яких розміщується та чи інша інформація. У найпростішому випадку ця інформація являє собою набір веб-сторінок, які можуть зберігатися на сервері у вигляді файлів, розмічених за допомогою мови розмітки HTML. Але ситуація, як правило, є більш складною; значна частина веб-ресурсів на сучасному етапі є динамічними, тобто вони не існують в заздалегідь підготовленому вигляді, а створюються безпосередньо в процесі обробки запиту від користувача.

Для того, щоб людина, яка працює в Інтернеті, могла переглянути ту чи іншу сторінку, на її комп'ютері повинно бути встановлено відповідне програмне забезпечення. Програми для перегляду веб-сторінок називаються браузерами (веб-оглядачами). Найпоширенішим браузером є Internet Explorer.

Але, крім браузерів, до серверів можуть звертатися і інші клієнти, а саме - автономні програми. Вони можуть передбачати взаємодію з людиною, а можуть працювати в цілком автоматичному режимі. Типовим класом таких програм є роботи, призначені для автоматичного перегляду веб-ресурсів. Зокрема, роботи є важливим елементом пошукових систем і використовуються ними для перегляду сторінок і збору інформації про них.[16]

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

1.4.2 Обгрунтування вибору архітектури програмної системи

Архітектура клієнт-сервер застосовується у великому числі мережевих технологій, що використовуються для доступу до різних мережевих сервісів. Коротко розглянемо деякі типи таких сервісів (і серверів):

Web-сервери.

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

Сервери додатків.

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

Сервери баз даних.

Сервери баз даних використовуються для обробки користувальницьких запитів на мові SQL. При цьому СУБД знаходиться на сервері, до якого і підключаються клієнтські програми.

Файл-сервери.

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

Проксі-сервер.

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

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

Файрволи (брандмауери)

Міжмережеві екрани, що аналізують і фільтруючі проходить мережевий трафік, з метою забезпечення безпеки мережі.

Поштові сервери

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

Сервери віддаленого доступу (RAS)

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

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

Отже, основна ідея архітектури «клієнт-сервер» полягає в поділі мережевого програми на декілька компонентів, кожен з яких реалізує специфічний набір сервісів. Компоненти такого додатки можуть виконуватися на різних комп'ютерах, виконуючи серверні та / або клієнтські функції. Це дозволяє підвищити надійність, безпеку і продуктивність мережевих додатків і мережі в цілому.[16]

1.4.3 Сутність та атрибути предметно області

Сутністю предметної області полягає в процедурному програмуванні. Процедурне (імперативне) програмування є відображенням архітектури традиційних ЕОМ. Виконання програми зводиться до послідовного виконання операторів з метою перетворення початкового стану пам'яті, тобто значень вихідних даних, в заключне, тобто в результати. Таким чином, з точки зору програміста є програма і пам'ять, причому перша послідовно оновлює вміст останньої.

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

При розробці сайту використовуються наступні функції для роботи з базою даних MySQL:

mysql_connect - Створює підключення з сервером MySQL.

Дана функція повертає вказівник на з'єднання з MySQL у випадку успішного виконання, або FALSE при невдачі.

mysql_select_db - Вибирає базу данних MySQL.

Повертає TRUE у разі успішного завершення або FALSE в разі виникнення помилки.

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

mysql_query - Посилає запит MySQL.

Ця функція надсилає запит активної базі даних сервера, на який посилається переданий покажчик. Якщо параметр link_identifier опущений, використовується останнє відкрите з'єднання. Якщо відкриті з'єднання відсутні, функція намагається з'єднатися з СКБД, аналогічно функції mysql_connect () без параметрів. Результат запиту буфферізіруется.

mysql_fetch_array - Обробляє ряд результату запиту, повертаючи асоціативний масив, чисельний масив або обидва. Ця функція повертає масив з обробленим рядом результату запиту, або FALSE, якщо рядів більше немає.

1.5 Обгрунтування вибору технологій та середовищ реалізації програмної системи

1.5.1 Аналіз можливостей та вибір оптимального середовища реалізації програмної системи

На сьогоднішній день є три основні мови програмування, на якій може бути здійснена розробка даного сайту: HTML, PHP i Flash.

1. HTML (від англ. Hypertext Markup Language -- «мова розмітки гіпертексту») -- стандартна мова розмітки документів у Всесвітній павутині. Більшість веб-сторінок створюються за допомогою мови HTML (або XHTML). Мова HTML інтерпретується браузером і відображується у вигляді документа, в зручній для людини формі[10].

2. PHP (англ. PHP: Hypertext Preprocessor -- «PHP: препроцесор гіпертексту», англ. Personal Home Page Tools (застар.) -- «Інструменти для створення персональних веб-сторінок») -- мова програмування, створена для генерування html-сторінок на веб-сервері-сервері і роботи з базами даних. В даний час підтримується переважною більшістю хостингу-провайдерів. Входить в LAMP -- поширений набір для створення веб-сайтів (Linux, Apache, MYSQL, PHP (Python або Perl))[9].

3. Adobe Flash, або просто Flash називають формат SWF (Shockwave Flash, виголошується ”swifi”) Adobe Flash Player, Adobe Flash Professional, програму розробки мультимедійного контента для платформи “Adobe Engagement Platform” (такого, як веб-додатки, ігри і мультфільми)[11].

З цих трьох мов найоптимальнішим варіантом буде мова програмування PHP,бо:

1. Має більше можливостей, ніж мова HTML, і не така вимоглива до ресурсів процесора як Flash.

2. Відносна схожість з Perl та іншими мова програмування в плані синтаксису команд.

3. Для відображення елементів написаних на PHP не потрібно ставити ніяких додаткових плагінів чи програм.

Головним чинником мови РНР є практичність. РНР надає ресурси для швидкого розв'язання поставлених завдань. Практичний характер РНР обумовлений п'ятьма важливими характеристиками:

- традиційністю;

- простотою;

- ефективністю;

- безпекою;

- гнучкістю.

Недоліки PHP:

1. PHP є інтерпретованою мовою, і, як наслідок, неспроможна зрівнятися за швидкістю з компільованим С.

2. Не така велика база готових модулів, як, наприклад, СPAN у Perl[1].

Серед багатьох СКБД було вибрана MySQL. MySQL - вільна система управління базами даних (СКБД). MySQL є власністю компанії Sun Microsystems. Поширюється під GNU General Public License.

MySQL призначена для роботи в малих та середніх додатках. Зазвичай MySQL використовують у ролі серверу, до якого звертаються локальні чи віддалені клієнти, однак у дистрибутив входить бібліотека внутрішнього серверу, що дозволяє включати MySQL в автономні програми[5].

Гнучкість СУБД MySQL забезпечується підтримкою великої кількості типів таблиць: користувачі можуть вибрати, як таблиці типу MyISAM(які підтримують повнотекстовий пошук) так і таблиці InnoDB(підтримують транзакції лише на рівні окремих записів). Крім того, в СКБД MySQL входить спеціальний тип таблиць EXAMPLE, демонструючи принципи створення нових типів таблиць. Завдяки відкритій архітектурі й GPL-лицензуванню, в СКБД MySQL постійно з'являються нові типи таблиць.

MySQL має подвійне ліцензування. MySQL може поширюватися відповідно до умовами ліцензії GPL. Проте за умовами GPL, якщо якась програма включає вихідні коди MySQL, вона також має поширюватися за ліцензією GPL. Це може не співпадати з планами розробників, котрі не хочуть відкривати вихідні тексти своїх програм. Для таких випадків передбачена комерційна ліцензія компанії MySQL AB, що забезпечує якісну сервісну підтримку[2].

CSS (анг. Cascading Style Sheets -- каскадні таблиці стилів) -- технологія опису зовнішнього вигляду документа, написаного мовою розмітки. Переважно використовують як засіб оформлення Web-сторінок в форматі HTML і XHTML, проте може застосовуватися із будь-якими видами документів у форматі XML, включаючи SVG і XUL.

CSS використовується творцями Web- сторінок для задання кольорів, шрифтів, розташування і інших аспектів приставленого документа. Основною метою розробки CSS був поділ вмісту (написаного HTML чи будь-якою іншою мовою розмітки) і представленого документа (написаного CSS). Це поділ може збільшити доступність документа, надати більшої гнучкості і можливість управління його поданням, і навіть зменшити складність і повторюваність в структурному вмісті. Крім того, CSS дозволяє представляти один і той же документ у різних стилях чи методах виведення, як екранне представлення, печатку, читання голосом (спеціальним голосовим браузером чи програмою читання з екрана), або при виведенні пристроями, використовуючи Шрифт Брайля.

CSS при відображенні сторінки , може бути взятий з різних джерел:

- Авторські стилі (інформація стилів, надана автором сторінки) як:

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

* Вбудованих стилів -- блоків CSS всередині HTML-документа.

* Inline-стилей, коли у HTML-документі інформація стилю на однин елемент вказується у його атрибуті style.

- Користувальні стилі

* Локальний CSS-файл, зазначений користувачем в настройках браузера, переосмислює авторські стилі, і застосовує їх до всім документів.

- Стиль браузера

* Стандартний стиль, використовуваний браузером за-замовчуванням для виводу елементів.

Стандарт CSS визначає пріоритети, в порядку яких застосовуються правила стилів, для якогось елемента підходять кілька правил одночасно. Це називається «каскадом», у якому для правил розраховуються пріоритети, що робить результати передбачуваними.

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

Схематично це можна зобразити так:

селектор, селектор {

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

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

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

Наприклад:

p {

font-family: "Garamond", serif;

}

h2 {

font-size: 110 %;

color: red;

background: white;

}

note {

color: red;

background: yellow;

font-weight: bold;

}

p#paragraph1 {

margin: 0;

}

a:hover {

text-decoration: none;

}

#news p {

color: blue;

}

Тут наведено шість правил із селекторами p, h2, .note, p#paragraph1, a:hover і #news p.

У перших двох правилах HTML-елементам p (параграфу) і h2 (заголовку другого рівня) призначаються стилі. Параграфи відбиватимуться шрифтом Garamond, чи, якщо такий шрифт недоступний, якимось іншим шрифтом з засічками («serif»). Заголовок другого рівня вказуватиметься червоним кольором на білому фоні зі збільшеними літерами.

Третє правило буде застосовано до елементів, атрибут class яких містить слово 'note'. Наприклад:

<p class="note">Цей параграф виведуть напівжирним шрифтом червоного кольору на жовтому фоні.</p>

Четверте правило застосовуватиметься лише для елементів p, атрибут id яких дорівнює paragraph1. Такі елементи не будуть мати зовнішніх відступів (margin).