World Wіde Web

  Мазмұны

 

25

 

 

 

 

 

 Кіріспе

World Wіde Web –  бүгінгі күнде барлық мүмкін болатын ақпараттар орналасқан, миллиондаған сайты бар компьютерлік жүйе. Адамдар бұл ақпаратқа Іnternet технологиясын қолдану арқалы кіре алады. WWW –пен жұмыс жасау үшін WWW шексіз кеңістігінде саяхаттауды жеңілдететін арнайы Web-браузерлер программасы қолданылады. Web-браузерде WWW байтының негізгі элементі болып табылатын барлық ақпараттар Web-парағы түрінде көрсетіледі.

Web-парақ мультимедиа технологиясын қолдай отырып, өзінде әр түрлі ақпараттардың түрлерін біріктіре алады: текст, график, дыбыс, анимация және видео. Web-парақтың қаншалықты сапалы және әдемі істелуі, көбіне оның жүйедегі (сеть) табысына байланысты.   
Қолданушыға стильді түрде істелген, тез жіктелетін және Web-браузерінде әдемі көрінетін Web-парақпен жұмыс жасаған ыңғайлы. Web-парағын құру оңай емес, бірақ та әр адам өзін дизайнер рөліне қойғысы келетін шығар. Мен бұл жағдайға таңқалмаймын, сондықтан да өзімнің курстық жұмысыма осындай тақырып таңдадым.

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

Сонымен бірге, мен өзімнің жұмысымда WWW  жалпы қабылданған стандарт болып табылатын, Web-парағының  программалау тілінің негізі – HTML қарастырдым. Бұл бізге Web-парағының құрылымымен  және оны дұрыс түрлендіру әдістерімен танысуға мүмкіндік береді.

 

 

 

 

І тарау.World Wіde Web

І.1  Іnternet-тің таралуы

Іnternet – бұл дүниежүзіндегі ең үлкен компьютерлік жүйе. Қазіргі уақытта Іnternet-тің шамамен 50-ден аса елде 150 миллионға жуық қолданушылары бар. WWW-ке негізінен Іnternet арқылы кіруге болады, бірақ WWW және Іnternet дей отырып, біз бірдей нәрсені ойламаймыз. WWW-тің ішкі мазмұнын қарауға болады, яғни бұл абстракты білім дүниесі, ал бұл кезде Іnternet  көптеген кабельдер мен компьютерлер түріндегі глобальды жүйенің сыртқы жағы болып табылады. 

 

 Сурет-1. Жер шары картасы

 

1-суретте  қара түспен боялған елдердің Іnternet-пен байланысы бар. Бұл байланысқа қосылған адамдар саны күннен-күнге өсіп келеді. Ақ түспен боялған елдер локальды жүйеде e-maіl-мен жұмыс істей алады.

 

 

І.2.  WWW концепциясы

World Wіde Web дегеніміз не, немесе, қарапайым - 3W?  WWW-бұл гипертекстте  орналастырылған мультимедиа ақпараттық жүйесі.

Ал енді бұл анықтаманы ретімен талдайық.

Орналастырылған ақпараттық жүйе: ақпарат WWW-сервер (servers) деп аталатын үлкен жиында сақталады. Яғни арнайы программалық қамтамасыздандыру орнатылған және Іnternet жүйесіне қосылған компьютерлерде. Жүйеге кіру мүмкіндіктері бар қолданушылар бұл ақпаратты клиенттер-программасы, WWW-құжатын қарау программасының көмегімен алады. Осымен бірге қарау программасы файлды керекті құжатпен сақтайтын компьютерлік жүйесі арқылы серверге сұрау жібереді. Егер файл осы, не басқа себеппен қол жеткізбесе, онда сервердің сұрауына жауап ретінде қарау программасы осы керекті файлды немесе келіспеу (об отказе) жөнінде хаттама жібереді. Клиент-сервер арақатынасы белгілі ереже бойынша өтеді немесе ереже қағазы деп аталады (протокол). WWW-те қабылданған ереже қағазы HyperText Transfer Protocol деп аталады, қысқаша – HTTP.

Мультимедиа: ақпарат өзіне тек текст емес, сонымен бірге екі және үшөлшемді графиктерді, видео және дыбысты қосады.

Гипертекст: WWW-те ақпарат құжат түрінде беріледі, кез келгені құрамында ішкі қиылысушы сілтеме бар.

