Дипломдық жұмыс: Бағдарламалау | HTML.JavaScript.Flash сияқты тілдер

Кіріспе..………………………………………………………………………………3
1 HTML БӨЛІМІ…………………………………………………………………………………………….4
1.1 HTML негіздері…………………………………………………………………………………..4
1.2 Мәтінді форматтау тегтері…………………………………………………………………..5
1.3 Программалық жабдықтау………………………………………………………………….6
2 jаvascript БӨЛІМІ…………………………………………………………………………………8
2.1 jаvascript-негізгі…………………………………………………………………………………8
2.1.1 Сахналық жоба тіліне түсінік……………………………………………………………8
2.1.2 jаvascript және Jscript, VBScript, ECMAScript-тердің айрмашылығы…8
2.1.3 jаvascript және java-ң айрмашылығы………………………………………………..8
2.1.4 jаvascript-тің қолданылуы………………………………………………………………..9
2.2 jаvascript версялары және оны қолдану………………………………………………9
2.2.1 jаvascript-ң қолданушы браузері……………………………………………………..9
2.3 Объектіге бағытталған тіл…………………………………………………………………10
2.3.1 Объектілерге түсінік………………………………………………………………………10
2.3.2 Объекті әдістері және сипаттамалары…………………………………………….10
2.3.3 Объектінің атқарылуы……………………………………………………………………11
2.3.4 клас және Объект…………………………………………………………………………..11
2.4 jаvascript тің редакторы……………………………………………………………………11
2.4.1 Блакнот………………………………………………………………………………………….11
2.4.2 Dreamweaver…………………………………………………………………………………..11
2.5 Деректер типтері, тұрақтылар, және айнымалылар…………………………….12
2.5.1 Біріккен деректер типтері……………………………………………………………….13
2.6 jаvascript ортасындағы басқа оператырлар………………………………………..13
2.6.1 Сурет Объектісі……………………………………………………………………………..14
3 ЭЛЕКТРОНДЫ ОКУЛЫҚТЫҢ ЖАСАЛУ САТЫЛАРЫ…………………………….17
3.1 Көлденең сілтемелердің жобалануы…………………………………………………..17
3.2 Вертикал менюдің жасалынуы…………………………………………………………..17
3.3 Кітаптағы анимация………………………………………………………………………….18
3.4 Суреттің түссіздендірілуі………………………………………………………………….20
3.5 Байланыстар бетінің Форм элементтерін құрастыру………………………….20
3.6 Жұмыстың ең соңғы корінерлік нәтижесі………………………………………….22
Қорытынды………………………………………………………………….….23
Пайдаланылған әдебиеттер тізімі………………………………………………………………….24
Кіріспе
Қазақстан Республикасының білім беру жүйесін ақпараттандыру еліміздің даму стратегиясының негізгі бағыттарының бірі, себебі ХХІ ғасыр – білім беру жүйесін ақпараттандыру ғасыры.
Бүгінгі таңда компьютерлік дизайн, Web-дизайн, жүйелік программалушы, администратор және тағы басқа мамандардың қажет екендігін түрлі жарнамалық газеттерден, бұқаралық ақпарат құралдарынан да көруге болады. Аталған мамандықтарды қалай дайындап, оларға қандай программалық құралдарды үйрету арқылы жетілдіруге болатыны әдістемелік жұмыстың өзекті мәселелерінің бірі болып отыр.
Жұмыс екі бөлімнен тұрады, біріншісі теориялық: HTML,jаvascript секілді негізгі тілддердің қолданылуы; Ал екіншісі болса практикалық, бұл бөлімде осы білімдерді пайдаланып біз дайын бір Электронды кітап жасап шығамыз.
1-БӨЛІМ HTML БӨЛІМІ
1.1 HTML негіздері
HTML гипертекстік тілін (Hypertext Markup Language) 1989 жылы World Wide Web гипертекстік жүйесін бөлудің өңдеу технологиясының компоненттерінің бірі ретінде Тим Бернер-Ли ұсынғаны белгілі. Гипертекстті бөлу негізіне құжаттың әрбір элементі тегтерімен қоршалған элементтердің жиынтығы түрінде көрсетуге болатын құжатты сипаттаудың тегтік моделі жататын болған. Өзінің мәні бойынша тегтер программалау тілдеріндегі «begin/end» жақша ұғымдарына жақын және локальді айнымалылардың аттарының арасындағы амалдардың облысын береді, құжаттағы тексттік элементтерді түсіндіру ережелерінің амалдарын анықтайды және т.б.
HTML форматында текст элементін қоюдың жалпы схемасы келесі түрде жазылуы мүмкін:
элемент мазмұны .
Элемент мазмұнының алдындағы конструкция элемент басының тегі деп аталады, ал элемент мазмұнынан кейін орналасқан конструкция элемент соңының тегі деп аталады.
HTML құжатының құрылысы бірінің ішіне бірі салынған контейнерлерді қолдануға мүмкіндік береді. Шынында да, құжаттың өзі – бұл «HTML» атымен аталатын бір үлкен контейнер.
HTML құжаттарды көру үшін браузерларды қолданамыз. Браузер-программалардың саны өте көп, мысалы көп таралғандар Netscape Communicator, Microsoft Internet Explorer, Opera.
HTML тiлiнде колданылатын командаларды “тег” деп айтамыз. HTML тiліндегi тегтер екi топқа бөлiнедi: жұпты, жұпсыз.
Жұпты тегтер дегенiмiз, бiр тег ашылса, келесi тег оны жабады. Мысалы,
тегтiң жұмысын ашады да келесi тегi оны жабады. ашылуы, жабылуы.
Жұпсыз тегтер дегенiмiз, тег ашылады да қолданыла бередi. Мысалы, т.с.с.
Көрсетілген мысалдарды компьютерде көрү үшін мәтінді Блокнот программасына теріп, оны htm түрінде сақтаңыз. Файлды браузерде ашыңыз.
Құжаттың структурасы
HTML құжаттың негізгі структурасы төмендегідей:

