Структура веб-сайту

Міністерство  Освіти Та Науки України

Криворізька Гімназія №95

 

 

 

 

 

 

 

 

 

 

 

Реферат на тему

«Структура веб-сайту»

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Виконала:

Пілецька Марія Вікторівна

11 - Б клас

                

 

 

 

 

 

Кривий Ріг – 2013

 

Зміст

 

Структура веб-сайтів.

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

Веб-сайт— сукупність веб-сторінок, доступних в Інтернеті, які об'єднані як за змістом, так і навігаційно.

Фізично сайт може розміщуватися як на одному, так і на кількох серверах.

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

Структура веб-сайтів.

1. Головна сторінка
2. Меню сайту
3. Гіперпосилання на інші сторінки або сайти

 

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

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

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

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

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

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

• Стандартна

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

• Каскад

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

• Хмарочос

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

• Павутина

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

Етапи створення сайту

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

1. Попередній етап розробки сайту(на цьому етапі розв'язуються питання загального характеру. Обговорюється загальна концепція сайту, формулюються та фіксуються цілі створення сайту)
2. Етап проектування сайту(Визначення структури сайту: меню, посилання, розміщення модулів, побудова списку компонентів, що підключаються, тощо)
3. Етап розробки й тестування сайту.
4. Розміщення сайту.
5. Розвиток ресурсу.

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

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

Хостинг. Засоби автоматизованої розробки веб-сайтів

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

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

Можливість  створювати веб-сторінки та організовувати форуми й чати в автоматизованому режимі (крім власне розміщення сайту) часто надається на серверах, що забезпечують хостинг. Наприклад, ucoz.ru, mylivepage.com.

 

Веб хостинг UcoZ

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

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

Під час реєстрування користувачеві  надається можливість вибрати домен для свого проекту. В системі існують також і домени, спеціально розраховані на українську аудиторію — name.ucoz.ua, name.at.ua.

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

Основні можливості

1. Користувачу пропонується багато дизайнів на вибір, які можна використати для побудови сайту.
2. Можливість створити власний дизайн (шаблон) або переробити будь-який зі стандартних.
3. Доступ по FTP.
4. Безкоштовна технічна підтримка.
5. WYSIWYG online редактор.
6. Візуальний конструктор блоків.
7. Версія сайту для КПК.
8. Резервне копіювання.
9. Лайтбокс — рекламний щит.
10. Загальна авторизація — uID. Модулі системи
11. Користувачі — керування списком користувачів сайту.
12. Форум — створення та керування форумами.
13. Щоденник (блог) — створення та керування блогом.
14. Фотоальбоми — створення фотоальбомів.
15. Гостьова книга — керування гостьовою книгою.
16. Каталог статей — керування статтями на сайті.
17. Міні-чат — модуль для маленьких повідомлень, які можуть містити смайлики.
18. Шаблони — модуль містить дизайни на будь-який смак.
19. Новини сайту — модуль, що дозволяє користувачеві слідкувати за оновленням сайту.
20. Інтернет-статистика — перегляд статистики відвідувань сайту.
21. Каталог файлів — каталог файлів, які були додані користувачами сайту.
22. Каталог лінків — список веб-адрес, які були додані користувачами сайту.
23. Оголошення — створення дошки оголошень.
24. FAQ — список найчастіших запитань та відповідей на них.
25. Опитування — опитування різного спрямування.
26. E-mail форми — організація зворотного зв'язку з адміністрацією сайту.
27. Онлайн-ігри — модуль, у якому представлені ігри різних напрямків — від стратегій до настільних ігор.
28. Інтернет-магазин — модуль системи, який є оптимальним рішенням у галузі електронної торгівлі.

Технологія створення  сайту в системі UcoZ

В Інтернет-браузері відкриваємо сторінку www.ucoz.ua. Натискаємо на кнопці Створити сайт. Потрапляємо на реєстраційну форму користувача, яку заповнюємо, відповідно до запропонованих запитань.

Наступний крок — натиснути на кнопці Реєстрація.

Після заповнення форми ви отримаєте  глобальний профіль у системі uNet, що дасть вам можливість створювати будь-яку кількість сайтів у системі UcoZ.

Якщо всі дані введено правильно, ви переходите до сторінки, яка вимагає  підтвердження e-mail адреси (лист для  підтвердження вам надіслано  на вашу поштову скриньку, яку ви вказали під час реєстрації).

Підтвердивши e-mail адресу, ви переходите до вікна, у якому потрібно ввести секретний реєстраційний код, зображений на картинці поряд.

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

На наступному кроці потрібно придумати та вписати адресу сайту, вибравши той хостинг, який пропонує UсоZ. До речі, він налічує 18 імен і містить українські домени. Усе, ваш сайт успішно створено, про що й повідомить система.

Щоб створити розділ на Ucoz–сайті потрібно зайти під логіном і паролем адміністратора сайту.  Обрати Пункт «Общее» - «Вход в панель управления». Потім в контекстному меню(рис.1) обрати пункт «Каталог статей» - «Управление категориями» - натиснути кнопку «Добавить категорию».

Після створення категорії обираємо її натискуванням і натискаємо кнопку «Добавить материал».

Додавання статті. Післе натискування кнопки  «Добавить материал» в відповідній категорії перед нами відкриється вікно(рис.2). Тут ми вносимо назву статті, короткий зміст і саму статтю.

Для форматування документа ми використовуємо значки (рис.3).

В –це жирность тексту, U – це підкреслювання, і – це курсив, вирівнювання, нумеровані списки і відступи позначаются так

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

Кнопки  означають відповідно предпросмотр, вставку з буфера обміну, повернення чи повтор дії.

Кнопки  означають зміну кольору тексту і фону під текстом відповідно.

Кнопки  означають відповідно вставку гіперссилки, картинки, флеш і таблиці.

Кнопки  означають відповідно вставку символа з таблиці символів, вставку лінії, видалення текста, видалення форматування тексту, html – код документу.

Для додавання картинки в документ. натискаємо значок в панелі інструментів, обираємо у новому вікні (рис.4) значок папки після чого відкривається ще одне вікно окно(рис.5)

 

 

В даному вікні обираємо пункт «Выбирите  файл»

Після чого обираємо на комп’ютері картинку і натискаємо на кнопку «Загрузить файл». Після цих дій наша картинка з’являється в «Файлах форума.», де ми на неї натискаємо і переходимо знову на рис.4 (автоматно), після чого ми натискаємо кнопку «Іnsert» і наша картинка автоматично вставляєтся там, де знаходиться ваш курсор.

Для збереження документа натискаємо внизу сторінки кнопку «Добавить».

Для додавання різних документів в формате word, pdf, exe натискаємо  в меню сайта пункт «Общее» - «Главная страница», вводимо пароль і секретний код, і в меню рис. 6

обираємо пункт «Файловый менеджер», там обираємо кнопку «Выбрать файл» 

після чого обираємо файл на комп’ютері, натискаємо кнопку «Загрузить файл», після завантаження на сервер файлу ви можете створити в Каталозі файлів матеріал і додати ваш документ натиснувши кнопку (гіперпосилання), далі натиснувши на значок папки обрати потрібний файл і натиснути кнопку «Іnsert».

Редактор  веб-сайтів з графічним інтерфейсом.

Найпоширенішими візуальними редакторами  для створення сайтів є: Frontpage і Dreamweaver.  Програма Frontpage компанії Microsoft, на мою думку, є кращою на сьогоднішній день. 80% сайтів в Інтернеті створено за допомогою цього пакету. Не дивлячись на те, що це наймогутніша програма, майже повна схожість її інтерфейсу з поширеним текстовим редактором Word дозволяє освоїти її легко і швидко.

Редактор Frontpage містить великий  набір шаблонів і майстрів для  створення сайтів з різної тематики. Для форматування тексту можна використовувати всі можливості, передбачені в основному стандарті HTML, а так само застосовувати спеціальні динамічні ефекти і анімацію. Редактор має зручні інструменти для роботи з таблицями, вбудовані засоби для обробки зображень, дозволяє легко розміщувати на сторінках різні мультимедіа-об'єкти: малюнки, відеофільми, анімацію, звукові фрагменти. Тісна інтеграція з пакетом MS Office дозволяє відображати на сторінках документи MS Word, таблиці і графіки MS Excel, динамічно отримувати дані з MS Access, використовувати мову VBA, засоби перевірки орфографії і десятки готових тим для оформлення сторінок сайту.