Практичне заняття 1
«Створення алгоритму розробки web-сторінки»
1.1 Ознайомитися з логічної і фізичної структурою сайту, елементами веб-сторінки.
1.2 Навчитися будувати логічну і фізичну структуру сайту.
Пояснення до роботи
2.1 Короткі теоретичні відомості
Логічна і фізична структура сайту
Подібний набір тематичних рубрик з розподіленими за відповідними розділами документами і заздалегідь спроектованими гиперсвязями між усіма сторінками ресурсу і називається логічною структурою сайту.
Приклад порівняння логічної і фізичної структур одного і того ж ресурсу Інтернету показаний на рис. 1.1.
Мал. 1.1. Порівняння логічної і фізичної структури сайту
Очевидно, що логічна і фізична структури можуть не збігатися, оскільки в загальному випадку фізична структура ресурсу розробляється, виходячи зі зручності розміщення файлів. Однак більш-менш точне збереження порядку проходження логічних розділів у фізичній структурі сайту дозволить вам уникнути плутанини при подальшому доповненні і оновленні матеріалів.
Порада: Рекомендується розміщувати всі графічні зображення, які є елементами проекту, в окремій папці з назвою «Images», розташованої в кореневій директорії сайту. Такий підхід дозволить оновлювати зберігаються в інших тематичних розділах документи HTML без перенесення графіки, використовувати одні і ті ж графічні файли у всіх розділах сайту і при необхідності видаляти цілі директорії.
Для того щоб все гіперпосилання на вашій домашній сторінці або web-сайті працювали коректно, всі документи відкривалися правильно, і броузер не видавав помилок при зверненні до будь-яких розділах ресурсу, при створенні його фізичної структури слід дотримуватися кількох простих правил:
1.Назначайте імена директорій, імена і розширення документів HTML і графічних файлів з використанням символів тільки латинського алфавіту і тільки в рядковому регістрі. Намагайтеся, щоб імена створених вами файлів і директорій не перевищували по довжині восьми символів.
2. При присвоєння імен файлів документів HTML намагайтеся стежити за тим, щоб ці імена були «смисловими»: згодом ви легко можете забути вміст і призначення будь-якої web-сторінки, якщо імена файлів будуть виглядати, наприклад, як l.htm, 2 .htm, 3.htm і т. д.
Для того щоб полегшити процес оновлення web-сторінок, додатки розділів або створення нових рубрик, заведіть засіб документування проекту - будь-яку електронну таблицю, створену, наприклад, в Microsoft Excel, або просто розграфлену зошит, в яку записуйте відповідність елементів фізичної структури вашого проекту його логічної структурі. До тих пір поки кількість складових ваш сайт файлів відносно мало, це може бути зайвим, коли ж воно перевалить за перші два десятка, в достатку html-документів і графічних елементів буде легко заплутатися, особливо якщо ви створюєте кілька проектів одночасно. Приклад оформлення такого засобу документування показаний в табл. 1.1.
Таблиця 1.1. Приклад оформлення засоби документування проекту
Стає очевидним, що фізична структура сайту прихована від відвідувачів вашого ресурсу: вони можуть спостерігати тільки логічну структуру, причому саме так, як вона представлена за допомогою елементів навігації. Звідси випливає цілком логічний висновок: будова системи навігації має якщо не повністю повторювати, то хоча б максимально відповідати розробленої вами логічну структуру сайту.