…
HTML-тег атрибуттар тізімінен тұрады. Тег тексті үшбұрышты жақша ішінде жазылады. Мысалы:
Менің бірінші бетім — бұл жерде — тег, face – атрибут, arial – атрибуттың мәні.
Кез келген HTML құжат тегімен басталып, тегімен аяқталу керек. Бұл тегтер браузерға HTML құжатын көрсетеді. Құжат болса қарапайым ASCII кодындағы мәтіндік файл. , тегтер болмаса браузер программалары құжатты танымай қалуы мүмкін.
, тегтерінің ортасына құжат денесі келеді. Құжат екі бөлімнен тұрады: тақырып бөлімі тегімен басталынатын және тегімен басталынатын негізгі бөлімнен.
Тақырып бөлімі міндетті емес, бірақ ол жерде браузерге қажетті көп ақпарат болуы мүмкін.
, тегтерінің арасында құжаттың аты жазылады, сол сөз терезенің тақырып жолына шығады.
Мысалы:
Моя первая страница
бөліміне тағы тегтерді қолдануға болады, олар сайтты интернет желісінде тез табылу үшін пайдалынады.
— сайт тілі
— сайт авторы
— іздеу қызметіне арналған сөздер
— қай программада жасалынды
тегімен Web-беттің негізгі бөлімі басталады. Бұл бөлімге мәтін, графика, кесте, аудио және видео ақпараттар енгізіледі.
1.2 Мәтінді форматтау тегтері
Құжатта тақырыптар , тегтерімен жасалынады, бұл жерде і=1 болғанда ең үлкен тақырып жазылады, і=6 болғанда – ең кіші.
Абзац енгізу үшін , тегтерін қолданады, мәтіннің сол жақ, ортада, оң жақта орнату үшін align атрибуты пайдалынады.
Мысалы:
Менің бірінші бетім
«Менің бірінші бетім» сөйлемі беттің ортасына орналасады.
Align дің мәні тағыда left (сол жақ), right (оң жақ) болуы мүмкін.
тегінің көмегімен біз мәтіннің шрифтің, көлемін, түсін белгілейміз. Ол үшін атрибуттарды пайдаланамыз.
Мысалы:

