Основи web сайти, навігатори і навігація, контент-платформа
ОСНОВИ WEB: САЙТИ, НАВІГАТОРИ І НАВІГАЦІЯ
Цей курс для тих, хто налаштований освоїти HTML (мова конструювання сайтів), а головне, прийняти на озброєння ті правила дизайну, які не просто збільшують число відвідувачів гіпертекстових сторінок, але і покращують "екологію" глобальної інформаційної мережі. У сучасному світі вибухнув справжній бум сайтобудування. Свої сторінки в Інтернеті мають всі: державні установи, великі компанії, дрібні підприємці, магазини, бібліотеки, школи, садки, ясла, ПрезідентУкаіни і Петро Мячиков. Ймовірно, і ви роздумуєте про це!
Справді, чому б ні? В Інтернет приймають всіх! Ви теж можете побудувати свій власний віртуальний будинок. Або разом з друзями звити затишне гніздечко для своєї школи, а потім ходити один до одного в гості.
Якими знаннями та вміннями потрібно володіти, щоб успішно освоїти пропонований курс?
Передбачається, що початківець конструктор вміє:
Ø запускати комп'ютерна програма і завершувати його роботу;
Ø перемикатися між екранними вікнами додатків і переносити інформацію через буфер обміну з одного вікна в інше;
Ø писати і редагувати тексти на комп'ютері;
Ø редагувати графічну інформацію;
Ø ну, і де-не-що ще зі звичайного багажу користувача домашнього комп'ютера.
Ніяких попередніх знань з HTML, проектування сайтів, дизайну, а також програмування не передбачається.
Перша лекція містить вступний матеріал. Вона описує web-простір для початківця користувача - людини, який, не відстаючи від технічного прогресу, має намір використовувати Інтернет у своїй повсякденній діяльності.
Web-простір - це світова сукупність сайтів. Сайт розташований на сервері, сервери з'єднані між собою за допомогою каналів зв'язку.
Сайт - це сукупність гіпертекстових сторінок (частіше має деревоподібну структуру) для представлення підприємства, фірми (корпоративні сайти), для уявлення шкіл (шкільні сайти), приватних
осіб (особисті сайти). Сайт може здійснювати комерцію (інтернет-магазини), поставляти інформаційні послуги (сайти для пошуку інформації,
бібліотеки, довідкові системи, списки розсилки, навчання). У сучасному світі сайт стає візитною карткою. як організації, так і приватної особи.
Гіпертекстові сторінки, які складають сайт, записуються на спеціальному мові HTML (Hyper Text Markup Language - "Ейч-ти-em-el", або "аш-те-ем-ель", використовується англійська або латинська транскрипція). Ця мова не є, строго кажучи, мовою програмування, хоча він і інтерпретується браузером. Засоби HTML служать для вказівок браузеру, в якому вигляді виводити на екран текст і графіку, а також дозволяють записувати на сторінках гіперпосилання.
HTML-розмітка (на відміну, наприклад, від Word-розмітки) досить терпима до різних платформ, операційних систем і потужностей комп'ютера. Це дозволяє використовувати її як основу для побудови сайтів в Інтернеті, де різноманітність платформ, ОС і комп'ютерів дуже велике.
Сайти дивляться за допомогою браузера - спеціальної комп'ютерної програми.
Чутливої областю може бути фрагмент тексту (зазвичай він виділяється, синім кольором і підкресленням), картинка або фрагмент картинки. Попадання курсора миші в область дії гіперпосилання легко побачити - він змінює свою форму на вказуючий перст.
Відповідно, розробники браузерів додають в свої продукти кошти підтримки цих нових гіпертекстових технологій.
Останнім часом стає модним мати в автомобілі бортовий комп'ютер з інтернет-зв'язком. Так як очі користувача зайняті дорогою, до браузеру підключають мовний синтезатор.
З великого числа існуючих браузерів найбільш популярним є Microsoft Internet Explorer (близько 90% користувачів). Його надпопулярність в основному пояснюється тим, що цей браузер входить до складу операційної системи Windows і тому не вимагає додаткових коштів і зусиль по установці на комп'ютері.
Управління браузером Microsoft Internet Explorer (версія 6.0)
При запуску браузера відкривається вікно (рис. 1), яке містить:
Мал. 8. Вкладка Загальні панелі настройки браузера
Якщо вас цікавить тільки текстова інформація сторінки, а на графіку ви не хочете витрачати час і гроші, зніміть прапорець в рядку "Відображати малюнки".
Мал. 9. Пункт "Відображати малюнки"
Розглянемо пристрій сайту на прикладі
У вікні браузера з завантаженим сайтом можна виділити наступні важливі елементи (рис. 11):
Ø Заголовок вікна. Заголовок вікна збігається з заголовком сторінки.
Ø Тема сайту. Розташований в самому верху сторінки.
Ø Логотип. Зазвичай розташований в лівому верхньому кутку сторінки. На друге сторінках логотип є посиланням на Головну (початкову) сторінку.
Ø Горизонтальний навігаційне меню сайту. Зазвичай розташовується під заголовком сайту.
Ø Вертикальне навігаційне меню. Зазвичай розташовується під логотипом.
Мал. 11. Елементи гіпертекстового документа
Сайт складається з сторінок
Як і друковане видання, наприклад книга, сайт складається з сторінок. Сторінки сайту - це файли з розширенням htm (html). Сторінку сайту часто називають документом. Як і книга, сайт має одну головну сторінку (вхідні
На відміну від звичайної книги сторінки сайту рідко перегортаються по порядку. Завдяки гіпертекстових переходах користувач переходить зі сторінки на сторінку з контексту (за змістом, за потребою отримати тільки ту інформацію, яка відноситься до цікавої теми).
Спробуйте в браузері, підключеному до Інтернету, перейти на сайт *****
Сайти з ієрархічною структурою
Користувач бачить повне логічне будова сайту і має можливість одним клацанням потрапити на будь-яку сторінку (рис. 12).
Мал. 12. Карта сайту
Системи навігації по сайту
Переміщення по сайту (навігація) має бути організовано зрозуміло і зручно для користувача. При цьому прийоми навігації на правильних сайтах єдині для всіх його сторінок. Виняток становить випадок, коли сайт має самостійні підсайти - на них може бути використана власна навігаційна схема.
Навігація є зручною, якщо на будь-якій сторінці сайту можна легко відповісти на три питання.
Ø Де я? Користувач однозначно розуміє, де всередині сайту він знаходиться.
Ø Куди я можу піти? З кожної сторінки є можливість потрапити на будь-яку іншу, минаючи Головну.
Ø Де меню? Користувачеві не доводиться прокручувати сторінку, щоб отримати доступ до навігаційних елементів.
Перераховані нижче книги будуть дуже корисні для роботи на курсах: