Сайт жасауды оқыу әдістемесі

Автор работы: Пользователь скрыл имя, 27 Февраля 2013 в 19:39, дипломная работа

Краткое описание

Дамыған елдердегі білім беру жүйесінде ерекше маңызды болып табылатын мәселелердің бірі – информатика пәнінен WEB сайт арқылы оқытуды ақпараттандыру, яғни оқу үрдісінде ақпараттық технологияларды пайдалану болып табылады. Қазіргі таңда да елімізде білім беру жүйесінде жаңашылдық қатарына ақпараттық кеңістікті құру еніп, көкейтесті мәселе ретінде күн тәртібінен түспей отырғандығы мәлім.[1]

Содержание

Кіріспе .............................................................................................................5
Интернет желісінде электронды кешенді құру негіздерін оқыту........7
1.1 WEB дизайн және браузерлер, іздеу роботтары..............................7
1.2 Сайт құруға арналған бағдарламалау тілдері...................................17
1.3 Интернеттегі web серверлер. Web – сервер жұмысының
механизмі. Статистикалық және динамикалық беттер.
CGI технологиясы. Скриптер..................................................................24
Оқушыларға сайт құруды оқытудың әдістемесі..................................29
2.1 Әртүрлі тілдерде сайт құру әдістемесі............................................. 29
2.2 Желілік ресурсты құру кезеңдері.......................................................59
2.3 Желілік ресурсты қолдану әдістемесі................................................61
Қорытынды .....................................................................................................65
Қолданылған әдебиеттер тізімі......................................................................66
Қосымша...........................................................................................................67

Скачать полностью (1.06 Мб) Сколько стоит заказать работу?
Прикрепленные файлы: 1 файл

редактированная.docx

— 1.11 Мб (Скачать документ)

Мәтін фрагменттерін  ерекшелеу

1.      RASP.HTM файлына төмендегідей өзгерістер енгізіңіздер:

<HTML>

<HEAD><H2> Менің алғашқы  парағым </H2>

<TITLE>Алғашқы HTML файлы</TITLE>

</HEAD>

<BODY><B> Сәрсенбі күнгі </B>сабақ </I><U>кестесі</U></BODY></HTML>

2.      Өзгертілген Web-құжатты экраннан көріп шығыңыздар. Мұнда сөз тіркестерін ерекшелеуді аралас түрде де қолдануға болады:

<I><B> Сәрсенбі күнгі  </B></I> сабақ </I><U> кестесі  </U>

Бірақ мұндайда тэгтерді араластыра жазудың мынадай ережелерін есте сақтаған жөн:

<Тэг-1><Тэг-2>...</Тэг-2></Тэг-1> - дұрыс жазылған тізбек

<Тэг-1><Тэг-2>...</Тэг-1></Тэг-2> - қате жазылған тізбек

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">

<title>Шрифт өлшемі және  түрі</title>

</head>

<body>

<p><strong>Бұл сөз  &lt;b&gt; тегінің көмегімен жазылған</strong><br>

  Бұл  сөз &lt;big&gt; тегінің көмегімен жазылған<br>

<em>Бұл сөз &lt;em&gt; тегінің көмегімен жазылған</em><br>

<em>Бұл сөз &lt;i&gt; тегінің көмегімен жазылған</em><br>

  Бұл  сөз &lt;small&gt; тегінің көмегімен жазылған<br>

<strong>Бұл сөз &lt;strong&gt; тегінің көмегімен жазылған</strong><br>

  H2O мұндағы 2 саны &lt;sub&gt; тегінің көмегімен жазылған<br>

  E=mc2 мұндағы 2 саны &lt;sup&gt; тегінің көмегімен жазылған<br>

  Бұл сөз &lt;ins&gt; тегінің көмегімен жазылған<br>

</p>

</body>

</html>

COLOR– шрифттің түсін береді Текстті <FONT COLOR=n></FONT> тэгтерінің ортасына қойсақ (бұл жердегі n – түс аты) Сіз оған керекті өлшем бересіз:

<font COLOR="white">Қызыл</font> 
<font COLOR="#FF0000"> Қызыл </font>

Сонымен түс туралы басынан айтып кетейік. <BODY> тэгінің ішіне BGCOLOR параметрін жазып және оған түс атын немесе оның 6 орынды кодын беру керек. Берілген екі мысал бетті қызыл түспен бояйды.

<BODY BGCOLOR="RED">(түстің аты қолданылған) 
<BODY BGCOLOR="#FF0000">(түс 6 орынды кодпен берілген)

Уеб-беттің арқа беті(background)

Уеб-беттің артқы беті(background)

