Портал освітньо-інформаційних послуг «Студентська консультація»

  
Телефон +3 8(066) 185-39-18
Телефон +3 8(093) 202-63-01
 (066) 185-39-18
Вконтакте Студентська консультація
 studscon@gmail.com
 facebook.com/studcons

<script>

  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){

  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),

  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

 

  ga('create', 'UA-53007750-1', 'auto');

  ga('send', 'pageview');

 

</script>

Створення Web-сторінок. Мова HTML

Предмет: 
Тип роботи: 
Реферат
К-сть сторінок: 
7
Мова: 
Українська
Оцінка: 
Зміст
 
1. HTML – мова опису Web-сторінок
2. Структура Web-сторінки
3. HTML-файл
4. Як створюються Web-сторінки
 
1. HTML – мова опису Web-сторінок
 
World Wide Web (WWW) – це найвідоміша та найпопулярніша служба Iнтернета. Ця глобальна, розподілена по цілому світі інформаційна гіпертекстова мультимедійна система дозволяє з'єднати в одне ціле інформацію різних видів, яка зберігається на різних комп'ютерах. Нагадаємо, що інформація в WWW розповсюджується у вигляді Web-сторінок (Web-документів). Декілька Web-документів з однієї теми, що належать одному власникові чи є на одному комп'ютері, утворюють Web-вузол, який часто називають сайтом. Основним принципом використання Web-сторінок є активізація гіпертекстових посилань, за допомогою яких можна здійснити перехід в інші місця Web-сторінки або до інших Web-сторінок. В основі WWW лежать два поняття: гіпертекстові посилання та формат документів HTML. Завдяки гіпертексту Web-сторінки набувають властивості інтерактивності.
HTML (Hyper Text Markup Language) – це спеціальна мова форматування текстових електронних документів. Наприклад, для друкованого документа задаються такі параметри, як розмір паперу та полів, шрифти та їх розміри тощо. Оскільки електронні Web-документи призначені для перегляду на екрані, причому наперед не відомо, на якому комп'ютері це буде робитися, а, отже, невідомі розміри вікна програми-переглядача, шрифти, які встановлені на комп'ютері, і т. д., то мова HTML призначена якраз для того, щоб оформляти електронні документи з розрахунку на те, що засоби, якими вони будуть переглядатися, наперед невідомі. Формування документів мовою HTML подібне до програмування. Вихідний текст документа складається з послідовності команд, які називають тегами (tag). Під час перегляду теги спрацьовують, і завдяки їм на екран виводяться запрограмовані елементи зображення. Наприклад, якщо на початку абзацу стоїть тег <center>, то весь абзац буде вирівняно по центру вікна, незалежно від того, в якому вікні здійснюється перегляд документа і яким шрифтом він зображається. Теги HTML дозволяють вирівнювати рядки документа, керувати кольором фону та кольором тексту, дозволяють вставляти в текст ілюстрації, задавати заголовки різних рівнів, будувати таблиці, створювати гіпертекстові посилання на інші документи.
Web-документ зберігається і пересилається як файл з розширенням html або htm (HTML-файл). Це звичайні текстові файли-програми, написані мовою HTML. Відображаються такі файли на екрані інакше, ніж вони виглядають у HTML-файлі. Для відображення HTML-файлів використовують броузери.
 
2. Структура Web-сторінки
 
Типовий Web-документ складається з текстових блоків, рисунків, таблиць, ліній, гіперпосилань. Більш складні Web-документи містять фрейми (вкладені Web-сторінки), елементи керування та вводу інформації (кнопки, перемикачі, поля вводу тексту), динамічні об'єкти (Java Applet, Java Script, ActiveX).
Є три типи текстових блоків: текстові абзаци, списки, таблиці. За замовчування текст відображається чорним кольором, але при потребі можна змінити колір, розмір, стиль та шрифт тексту. Абзаци на сторінці за замовчуванням розмежовуються переводом рядка і не мають відступів у першому рядку. Абзац може бути вирівняний до одного з країв або по центру вікна. Зручність перегляду Web-сторінок зумовлена тим, що броузер автоматично масштабує елементи по горизонталі, враховуючи розміри вікна, і при потребі відображає тільки вертикальну смугу прокрутки. інформація на сторінці традиційно відображається на білому фоні, але його колір можна змінити на інший або використати фонову картинку.
 
3. HTML-файл
 
