Web-жобалау

Интернеттің дамуының арқасында кез келген ақпарат немесе туындаған сұрақтарын интернет арқылы табуға тырысатын пайдаланушылардың саны артты. Өйткені интернет – қарапайым адамдардың бөліскен іс-тәжірибелерінен бастап, өмірдің әртүрлі салаларындағы жинақталған, жалпыға қолжетімді, үлкен көлемдегі ақпараттардың көзі. Интернеттің қазіргі дамуы 90-жылдар басында компьютерлер арасында мәлімет алмасудың жаңа хаттамасы пайда болғаннан кейін басталды. Бұл хаттама НТТР (Hyper Text Transfer Protocol – гипермәтінді тасымалдау хаттамасы) деп аталған болатын. Осы хаттамамен қатар НТТР серверлерінің кеңейтілген желілері – интернет арқылы файлдар тасымалдай алатын World Wide Web қызметі пайда болды. WWW (World Wide Web)-ні «Дүниежүзілік өрмек», кейде қысқа түрде Web (веб) деп атайды. Webтің көмегімен қажетті ақпаратты іздеу, жинақтау және оны экранға шығаруды ұйымдастырады. Веб-тің негізгі қызметі – қажетті ақпаратты іздеу, жинастыру және оны экранға шығаруды ұйымдастыру. Оның экранда көрсетілетіні – мәліметтер, графиктер, фотосуреттер.

WWW құжаттары интернетке тұрақты түрде қосылатын компьютерлер – Web-серверлерде сақталады. Web-серверлерде құжаттар жекелеп емес, өзара байланысқан құжаттардың тобы ретінде орналасады. Мұндай топ Web-түйінді (вeб-сайт) құрайды. Дайын материалдардың вeб-сайтта орналасуын Web-басылым немесе Web-жарияланым деп атайды. WWWдағы жеке құжат web-бет деп аталады.

Web-бет – бұл мәтіннен, графикалық иллюстрациялардан, мультимедиалық нысандардан тұратын құжаттар жиынтығы. WWW – бұл гипермәтінде негізделген, мультимедианың бөлінген ақпараттық жүйесі

HTML гипермәтіндік тілін 1989 жылы Тим Бернерс-Ли ұсынғаны белгілі. Тегтер программалау тілдеріндегі «BEGIN END» жақша ұғымдарына жақын және жергілікті айнымалылардың HTML атауларының арасындағы амалдардың аймағын білдіреді. Құжаттағы мәтіндік элементтерді түсіндіру ережелерінің амалдарын анықтайды, т.б.

Сайтты жоспарлау

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

Сайтты жоспарлау кезеңдері:

Сайтты қандай мақсатта жасауды анықтау;
Сайтта қандай ақпарат орналастыру керектігін анықтау;
Қажетті ақпаратты жинақтау;
Сайттың дизайнын белгілеу;
Сайттың логикалық құрылымын дайындау;
Сайттың физикалық құрылымын ойластыру, сайтты құрайтын бөлек файлдарды бумаларға бөліп алуды жоспарлау.

Web-сайт жұмысын ұйымдастыру кезеңдері:

Жоспарлау;
Элементтерді жасақтау;
Программалау;
Тестілеу;
Жариялау;
Жарнамалау;
Бақылау.

HTML тілі

Web-беттің негізгі қызметі – қажетті ақпаратты іздеу, жинастыру және оны экранға шығаруды ұйымдастыру. Вeб-беттер түрінде дайындалып сақталған электрондық құжаттарға мәлімет, график, фотосуреттер жатады. Электрондық құжаттың қарапайым құжаттан айырмашылығы – оның жазылу форматында. Интернетте электрондық құжат құру үшін HTML арнайы тілі пайдаланылады және олар HTML форматында сақталады.