<body> тегі уеб-беттің  артқы бетін сәндеу үшін екі  атрибут қолданады. Біріншісі  - "bgcolor", екіншісі - "background". Мұндағы  "background" атрибуты арқылы уеб-беттің  артқы бетіне сурет қоя аламыз. Ал "bgcolor" атрибуты арқылы артқы  бетке түс береміз. Барлығын  мысалдармен көрейік

Мысалдар

<body bgcolor="blue">

немесе

<body bgcolor="red">

Ал сурет қоярда былай  жазамыз:

<body background="http://www.webteacher.kz/images/suret.jpg">

HTML-де түстер (colors)

HTML-де түстер 

HTML-де түстер RGB (қызыл, жасыл, көк) комбинациясын оналтылық сандар жүйесінде жазу арқылы белгіленеді. Ең төменгі мәні - #00, ең жоғарғы мәні - #FF. Төменде айтылып отырған комбинация арқылы жазылған түстердің кестесі берілген:

W3C Стандарт түстердің  атаулары: 
     W3C, 16 түстің стандартты атауын берген. Олар: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, және yellow.

16 миллион түрлі түс Қызыл, жасыл және көк түстерінің әр бірінің 255 түрлі реңі бар. Бұл үш түсті неше түрлі комбинацияда жазып (255 x 255 x 255) 16 миллион түрлі түс шығаруға болады. Бірінші қосымшада  қызыл түстің 255 түрлі реңі жазылған (барлығы емес) кесте келтірілген (бұл жерде жасыл мен көк түстер жоқ):

  HTML-де түстердің атаулары бірінші қосымшадағы кестеде ең көп қолданылатын шолғыштардың көрсете (қолдай) алатын түстердің ағылшынша атауы және оналтылық жүйеде жазылу тәсілі көрсетілген:

Қаріп гарнитурасы (типі) мен түсін өзгерту

<FONT>тэгі бөліктерініңкөлемін, типін және түсін өзгертуге мүмкіндік береді. Қаріп типін өзгерту <FONT> тэгіне FAGE атрибутын қосу арқылы орындалады. Мысалы, мәтін бөлігін KZ Arial қарпімен жазу үшін: <FONT FAGE=”KZ Arial”> тэгін қолдану қажет.

Қаріп түсін беру үшін <FONT>тэгінің COLOR=”X”> атрибутын жазу керек. Мұндағы Х орнына ағылшын тіліндегі түс атын немесе оның он алтылық жүйедегі сандық мәнін жазса болады. Он алтылық санды қолданғанда, түс құрамындағы қызыл (R-Red), жасыл (G-Green), көк (B-Blue) бояулардың араласу мөлшерін 00 мен FF сандары аралығындағы мәндермен көрсету керек. Осы тәсілді бояу түсін көрсетудің RGB форматы деп атайды.

1.      RASP.HTM файлына төмендегідей өзгерістер енгізіңіздер:

HTML>

<HEAD><H2> Менің алғашқы  парағым </H2>

TITLE>Алғашқы HTML файлы</TITLE>

</HEAD>

<BODY>

<U><I><B><FONT COLOR=”#FF0000”  FAGE=”ARIAL”> SIZE=”7”

Сәрсенбі күнгі </FONT></B></I></U><BR>

<FONT COLOR=”GREEN” FAGE=”ARIAL”  SIZE=”4”>сабақ кестесі

</BODY>

</HTML>

2.      Өз қалауларыңыз бойынша құжат мәтіндерінің мөлшерін, түсін, гарнитурасын, стилін өзгерте отырып қарап шығыңыздар.

 

Құжат фоны мен  жапы мәтіннің түсін беру

Құжат фоны мен жылпы мәтіннің түсін беру кезінде браузерлер алдын  ала келісілген (по умолчанию) түстерді пайдаланады, олар браузерлер параметрлері арқылы тағайындалады. Егер біз басқа  түстерді пайдаланғымыз келсе, онла олардың бастапқы мәндері HTML файлының бас жағында жазылатын <BODY> тэгінде  көрсетіледі. Осы тэгтің BGCOLOR=... атрибуты құжаттың фон түсін, TEXT=... атрибуты жалпы  мәтін түсін анықтайды. LINK=… және VLINK атрибуттары әлі қаралмаған және қаралған сілтемелік сөздер түсін тағайындайды (соңғы екеуі кейінірек қарастылады)

RASP.HTM файлына төмендегідей  өзгерістер енгізіңіздер:

HTML>

<HEAD><H2 ALIGN=”CENTER”> Моя  первая страница </H2>

TITLE> Учебный файл </TITLE></HEAD>

<BODY> BGCOLOR=”#FFFCC” TEXT=”#330066”

<P ALIGN=”CENTER”><FONT COLOR=”#008080”  SIZE=”7”>

