Главная Обратная связь

Дисциплины:






HTML – мова розмітки тексту



Всесвітня павутина складається з веб-сторінок, які створено у форматі HTML (HyperТext Markup Language, «мова розмітки гіпертексту»). HTML - це фундаментальна, базова технологія Інтернету.

HTML не є мовою програмування, це мова розмітки тексту, що використовує спеціальні оператори – теги (tag) чи інша назва дескриптори (descriptor) для розмітки текстового документа. Ці позначки вказують в якому вигляді буде виведено текстовий чи інший елемент у вікні браузера.

HTML дозволяє формувати на сторінці сайту текстові блоки, додавати до них зображення, організовувати таблиці, керувати відтворенням кольору, додавати до дизайну сайту звуковий супровід, організовувати гіперпосилання з переходом до інших розділів сервера або звертатися до інших ресурсів Інтернету і компонувати всі ці елементи між собою. Документи, що створено лише засобами HTML мають розширення .htm або .html.

Однією з основних функціональних особливостей мови HTML, завдяки якої вона і отримала свою назву, є гіперпосилання.

Гіперпосилання (Hyperlink) — це базовий функціональний елемент HTML-документу, який реалізовує зв'язок певного об'єкту веб-сторінки з іншим об’єктом. Для гіперпосилання може використовуватися як фрагмент тексту, так і графічний об'єкт, а сам гіперзв'язок можна встановлювати як між об’єктами одного сайту, так і між об'єктами, що розміщені на різних сайтах Інтернету.

HTML є мовою, що лише інтерпретується, тому, для виконання коду, його не потрібно компілювати. Інтерпретатор мови втілено в браузер, і він «компілює» код безпосередньо під час відкривання документа. Якщо в коді сторінки виявлено помилку, інтерпретатор, зазвичай, не видає відповідного попередження, а просто ігнорує весь «помилковий» рядок, що може зіпсувати зовнішній вигляд завантаженої сторінки. Це є важливим для розробників, тому слід бути уважним під час складання HTML-коду і ретельно тестувати результати своєї роботи.

CSS – каскадна таблиця стилів

CSS (Cascading Style Sheets) — це технологія опису зовнішнього вигляду документа, що створено засобами HTML, XML і XHTML.

CSS використовується для завдання кольорів, шрифтів, розташування елементів сторінки тощо. До появи CSS оформлення веб-сторінок вказувалося безпосередньо в HTML-коді сторінки. Проте, з появою CSS стало можливим принципове розділення змісту і представлення документа. За рахунок такого нововведення стало можливим легке застосування єдиного стилю оформлення для кількох сторінок сайту, а також швидка зміна цього оформлення.

Переваги:

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



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

· Простота подальшої зміни дизайну. Не потрібно виправляти кожну сторінку, достатньо лише змінити кілька правил у CSS-файлі.

· Додаткові можливості оформлення. Наприклад, за допомогою CSS-правил можна застосувати обтікання певного блоку текстом або зробити так, щоб меню фіксовано знаходилося в певному місці при перегортанні сторінки.

Недоліки:

· Різні браузери можуть в різний спосіб інтерпретувати правила CSS, і відповідно, по різному відображати одні і ті ж фрагменти сторінки.

 

Хід роботи

1. Створіть базовий каркас для сайту.

2. Додайте назву сайту, ключові слова, опис сайту, посилання на файл зі стилями.

3. Створіть блоки для шапки, сторінки для основного контенту, сайдбару та підвалу.

4.Створіть меню в блоці header згідно свого завдання. Меню створюється з ненумерованого списку.

5. Далі створіть логотип з посиланням на головну сторінку.

6. Пропишіть наступні теги, для створення навігаційного меню сайту.

Вигляд шапки та меню без використання каскадних стилів

7. В блоці content створіть 2 блоки для контенту.

8. Додайте в контент інформацію згідно свого завдання для першого блоку використовуючи параграфи (теги <p>)

Результат:

9. Аналогічним чином заповнюємо другий блок.

Результат:

10. Створіть елементи меню для сайдбару, використовуючи ненумерований список.

11. Також створюємо форму пошуку за допомогою тегу <form> та <fieldset>

Встановлюємо копірайт

12.Задайте стилі для заголовків , параграфів та списків.

Результат:

 

 

13. Задайте стилі для зображень, форм вводу, легенд