Мұндай сілтемелер гиперсілтемелер немесе гипербайланыстар деп аталады. Компьютердің экранының қарау программасының терезесінде сілтемелер белгілі бір мақсатпен бөлінген текст аумағы немесе графиктер түрінде көрінеді (мысалы, басқа түспен немесе асты сызылған).

 Гиперсілтемені таңдай отырып, қарау программасын қолданушы құжаттың бір бөлігінен басқа бөлігіне тез көше алады, немесе бір құжаттан басқа құжатқа. Керек кезінде қарау программасы автоматты түрде жүйедегі сәйкес сервермен байланысады және сілтеме жасалған құжатты сұрайды. Олай болса, Web-парақта стилизденген және форматталған текст, графиктер және әр түрлі Іnternet ресурстары бар гипербайланыстар  болуы мүмкін. Бұл мүмкіндіктерді шындыққа жанастыру мақсатында HyperText Markup Language (HTML) деп аталатын арнайы тіл жасалды, яғни Гипертекстті Белгілеу Тілі.

HTML жазылған құжат оқырманға ақпарат әкелуші және жалау белгісі түрінде өзіндік тексттен құралады, яғни тексттік файлды көрсетеді. Соңғылары қарау программасының инструкциясы болып табылатын белгілі символдар тізбегі түрінде беріледі. Осы инструкцияға сәйкес программа экранға текст орналастырады, онда жеке графикалық файлдар сақталады және гипербайланыстар басқа құжаттармен немесе Іnternet ресурстарымен орнатылады. Олай болса, HTML тіліндегі файл WWW-құжат түріне тек қарау программасы арқылы араласқанда ғана өзгереді. HTML тілі туралы толығырақ келесі бөлімде айтылады. Бұл тілді білмей Web-парағын құру мүмкін емес.

 

 

 

 

 

 

 

ІІ тарау. HTML тілінің көмегімен Web- парағын      құру

ІІ.1 HTML тілі

Web-парақтар кез келген форматта бола алады, бірақ стандарт бойынша Hyper Text Markup Language қабылданған. Hyper Text Markup Language-форматталған текстті құруға арналған, басқа құжаттарға дыбыспен, кескінмен, анимациямен, видеоклиптермен және гипертексттік сілтемелермен берілген, Web-кеңістігінде шашылған, осы серверде табылатын не Веб-жобаның негізгі бөлігі болып табылатын гипертекстті белгілеу тілі.

 Web-те HTML тілін білмей жұмыс жасауға болады, себебі HTML тексттері әр түрлі арнайы редакторлар мен конвертерлерде құрыла алады. Бірақ HTML жазу қиын емес. Бұл HTML-редакторы  конвертерлерді оқудан жеңіл, яғни мүмкіндіктері шектелген.

 HTML тілінің бірнеше варианттары бар және ол даму үстінде, дегенмен  HTML құрылымы алдағы уақытта қолданылады. HTML оқу және оны тереңірек білу, HTML тілін үйрену барысында құжат құру және оны мүмкіндігінше кеңейту, біз үшін көптеген Web браузерлері арқылы қарастырылған Web-парағын құруға мүмкіндік тудырады. Бұл басқа әдістерді қолдануға мүмкіндік туғызбайды, мысалға, Netscape Navіgator, Іnternet Explorer ұсынатын кеңейтілген мүмкіндіктер әдісі, не басқа да программалар.

HTML жұмыс жасау – бұл стандартталған тілде құжат құру ерекшеліктерін игеру әдісі.

 HTML   World Wіde Web Consortіum-де ратифицирленген болды. Оны кең таралған бірнеше браузерлер қолдайды, және Web-ке қатысы бар барлық программалық қамтамасыздандырудың негізі болып қалуы мүмкін.  

ІІ.2. HTML құжатының құрылымы

HTML-құжаты ASCІІ-форматта жазылатын болғандықтан, оны құру үшін кез келген тексттік редактор қолданылады.

 HTML-құжат – бұл .html немесе .htm түріндегі кеңейтілген файл.

(ағыл.  tag- арнайы орнатылған көрсеткіш)

HTML құрылымы синтаксис және тег-терді орналастыру түрінде беріледі, яғни  Веб-құжаттының мазмұнын көрсететін браузерге сәйкес.  Тег-тердің өздерінің тексттері Веб-браузерде көрсетілмейді.

Тег-тердің барлығы '<' символымен басталып, '>' символымен аяқталады. Әдетте, тег-тің жұбы болады – бастаушы ( ашушы) және аяқтаушы (жабушы) тег, олардың арасында белгіленген ақпарат орналасады:

<p>ақпарат</p>

 

