ОСНОВИ БУДУВАННЯ САЙТІВ (книга)

ЗМІСТ

ВСТУП    5

Розділ 1. ОСНОВИ ПРОЕКТУВАННЯ ВЕБ-САЙТУ    6

МЕТА СТВОРЕННЯ САЙТУ    6

ОРГАНІЗАЦІЯ ГОЛОВНОЇ СТОРІНКИ    13

СТВОРЕННЯ ВЛАСНОГО СТИЛЮ САЙТУ    16

СТВОРЕННЯ ВЕБ-СТОРІНОК ДЛЯ МОНІТОРІВ З РІЗНОЮ РОЗДІЛЬНОЮ ЗДАТНІСТЮ    26

ПРАКТИЧНИЙ WEB-ДИЗАЙН    29

РЕДАКТОРИ ДЛЯ ВЕРСТКИ ВЕБ-СТОРІНОК    29

ВЕРСТКА САЙТУ    31

ОПТИМІЗАЦІЯ ЗОБРАЖЕНЬ У ФОРМАТІ GIF I JPEG    32

СТВОРЮЄМО САЙТ    37

ГІПЕРТЕКСТ    37

WORLD WIDE WEB    37

HYPERTEXT MARKUP LANGUAGE (HTML)    38

ПРОГРАМИ ПЕРЕГЛЯДУ ІНФОРМАЦІЇ В ІНТЕРНЕТ (БРАУЗЕРИ)    44

ОГЛЯД СУЧАСНИХ HTML-РЕДАКТОРІ В    46

СТВОРЕННЯ HTML-СТОРІНКИ    51

СТВОРЕННЯ НАЙПРОСТІШОГО HTML-ДОКУМЕНТА    52

МОДИФІКАЦІЯ HOME-СТОРІНКИ    56

РОБОТА З ТЕКСТОМ    56

СТВОРЕННЯ ФРЕЙМІВ    63

ГРАФІКА І ЗВУК УДОКУМЕНТАХ HTML    73

ВСТАВКА ГРАФІЧНИХ ЗОБРАЖЕНЬ    73

ВСТАВКА ЗВУКУ В ДОКУМЕНТ HTML    76

ВИКОРИСТАННЯ JAVASCRIPT НА ПРАКТИЦІ    77

JAVASCRIPT: НЕОБХІДНО ЗНАТИ    77

ВМІЩЕННЯ JAVASCRIPT В HTML-СТОРІНКИ    78

ОСНОВНІ ПОНЯТТЯ JAVASCRIPT    79

ОГЛЯД ВБУДОВАНИХ ОБ’ЄКТІВ JAVASCRIPT    88

DHTML ТА ОБ’ЄКТНА МОДЕЛЬ INTERNET EXPLORER    93

DHTML I JAVASCRIPT (7 ПРАКТИЧНИХ ПРИКЛАДІВ)    94

КОРИСНІ ПОСИЛАННЯ    98

КАСКАДНІ СТИЛІ CSS    99

СТИЛІ: ІНСТРУМЕНТ ДЛЯ СУЧАСНИХ ВЕБ-ДИЗАЙНЕРІВ    101

ІМПОРТУВАННЯ СТИЛІВ    104

РОБОТА ІЗ САЙТОМ    110

ЯК ОРГАНІЗУВАТИ ПОШУК НА САЙТІ    110

ЯК ОРГАНІЗУВАТИ «РОЗКРУТКУ» САЙТУ    112

ОПТИМІЗАЦІЯ САЙТУ    113

ОПТИМІ3АЦІЯ КОНТЕНТУ САЙТУ    113

ОПТИМІЗАЦІЯ ДЛЯ ПОШУКОВОЇ СИСТЕМИ YANDEX    114

ОПТИМІЗАЦІЯ ДЛЯ ПОШУКОВОЇ СИСТЕМИ RAMBLER    114

ТЕХНОЛОГІЯ ПОШУКУ GOOGLE    115

ЗМІСТ САЙТУ    115

КОРИСНІ ПОСИЛАННЯ ДЛЯ ВИКЛАДАЧІВ ШКІЛ    116

ВСТУП

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

Веб-сторінка це логічна одиниця Інтернету, однозначно обумовлена адресою. Можна сказати, що Інтернет складається із сайтів, а сайти, у свою чергу — зі сторінок. URL — це адреса сторінки в Інтернеті. URL складається з доменного імені, шляхів до сторінки на сайті та назви файла сторінки. Наприклад: www.dlab.kiev.ua/index.html/. Тут www.dlab.kiev.ua — доменне ім’я сайту, index.html—ім’я файла. Як правило, файли, що містять веб-сторінки, мають розширення .htm або .html. Коли говорять «адреса сайту», мають на увазі його доменне ім’я, при звертанні до якого завантажується стартова сторінка сайту.

За міжнародною згодою кожній країні в Інтернеті зарезервоване деяке кодове позначення довжиною у 2—3 літери, що називається доменом першого рівня або доменом цієї країни. Так, наприклад, якщо адреса сайту закінчується на иа — сайт знаходиться в домені України, .fr — Франції, .de — Німеччини. До того ж, існують деякі домени першого рівня, пов’язані не з географією, а зі спрямованістю сайту — наприклад, .com для комерційних, .org для некомерційних, .edu для освітніх організацій.

Розділ 1. ОСНОВИ ПРОЕКТУВАННЯ ВЕБ-САЙТУ

МЕТА СТВОРЕННЯ САЙТУ

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

Проектування сайту зазвичай передбачає такі кроки:

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

  • домашня сторінка;
  • сайт школи;
  • освітній портал.

Як правило, якісний шкільний сайт:

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

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

    Структура шкільного сайту може бути такою:

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

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

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


    Рис. 1.1. Приклад веб-сторінки шкільного сайту

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

    Лінійна структура це найпростіша структура сайту. Веб-сторінки йдуть одна за одною, і користувач має переглядати їх як слайд-шоу (рис. 1.2 на с. 8). У лінійній структурі не існує поділу контенту на рівні. Всі сторінки на таких сайтах рівноправні, і їх має побачити кожний відвідувач. Незважаючи на простоту реалізації лінійної структури, недоліків у неї набагато більше, ніж переваг. А тому сфера її застосування чітко обмежена: вона може використовуватися на сайтах-презентаціях і в онлайнових навчальних посібниках.


    Рис. 1.2. Лінійна структура сайту

    Лінійну структуру реалізувати нескладно. Найпростіший варіант сайту — набір HTML-сторінок, в кожної з яких є посилання на наступну і попередню (винятком є крайні сторінки).

    ЗАВАНТАЖИТИ

    Для скачування файлів необхідно або Зареєструватись

    Osnovy Bud Sajtiv (2.0 MiB, Завантажень: 1)

Сторінка: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30
завантаження...
WordPress: 24.12MB | MySQL:26 | 0,352sec