ВУЗ: Не указан
Категория: Не указан
Дисциплина: Не указана
Добавлен: 10.05.2024
Просмотров: 72
Скачиваний: 0
Міністерство освіти і науки України
Машинобудівний коледж Сумського державного університету
Циклова комісія спеціальності 5.05010101
„Обслуговування програмних систем і комплексів”
КУРСОВА РОБОТА
З предмету _______“Web-технології та Web-дизайн”___________
Студента(ки) 4 курсу 411-ік групи
напряму підготовки 050101
«Інформатика та обчислювальна техніка»
спеціальності 5.05010101 .
.
Керівник .
.
Оцінка_____________________________________
Члени комісії ___________ ___________________
___________ ___________________
___________ ___________________
(підпис) (прізвище та ініціали)
м. Суми – 2015 рік
Міністерство освіти і науки України
Сумський державний університет
Машинобудівний коледж
Дисципліна: Web-технології та Web-дизайн
Спеціальність 5.05010101 “Обслуговування програмних систем і комплексів”
Курс________________Група __________________Семестр______________
Завдання на курсову роботу студента
__________________________________________________________________
(прізвище, ім’я, по батькові)
Тема роботи: Розробка електронного підручника на основі Web-технологій.
Дата видачі завдання “____”________________201__ р.
Дата закінчення роботи “____”________________201__ р.
Керівник _____________________ Ананченко Ю.М.
(підпис) (прізвище, ім’я, по батькові)
Завдання розглянуто на засіданні циклової комісії спеціальності 5.05010101
Протокол №________ від “____”____________201__р.
Голова циклової комісії ___________________ Овсянко А.М.
(підпис) (прізвище, ім’я, по батькові)
Зміст
1 Постановка задачі 3
2 Вступ 4
3 Теоретичні відомості 6
3.1. “Голова” документа 6
3.2. "Тіло" документа 6
3.3. Таблиці 7
3.4. Абзаци 9
3.5. Розмір шрифту 10
3.6. З'єднання з іншими документами 11
3.7. Фрейми 12
4. Карта сайту 15
5 Приклад тестування та результату роботи програми 16
Висновок 22
Література 23
ДОДАТОК А 24
1 Постановка задачі
Практичне завдання
Розробити та програмно реалізувати електронний підручник - з всесвітньої історії (частина 1).
Вимоги до програми
Створити шаблон засобами CSS для електронного підручника (випадаюче меню, позиціонування блоків, оформлення заголовків і тексту), розробити веб-сторінки, розмістити інформацію електронного підручника, створити складну систему навігації, додати інтерактивні елементи та динамічну зміну сторінок. Як окремий розділ створити тести для самоконтролю з можливістю вибору варіанту відповіді та перевірки його правильності.
2 Вступ
HTML, Hyper Text Markup Language, або, по-українськи, «мова розмітки гіпертексту », є фундаментальною, базовою технологією Інтернету. Не дивлячись на існуюче серед користувачів Всесвітньої мережі думка, що HTML є повнофункціональною мовою програмування, яка володіє практично всіма рисами, характерними для інших аналогічних мов.
Практично весь вміст web-вузлів, який відображається на екрані підключених до Інтернету комп'ютерів, є набором документів, що містять програмний код HTML.
HTML дозволяє формувати на сторінці сайту текстові блоки, включати в них зображення, організовувати таблиці, управляти відображенням кольору документа і тексту, додавати в дизайн сайту звуковий супровід, організовувати гіперпосилання з контекстним переходом в інші розділи серверу або звертатися до інших ресурсів Мережі і компонувати всі ці елементи між собою. Файли, що містять гіпертекстовий код, мають розширення .htm або .html.
HTML, Hyper Text Markup Language (мова розмітки гіпертексту) - мова, що використовується для створення документів в Інтернеті. HTML-документом називається файл, що містить код HTML. Такі документи є основним інформаційним наповненням web-вузлів, вони дозволяють відображати текст, графіку, аудіо та відеоінформацію, а також інші компоненти ресурсів Інтернету.
Однієї з основних функціональних особливостей, характерних саме для даної мови програмування, завдяки якій він і одержав свою назву, є гіперпосилання.
Гіперпосилання (Hyperlink) - базовий функціональний елемент html-доку-мента, що є реалізацією динамічного зв'язку якого-небудь об'єкту даної web-сторінки з контекстним вмістом іншого документа.
Щоб роз'яснити цей термін, приведу простий приклад. Припустимо, що створений вами html-документ включає текст, в якому зустрічається слово
«гіперпосилання », а докладне розкриття цього терміну приведено в іншому документі, розміщеному в Інтернеті незалежно від першого. Перетворивши дане слово в гіперпосилання і пов'язавши її з вказаним вище документом, ви організовуєте тим самим найпростіший гіперзвязок: користувачу, охочому ознайомитися із значенням терміну «гіперпосилання », достатньо клацнути мишею на цьому слові, щоб перейти до web-сторінки з відповідними поясненнями. Слід зазначити, що як гіперпосилання може використовуватися як елемент текста, так і графічний об'єкт, а сам гіперзвязок можна встановлювати як між декількома документами, розташованими на одному фізичному сервері, так і з об'єктами, розміщеними на різних вузлах Інтернету.
На відміну від інших мов програмування, HTML - мова не трансльована, але що інтерпретується. Це означає, що для виконання готового коду його не потрібно компілювати, вбудований в спеціальне програмне забезпечення, призначене для проглядання web-сторінок, інтерпретатор «компілює » код безпосередньо в процесі відкриття документа. При цьому, знайшовши в тексті помилку, така програма не видає відповідного попередження(якщо сторінка не містить вбудованих скриптів Java), а просто ігнорує всю «помилковий » рядок.
Це слідує мати у вигляді, складаючи HTML-програму, оскільки можна ненароком пропустити «непомітну » помилку і виявити її наявність вже тоді, коли сторінка буде опублікована в Web.
3 Теоретичні відомості
3.1. “Голова” документа
Для оголошення назви сторінки служать команди:
<HEAD><TITLE> текст </TITLE></HEAD>
Назва - необов'язкова частина в документі, але окрім відображення в заголовку браузера імені сторінки, може включати необмежену кількість дуже корисних META-інструкцій. Звичайно вони розташовуються між двома першими мітками <head> і <title>. META-інструкція цей стандартний опис теми документа(для пошукових систем) або ж пряма вказівка для браузера. Приклад:
<META HTTP-EQUIV="Content-Type" CONTENT="text/html"> - інструкція дає вказівку браузеру інтерпретувати документ як HTML-текст (кодування сучасні браузери розпізнають автоматично, тому використовувати в метах параметр charset більше не рекомендується.)
Простір між закриваючими мітками </title> і </head> часто використовується для зберігання операторів JavaScript и VBScript <scripts.htm> використовуючих глобальні змінні і функції, а також при упровадженні Каскадных таблиц стилей <style.htm> або для оголошення скажемо нестандартного розміру шрифту сторінки за допомогою тега <basefont size="5">
3.2. "Тіло" документа
Основний текст сторінки знаходиться після необов'язкового заголовка, між так само необов'язковими мітками: <BODY>...тіло сторінки...</BODY>.(Сучасні браузеры самі розпізнають де кінчається заголовок і починається тіло документа... але ми, дотримуватимемо традиції побудови web сторінок)
До того ж відкриваючу мітку можна використовувати для задання кольору або шпалер для сторінки :
<BODY BGCOLOR=GREEN> - зелений колір сторінки; або
<body background=Image.gif> для використовування як шпалери, фонового малюнка, наприклад з ім'ям Image.gif
Якщо сторінка займає місця більш ніж вікно браузера, то зсовуючи смугу прокрутки ви зсовуватимете так само і шпалери. Для того, щоб вони не уповзали використовуйте наступний синтаксис:
<body bgcolor="red" background="fon.jpg" bgproperties="fixed">
В даному прикладі ще до завантаження фонового зображення (fon.jpg) сторінка матиме червоний колір (підбирається в тон фонової картинки, адже зображення може мати великий час завантаження, а може і зовсім не завантажитись при поганому зв'язку.