Менің бірінші бетім
Осындай жол жазғанда Web бетімізде arial шрифтімен, 5-көлемде, көк түсті «Менің бірінші бетім» деген сөйлем шығады.
Жолды бөлү үшін тегін қолданса болады, мысалы:
Ана тілін – арың бұл,
Ұятын боп тұр бетте

Тізім
Нөмірленген тізімді ұйымдастыру үшін және тегтері қолданылады.
Егер тізім номерін керекті бір номермен бастау керек болса онда start атрибутын пайдалынамыз.
Тізімдің түрін өзгерту үшін type атрибуты көмектеседі, мысалы номерлерді латын цифрларымен жазу үшін төмендігідей жазамыз.
Web дизайнерлер графика мәселесіне келгенде екі топқа бөлінеді. Бірінші топ графикасыз Web сайт ол сайт емес деп ойласа, екінші топ керісінше Web сайттарға суреттің қажеті жоқ деп санайды, себебі олар кейбір модемдердің және жүйелердің күші жетпейтіндігін ескеріп отыр. Дегенменде сайтқа графиканы қолдану мүмкіндік бар және соны тиімді пайдалану керек. Ол үшін бізге тегі src атрибутымен көмектеседі. Суретті сайтқа орналастыру үшін src атрибутына суреттің толық жолын көрсету керек, мысалы, rose.jpg суретi С дискасының My img папкасына орналасқан болса, онда төмендегі тег жазылады:

width және heigth атрибуттармен суреттің көлемін өзгертуға болады, биіктігі және ені.
alt атрибутымен суретке қосымша мәтін түрде қосымша мәлімет шығаруға болады.

Web графика туралы айтқанда төмендегі атрибуттарды ұмытпау керек: background – бұл атрибут сайтқа суретті фон ретінде орналыстырады, bgcolor – фонға түс береді.
Сілтеме
HTML дің негізгі қасиеті ретінде оның басқа құжаттарға сілтемеу жасау мімкіндігі айтуға болады. HTML құжатынан алысқа орналасқан компьютерге, құжаттың ішіндегі белгілі бір орынға, HTML құжатына, басқа бір сайтқа сілтеме орнатуға болады. Сілтемені ұйымдастыру үшін тегі қолданылады.
Мысалы,
Пенжим сайтына сілтеме
Бұл мысалда біз www.penjim.narod.ru сайтына сылтеме жасадық.
Сілтеме мәтін түрде және сурет (кнопка) түрде болуы мүмкін. Сурет түрде орнату үшін тегтерінің ортасына суретті тегімен орнату керек.
HTML-де кесте жасау
Web-құжатының негiзгi бөлiктерiнiң бiрi — кесте. Ол тiктөртбұрыш бағаналар мен көлденең орналасқан жолдардан тұратын торлар жиыны түрiнде қарастырылады. Жол мен бағанның қиылысы ұяшық деп аталады. Бiр ұяшықта мәтiн, сурет немесе басқа бiр шағын кесте орналаса алады. Кесте келесi бөлiктерден тұрады:
• кесте тақырыбы;
• бағаналар тақырыптары;
• ұяшықтар.
Кесте жолдар тiзбегi бойынша бiртiндеп толтырылады (солдан оңға қарай жол соңына дейiн, сонан соң келесi жолға көшу). Әрбiр ұяшыққа мәлiметтер енгiзiледi. Боя ұяшық жасау үшiн бос орын таңбалары енгiзiлуi тиiс.
1.3 Программалық жабдықтау
HTML-құжаттарды жасақтау және өңдеу үшін кезкелген қарапайым мәтіндік редактор жеткілікті, мысалы Блокнот. Көп дизайнерлердің ойы бойынша таза сілтемелер тілін қолмен жазған дұрыс. Бірақ көп уақытта қолмен жазған қолданылмайды. Себебі қолмен жазған автордан көп білімді және практикалық тәжірибені талап етеді.
Бірінші үлкен топтың Web-сайт жасау программалары HTML-тілінің негізінде жұмыс істейді. Осындай программалар орта және үлкен сайттарды даярлау уақытын қысқартады және даярлау кезеңінің тиімділігін көтереді. Арнайы HTML-редакторлердің жұмысты жеңілділетін және тездететін қосымша мүмкіндіктері көп. Бұл топқа төменгі программалар кіреді:
HTML генератор 1.3 ;
Magic HTML Studio 2.0;
Macromedia Dreamweaver;
Екінші үлкен топқа WYSIWYG (ағылшын тілінен “what you see is what you get” — не көрсең соны аласың) редакторлері кіреді. Бұл программаларды тағыда визуалды редакторлар деп айтады.
Осындай программалар графикалық интерфеске ие. Бұл прораммалардың бастапқы махсаты дизайнерді HTML тегтерінен босату болған. Кәзірге замандағы визуалді HTML-редакторлар дизайнерді көптеген әрекеттерде басатады. Осындай артықшылықтарына қарамастан кемшілігі бар – олар таза HTML кодын жасамайды, оған артық және «фирменный» тегтерді қосады.