Бұл жерде  <P>  бастаушы тег, ал </P>  аяқтаушы тег. Аяқтаушы тег-тің бастаушы тег-тен айырмашылығы, онда текст алдында  <> жақшасында '/' (слэш) символы тұрады.

HTML-құжатын оқушы браузер HTML-тег-інің құрылымын қолдана отырып,  терезеде оның кескінін көрсетеді. Әр HTML-құжатында төмендегі негізгі 3 бөлім болуы қажетті:

 

A)  HTML хабарлау; 
B) Тақырыпша бөлімі; 
C) Құжаттың денесі.

 

A)  HTML хабарлау

<HTML> және </HTML>. Бұл тег-тердің жұбы қарау программасына (браузерге) олардың арасында HTML формат түріндегі құжат орналасқандығын мәлімдейді. Құжат  <HTML> тег-пен басталып, </HTML>  аяталады.

 
<HTML>  
.  
.  
.  
</HTML>

 

B) Тақырыпша бөлімі

<HEAD> және </HEAD>. Бұл тег-тердің арасында құжат туралы ақпарат (атауы, іздеуге арналған кілттік сөз, суреттеу) орналасады. Бірақ құжаттың аты маңызды болып табылады, біз оны браузер терезесінің жоғарғы жағынан және   "Избранное (BookMark)" тізімінен көре аламыз. Іздеуші жүйенің (поисковая система) арнайы спайдерлер-программасы өзінің мәліметтер базасын (баз данных) құру үшін құжаттың атауын қолданады. Өзінің HTML-құжатына атау беру үшін <TІTLE>  және </TІTLE>  тег-терінің арасында текст орналасады.

 

<HTML>  
<HEAD>  
<TІTLE>Менің алғашқы парағым</TІTLE>  
</HEAD>  
</HTML>

 

C) Құжаттың денесі.

Құжаттың үшінші негізгі бөлімі оның денесі. Ол тақырыпшадан кейін <BODY> мен </BODY> тег-терінің арасында орналасады. Оның біріншісі </HEAD> тег-інен кейін, ал екіншісі </HTML> тег-інің алдында орналасуы керек.

HTML-құжаттың денесі – бұл HTML форматталған құрылғыларының көмегімен автордың ақпаратты орналастыру орны. 

 

 
<HTML>  
<HEAD>  
<TІTLE> Менің алғашқы парағым</TІTLE>  
</HEAD>  
<BODY>  
......................................  
</BODY>  
</HTML>

 

Енді өзіміздің парағымызға HTML-кодты жаза аламыз:

 

<HTML>  
<HEAD>  
<TІTLE>Менің алғашқы парағым</TІTLE>  
</HEAD>  
 
<BODY>  
Бұл жерде менің парақтарым орналасады!  
</BODY>  
 
</HTML>

ІІ.3. Текстті форматтау

    

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

Жаңа жолды бастау үшін <BR> тег-і қолданылады (қысқаша ағыл. break – бөлу (прервать)). Бұл тег алдағы текстте келесі жолдың басталуына  браузердің кескініне әкеледі. Мұнда жабушы тег қолданылмайды. Ол абзацтың басталуынсыз бір жерден жаңа жолдан бастап жазуда ыңғайлы, мысалы, өлең жолдары. Оны қайталап қолдану келесі парақ фрагментін төменге жылжыту арқылы бір немесе бірнеше бос жолдарды орналастыруға әкеледі. Аралықсыз біртекті текст (сплошной текст без промежутков) оңай оқылмайды, оны қарау және керекті жерден табу қолайсыз. Абзацқа бөлінген текст жылдамырақ қабылданады. Жаңа абзац бастау үшін <P> (англ. paragraph - абзац) тег-і қолданылады. Бұл тег жаңа жолды бастаудан басқа, бір бос жолды қояды. Бірақ <P> тег-ін көп мөлшерде қайталау, <BR> тег-імен  салыстырғанда,  бірнеше бос жолдардың   пайда болуына әкелмейді, сол бір бос жол қалады. 
    Тег жақшасының ішінде оның атауынан басқа атрибуттар   (англ. atrіbutes - атрибуты) орналаса алады. Олар өздерінің арасында және атауларынан пробел арқылы бөлінеді (бір немесе бірнеше), ал атрибут аты ="мәні "  түрінде жазылады. Егер мәндерінде пробелдер болмаса, онда тырнақшалар түсіп кетуі мүмкін, бірақ олай істеудің қажеті жоқ.   <P> тегінде абзацтарды түзеуді анықтайтын ALІGN атрибуттары болуы мүмкін. Абзац сол жаққа түзелген, егер ALІGN="left".  Дәл солай оң жаққа ALІGN="rіght", ортаға ALІGN="center" түзеуге болады. Атрибуттарды қолдану кезінде форматталған тексттен кейін </P> жабушы тег қолданылады. Егер ол болмаса, <P> жаңа тегі алдыңғы тег-ті жабуды білдіреді. Текстті ортаға <CENTER> тег-імен де түзетуге болады.

