МІНІСТЕРСТВО ОСВІТИ І НАУКИ УКРАЇНИ
ЗАПОРІЗЬКИЙ НАЦІОНАЛЬНИЙ УНІВЕРСИТЕТ
Математичний факультет
Кафедра
програмної інженерії
ЗАТВЕРДЖУЮ
Декан математичного факультету
____________ Гоменюк С.І.
(підпис) (ініціали та прізвище)
«______» ________________2016
ОСНОВИ
ІНТЕРНЕТ ТЕХНОЛОГІЙ
РОБОЧА
ПРОГРАМА НАВЧАЛЬНОЇ ДИСЦИПЛІНИ
підготовки бакалаврів
спеціальності 113 – Прикладна математика
Укладач доцент кафедри програмної інженерії, к.т.н., Мухін В.В.
|
Обговорено та ухвалено на засіданні кафедри математичного моделювання Протокол №__1__ від “_25_” __08__2016 р. Завідувач кафедри____________________ _____________________А.О. Лісняк__ (підпис) (ініціали, прізвище ) |
Ухвалено науково-методичною радою математичного факультету
Протокол №_1_від “_01_” ___09___2016 р. Голова науково-методичної ради математичного факультету ____________________П.Г. Стєганцева_ (підпис) (ініціали, прізвище ) |
2016 рік
1. Опис навчальної дисципліни
|
Найменування показників |
Галузь знань, спеціальність, освітня програма, рівень вищої освіти,
|
Характеристика навчальної дисципліни |
||
|
денна
форма навчання |
заочна
форма навчання |
|||
|
Кількість кредитів - 3 |
Галузь знань 11 - Математика та статистика |
Нормативна |
||
|
Загальна кількість годин - 90 |
Спеціальність
113 – Прикладна математика |
Рік підготовки: |
||
|
1-й |
- |
|||
|
Лекції |
||||
|
Тижневих аудиторних годин для денної форми навчання: аудиторних – 3, самостійної роботи студента – 4,5 |
Рівень вищої освіти: бакалаврський |
12год. |
|
|
|
Лабораторні |
||||
|
24
год. |
- |
|||
|
Самостійна робота |
||||
|
54 год. |
- |
|||
|
Вид контролю: залік |
||||
2. Мета та завдання навчальної дисципліни
Метою викладання навчальної дисципліни «Основи
Інтернет технологій» є сформувати у студентів систему знань, умінь та навичок,
необхідних для ефективного використання сучасних інформаційних технологій у
своїй майбутній професійній діяльності, для управління навчальним процесом, для
формування елементів інформаційної та загальної культури студентів, для
гуманізації навчального процесу, інтеграції навчальних предметів і
диференціації навчання, надання навчальній діяльності дослідницького, творчого
характеру. Розкрити значення Інтернету в загальній і професійній освіті людини,
його вплив на науково-технічній і соціально-економічний розвиток суспільства.
Забезпечити ґрунтовне оволодіння студентами основними
засобами і технологіями створення документів для WEB, теоретичною і технічною
базою, можливими напрямками використання.
Згідно з вимогами освітньо-професійної програми
студенти повинні:
знати:
·
Мову HTML(XHTML)
·
Таблиці стилів CSS
·
Мову JavaScript
·
Базові основи серверного
web-програмування (CGI);
вміти:
·
Свідомо і кваліфіковано працювати з мережею
Internet.
·
Користуватись програмними засобами, призначеними
для
роботи в Internet
та додатками для
Internet.
·
Підбирати
і встановлювати необхідне системне програмне забезпечення для
роботи в Internet і розробки WEB-сторінок.
·
Створювати власні
WEB-сторінки, комерційні реклами,
сайти й розміщувати їх в мережі Internet.
·
Самостійно освоювати новітні засоби і технології створення WEB-сторінок.
Міждисциплінарні
зв’язки.
Дисципліна
«Основи Інтернет технологій» є своєрідним вступом до спеціальності, що
передбачає здобуття необхідних базових теоретичних та практичних знань і
викладається до вивчення спеціальних дисциплін професійного спрямування.
3. Програма навчальної дисципліни
Розділ 1. Мережа Internet.
Мова HTML (XHTML)
ТЕМА 1. Основи
функціонування мережі Internet
Історія появи Internet. Всесвітня павутина – Word Wide Web.
Гіпертекстові системи. Розвиток HTML, специфікації. Питання межбраузерної
сумісності. W3 C. Редактори web-сторінок.
Оглядачі web-вмісту.
ТЕМА 2. Мова
HTML (XHTML)
Структура xhtml-документа. Основні елементи і їх призначення. Правила запису тегів і їх атрибутів в
стандарті XHTML.
Форматування тексту. Класифікація тегів: лінійні і
блокові елементи. Модель форматування тексту: заголовки і абзаци. Елементи
<p>, <h1>-<h6>. Вирівнювання тексту в блокових елементах:
атрибут align. Класифікація тегів:
логічне і фізичне форматування. Теги фізичного форматування: <b>,
<i>. Відмінність від тегів логічного форматування <strong>,
<em>. Теги фізичного форматування <font>, <u>, <sub>,
<sup>. Стиль елементу: атрибут style.
Колір в HTML і CSS. Web-палітра. Підбір кольорів для веб-сторінки з
використанням Photoshop. Зміна кольору
фону і кольору тексту на сторінці.
Списки.
Неврегульовані списки: елементи <ul>, <li>. Впорядковані
списки: елементи <ol>, <li>.
Неврегульовані списки: атрибут type. Впорядковані списки: атрибути type,
value, start. Стильове форматування списків. Списки визначень: елементи
<dl>, <dd>, <dt>.
Вкладені списки. Форматування
списків: атрибути list-style-type, list-style-image, list-style-position,
list-style.
Графіка в web-дизайні. Особливості форматів.
Оптимізація графіки. Формати графічних файлів в Internet. Оптимізація. Тег
<Img /> і його атрибути (src, alt, width, height, border). Вирівнювання
зображень на сторінці: атрибути align, valign, hspace, vspace.
Гіперпосилання. Принципи навігації web-сайту. Загальні
відомості про гіперпосилання. Тег <a> і його атрибути (href, target).
Ергономіка, зручність навігації. Абсолютна і відносна адресація. Організація
зовнішніх посилань Організація внутрішніх посилань, атрибут
html-елементів id. Організація внутрішніх посилань за допомогою елементу
<a>. Атрибут name. Організація «змішаного» переходу (на вказаний елемент
в зовнішньому html-документі). Графічні посилання.
Таблиці. Створення простої таблиці Атрибути тегів <table>, <tr> і
<td>: border, cellspacing cellpadding. Вказівка ширини і висоти вічка:
атрибути width, height. Вирівнювання
даних в таблиці: атрибути align і valign. Управління кольором фону і кольором
рамок таблиці (окремого рядка, окремого вічка). Використання зображень як фон
таблиці (окремого рядка, окремого вічка). Об'єднання вічок: атрибути colspan,
rowspan. Теги логічної структуризації таблиць: <thead>, <tbody>,
<tfoot>. Теги логічного групування стовпців: <colgroup>, <col>.
Управління рамками таблиці: атрибути frame, rules.
Фрейми. Організація взаємодії між фреймами за
допомогою атрибуту target елементу <a>. Зарезервовані (спеціальні) імена
фреймів: _top, _parent, _blank, _self. Тег <base>. Практичне вживання
фреймів: приклади і рекомендації.
Форми. Вживання форм. Розміщення елементів форми в
HTML. Створення елементів форми. Кнопки: елементи Button, Submit, Reset. Текстові поля: елементи Text, Password, File
Upload, Textarea. Приховане поле форми: загальне поняття про елемент
Hidden. Прапорець: елемент Checkbox.
Перемикач: елемент Radio. Список: елементи Select, Option.
Мета-теги. Кодування і символьні підстановки. Вказівка
кодування тексту за допомогою тега <meta>. Мета-теги: управління
примусовим оновленням web-сторінки.
Пошукові машини і каталоги. Синтаксичний аналіз веб-сторінки при
індексуванні. Завдання ключових слів за допомогою мета-тегов. Хостинг,
реєстрація доменного імені Розміщення
сайту в Internet. Робота з ftp-клієнтами. Реєстрація в пошукових системах і
каталогах. Розміщення лічильника на web-сторінці.
ТЕМА 3. Таблиці
стилів CSS.
Каскадні таблиці стилів. Введення в таблиці стилів.
Можливості таблиць стилів. Специфікації CSS. Вживання таблиць стилів: способи
впровадження стилів в документ, каскадність. Селектори, типи селекторів: класи,
селектори-нащадки, ідентифікатори, псевдокласи etc. Псевдокласи заслань: hover,
active, visited. Атрибут cursor.
Основи шрифтового дизайну. Правила форматування
тексту: атрибути color, font-size, font-style, font-weight, font-family etc.
Узагальнений атрибут font. Атрибути блокових елементів тексту: text-indent,
text-align, text-justify, line-height,
letter-spacing, word-spacing etc.
Блокові елементи: Форматування кордонів. Відступи
margin, padding. Атрибути стилю display, visibility, float, overflow.
Управління фоновим кольором і малюнком. Відносне і
абсолютне позиціювання. Атрибути position, left, top, right, bottom.
Розділ 2.
Створення сторінок за допомогою HTML5 і CSS3, web-програмування
ТЕМА 4.
Створення сторінок за допомогою HTML5 і CSS3.
Структура HTML5 документа. Нові теги завдання
структури: <header>, <nav>, <section>, <article>,
<aside>, <footer>. Доступність нових тегов в сучасних браузерах.
Відображення нових тегів в застарілих браузерах. Html5 – конкурент Flash.
Вставка відео на сторінці за допомогою тега <video>. Вставка аудіо на
сторінці за допомогою тегу <audio>. Створення зображень і анімації за
допомогою тегу <canvas>.
Використання SVG формату.
Нові елементи форм. Нові властивості: CSS3. Робота з
фоном: створення градієнтів, зміна розмірів фону – властивості background і
background-size. Робота з кордонами: краї, що округляють, в блоків –
властивості border-radius. Завдання напівпрозорій елементам сторінок –
властивість opacity. Повна підтримка селекторів CSS.
Розгляд нових API для управління даними на сторінці
(доступно в скріптових мовах, наприклад Javascript, теоретичні відомості).
Малювання 2d-картінок в реальному часі. Контроль над програванням медіа файлів,
який може використовуватися, наприклад, для синхронізації субтитрів з відео.
Зберігання даних в браузері.
Drag-and-drop: перетягання елементів на сторінці. Робота з мережею:
робота з базою даних, а так само з локаціями. MIME.
ТЕМА 5.
Динамічний HTML. Мова JavaScript.
Основні конструкції мови. Сценарії, що виконуються на
стороні клієнта. Відмінності між Javascript і Java, Jscript, Ecmascript.
Впровадження в HTML документи. Редактори коди Javascript. Синтаксис. Змінні і
типи даних. Оператори. Введення/вивід даних. Діалогові вікна Ухвалення рішень, вибір Цикли.
Функції. Об'єкти. Функції: формальні і фактичні
параметри. Об'єктний тип даних,
створення об'єктів, this Об'єкт Array. Властивості і методи. Об'єкти
Javascript. Управління вмістом елементів (document.write (), innertext, innerhtml,
insertadjacenttext і insertadjacenthtml).
Об'єкт String. Робота з рядками.
Обробка подій. Обробка подій в сценаріях. Управління
стилями елементів web-сторінки. Об'єкт event і його властивості. Обробники
подій за умовчанням (стандартні обробники), заборона виклику стандартного
обробника. Проходження подій через елементи (властивість cancelbubble). Об'єкт
Image. Управління малюнками і ролловерамі. Список, що розкривається, випадне
меню.
Об'єкти Date і Math. Затримки і інтервали. Періодичний
виклик функцій. Об'єкт Date. Обробка
дати і часу. Об'єкт Math. Властивості і методи. Випадкові числа.
Взаємодія подій і стилів: фільтри. Статичні фільтри.
Зміна фільтру в результаті події. Ефект динаміки за допомогою періодичного
виклику функцій. Динамічні фільтри.
Об'єктна модель документа (DOM). Опис DOM. Ієрархія
об'єктів. Об'єкт Navigator. Управління
браузером. Об'єкт Screen. Властивості
екрану. Переміщення по сторінках:
об'єкти Location і History. Об'єкт
Window. Відкриття, переміщення і зміна розміру вікон. Колекція Frames:
управління фреймами за допомогою Javascript. Знайомство з об'єктами Document і
Link. Управління виділенням і текстовим діапазоном: об'єкти Selection і
Textrange.
Форми. Програмування елементів форми: Кнопки: елементи Button, Submit, Reset. Текстові поля: елементи Text, Password, File
Upload, Textarea. Приховане поле форми:
загальне поняття про елемент Hidden.
Прапорець: елемент Checkbox.
Перемикач: елемент Radio. Список:
елементи Select, Option.
Об'єкт Regexp. Правила запису регулярних виразів. Методи об'єктів String і Regexp для роботи з
регулярними виразами Перевірка
достовірності даних форми.
Cookie. Переваги і недоліки cookie. Створення,
використання і видалення cookie.
Практичне вживання cookie.
Стандарт DOM, jquery. Відмінності між моделями DOM і
BOM. Представлення html-документа у вигляді дерева. Об'єкти моделі DOM.
Ієрархія вузлів. Властивості і методи моделі DOM. Модель подій DOM. Зміна дерева DOM.
Бібліотека jquery. Цілі і завдання jquery. Приклади використання. Селектори. Атрибути
Traversing. Взаємодія з DOM. Події. Ефекти. Робота з таблицями
стилів. Практичне використання jquery.
ТЕМА 6.
Введення в web-програмування
Введення в web-програмування і принципи роботи
web-додатків. Обґрунтування і витоки виникнення. Відмінності серверного
web-програмування від клієнтського. Цілі, завдання, напрям розвитку, коротка
історія. Архітектура «клієнт-сервер». Виконання серверних сценаріїв. CGI.
Взаємодія з СУБД. Принципи і етапи завантаження web-сторінки. Огляд і
порівняльний аналіз існуючих серверних web-технологій: ASP, ASP.NET, JSP, PHP, Ruby on Rails. Приклади
використання серверних сценаріїв.
4. Структура
навчальної дисципліни
|
Назви змістовних модулів і тем |
Кількість годин |
|||||||||||
|
Денна форма |
Заочна форма |
|||||||||||
|
усього |
у тому числі |
усього |
у тому числі |
|||||||||
|
л |
с/п |
лаб |
сам.роб. |
л |
с/п |
лаб |
сам.роб. |
|||||
|
|
інд.з. |
|
інд.з. |
|||||||||
|
1 |
2 |
3 |
4 |
5 |
6 |
7 |
8 |
9 |
10 |
11 |
|
|
|
Розділ 1. Мережа Internet. Мова HTML (XHTML) |
||||||||||||
|
Тема 1. . Основи функціонування мережі
Internet. |
|
2 |
|
- |
6 |
|
|
|
|
|
|
|
|
Тема 2. Мова HTML (XHTML). |
|
2 |
|
6 |
10 |
|
|
|
|
|
|
|
|
Тема 3. Таблиці стилів CSS. |
|
2 |
|
6 |
11 |
10 |
|
|
|
|
|
|
|
Разом за розділом 1 |
|
6 |
|
12 |
27 |
|
|
|
|
|
|
|
|
Розділ 2. Створення сторінок за допомогою
HTML5 і CSS3, web-програмування |
||||||||||||
|
Тема 4. Створення сторінок за допомогою HTML5 і CSS3. |
|
2 |
|
6 |
9 |
|
|
|
|
|
|
|
|
Тема 5. Динамічний HTML. Мова JavaScript. |
|
2 |
|
6 |
9 |
|
|
|
|
|
|
|
|
Тема 6. Введення в web-програмування. |
|
2 |
|
9 |
|
|
|
|
|
|
|
|
|
Разом за розділом
2 |
|
6 |
|
12 |
27 |
|
|
|
|
|
|
|
|
Усього годин |
90 |
12 |
|
24 |
54 |
|
|
|
|
|
|
|
5. Теми лекційних занять
|
№ з/п |
Назва теми |
Кількість
годин |
|
1 |
Тема 1. Основи функціонування мережі Internet. |
2 |
|
2 |
Тема 2. Мова HTML
(XHTML). |
2 |
|
3 |
Тема 3 Таблиці
стилів CSS. |
2 |
|
4 |
Тема 4. Створення сторінок за допомогою HTML5 і CSS3. |
2 |
|
5 |
Тема 5. Динамічний
HTML. Мова JavaScript. |
2 |
|
6 |
Тема 6. Введення в web-програмування, . |
2 |
|
|
Разом |
12 |
6. Теми лабораторних занять
|
№ з/п |
Назва теми |
Кількість
годин |
|
1 |
Тема 1. Розробка веб-сторінки. Форматування тексту, списки. |
2 |
|
2 |
Тема 2. Графіка, гіперпосилання. |
4 |
|
3 |
Тема 3 Каскадні таблиці стилів. |
4 |
|
4 |
Тема 4. Створення сторінок за допомогою HTML5 і CSS3 |
4 |
|
5 |
Тема 5. Динамічний HTML. Мова JavaScript. |
4 |
|
6 |
Тема 6. Виконання серверних сценаріїв, принципи і етапи
завантаження web-сторінки. |
6 |
|
|
Разом |
24 |
7.
Самостійна робота
|
№ з/п |
Назва теми |
Кількість
годин |
|
1 |
Тема 1. Історія появи
Internet, Редактори web-сторінок. |
1 |
|
2 |
Тема 2. Таблиці. Створення простої таблиці. |
2 |
|
3 |
Тема 3. Відносне
і абсолютне позиціювання. |
3 |
|
4 |
Тема 4. Нові
властивості: CSS3. Розгляд нових API для управління даними на сторінці
(доступно в скріптових мовах, наприклад Javascript, теоретичні відомості) |
8 |
|
5 |
Тема 5 Що таке jquery? Цілі і завдання jquery. Приклади використання. |
20 |
|
6 |
Тема 6. Виконання
серверних сценаріїв. CGI. Взаємодія з СУБД. |
20 |
|
|
Разом |
54 |
Індивідуальне
завдання
Індивідуальне завдання складається з двох частин: аналітичний звіт обсягом 20 сторінок
(оформлений відповідно до вимог) та розробка сайту. Оформлені завдання
подаються на оцінювання в електронному вигляді у СЕЗН
Moodle.
8. Види контролю і система накопичення балів
|
Вид контролю |
Максимальна кількість балів |
|
Розділ 1 |
|
|
Захист лабораторної роботи №1 |
4 |
|
Захист лабораторної роботи №2 |
8 |
|
Захист лабораторної роботи №3 |
8 |
|
Контрольне тестування рівня теоретичної підготовки |
10 |
|
Разом |
30 |
|
Розділ 2 |
|
|
Захист лабораторної роботи №4 |
4 |
|
Захист лабораторної роботи №5 |
8 |
|
Захист лабораторної роботи №6 |
8 |
|
Контрольне тестування рівня теоретичної підготовки |
10 |
|
Разом |
30 |
|
Індивідуальне завдання |
20 |
|
залік |
20 |
|
Загальна сума |
100 |
Критерії оцінювання кожного з проведених видів
контролю:
1)
Захист лабораторної роботи відбувається
після виконання завдання та завантаження
відповідного звіту до СЕЗН Moodle. Один завантажений звіт без захисту
лабораторної роботи може бути оцінений не вище, ніж 50% від максимального
можливого значення балів. Під час захисту студент має відповісти на питання
викладача та пояснити деякі етапи виконання завдання.
2)
Контрольне тестування рівня теоретичної
підготовки з розділу «Мережа Internet. Мова HTML (XHTML)» проводиться у СЕЗН
Moodle та має 20 питань, які оцінюються по 1 балу. Підсумкова оцінка з цього
тестування додається загальну курсу з
коефіцієнтом 0,5.
3)
Контрольне тестування рівня теоретичної підготовки з
розділу «Створення сторінок за допомогою HTML5 і CSS3, web-програмування» проводиться у СЕЗН
Moodle та має 10 питань, які оцінюються по 1 балу. Підсумкова оцінка з цього
тестування додається у загальну оцінку
без змін.
4)
Захист індивідуального завдання
проводиться у формі співбесіди, під час якої студент представляє виконане
завдання та пояснює окремі етапи його виконання. Максимальна кількість балів,
що може отримати студент
дорівнює 20.
Шкала оцінювання: національна та ECTS
За шкалою
ECTS
|
За
шкалою
університету |
За
національною шкалою |
|
|
Екзамен |
Залік |
||
|
A |
90 – 100 (відмінно) |
5 (відмінно) |
Зараховано |
|
B |
85 – 89 (дуже добре) |
4 (добре) |
|
|
C |
75 – 84 (добре) |
||
|
D |
70 – 74 (задовільно) |
3 (задовільно) |
|
|
E |
60 – 69 (достатньо) |
||
|
FX |
35 – 59 (незадовільно – з можливістю повторного складання) |
2
(незадовільно) |
Не зараховано |
|
F |
1 – 34 (незадовільно – з обов’язковим повторним курсом) |
||
9. Рекомендована
література
Основна:
1. Глушаков
С.В. Програмирование Web-страниц [Текст] / С.В. Глушаков, И. А. Жакин, Т. С.
Хачиров. – Харьков:Фолио,
2005. – 390 с.
2.
Леа Веру Леа. Секреты CSS. Идеальные решения
повседневных задач [Текст] / Леа Веру. – Санкт-Петербург:
Питер, 2016. –
336 с.
3.
Бен Фрэйн. HTML5 и CSS3. Разработка
сайтов для любых браузеров и устройств [Текст] / Фрэйн Бен. – Санкт-Петербург: Питер,
2016. – 272 с.
4.
Кроудер Девид. Создание веб – сайта для чайников [Текст]
/ Девид
Кроудер. – Диалектика,
2016. – 336 с.
Додаткова:
2. Пьюривал Сэмм. Основы разработки веб-приложений [Текст]
/ Сэмм Пьюривал. – Санкт-Петербург: Питер, 2014. –
272 с.
Інформаційні ресурси:
1.
Введение в HTML. – Режим доступу до сайту: http://www.intuit.ru/department/internet/htmlintro/
2.
Применение каскадных таблиц
стилей (CSS). – Режим доступу до
сайту:http://www.intuit.ru/department/internet/css/
3.
Введение в JavaScript. – Режим доступу до сайту: http://www.intuit.ru/department/internet/js/
Погоджено
_____________
відділ з навчальної
роботи
«_____»________________
Додаток
Доповнення та зміни до робочої
програми навчальної дисципліни
|
Протокол засідання кафедри (дата та номер) |
Внесені зміни |
Підпис завідувача кафедри, дата |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|