HTML (HyperText Markup Language-гипермәтіндік белгілеу тілі) – қатаң ережелері бар компьютерлік тіл. HTML тілінде құжаттың авторы өз мәтінін тегтер деп аталатын символдар көмегімен арнайы файлға – web-бетке айналдырады. Web-беттің мазмұны әртүрлі болуы мүмкін, бірақ барлығы да арнаулы HTML тілінде жазылғандықтан, бұл құжаттардың кеңейтілімі .htm немесе .html болып келеді.

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

Тег дегеніміз не? HTML тiлiнде қолданылатын командалар «тег» деп аталады. HTML тiліндегi тегтер екi топқа бөлiнедi: жұпты, жұпсыз. Жұпты тегтер де бiр тег ашылса, келесi тег оны жабады. Мысалы, <html> тегтiң жұмысын ашады да, келесi <html> тегi оны жабады. Жұпсыз тегтер – тег ашылып, жабылуды қажет етпей қолданыла беретін тегтер.

CSS

CSS (Cascading Style Sheets – Каскадтық стильді кестелер) – HTML, XHTML, т.б. белгілеу тілдерінде жазылған web-беттердің сыртқы көрінісін безендіретін, әрлейтін тіл. Бұл тілде web-беттердің сыртқы көрінісіндегі қаріптер мен түстердің орналасуы, блоктар сияқты элементтерді жасауға болады. Белгілеу тілдерінде (HTML, XHTML, XML, т.б.) web-беттердің логикалық құрылымдары мен сыртқы көріністерін безендіруді бір-бірінен бөліп қарастыруға болады. Әрқайсысы бөлек болса, сайт жасағанда да, сайттың кодын оқығанда да түсінікті болады.

1990 жылдары web-стандарттау жұмыстары қарқынды дамыды және web-дизайнерлер үшін сайт жасауда ортақ бір стандарт қажет болатын. Соның арқасында HTML 4.01, XHTML және CSS стандарт пайда болды. «Каскадтық стильді кестелер» терминін 1994 жылы Хокон Виум Ли енгізді. Хокон Берт Боспен CSS-ті дамытып, оған Интернет Консорциумы «Webстандарты» деген атау берді.

Артықшылықтары:

• HTML кодының көлемін едәуір кемітеді және оны оқуға ыңғайлайды.

• CSS тілі көмегімен HTML тілінде беруге болмайтын параметрлерді жасауға болады. Мысалы, сілтемелердің астындағы сызықты алып тастауға болады.

• CSS арқылы web-беттің сыртқы көрінісін оңай өзгертеміз. Көп құжаттардың сыртқы көрінісін бір кесте арқылы көрсетуге болады. Мысалы, отыз бет жазылған web-беттегі қаріпті жасыл түске боядық делік. Біраз уақыт өткен соң, қаріпті көк не қызыл түске өзгерткіміз келсе, онда отыз беттегі қаріптің барлығының түсін қолмен өзгертіп шығуға тура келеді. Ал CSS тіліндегі жазылған бір қатар программа коды арқылы сол отыз беттің барлығына бірден қажетті өзгертулерді жасауымызға болады;

• Құрамалы және жинақталған дизайн техникасының болуы. CSS тілінде «сайт версткасы» (орналастыру) деген ұғым бар.

Қарапайым web-бет жасауда CSS-ті қолдану: Блокнот программасынан жаңа бет ашып, оны style.css атауымен html бет орнатылған бумаға сақтаймыз. Ол біздің стильдеріміздің беті болады. Енді біз style.css бетін html-бетке жалғауымыз керек. Ол үшін html-де сыртқы файлдарды жалғауға жауап беруші тегі бар. Осы тегті қарастырылып жатқан html-бетке қосамыз:

Скриптерді қолдану

«Скрипт» термині – құжатты жүктеу кезінде немесе кейінірек орындалуы мүмкін клиенттік сценарийлерді қамтитын HTML түзету тілі.

JavaScript – нысанды бағытталған, императивті және функционалды стильдерді қабылдай алатын мультипарадигмалық программалау тілі.