<B> Расписание </B></FONT><BR><FONT SIZE=”5”>

<I>занятий на СРЕДУ </I>

</FONT>

</P>

</BODY>

</HTML>

 

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">

<title>Шрифт өлшемі және  түрі</title>

<style type="text/css">

<!--.style1 { color: #0000FF;

font-weight: bold;}

.style2 { color: #666666;

font-style: italic;}

.style3 {color: #000000}-->

</style>

</head>

<body>

<p><span class="style1">HTML –да тегтік модельдер құжаттың  белгілеулері болыпе  табылады  Тегтік модель құжатты тегпен  басталып және аяқталатын контейнерлердің  жиынтығы сияқты сипаттайды. Яғни  НТМL  құжаты  қарапайым АSСII-файлы сияқты  көрсетіледі .  </span><br>

<span class="style2">Көбінесе  НТМL құжаттарының  тегтерін түсіну  және қолдану оңай ,  өиткені олар ағылшын тілінің сөздерімен пайдаланылған қысқартуларды және  белгіленулерді түсінеді.   НТМL – тегі  қажет емес тегтің атрибуттар тізімінен кейін болатын аттан құралады. Тегтің  мәтіні бұрышты жақшалардан тұрады (&lt; және &gt;).</span><span class="style3">Тегтің ең қарапайым оңай  вариянты – бұрыштық жақшаларға негізделген аты. Мысалға: &lt;HEAD&gt; немесе  &lt;i&gt;. Қиын тегтер үшін, функцияның тегтерін видео өзгерту үшін автормен  анықталған дәл мағынасы бар болатын атрибуттардың айырмашылығы сипатталады. </span></p>

</body>

</html>

 

HTML-құжатының контейнері.

Әрбір құжаттың құрама бөліктерінде оның ішінде қолданылатын өзінің контейнер  жинағы болады. Құжат денесінің контейнерлері  тақырыпта немесе FRAMSET контейнерінде  қолданылмайды. Контейнерлердің әрбір  тобын толықтай қарастырайық.

HTML-HEAD құжатының тақырыбының  контейнерлері

Құжат тақырыбы атрибут қажет етпейді. Тақырып тегінің басты тағайындалуы – бұа барлық құжаттардың бейнелеу параметрлерін түгелдей сипаттау. Бұндай параметрлерге құжаттарды бейнелеу  стилін, гипермәтіндік сілтеменің жалпы базалық адресін, жалпы гипермәтіндік сілтеме, идентификатор және құжат атын және т.б. жатқызуға болады. Біз тек қана жиі кездесетін контейнерлерді қарастырамыз.

TITLE

Такырып тегінде жиі қолданылатын құжат аты болып табылады.

TITLE келесі синтаксисті  алады

<TITLE> Құжат аты  </TITLE>

TITLE  тегінің  мазмұны  құжат атының алаңында бейнеленеді.

BASE

BASE тегі URL формасында гипермәтіндік  сілтеме көрсету формасымен байланысты. URL спецификациясы құжат адресатының  екі формасын анықтайды: толық  және толық емес. HTML  URL адресінің  толықтай формасын қолдануға  рұқсат етеді. Сонымен спецификацияның  екінші формасын қолдану үшін,  оны бірдемемен негіздеу керек,  базалық адресті сурау толық  еместен URL-дің толық формасын  қалыптастыруда қолдануға болады. BASE тегі осы базаны анықтауға  мүмкіндік береді.

ISINDEX

HTML-құжатын кілттік сөз  бойынша іздеу мүмкіндігі құжат  тақырыбының ISINDEX тегі арқылы  анықталады. Тілдің алғашқы версиясында  берілген тег қосымша атрибут қабылдамады. Егер сервер кілттік сөз бойынша сұраныс жасайтын болса, онда ол автоматты түрде тақырыпқа ISINDEX тегін қояды. Кілттік сөз тізімін клиент құжат адресіне “?” символдан кейін жазады. Түсінікті, сұранысты сервер атқарады, “?” символдар түгел болған кезде іздеу машинасына айналды. HTML-құжаты “жазғы” программасымен, сонда кілттік сөз “?”-кейін осы программаның адресіне жазылады. Тілдің алғашқы версиясында өңдеу программасын көрсету және “SEARCH ISINDEX” стандартының орнына сөйлемді сұрау мүмкіндігі туды.

<ISINDEX HREF=

http://polyn.net.kiae.su/cgi-bin/search

PROMPT=”Enter Keywords:”>

Көрсетілген мысалда  HREF атрибуты сұранысты өңдеу программасының адресін анықтайды, ал атрибут PROMPT –  шақыру мазмұнын анықтайды.

        META

META тегі HTML спецификациясында  жоқ құжат тақырыбының конструкциясын  анықтау үшін қажет. Ол үш  атрибут қабылдайды: NAME, CONTENT, HTTP-EQUIV. Берілген текті қолдану қиындығы, осы тег арқылы еңгізілетін  конструкцияны интерпретациялау  үшін,  сервис немесе интерфейс  қолданушылар осы конструкцияны  кеңейтуі және қолдануы керек.  Осындай жұмыс түрі үшін программа  SGML конструкциясын түсіндіріп беру(интерпретировать) керек. Берілген тегті тәжірибеде  қолданудың бірден-бір түрі тақырыпқа  анықталған HTTP-EQUIV атрибуты арқылы  протокол бойынша HTTP ақпаратын  қосу.

< META HTTP-EQUIV=”Keywords”

          CONTENT=”Plasma, Nuclear Physics”>

Осындай қолдану кезінде  почтаны жіберуге ыңғайлы болу үшін, HTTP-пакет тақырыбында мынадай  жолдар қосылады: Keywords: Plasma, Nuclear Physics.

Құжат денесінің  тегі.

Құжат денесінің тегі интерфейстік қолданушы программасында ақпаратты  көрсетуді басқарады. Олар мәтінде  тізілген контекстік гипермәтіндік  сілтеме көмегімен деректер базасының  гипермәтіндік құрылымын бейнелейді. Құжат денесі тұрады:

-иерархиялық контейнер  және заставка;

-тақырыптар (Н1-Р6 дейін);

-блоктар(параграфтар, тізімдер, формалар, кестелер, суреттер және  т.б.);

-көлденеңінен белгілеп  алу және адрестер;

-мәтіндер, стильдерді жүргізу  облыстарына бөлінген(сызылған, белгіленген,  курсивті);

-математикалық бейнелеу, графиктер және гипермәтіндік  сілтеме;

BODY

Құжат денесінің тегін  бейнелеу BODY тегі арқылы бастап жазылады. HEAD тегінен айырмашылығы, BODY тегі атрибут  қабылдайды:

ID-тег идентификаторы. Тегті  атау үшін, сол сияқты гипермәтіндік  сілтеме бойынша нүктелік ауысу  түрінде қолданылады. Берілген  атрибут құжат бетінің барлық  тегінде бар. 

LANG-екісандық  ISO-639 код  түрінде  құжат тілін анықтайды,  нүктеден кейін міндетті емес ISO-3166 форматында қала коды алынады.  Тіл стандартын құраушылардың  ниеті бойынша берілген атрибут  түсіндіру программасын тану  және көптілді мәтінді бейнелеуді  басқару керек. Сонымен қатар  Arena да, арнайы  HTML 3.0 иллюстрациялау  үшін арналған, ол осы мүмкіндікті  іске асырмайды.

CLASS-“ADDITION.FIRST” типті иерархиялық  құрылған ат. Мәтін тегін, анықталған  бейнелеу стилімен байланыстыруға  арналған. Қазіргі кезде қолданылмайды.

Жоғарыда көрсетілген  үш атрибут дене тегіне жалпы болып  табылады және алдағы уақытта оларды қарастырмаймыз. Егер атрибут құжат  мәтіннің дене тегінде кеңейтілмесе, онда ол арнайы көрсетіледі.

BACKGROUND-құжат мәтінін бейнелейтін  фонды анықтайды, мысалы,  HTML-құжатында  фон ретінде үлкен емес графикалық  кескін ”bgr.gif” қолданылады.

< BODY BACKGROUND =”bgr.gif”>

Осы мысалда көрсетілгендей, берілген атрибуттың мәні ретінде URL формасында қысқартылған адрес қолданылады. Бұл  локальдық файл адресі.

<BR> тегі

Жолдың аударылымы мәтінді  бейнелеудің стандарттар ретін  бұзу үшін қолданылады. Интерпретацияның қарапайым режимінде қолданушының интерфейс программасы мәтінді  автоматты түрде жолдарға бөлу арқылы жұмыс терезесінде көрсетеді. Бұл  режимде мәтінде бар болған соңғы  жол ескерілмейді. Кей-кезде үлкен  айқындық үшін басуды жаңа жолдан бастау керек. Ол мақсатта <BR> тегі қолданылады. <BR> тегіндегі  CLEAR  атрибуты көрсетілген  нүктеде объектіні мәтінмен  сүйірлеу(обтекание) үшін қолданылады және содан кейін  мәтінді объекттің ар жағында  бос областа жалғастыру үшін. Объекттің  ар жағында жалғасып жатқан мәтін CLEAR  атрибутында LEFT, RIGHT және ALL мәндеріне  сәйкес тегістеледі

Информация о работе Сайт жасауды оқыу әдістемесі