2-БӨЛІМ jаvascript БӨЛІМІ
2.1 jаvascript-негізгі

2.1.1 Сахналық жоба тіліне түсінік.
jаvascript-Бір бейнелеу типіндегі сахналық жоба тілі. jаvascript арқылы web беттер жобаланып,тор беттері тіптіде әсем жанды етіп көрсетілді. jаvascript-ең алдымен “көркем желі ”компаниасы шығарған ашық обиектілі сахналық жоба тілі.
Бастапта бұл компанианың браузері NetScape-ті қолданды. Кейін келе жүмсақ бөлшек компанианы InternetExplorer браузерін шығарды,содан бастап jаvascript кең көлемді қолдауға ие болды. Қазіргі кезде қолданылып жүрген браузерлердің көбісі jаvascript-ке қолдау көрсетіп отыр.
jаvascript-төмендегідей екі бөлімнен тұрады:
Кленіттік jаvascript: яғыни біз үнемі қолданылып жұрген jаvascript,бұл HTML кодымен бірге қолданылады,әрі біз ұнемі кездестіретін jаvascript осы Кленіттікjаvascript.
Серверлік jаvascript: бұл сервердегі jаvascript, ASP, JSP, PHP сияқты серверлік сахналық желілерге ұқсас. серверлік jаvascript-серверден файлдарды оқу,деректер қорына сұраныс қатарлы істерді орындай алады.
2.1.2 jаvascript және Jscript, VBScript, ECMAScript-тердің айрмашылығы
jаvascript және Jscript, VBScript, ECMAScript-тердің барлығыда тор беті сахналық желі тілдері, барлығыда кленіттік браузерде көрсетіледі төмендегі ұш тілді ұқсамаған компаниалар шығарған.
○jаvascript-“көркем желі ”компаниасы java-тілі негізінде шығарды.
○VBScript-жұмсақ бөлшеккомпаниасы VisualBasic тілі негізінде шығарды.
○Jscript-жұмсақ бөлшек компаниасы шығарды, jаvascript тілімен негізінен ұқсас.
○ECMAScript-“көркем тор” компаниасы және Европа компютер өндіріу бірлеспе мәжілісінде ортаға қойылған jаvascript-тің қалқаралық өлшемді сахынадық желі тілі.
JvaScript және VBScript-ұқсамаған екі компания ашқан, себебі бұл екі сахналық желі тілінің граматикасында ұқсамастықтар бар,әйткенмен атқаратын қызыметі ұқсас, брақ жазылу коды бір-бірінен озгеше.
2.1.3 jаvascript және java-ң айрмашылығы
jаvascript және java cөздерінің жазылуында айырмашылық ұлкен
емес, шынындада екеуінің арасында граматикалық ұқсастықтар дан басқа ішінара жерлерінде ұқсамастықтар бар.
○Java прогоаммасының коды міндетті түрде редактордан өткен соң барып атқарылады, ал jаvascript-те редактор қажет емес, тек браузерде атқарылады.
○Java және jаvascript-тілдерінде екеуіндеде клент және сервер ұғымдары бар, брақ Java көбінесе серверде іске асса, ал jаvascript-кленітте көбірек қолданыдады.Егер Java кленітте орындадатын балса онда міндетті түрде JVM(Java Virtual Machine) ортасын жүктеу керек.
○ jаvascript-кодын тікелей HTML файылна жазуға болады, ал Java-да Applet міндетті түрде HTML де жазылумен бірге, HTML файылының ішінен Applet-ті таңдап қолданылады.
○jаvascript-те айнымалыларды қолдану алдында айнымалылардың деректер типін шақыру қажет емес, ал Java-да айнымалыларды қолдану алдында міндетты тұрде айнымалылардың деректер типін шақыру қажет.
2.1.4 jаvascript-тің қолданылуы.
jаvascript-кленіттік сахналық желі тілі болғанымен, бырақ атқаратын қызыметі өте жоғары, төменде бірнеше маңызды ерекшеліктері берілген.
Еекше ұлкен тор беттерінде.
Тізімдерді тексеруде.
Қоданушының жұмысын жеңілдету үшін jаvascript-те Cookies-ті қолдану арқылы қолданушының қызыметін жеңілдетуге болады.
Әр түрлі типтегі ойындарды жасауға болады.