Нысан – деректер мен функциялар жиынынан тұратын бірыңғай конструкция немесе JavaScript терминологиясындағы қасиеттер мен тәсілдер жиыны. JavaScript, әдетте, программалық жасақтаманың нысандарына қол жеткізу үшін енгізілген тіл ретінде пайдаланылады. Бұл тіл браузерлерде web-беттерді интерактивті ету үшін сценарий тілі ретінде кеңінен қолданылады. JavaScript программасын жасау үшін ешқандай қосымша құралдар қажет емес, тек сәйкес версиядағы JavaScript тілін көтере алатын және HTML құжаттамаларды құруға мүмкіндік беретін мәтіндік редактор ғана қажет. Програм ма JavaScript-тің тікелей HTML-құжаттама мәтінінде тұрғызылатын болғандықтан, біз өзіміздің жұмысымыздың нәтижесін құжаттаманы браузермен қарау кезінде көре аламыз және қажет болғанда өзгерістер енгізуге мүмкіндігіміз болады.

Негізгі сәулеттік ерекшеліктері:

• динамикалық теру;

• әлсіз теру;

• жадыны автоматты басқару;

• прототипті программалау бірінші санаттыны сандар ретінде жұмыс істейді. JavaScript-ге көп те ген тілдер әсер еткендіктен, программалаушы маман болмаса да оны қолдану оңай.

Мультимедиа енгізу

Мультимедиа – мәтін, графика, анимация, сандық бейнелерді, бейне, дыбыс сияқты деректер типін енгізуге, өңдеуге, сақтауға, беруге және бейнелеуге мүмкіндік беретін технологиялар жиынтығы.

Web-беттердің басқа web-беттерге қатысты сілтеменің болуы – World Wide Web жүйелерінің ең тартымды ерекшеліктерінің бірі. HTML құжатында гипермәтіндік сілтемелерді құру өте жеңіл. Ол үшін атрибуты, яғни параметрі бар ашылатын және қарапайым жазылатын тегтері пайдаланылады. Жалпы сілтемелер жасаған кезде мынадай ережелерді есте сақтаған жөн.

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

1) Фреймдерді құру үшін HTML-дің ерекше құжаты пайдаланылады, оның құрылымы кәдімгі құжаттардан бөлек болады. Осындай құжаттарда құжат «денесінің» бөлімдері болмайды, ол шын мәнінде қандай да болсын мәтінде мүлде болмайды. Оның орнына бұл құжаттар да < F R A ME S E T > және < / F R A ME S E T > тегтерінің арасында орналасқан фреймдер болады.

2) <FRAMESET>тегі, терезелерді бөлу әдістерін анықтайтын атрибуттар: • COLS = атрибуттарын пайдаланған уақытта терезелер вертикаль сызықтар мен; • ROWS = атрибутын пайдаланған уақытта горизонталь сызықтар мен бөліктерге бөлінеді. Осы атрибуттардың мәндері терезе бөліктерінің биіктігін (немесе енін) анықтайды. Әр бағанға (жолға) арналған параметрлер пиксель өлшем бірлігі бойынша үтірлер арқылы немесе процентпен (% белгісі) беріледі.

3) <FRAMESET>және <FRAMESET> тегтерінің арасын да қалыптасқан бөліктердің қажеттілігін көрсететін қосым ша тегтер орналастырылады. Осы мақсаттар үшін терезені қосымша бөлу мүмкіндігін беретін, ендірілген тегін немесе экрандағы жеке бөліктеріне шақырылатын құжаттарды анықтайтын, жеке-даралық тегтерін пайдалануға болады. және тегтерінің араларына орналастырылған элементтердің саны қалыптастырылған бөлік санына сәйкес болуы керек.

4) <FRAME >тегінде аталмыш бөлікке шақырылатын құжаттарды анықтайтын SRC = міндетті атрибуттары болуы керек. Қосымша атрибуттар және фреймдер арасындағы қоршауларды және оның басқа кейбір қасиеттерін реттеу мүмкіндігін береді.