Тема 6.1. Створення Web-сторінок
Мета: вдосконалити навички роботи по створенню гіпертекстових документів.
Завдання: створити засобами MS Word Web-сторінку свого навчального закладу.
Виконання:
1. Дайте письмово відповідь на питання:
Що таке Web-сторінка?
Web-сторінка - інформаційний ресурс доступний в мережі World Wide Web (Всесвітня павутина), який можна переглянути у веб-браузері.
Що таке гіперпосилання?
Гіперпосилання — це активний (виділеним кольором) текст, зображення чи кнопка на веб-сторінці, натиснення на яку (активізація гіперпосилання) викликає перехід на іншу сторінку чи іншу частину поточної сторінки.
Що таке тег?
Теги — це одна з кількох властивостей, які користувач може додавати до файлів, щоб їх було легше знаходити та впорядковувати.
Яка структура HTML-документа?
Документ HTML складається з основного тексту документу і тегів розмітки.
Яке розширення має Web-сторінка?
Web-сторінка має розширення.htm або.html
2. Створіть за допомогою мови гіпертекстової розмітки HTML власну WWW-сторінку:
1) створіть у папці Тема 6.1 папку Web;
2) у створену папку скопіюйте графічний файл – емблему нашого коледжу і дайте йому назву – logo.jpg;
3) у папці Web створіть текстовий документ за допомогою програми Блокнот та дайте йому назву index1.htm;
4) відкрийте створений документ і вставте в нього зміст Web-сторінки:
<HTML>
<HEAD> </HEAD>
<BODY BGCOLOR=«#C0C0C0»>
<I><H2><FONT FACE=«ARIAL»><FONT COLOR= #FF0000 ><MARQUEE> Біжучий рядок – текст </MARQUEE></FONT></FONT></H2></I>
<CENTER><BIG><H2><FONT FACE=«ARIAL»><FONT COLOR= #FFFFFF > Мукачівський кооперативний торговельно-економічний коледж</FONT> </FONT></H2></BIG></CENTER>
<DIV ALIGN=CENTER><IMG SRC= «logo.jpg» ALT =«Емблема нашого коледжу» ALIGN=«CENTER» WIDTH=231 HEIGHT=231 BORDER=2></DIV>
<TABLE BORDER=3 BORDERCOLOR=«#40E0D0»
BGCOLOR=«#D8BFD8» ALIGN=CENTER>
<TR>
<TD><FONT FACE=«ARIAL»><FONT SIZE=«+2»> Ваше прізвище </FONT> </FONT></TD>
<TD><FONT FACE=«ARIAL»><FONT SIZE=«+1»> Ваша спеціальність </FONT> </FONT></TD>
<TD><FONT FACE=«ARIAL»><FONT SIZE=«+1»> номер групи </FONT> </FONT></TD>
<TD><FONT FACE=«ARIAL»><FONT SIZE=«+2»> дата створення </FONT> </FONT></TD>
</TR>
</TABLE>
<CENTER><H2><FONT FACE=«ARIAL»><FONT COLOR=#000800<LH>Професійний комерсант повинен дотримуватись таких фундаментальних принципів:</LH> </FONT></FONT></H2></CENTER>
<LEFT><H4><FONT FACE=«ARIAL»><OL>
<LI>ЧЕСНІСТЬ
<LI>ОБ’ЄКТИВНІСТЬ
<LI>ПРОФЕСІЙНА КОМПЕТЕНТНІСТЬ ТА НАЛЕЖНА РЕТЕЛЬНІСТЬ
<LI>КОНФЕДЕНЦІЙНІСТЬ
<LI>ПРОФЕСІЙНА ПОВЕДІНКА
</OL>
<U><CENTER><H3><FONT FACE=»ARIAL»><FONT COLOR=#000080>
В майбутньому я мрію стати… </FONT></FONT></H3></CENTER></U><HR WIDTH =1500 SIZE=2 COLOR=#008000>
<RIGHT><H4><FONT FACE=«ARIAL»><FONT COLOR=#008000>Моя перша Веб-сторінка</FONT></FONT></H4></RIGHT>
</BODY>
</HTML>
5) внесіть зміни у текст – замініть напівжирний підкреслений текст згідно Ваших даних;
6) збережіть створений файл та перегляньте його за допомогою програми-браузера;
6) при потребі внесіть зміни у дизайн створеної Web-сторінки.
3. Роздрукуйте отриманий результат (Додаток 9).
Висновок: ми вдосконалити навички роботи по створенню гіпертекстових документів.
Список використаної літератури
1. Енгель П.С., Макарова М.В., та ін. Інформатика та комп’ютерна техніка навч. посіб. для студ. вищ. навч. закл.- К.: НМЦ “Укоопосвіта”, 2000.
2. Інформатика. Комп’ютерна техніка. Комп’ютерні технології. Підруч. для студ. вищ. навч. закл. За редакцією О. І. Пушкаря. – К.: Видавничий центр “Академія”, 2000.
3. Інформатика та комп’ютерна техніка. Практичні завдання для навчальної практики. Укоопосвіта. Київ – 2003.
4. Конспект лекцій.