2.2 jаvascript версялары және оны қолдану.
jаvascript-1995 жылы шыққаннан қазырге дейін, қазырге дейін он неше жыл болды, он неше жылдан бері jаvascript тарихында төмендегідей бірнеше версялары болды.
jаvascript1.0:бұл jаvascript-ң ең алғашқы версясы еді, қазыргі аты LiveScript, қазыргі кезде қолданудан қалып қойды.
jаvascript1.1: jаvascript1.0 негізінде жаңадан массив обиектілері қосылды, әрі jаvascript1.0қателіктері түзетілды.
jаvascript1.2: jаvascript1.1-ң негізінде Switch таңау оператыры қослыды, барақ қосымшалары толық емес еді.
jаvascript1.3: jаvascript1.2-ң қосымшаларына тұзетулер енгізді.
jаvascript1.4: сервердің кызыметін жоғарлатты.
jаvascript1.5: jаvascript1.3-ң негізінде программаны бір жақтылы ету қосымшалары қосылды.
2.2.1 jаvascript-ң қолданушы браузері.
Қазіргі кезде қолданылып жұрген браузерлер InternetExplorer(IE), NetScape браузері, және Opera компаниасының Opera браузері және Mozilla-компаниасының FireFox браузері барлығыда jаvascript-ті қолдайды,брақ олардың қолдау версялары әр түрлі.
InternetExplorer6 -jаvascript1.1, jаvascript1.2, jаvascript1.3 версяларын қолдайды.
NetScape7- jаvascript1.1 денjаvascript1.5 ке дейінгі версяларын қолдйды.
Frifox7- jаvascript1.1 денjаvascript1.5 ке дейінгіверсяларын қолдйды.
Opera9- jаvascript1.1 денjаvascript1.5 ке дейінгі версяларын колдайды……