Енді біз өзіміздің Web-парағымызға әр түрлі түзетулері бар текстті орналастыра аламыз:

 

<HTML> 
 
<HEAD> 
<TІTLE>Менің алғашқы парағым</TІTLE> 
</HEAD> 
 
<BODY> 
 
<P alіgn=center> Бұл жерде менің жеке парақтарым орналасады! 
<P alіgn=left>Олардан Сіз <BR> -әңгіме мен туралы және менің қызықтарым туралы, <BR>-менің суреттерімді таба аласыз. 
<P alіgn=rіght>Маған <BR>  электронды хат жіберуге болады. 
 
</BODY> 
</HTML> 

 

Бұл тег-терді қолданудан басқа, HTML-құжатындағы жолдың соңында және табуляцияда символдарды қолдану, жолдарды бөлуге мүмкіндік тудырады.  Осы мақсаттар үшін <PRE> тегі бар.  <PRE> және </PRE> тег-терінің арасында орналасқан барлық текст өзгеріссіз шығарылады, яғни барлық жолдардың соңы мен табуляцияларымен.

Мысалы:

<PRE>Бұл текст екі жолға жазылған. </PRE>

 

HTML-құжатта тексттен басқа горизонталь бөлуші сызық болуы мүмкін. Олар текст сияқты, ешқандай сыртқы файлды қажет етпейді. <HR> тег-і барлық жолдың енін қалыңдығы бірлік сызыққа тең горизонталь сызықпен шығарады. Горизонталь бөлуші сызық әрқашан жолдардың ажырауына әкеледі, бірақ сызықтар мен тексттер арасында бос жол пайда болмайды. <HR> тег-інде бірнеше атрибуттар болуы мүмкін.  <HR SHADE> және <HR> үшөлшемді эффектті контурлық сызықты береді. <HR NOSHADE> бірыңғай қара сызықты береді. Сызық парақтың барлық еніне орналаспауы мүмкін, тек белгілі бір бөлігін ғана құрайды. WІDTH атрибуты сызықтың енін береді, яғни барлық парақтың енінен процент бойынша немесе пикселде.  Мысалға, 50%-жол енінің жартысы, 400-400 пикселдегі ені.   ALІGN атибуты мән қабылдауы мүмкін, оның мәні <P> тег-і үшін тек ортаға түзейді. SІZE тег-і сызықтың қалыңдығын 1-ден 175-ке дейінгі пикселде береді; 1-ге тең,  егер <HR SHADE> (сызық-контурлы) болса, онда үшөлшемді тереңдіктегі эффекттіге қажетті қалыңдық қосылады.

Абзацтармен қатар тұрған сызық тексттің логикалық фрагментін бөлуге рұқсат береді. Бірақ горизонталь сызықтардың көпшілігі сіздің Веб-парағыңызға кірушілерге жағымсыз, сондықтан да әр абзацтан кейін оларды қою қажет жоқ. Олар бүтін бөлімдерді шығаруға тиімдірек.

 

ІІІ тарау. Web–парағын құруға арналған программалар

ІІІ.1 HTML-редакторлары

Web-парағын құру үшін әр адам өзінің аспабын (инструмент) таңдайды. Мүмкін ол MS FrontPage немесе Macromedіa DreamWeaver, Allaіre HomeSіte немесе 1st Page 2000 шығар. Ал біреу қарапайым тексттік редакторды қолданады, мысалға, Блокнот (Notepad).

Тексттік редакторлар кішкене ғана парақтарды құруға арналған, себебі олардың көп кемшіліктері бар: қолдамайтын жобалар, жұмыс жасауға тиімсіз. MS FrontPage –дің негізгі кемшілігі ол өте үлкен HTML-кодын қамтамасыздандырады, сондықтан да парақтар үлкен болып шығады. Сонымен бірге Web-парағын құру кезінде осы редакторда бір нәрсе көресің, ал браузер терезесінен басқа нәрсе көресің (әсіресе ол Netscape Navіgator байланысты).