Широке розповсюдження HTML-документи одержали завдяки різноманітним можливостям представлення інформації, легкістю написання та сумісністю з різними операційними системами. Спочатку нагадаємо, що команди мови HTML називають тегами. Теги бувають одинарними і парними. Більшість тегів є парними, наприклад, тег означення HTML-файлу: <html>: </html>. Парні теги позначають початок і кінець області дії відповідної команди. Теги записують у кутових дужках, причому той тег, що закриває область дії, має косу риску (слеш/slash). Тег може містити параметри, які користувач записує у першому тезі через пропуск, наприклад, <body bgcolor=«black»>.
Всі програми, написані мовою HTML (HTML-файли) мають однакову структуру. Можна зекономити час при створенні своїх Web-сторінок, якщо використовувати цю структуру як еталон. Зокрема, обов'язково повинні бути такі команди (теги) :  <html> <head> <title>.. Назва вікна Web-сторінки.. </title> </head> <body> ... </body> </html>
Теги <html> i </html> обмежують www-документ і записуються лише задля форми. Команди <head> i </head> обмежують заголовок сторінки. Ці теги також не є обов'язковими, вони допомагають краще структурувати сторінку. Нарешті, <title> виконує важливу функцію. Текст, введений між <title> і </title>, з'являється в броузері в рядку заголовку. Ще важливішим є тег <body>, який дозволяє описати власне Web-документ. В цьому місці розміщується певна кількість параметрів, що визначають зовнішній вигляд документа. Ці параметри, наприклад, визначають, як виглядає фон і колір тексту і яке зображення повинно бути на задньому плані Web-сторінки.
На цьому завершуємо початкове ознайомлення із тегами мови HTML та їх використанням, оскільки на практичних заняттях буде детально розглянуто створення власної Web-сторінки.
На завершення звернемо увагу, що для створення Web-сторінок дизайнери використовують гіпертекстові редактори, наприклад, Macromedia Dreamweaver, Microsoft FrontPage та інші, хоча за достатнього володіння мовою HTML можна писати Web-сторінки в будь-якому текстовому редакторі, наприклад, Блокнот (NotePad). Після написання програм файл потрібно зберегти на диску з певною назвою та розширенням. html чи. htm. Сучасні текстові процесори, наприклад, MS Word, Lotus WordPerfect дають змогу створити Web-сторінки методом конструювання без застосування команд HTML, оскільки вони генерують ці команди автоматично. Загальна назва таких програм, які мають можливість автоматизованого створення Web-сторінок без явного застосування користувачем мови HTML – Web-композери.
Розглянемо дещо детальніше можливості композера, які має програма MS Word. Щоб створити Web-сторінку або цілий Web-сайт, потрібно під час створення нового документу перейти на закладку Web-сторінки і скористатись Майстром Web-сторінки чи створити нову сторінку. У другому випадку алгоритм дій дизайнерів такий:
Командою меню Формат->Фон задають колір фону чи спосіб замальовування екрана певною текстурою.
Вводять текст, вибираючи шрифт, його розмір, колір, вирівнювання тощо.
Створюють списки, як у звичайному текстовому редакторі.
Вставляють горизонтальні лінії командою меню Вставка->Горизонтальная линия, і вибирають тип лінії.
За допомогою команди Таблица створюють і форматують таблиці.
Використовують команду Вставка для вставлення картинок, фотографій, звуку, гіперпосилань тощо.
Записують створений файл як Документ HTML, і перглядають його броузером.
 
4. Як створюються Web-сторінки
 
Приступаючи до створення Web-сторінок, ясно уявіть собі їхнє призначення. Вирішіть, якій темі буде присвячений майбутній сайт, і визначить тип інформації, яку слід на ньому представити. Самий очевидний приклад – побудова особистого сайта, що містить відомості про родину, область професійних інтересів і коло захоплень. Web-сторінки ділового характеру дозволять відвідувачам ознайомитися з особливостями вашого бізнесу, прес-релізами, каталогами й оголошеннями. Якщо ви послідуєте приведеним нижче рекомендаціям, ваші Web-сторінки придбають привабливий зовнішній вигляд і принесуть безсумнівну користь майбутнім читачам.
Поради по створенню:
1) Збір інформації.
Підготуйте всі дані, що збираєтеся представити на сторінках майбутнього сайта – тексти, картинки, діаграми і компактні відомості. Переконайтеся, що вся зібрана інформація має пряме відношення до обраної теми і становить інтерес для аудиторії. У процесі збору даних не забувайте про те, що перед опублікуванням будь-якої запозиченої інформації ви повинні заручитися дозволом її авторів.
2) Організація даних
Поділіть зібрані дані на групи. Кожна група повинна представлятися окремою Web-сторінкою, присвяченої конкретному предмету чи визначеній темі. Непогано, якщо Web-сторінка буде містити обсяг інформації, достатній для заповнення одного екрана. Майте на увазі, що розміщення надлишкового числа інформаційних елементів на одній сторінці приведе до істотного росту розміру файлу цієї сторінки і, як наслідок, до невиправданого збільшення часу пересилання файлу на комп'ютер користувача.
3) Введення інформації
За допомогою програми текстового редактора чи процесора введіть текст, що повинний відображатися на ваших Web-сторінках. Кожну сторінку варто зберегти у виді окремого файлу-документа. Помітьте текст дескрипторами HTML, щоб перетворити його у формат Web-сторінок. За допомогою дескрипторів HTML можна доповнити Web-сторінки графічними зображеннями, таблицями, аудіо- і відеозаписами.
4) Додавання гіперпосилань
Додавання гіперпосилань – надзвичайно важливий етап проектування Web-сторінок. Гіперпосилання у вікні броузера виглядають як фрагмент тексту чи графічне зображення, що дозволяють користувачу переміститися до необхідної сторінки Web одним клацанням кнопки миші.
5) Опублікування Web-сторінок
По завершенні роботи над Web-сторінками ви повинні звернутися до однієї з компаній – провайдерів (Web Presence Provider – WPP), що надають послуги по опублікуванню Web-сторінок. WPP забезпечить збереження ваших Web-сторінок на власному сервері і доступ до них ззовні. Після опублікування сторінок ви повинні ще раз переконатися в тому, що всі гіперпосилання діють так, як вами задумано, і інформація у вікні браузера виглядає належним чином.
Фото Капча