Міністерство освіти і науки України Національний університет “Львівська політехніка”
Розрахункова робота з дисципліни: „Робота в інтернеті” на тему: „ Розробка веб сторінки.” Завдання Cторінка повинна містити: Назву сторінки. Метаінформацію про сторінку: тип сторінки, використане кодування та ключові слова, які будуть використовуватись пошуковими серверами для індексування сторінки. Фонове зображення та зображення, до яких прив’язані гіперзв’язки. Структурований текст (заголовки різних рівнів, різні типи шрифтового оформлення та акцентування тексту (гарнітура, стиль, розмір, колір.) Гіперзв’язки різних типів (внутрішні та зовнішні) з різним типом адресації. Сторінка може містити додаткові можливості оформлення (фрейми, таблиці, карти зображень, скрипти та ін.) Сторінка повинна правильно відображатись в браузерах Internet Explorer та Firefox. Розробка HTML – коду HTML – код головної сторінки <html> <head> <TITLE>Головна</TITLE> <BODY> <H2 align="center">Персональна сторінка Пігович Юлі</H2> <body background="fonf6.jpg" bgcolor="#ffffff"> <body> <body bgcolor="D8BFD8" text="000000"> <body background = "green_stone.bmp" text = "#000000" link = "1E90FF" vlink = "0000CD" alink = "C71585"> <body> <i><a href="file1.htm">Автобіографія</a></i><hr> <p><i><a href="file2.htm">Фотогалерея</a></i><hr> <p><i><a href="file3.htm">Друзі</a></i><hr> <p><a href="file4.htm">Навчання</a></i><hr> <p>&nbsp;</td> <td center="100%"><br><br> <CENTER> <FONT FACE = "Decor" SIZE=+4 Color= "red">Це Я</Font> </CENTER><P> <CENTER><IMG SRC="ja.jpg" alt= "" align="center" width="400" height="480"></CENTER><P> </td> </tr> <tr> <td width="24%" height="95"> </td> </tr> <tr> <td width="100%" colspan="2" background="koord.gif" height="20"> <p align="right"> </p> </td> </tr> <tr> <td width="100%" colspan="2"> <p align="right"> тел. секрет<br> </dfn></font></p> </td> </tr> <tr> <td width="100%" colspan="2"> <p align="center" style="Arbat: 0"> &nbsp; <font color="red"> <a href="file1.htm">Автобіографія</a>| <a href="file2.htm">Фотогалерея</a> |&nbsp; </font> </p> <p align="center" style="margin: 0">| <font color="red"> <a href="file3.htm">Друзі</a>| <a href="file4.htm">Навчання</a> </font> </p> </td> </tr> </table> </body> </html> Результат виконання
HTML – код сторінки під назвою «Автобіографія» <html> <head> <TITLE>Aвтобіографія</TITLE> <BODY> <H2 align="center">Персональна сторінка Пігович Юлі</H2> <body background="fonf6.jpg" bgcolor="#ffffff"> <body> <body bgcolor="D8BFD8" text="000000"> <body> <p><a href="index.htm">Головна</a></i><hr> <p><i><a href="file1.htm">Автобіографія</a></i><hr> <p><i><a href="file2.htm">Фотогалерея</a></i><hr> <p><i><a href="file3.htm">Друзі</a></i><hr> <p><i><a href="file4.htm">Навчання</a></i><hr> <p>&nbsp;</td> <td center="100%"><br><br> <left> <FONT FACE = "Decor" SIZE=+1 Color= "black">Я [ім’я автора приховано] народилася 20 серпня 1987 року у місті Львові.Де проживала 6 років.Пізніше переїхала з батьками у селище міського типу Гірник що у Львівській області. Тут і пішла навчатися у школу №6 м. Червонограда. Школу закінчила у 2004 році. Тут же поступила у НУ " Львіська політехніка" в інститут Комп'ютерних технологій автоматики і метрології.</Font> </left><P> </tr> <tr> <td width="24%" height="95"> </td> </tr> <tr> <td width="100%" colspan="2" background="koord.gif" height="20"> <p align="right"> </p> </td> </tr> <tr> <td width="100%" colspan="2"> <p align="right"> тел. секрет<br> </dfn></font></p> </td> </tr> <tr> <td width="100%" colspan="2"> <p align="center" style="Arbat: 0"> &nbsp; <font color="red"> <a href="file1.htm">Автобіографія</a>| <a href="file2.htm">Фотогалерея</a> |&nbsp; </font> </p> <p align="center" style="margin: 0">| <font color="red"> <a href="file3.htm">Друзі</a>| <a href="file4.htm">Навчання</a> </font> </p> </td> </tr> </table> </body> </html> Результат виконання
HTML – код сторінки під назвою «Фотогалерея» <html> <head> <TITLE>Фотогалерея</TITLE> <BODY> <H2 align="center">Персональна сторінка Пігович Юлі</H2> <body background="fonf6.jpg" bgcolor="#ffffff"> <body> <body bgcolor="D8BFD8" text="000000"> <body background = "green_stone.bmp" text = "#000000" link = "1E90FF" vlink = "0000CD" alink = "C71585"> <body> <p><a href="index.htm">Головна</a></i><hr> <p><i><a href="file1.htm">Автобіографія</a></i><hr> <p><i><a href="file2.htm">Фотогалерея</a></i><hr> <p><i><a href="file3.htm">Друзі</a></i><hr> <p><i><a href="file4.htm">Навчання</a></i><hr> <p>&nbsp;</td> <td center="100%"><br><br> <CENTER><IMG SRC="f1.jpg" alt= "" align="center" width="640" height="480"></CENTER><P> <CENTER> <FONT FACE = "Decor" SIZE=+1 Color= "black">я на морі фото 1</Font> </CENTER><P> <CENTER><IMG SRC="f2.jpg" alt= "" align="center" width="400" height="480"></CENTER><P> <CENTER> <FONT FACE = "Decor" SIZE=+1 Color= "black">я на морі фото 2</Font> </CENTER><P> <CENTER><IMG SRC="f3.jpg" alt= "" align="center" width="640" height="480"></CENTER><P> <CENTER> <FONT FACE = "Decor" SIZE=+1 Color= "black">День народження 2006</Font> </CENTER><P> <CENTER><IMG SRC="f4.jpg" alt= "" align="center" width="640" height="480"></CENTER><P> <CENTER> <FONT FACE = "Decor" SIZE=+1 Color= "black">світлина власноруч</Font> </CENTER><P> <CENTER><IMG SRC="f5.jpg" alt= "" align="center" width="350" height="480"></CENTER><P> </td> </tr> <tr> <td width="24%" height="95"> </td> </tr> <tr> <td width="100%" colspan="2" background="koord.gif" height="20"> <p align="right"> </p> </td> </tr> <tr> <td width="100%" colspan="2"> <p align="right"> тел. секрет<br> </dfn></font></p> </td> </tr> <tr> <td width="100%" colspan="2"> <p align="center" style="Arbat: 0"> &nbsp; <font color="red"> <a href="file1.htm">Автобіографія</a>| <a href="file2.htm">Фотогалерея</a> |&nbsp; </font> </p> <p align="center" style="margin: 0">| <font color="red"> <a href="file3.htm">Друзі</a>| <a href="file4.htm">Навчання</a> </font> </p> </td> </tr> </table> </body> </html> Результат виконання

HTML –код сторінки під назвою «Друзі» <<html> <head> <TITLE>Друзі</TITLE> <BODY> <H2 align="center">Персональна сторінка Пігович Юлі</H2> <body background="fonf6.jpg" bgcolor="#ffffff"> <body> <body bgcolor="D8BFD8" text="000000"> <body background = "green_stone.bmp" text = "#000000" link = "1E90FF" vlink = "0000CD" alink = "C71585"> <body> <p><a href="index.htm">Головна</a></i><hr> <p><i><a href="file1.htm">Автобіографія</a></i><hr> <p><i><a href="file2.htm">Фотогалерея</a></i><hr> <p><i><a href="file3.htm">Друзі</a></i><hr> <p><i><a href="file4.htm">Навчання</a></i><hr> <p>&nbsp;</td> <td center="100%"><br><br> <CENTER><MARQUEE BGCOLOR="white" HEIGHT="40">В мене друзів багато!!... Вася, Маша,Петя, Федя, Кіндрат, Павло, Петро, Іван, Оксана, Маряна, Христина і багато інших!!!</MARQUEE> </td> </tr> <tr> <td width="24%" height="95"> </td> </tr> <tr> <td width="100%" colspan="2" background="koord.gif" height="20"> <p align="right"> </p> </td> </tr> <tr> <td width="100%" colspan="2"> <p align="right"> тел. секрет<br> </dfn></font></p> </td> </tr> <tr> <td width="100%" colspan="2"> <p align="center" style="Arbat: 0"> &nbsp; <font color="red"> <a href="file1.htm">Автобіографія</a>| <a href="file2.htm">Фотогалерея</a> |&nbsp; </font> </p> <p align="center" style="margin: 0">| <font color="red"> <a href="file3.htm">Друзі</a>| <a href="file4.htm">Навчання</a> </font> </p> </td> </tr> </table> </body> </html> Результат виконання
. HTML –код сторінки під назвою «Навчання» <html> <head> <TITLE>Навчання</TITLE> <BODY> <H2 align="center">Персональна сторінка Пігович Юлі</H2> <body background="fonf6.jpg" bgcolor="#ffffff"> <body> <body bgcolor="D8BFD8" text="000000"> <body background = "green_stone.bmp" text = "#000000" link = "1E90FF" vlink = "0000CD" alink = "C71585"> <body> <p><a href="index.htm">Головна</a></i><hr> <p><i><a href="file1.htm">Автобіографія</a></i><hr> <p><i><a href="file2.htm">Фотогалерея</a></i><hr> <p><i><a href="file3.htm">Друзі</a></i><hr> <p><i><a href="file4.htm">Навчання</a></i><hr> <p>&nbsp;</td> <td center="100%"><br><br> <CENTER><H3 allign="center"> Ось так ми вчимося!!!!</H3><CENTER> <CENTER><IMG SRC="f6.jpg" alt= "" align="center"></CENTER><P> <CENTER><IMG SRC="f7.jpg" alt= "" align="center" ></CENTER><P> <CENTER><IMG SRC="f9.jpg" alt= "" align="center"></CENTER><P> <CENTER><IMG SRC="f10.jpg" alt= "" align="center"></CENTER><P> <CENTER><IMG SRC="f11.jpg" alt= "" align="center"></CENTER><P> </td> </tr> <tr> <td width="24%" height="95"> </td> </tr> <tr> <td width="100%" colspan="2" background="koord.gif" height="20"> <p align="right"> </p> </td> </tr> <tr> <td width="100%" colspan="2"> <p align="right"> тел. секрет<br> </dfn></font></p> </td> </tr> <tr> <td width="100%" colspan="2"> <p align="center" style="Arbat: 0"> &nbsp; <font color="red"> <a href="file1.htm">Автобіографія</a>| <a href="file2.htm">Фотогалерея</a> |&nbsp; </font> </p> <p align="center" style="margin: 0">| <font color="red"> <a href="file3.htm">Друзі</a>| <a href="file4.htm">Навчання</a> </font> </p> </td> </tr> </table> </body> </html>Результат виконання
Висновок: На даній розрахунковій роботі ми навчилися створювати нескладні веб сторінки засобами мови HTML, вивчили основні команді мови HTML, які ще називають тегами. А саме: - теги для форматування тексту, - тег задання параметру шрифту FONT, - теги для встановлення графічних файлів, - теги для гіперпосилань.