Автор работы: Пользователь скрыл имя, 30 Августа 2012 в 01:06, дипломная работа
World Wide Web – глобальная компьютерная сеть на сегодняшний день содержит миллионы сайтов, на которых размещена всевозможная информация. Люди получают доступ к этой информации посредством использования технологии Internet. Для навигации в WWW используются специальные программы – Web-браузеры, которые существенно облегчают путешествие по бескрайним просторам WWW. Вся информация в Web-браузере отображается в виде Web-страниц, которые являются основным элементом байтов WWW.
I. ВВЕДЕНИЕ …………………………………………………………….
1.1 Концепция WWW ………………………………………………….
II. ОСНОВНЫЕ ПРАВИЛА И ЭТАПЫ СОЗДАНИЕ САЙТА ………...
2.1 Правила Web-дизайна ……………………………………………..
2.1.1 Что такое стиль? ………………………………………….
2.1.2 Цветовые ассоциативные и эмоциональные модели …..
2.2 Браузеры ……………………………………………………………
2.3 Влияние дисплеев на Web-дизайн ………………………………..
2.4 Стандартные размеры и разрешения дисплеев ………………….
2.5 Обеспечение доступности Web-страницы ……………………….
2.6 Представление графики на Web-страницах ……………………...
2.6.1 Разрешение и размер файла изображений ……..…....….
2.7 Графические редакторы …………………………………...……...
2.7.1 Редакторы растровой графики …………………………..
2.7.2 Редакторы векторной графики …………………………..
III. ВЫБОР СТРУКТУРЫ WEB-СТРАНИЦЫ …………………………...
3.1 Создание фиксированных и гибких Web-страниц …………...….
3.2 Разработка комбинированных Web-страниц …………………….
3.3 Язык HTML …………………………….…………………………..
3.4 Теги HTML …………………………………………………………
3.5 Структура HTML документа ……………………………………...
3.5.1 Форматирование текста ………………..………………...
3.6 Программа и ее описание ………………………………………….
IV. ЗАКЛЮЧЕНИЕ ………………………………………………………...
V. ЛИТЕРАТУРА ………………………………………………………….
VI. ПРИЛОЖЕНИЕ (листинг программы)
VI.
ПРИЛОЖЕНИЕ
Листинг
файла index.htm
<HTML>
<HEAD>
<LINK href="favicon.ico" rel="SHORTCUT ICON">
<TITLE>Туймазинский государственный юридический колледж</TITLE>
<META content="text/html; Charset=Windows-1251" http-equiv=Content-Type>
<META content="tguk-tuimazy.narod.ru
<META content="Туймазинский государственный гридический колледж" name=Description>
</HEAD>
<body bgcolor="White"
leftmargin="0" topmargin="0" marginwidth=0 marginheight=0
style="background-repeat: repeat-y; background-attachment: scroll;
background-image: url('fon.jpg'); background-position: left top">
<p style="word-spacing:
0; margin: 0"><img border="0" src="baner/ban_1.jpg"
width="779" height="29"></p>
<p style="word-spacing:
0; margin: 0"><img border="0" src="baner/ban_2.jpg"
width="779" height="19"></p>
<p style="word-spacing:
0; margin: 0"><img border="0" src="baner/ban_3.jpg"
width="779" height="23"></p>
<p style="word-spacing:
0; margin: 0"><img border="0" src="baner/ban_4.jpg"
width="779" height="25"></p>
<p style="word-spacing:
0; margin: 0"><img border="0" src="baner/ban_5.jpg"
width="779" height="33"></p>
<p style="word-spacing:
0; margin: 0"><img border="0" src="baner/ban_6.jpg"
width="779" height="37"></p>
<SCRIPT language=JavaScript>
glav1=new Image();
glav1.src="img/knop/kn_glav.
glav2=new Image();
glav2.src="img/knop/kn2_glav.
abitur1=new Image();
abitur1.src="img/knop/kn_
abitur2=new Image();
abitur2.src="img/knop/kn2_
zaochnik1=new Image();
zaochnik1.src="img/knop/kn_
zaochnik2=new Image();
zaochnik2.src="img/knop/kn2_
kafed1=new Image();
kafed1.src="img/knop/kn_kafed.
kafed2=new Image();
kafed2.src="img/knop/kn2_
nov1=new Image();
nov1.src="img/knop/kn_nov.gif"
nov2=new Image();
nov2.src="img/knop/kn2_nov.
hist1=new Image();
hist1.src="img/knop/kn_hist.
hist2=new Image();
hist2.src="img/knop/kn2_hist.
adres1=new Image();
adres1.src="img/knop/kn_adres.
adres2=new Image();
adres2.src="img/knop/kn2_
tuim1=new Image();
tuim1.src="img/knop/kn_tuim.
tuim2=new Image();
tuim2.src="img/knop/kn2_tuim.
web1=new Image();
web1.src="img/knop/kn_web.gif"
web2=new Image();
web2.src="img/knop/kn2_web.
strel_21=new Image();
strel_21.src="img/knop/strel_
strel_22=new Image();
strel_22.src="img/knop/strel_
function graph(graphName, pict){
document.images[graphName].
}
</SCRIPT>
<table border="0" width="775" height="96">
<tr>
<td width="193"
height="352" background-repeat: repeat-y; background-attachment:
fixed; background-position: left top" valign="top" style="background-repeat:
repeat-y; background-attachment: fixed; background-position: left top">
<p align="justify" style="margin-left: 48; margin-right: 0; margin-top: 5; margin-bottom: 8">
<img border="0"
name=glav src="img/knop/kn_glav.gif" width="139"
height="25" alt="Главная" style="color:
#FFFFFF; font-family: Times New Roman; font-size: 12pt" ></p>
<p align="justify" style="margin-left: 48; margin-right: 0; margin-top: 10; margin-bottom: 8">
<A href="abitur.htm" onmouseout="graph('abitur', abitur1)" onmouseover="graph('abitur', abitur2)"
target=_parent>
<img border="0"
name=abitur src="img/knop/kn_abitur.gif" width="139"
height="25" alt="Абитуриентам" style="color:
#FFFFFF; font-family: Times New Roman; font-size: 12pt"></a></p>
<p align="justify" style="margin-left: 48; margin-right: 0; margin-top: 10; margin-bottom: 8">
<A href="zaochnik_let.htm"
onmouseout="graph('zaochnik', zaochnik1)" onmouseover="graph('zaochnik',
zaochnik2)" target=_parent><img border="0" name=zaochnik
src="img/knop/kn_zaoch.gif" width="139" height="25"
alt="Заочникам" style="color: #FFFFFF; font-family:
Times New Roman; font-size: 12pt"></a></p>
<p align="justify" style="margin-left: 48; margin-right: 0; margin-top: 10; margin-bottom: 8">
<A href="kafedra.htm"
onmouseout="graph('kafed', kafed1)" onmouseover="graph('kafed',
kafed2)" target=_parent><img border="0" name=kafed
src="img/knop/kn_kafed.gif" width="139" height="25"
alt="Кафедры" style="color: #FFFFFF; font-family:
Times New Roman; font-size: 12pt"></a></p>
<p align="justify" style="margin-left: 48; margin-right: 0; margin-top: 10; margin-bottom: 8">
<A href="homostud/novosty.htm"
onmouseout="graph('nov', nov1)" onmouseover="graph('nov',
nov2)" target=_parent><img border="0" name=nov
src="img/knop/kn_nov.gif" width="139" height="25"
alt="Новости" style="color: #FFFFFF; font-family:
Times New Roman; font-size: 12pt"></a></p>
<p align="justify" style="margin-left: 48; margin-right: 0; margin-top: 10; margin-bottom: 8">
<A href="histor.htm" onmouseout="graph('hist', hist1)" onmouseover="graph('hist', hist2)" target=_parent><img border="0" name=hist src="img/knop/kn_hist.gif" width="139" height="25" alt="История" style="color: #FFFFFF; font-family: Times New Roman; font-size: 12pt"></a></p>
<p align="justify" style="margin-left: 48; margin-right: 0; margin-top: 10; margin-bottom: 8">
<A href="adress.htm"
onmouseout="graph('adres', adres1)" onmouseover="graph('adres',
adres2)" target=_parent><img border="0" name=adres
src="img/knop/kn_adres.gif" width="139" height="25"
alt="Наш адрес" style="color: #FFFFFF; font-family:
Times New Roman; font-size: 12pt"></a></p>
<p align="justify" style="margin-left: 48; margin-right: 0; margin-top: 10; margin-bottom: 8">
<A href="tuimazy.htm"
onmouseout="graph('tuim', tuim1)" onmouseover="graph('tuim',
tuim2)" target=_parent><img border="0" name=tuim
src="img/knop/kn_tuim.gif" width="139" height="25"
alt="г.Туймазы" style="color: #FFFFFF; font-family:
Times New Roman; font-size: 12pt"></a></p>
<p align="justify" style="margin-left: 48; margin-right: 0; margin-top: 10; margin-bottom: 8">
<A href="web_master.htm" onmouseout="graph('web', web1)" onmouseover="graph('web', web2)" target=_parent><img border="0" name=web src="img/knop/kn_web.gif" width="139" height="25" alt="Web-мастер" style="color: #FFFFFF; font-family: Times New Roman; font-size: 12pt"></a></p>
<p align="justify"
style="margin-left: 49; margin-right: 0; margin-top: 15; margin-bottom:
8"><img border="0" src="img/knop/strel_1.jpg"
width="55" height="29"><img border="0"
src="img/knop/strel_000.jpg" width="27" height="29"><A
href="abitur.htm" onmouseout="graph('strel_2', strel_21)"
onmouseover="graph('strel_2', strel_22)" target=_parent><img
border="0" name=strel_2 src="img/knop/strel_2.jpg"
alt="Следующая" width="55" height="29"></a></p>
</td>
<td width="546" height="352" bgcolor="#FFFFFF" bordercolor="#FFFFFF" bordercolorlight="#FFFFFF" bordercolordark="#FFFFFF" style="background-color: #FFFFFF; background-repeat: repeat-y; background-attachment: fixed; color: #FFFFFF; background-position: left top" valign="top">
<p style="margin-left:
5; margin-top: 5; margin-bottom: 10"><a href="0201_pravoved.htm"><font
size="3" color="#3333CC" face="Times New Roman"><b>0201
«Правоведение»</b></font></a><
<p style="margin-left: 5; margin-top: 20; margin-bottom: 10"><a
href="0202_sociolog.htm"><font size="3" color="#3333CC"
face="Times New Roman"><b>0202 «Право
и организация социального
<p style="margin-left: 5; margin-top: 20; margin-bottom: 10"><a href="0205_sociolog.htm"><font size="3" color="#3333CC" face="Times New Roman"><b>0603 «Финансы»</b></font></a></p>
<p style="margin-left:
5; margin-top: 20; margin-bottom: 10"><a href="2203_po.htm"><font
size="3" color="#3333CC" face="Times New Roman"><b>2203
«Программное обеспечение вычислительной
техники и автоматизированных систем»</b></font></a></p>
<p style="margin-left:
5; margin-top: 20; margin-bottom: 10"><a href="dopoln_obr.htm"><font
face="Times New Roman" size="3" color="#3333CC"><b>
<p style="margin-left: 10 margin-top: 50"> </p>
</td> </tr></table>
<p style="margin-left: 0; margin-top: 50; margin-bottom: 0"></p>
</body>
</html>
Листинг
файла 1kurs.htm (похожая структура у файлов
2kurs.htm, 3kurs.htm)
<html>
<head>
<title>1-й курс</title>
<META
content="tguk.narod.ru,ТГЮК, Туймазинский, Государственный, Юридический, колледж, Образование, наука, Туймазы, РБ, Республика Башкортостан," name=KeyWords>
<META content="Туймазинский
Государственный Юридический
</head>
<body bgcolor="White"
leftmargin="0" topmargin="0" marginwidth=0 marginheight=0
style="background-repeat: repeat-y; background-attachment: scroll;
background-image: url('../../fon.jpg'); background-position: left top">
<p style="word-spacing:
0; margin: 0"><img border="0" src="../../baner/ban_1.jpg"
width="779" height="29"></p>
<p style="word-spacing:
0; margin: 0"><img border="0" src="../../baner/ban_2.jpg"
width="779" height="19"></p>
<p style="word-spacing:
0; margin: 0"><img border="0" src="../../baner/ban_3.jpg"
width="779" height="23"></p>
<p style="word-spacing:
0; margin: 0"><img border="0" src="../../baner/ban_4.jpg"
width="779" height="25"></p>
<p style="word-spacing:
0; margin: 0"><img border="0" src="../../baner/ban_5.jpg"
width="779" height="33"></p>
<p style="word-spacing:
0; margin: 0"><img border="0" src="../../baner/ban_6.jpg"
width="779" height="37"></p>
<SCRIPT language=JavaScript>
glav1=new Image();
glav1.src="../../img/knop/kn_
glav2=new Image();
glav2.src="../../img/knop/kn2_
abitur1=new Image();
abitur1.src="../../img/knop/
abitur2=new Image();
abitur2.src="../../img/knop/
zaochnik1=new Image();
zaochnik1.src="../../img/knop/
zaochnik2=new Image();
zaochnik2.src="../../img/knop/
kafed1=new Image();
kafed1.src="../../img/knop/kn_
kafed2=new Image();
kafed2.src="../../img/knop/
nov1=new Image();
nov1.src="../../img/knop/kn_
nov2=new Image();
nov2.src="../../img/knop/kn2_
hist1=new Image();
hist1.src="../../img/knop/kn_
hist2=new Image();
hist2.src="../../img/knop/kn2_
adres1=new Image();
adres1.src="../../img/knop/kn_
adres2=new Image();
adres2.src="../../img/knop/
tuim1=new Image();
tuim1.src="../../img/knop/kn_
tuim2=new Image();
tuim2.src="../../img/knop/kn2_
web1=new Image();
web1.src="../../img/knop/kn_
web2=new Image();
web2.src="../../img/knop/kn2_
strel_11=new Image();
strel_11.src="../../img/knop/
strel_12=new Image();
strel_12.src="../../img/knop/
strel_21=new Image();
strel_21.src="../../img/knop/
strel_22=new Image();
strel_22.src="../../img/knop/