14. Задаємо стилі для шапки, меню

 

15. Логотип

16. Контент, сторінка, класи для постів

17. Встановлюєм стилі для сайдбару

 

список рекомендованої літератури

Бібліотека Луцького НТУ

1. Дригалкин В.В. HTML в примерах. Как создать свой Web-сайт: Самоучитель./ В.В. Дригалкин.- М.: Изд. дом "Вильямс", 2004.- 192с., ил.

2. Жадаев А.Г. Самоучитель HTML4./ А.Г. Жадаев -К.: Юниор, 2004.- 292с., ил.

3. Пасічник О.В. Веб-дизайн: підручник/ О.В. Пасічник, В.В. Пасічник.- Львів.: Магнолія, 2010.- 520 с.,іл.

4. Полонская Е.Л. Самоучитель язык HTML. Самоучитель.- М.:Изд. дом "Вильямс", 2004.- 320 с., ил.

5. СамХольцшлаг Молли Э. Использование HTML и ХHTML./ Хольцшлаг Молли Э.- М.: Изд. "Вильямс", 2003.- 736 с., ил.

 

Волинська обласна універсальна наукова бібліотека ім. Олени Пчілки

1. Дубанов М. Создание Веб-страниц: искуство верстки/ М. Дубаков.– Минск: Новое знание, 2004.– 287с.

2. Дунаев В.В. Основы Веб-дизайна/ В.В. Дунаев.– 2-е изд., перераб. и доп.– СПб.: БХВ-Петербург, 2012.– 480с.:ил.

3. Дунаев В.В. HTML скрипты и стили: самое необходимое/ Дунаев В.В.; ред. Е.Кондукова.- СПб.: БХВ-Петербург, 2009.- 496 с.,ил.

4. Глинський Я.М. Інтернет сервіси HTML і Web-дизайн. Навч. посібн./ Я.М глинський, В.А. Ряжська.- 3-є вид.- Львів: Дол, СПД Глинський, 2005.- 192 с.

5. Загуменов А.П. Как раскрутить и разрекламировать Веб-сайт в сети интернет/А.П. Загуменов.– М.: ДМК Пресс, 2012.– 382с.

6. Закорин И. Что такое Internet, WWW, и HTML/ И. Закорин, В. Рафалович.- 2-е изд., перераб. и доп.- М.: Интернет-Трейдинг, 2003.- 248 с.

7. Лебедев С.В. Web-дизайн: Учеб. пособие по созданию публикаций для интернета/ С.В. Лебедев.- 3-е изд., испр. и доп.- М.: Альянс-пресс, 2004.- 736с.

8. Мак-Дональд М. HTML5 недостающее руководство: пер. с англ./ М. Мак-Дональд.- СПб.: БХВ-Петербург, 2012.- 480с.: ил.

9. Пилигрим М. Погружение в HTML5: перев. с англ./ М.Пилигрим.- СПб.: БХВ-Петербург, 2011.- 304с.:ил.

10. Сакс Т. Дизайн и архитектура современного Web-сайта. Опыт профессионалов./ Т.Сакс, Г. Мак-Клейн; пер. с англ.- М.;СПб;К.: Вильямс, 2002.- 308 с.,ил.

 


Навчально-методичне видання

 

Методичні вказівки до виконання індивідуальної роботи для студентів напряму 6.010104 «Професійне освіта. Комп’ютерні технології в управлінні та навчанні» денної форми навчання / Н.А. Олексів. – Луцьк: ЛНТУ, 2011. – 80с.

 

 

Комп’ютерний набір та верстка: Н.А. Олексів

 

 

 

Редактор: О.С. Гордіюк

 

 

Підп. до друку Формат 60х84/16.Папір офс.

Гарн.Таймс.Ум.друк.арк. Обл.-вид.арк.

Тираж прим. Зам. 68.

 

 

Редакційно-видавничий відділ

Луцького національного технічного університету

43018 м. Луцьк, вул. Львівська, 75

Методичні вказівки до виконання самостійних робіт для студентів заочної форми навчання за напрямком “Педагогічна освіта”/ О.О. Герасимчук. - Луцьк: ЛДТУ, 2006. – с.  
Друк – РВВ ЛНТУ

 





sdamzavas.net - 2020 год. Все права принадлежат их авторам! В случае нарушение авторского права, обращайтесь по форме обратной связи...