Автор работы: Пользователь скрыл имя, 01 Октября 2015 в 20:09, курсовая работа
Краткое описание
Зерттеудің мақсаты: Бағдарламалау тілдерінде электрондық оқулықтарды жасау және география пәнінде оны қолдану тиімділігін теориялық-практикалық тұрғыда негіздеу. Зерттеу нысаны: Әртүрлі бағдарламалау тілдерінің мүмкіндіктерімен танысу және олармен жұмыс жасау.
Содержание
Кіріспе.....................................................................................................................3 І Электронды оқу құралдарын дайындау әдістері............................................5 1.1 Оқытудың компьютерлік құралдарын жасау әдістемесі............................9 1.2 Электронды оқулық және оның тиімділігі..................................................10 1.3 Электронды оқулықтың құрылымы.............................................................13 1.4. Электрондық оқулықтарға қойылатын талаптар.......................................15 1.5 Оқытудың компьютерлік кұралдарының бір түрі тестілеу......................17 ІІ Электронды оқулық жасауда қолданылған программалау тілдері мен технологиялар..................................................................................21 2.1 HTML тілінің шығу тарихы..........................................................................21 2.2 HTML құжатының құрылымы.....................................................................22 2.3 HTML тілінің тэгтері мен элементтері.....................................................23 2.4.JavaScript сценарийлер тілі...........................................................................41 2.5. JavаScript тілінің ерекшеліктері..................................................................42 2.6. Java Script айнымалылары мен функциялары..........................................43 ІІІ География пәнінен электронды оқулық......................................................46 3.1.Электронды оқулықтың құрылымы............................................................46 4.Экономикалық бөлім.......................................................................................49 Қорытынды..........................................................................................................53 Қолданылған әдебиеттер тізімі..........................................................................57 Қосымша..............................................................................................................59
1. Әріптің мөлшерін, түсін
және сызылымын таңдап алу
үшін <font> тегін пайдаланамыз. Бұл
қосарланған тег оның ашылған және жабылған
тегтер арасында орналасқан барлық мәтінді
түрлендіруге болады. <font> тегінде қолдануға
болатын size=…., color=…, face=…, тәрізді, 3 атрибутының
ең болмағанда біреуі тұруы тиіс: 1-ші атрибуты
әріптің мөлшерін тағайындайды. Әріптің
алдын-ала берілетін 7 түрлі көлемі бар.
Олар :1-7 сандар. Егер сан көрсетілмесе
келісім бойынша 3-ке тең деп саналады.
color= — әріптің түсін таңдау мүмкіндігін
береді. face= – қаріп (шрифт) типін береді.
Осы атрибуттың мәні компьютерде орнатылған
қаріп атының біріне сәйкес келуі керек.
Мысалы:
<body>
Алдарыңызда
<font color=”yellow” face= arial size=”4”>
төртінші мөлшермен arial типімен
аталған сары түсті әріптер.
</font>
</body>
2. Осы параметрдің барлығын
бүкіл құжат үшін бірден беру қажет болса,
онда
<base font> бір ғана тег пайдаланылады.
Бұл тегте де жоғарыда көрсетілген атрибуттарды
пайдаланылады. Олар қаріп түрін, мөлшерін,
түсін анықтайды.
3. Тегтердің тағы бір арнайы
тобы қаріптің сызылымын өзгерту мүмкіндігін
береді.
<b> және </b> тегтері араларында
орналасатын мәтін қарайтылған қаріпке
ауысады.
<i> және </i> тегтері қаріптерді
курсивпен береді.
<u> және </u> тегтері мәтіндердің
астын сызады , <s> және </s> тегтері
белдерінен сызылған символдарды бейнелейді.
Мысалы:
<html>
<head>
</head>
<body>
<base font size=5 face=”Arial kz ”>
негізгі қаріп Arial kz типінде
5-ші мөлшермен жазылған.
<p><font size=-2 face=”Times New Roman
Kz ” color=”green”>
</font>
<p><b> қарайтылу </b>
<p><i> курсивті </i>
<p><u> астын сызу
</u>
<p><s> белінен сызу </s>
</body>
</html>
Мәтін фрагменттерін
логикалық стильмен безендіру.
Логикалық стильдер <b>, <i>,
<u> тегтері сияқты сөздерді ерекшелеп
көрсетеді. Олар программа мәтінін жазғанда
немесе цытаталар келтірілген кезде қолданады.
Логикалық стильді пайдалану кезінде
броузер экранға не шығаратынын айту қиын.
Әртүрлі броузерлер экранға логикалық
стильмен берілген символдарды әртүрлі
етіп шығаруы мүмкін. <EM>…</EM> акцент
сөзінен шыққан яғни курсив түрінде берілетін
мәтін бөлігін қоршап тұратын белгілер
болып табылады.
<strong> …</strong> күшті акцент
деген сөзден шыққан мәтін ішіндегі қарайтылған
қаріп болып көрсетіледі.
<code>… </code> программа
мәтінін көрсету үшін қолданатын стиль
түрі.
<samp>… </samp> ағымның –мысал,
үлгі деген сөзі, программа жұмысы нәтижелерін
ендері бірдей моношрифт түрі экранға
шығарарда пайдаланылады.
<KBD>…</KBD> ағымның keyboard
пернетақта қысқаша сөзі пернелерден
енгізілген сөз тіркесін көрсету мақсатында
қолданамыз.
<var>… </var> ағымының variable
айнымалы сөзі программадағы айнымалы
аттарын жазу үшін енгізілген стиль түрі,
қисайтылған курсивке ұқсас қаріп түрі.
Мысалы:
<html>
<head>
<title> мысал </title> </head>
<body><center>
<h2> мәтін фрагментін белгілеп
ерекшелеу тәсілдері </h2>
<p> мәтінді төмендегідей
түрде ерекшелеуге болады <br>
<hr> <b> қарайтылған қаріп
</b> <br>
<i> қисайтылған курсив </i>
<br>
<u> астын сызу </u>
<p> мәтінді қаріптеу арқылы
логикалық стильде жазу
<hr>
<h3> логикалық стилдер </h3>
<hr>
<p> <em> акцент сөзі </em>
<br>
<strong> күшті акцент </strong>
<br>
<code> программа мәтіні </code>
<br>
<samp> мысал </samp> <br>
<KBD> KBD-клавиатура </BDD>
<BR>
<var> айнымалы сөзі </var>
</center>
</body>
</html>
Сырғымалы жолдарды
ұйымдастыру.
< Marquee>….</Marquee> тегтері
мәтіндерді үздіксіз жылжытып отыратын
сырғымалы жол түрінде экранға шығады.
Бұл тегтің ашылуы кезіндежазылатын біршама
атрибуттары бар. Олар сырғымалы жолдың
жылжу жылдамдығын, бағытын, әріптердің
түсін, т.б. өзгертеді. Енді жиі өзгертілетін
параметрлерді және олардың мүмкін мәндерін
қарастырамыз.
Benaior-мәтіннің бір бағыты (scrool)
немесе қос бағыттада (alternate) жылжуын немесе
жылжымай тоқтап тұруын қамтамасыз етеді.
Яғни мүмкін мәндері Scrool (alternate/slide).
Bgcolor — сырғымалы жолдың
фондық түсін анықтайды.
Direction — жолдық сырғу бағытын
анықтайды.
Оның мүмкін мәндері Left-солға
, Right-оңға.
Height — сырғымалы жолдың биіктігін
пиксель арқылы анықталатын бүтін сан.
Оны пайызбен көрсетуге болады.
Width -экрандағы сырғымалы жолдың
енін көрсетеді. Оны да биіктік сияқты
пайызбен көрсетеміз. (%)
Мысалы:
<html>
<head>
<title> Мысал </title> </head>
<bodytext>=red>
<center>
<h2> мысал: сырғымалы жол
</h2> <hr>
<h3> Marquee bgcolor = «blue» behavior= «Scrool
Direction» right=30> бұл алғашқы сырғымалы жол
HTML форматында текст элементін
қоюдың жалпы схемасы келесі
түрде жазылуы мүмкін:
<"элемент аты"
"атрибуттар тізімі"> элемент мазмұны
</"элемент аты">.
Элемент мазмұнының алдындағы
конструкция элемент басының тегі деп
аталады, ал элемент мазмұнынан кейін
орналасқан конструкция элемент соңының
тегі деп аталады.
HTML құжатының құрылысы бірінің
ішіне бірі салынған контейнерлерді қолдануға
мүмкіндік береді [1,4]. Шынында да, құжаттың
өзі – бұл "HTML" атымен аталатын
бір үлкен контейнер:
<HTML> Құжат мазмұны </HTML>
HTML элементінің өзі немесе гипертексттік
құжат құжаттың басынан (HEAD) және денесінен
(BODY) тұрады:
<HTML>
<HEAD>
Тақырып мазмұны
</HEAD>
<BODY>
Құжат денесінің мазмұны
</BODY>
</HTML>
WWW-да әрбір құжаттың өз аты
бар, оны басында көрсетеді. Оны интерфейс-программасының
бірінші жолында көруге болады. HTML бетінің
аты <TITLE> тегінің көмегімен
басына қосылады.
HTML құжатын жазуды бастай отырып,
оның сондай түрде болатынын теңестіреміз.
Мұндай теңестіру құжаттың ең басына <!DOCTYPE
HTML PUBLIC ``-//W3C//DTD HTML 3.2//EN''> тегін қою жолымен
жүргізіледі. DOCTYPE тегі SGML тілінің тегі
болып табылады және құжат HTML 3.2 спецификасына
сәйкес сипатталатын болатынын хабарлайды.
Барлық программалау тілдеріндегідей
HTML тілінде де тексттің белгілі-бір бөліктеріне
түсініктеме беретін әдісі бар. Түсініктемелер
< ! - - және - - > тізбектерінің арасына
жазылады. Түсініктеме мысалы:
<!-- бұл мәтіннің түсініктемесі
бар -->
1-мысал.
<!DOCTYPE HTML PUBLIC ``-//W3C//DTD HTML 3.2//EN''>
<HTML>
<!- Author: Irina Kuzina Date: December
5, 1996 ->
<HEAD>
<TITLE> This is a Baner</TITLE>
</HEAD>
<BODY >
Internet-ті администраторлау
</BODY>
</HTML>
Егер құжат денесінің ішінде
тексттің бірнеше жолын теріп, содан соң
оны броузерде қарайтын болсақ, онда терезеде
жай кіші шрифтпен жазылған текст пайда
болады, сонымен бірге бастапқы текстте
бар жолдардың аудармасы сақталынбайды.
Броузерлер бетке тексттерді өздері қояды.
Жолдарды аударуды "күштеп" қою үшін
<BR> тегін қолдану қажет. Броузер кескіндеу
кезінде осы тег шыққан орынға жолдарды
аударып қояды.
НАЗАР АУДАРЫҢЫЗ! <BR> ТЕГІ
</BR> ЖАБАТЫН ЭЛЕМЕНТІСІЗ ҚОЛДАНЫЛАДЫ.
HTML-де басқа да қасиеттері ұқсас
бірнеше тегтер бар. Оларды қарапайым
түрде бос (немесе жалғыз) деп атайды және
де олар "ішкі" толтырулардан тұрмайды.
Егер сізге тексттің бір анықталған жерінде
бөлінбейтінін жасау қажет болса, онда
осы жерге <NOBR> тегін жазыңыз.
Тексті параграфтерге бөлу
үшін <P параметрлер> тегі қолданылады.
Дәлірек айтқанда, параграф
<P>...</P> тегтерінің ішіне орналасады,
бірақ та іштестірілген параграфтар болмайтындықтан,
жабылатын тегті жазбауға болады.
<P> тегінде параграфтың ішіндегі
текстті тегістеу әдісіне көрсететін
ALIGN параметрі бар: текст оң жақ шеті бойынша
(RIGHT), сол жақ шеті бойынша (LEFT), ортасы
бойынша (CENTER) немесе ұзындығы бойынша
(JUSTIFY) тегістелуі мүмкін. Егер параметр
көрсетілмесе, онда текст сол жақ шеті
бойынша тегістеледі.
Параграфты ортаға жазу үшін
келесі түрдегі тегті қолдануға болады:
<CENTER>...</CENTER>
Текстті бөлікке бөлудің тағы
бір әдісін горизонтальді сызық деп атауға
болады. Сызық HTML тілінің элементі болып
табылады және текстке
<HR параметрлер>
тегінің көмегімен қойылады,
мұндағы параметрлер келесі түрде болуы
мүмкін:
WIDTH сызықтың ұзындығын береді.
HTML-де өлшем бірлігі шығару құрылғысының
нүктесімен есептеледі, яғни <HR> тегінің
параметрі ретінде WIDTH=100 деп көрсетсеңіз,
онда ұзындығы 100 нүктеден тұратын сызық
құрасыз. Бірақ та бұл әдістің қолайлы
емес екені көрініп тұр, себебі құжат әр
түрлі шығару құрылғыларында әр түрлі
болып кескінделуі мүмкін. Сол себепті
HTML-де элементтердің ТӘУЕЛДІ өлшемдерін
беру мүмкіндігі бар, яғни кескіндеу облысының
жалпы ұзындықтан пайызы (броузер немесе
қағаздың беті). Мысалы: <HR> тегінде WIDTH=50%
параметрін көрсетіңіз, сіз құжаттың кескінделу
облысының қақ ортасындағы сызықты аласыз.
SIZE – сызықтың қалыңдығын
береді.
NOSHADE – егер бұл параметр
берілген болса, онда сызықтың
көлеңкесі болмайды.
Егер осы моментте алынған бетті
қарайтын болсақ, онда ол бір түсті болып
көрінеді. Бір қарағанда не екені түсініксіз
(егер терезенің басына қарамайтын болсақ).
Бетке "басты" тақырып жетпейді, яғни
тақырып құжаттың денесінде. HTML тілінде
алты түрден тұратын тақырып аты бар. Оларды
құру үшін <H1>…–</H1>,…,<H6>…</H6>
тегтері қолданылады. Тегтердің аттары
олардың қолданылуын анықтайтын ағылшынның
Heading (яғни, тақырып) сөзінен алынған. Өлшем
1 ең үлкен, өлшем 6 ең кіші шрифтке сәйкес
келеді. Олай болса, тексттің негізгі
жолының алдына
<H1>Welcome to my homepage!</H1>
жолын жазып, біздің бетті жазуды
бастаймыз.
Енді біздің бетті броузерде
қараймыз. Енді бет бұрынғыдан қарағанда
жақсырақ көрінеді. <Hn> тегтері блокты
болып табылады, олардың қолданылу жерінде
абзацтарға бөлу жүргізіледі [9].
Тексттің шрифттерін көркемдеудің
басқа жабдықтары болып курсивпен және
қарайтылған түрмен жазу табылады. Осы
әдістермен тексттегі кейбір сөздерді,
тақырыптарды белгілеуге болады. Мысалы,
бірінші және екінші деңгейдегі тақырыптарды
<Hn> тегтерінің көмегімен, ал үшінші
деңгейдегі тақырыпты қарайтылған шрифтпен
белгілеу өте ыңғайлы. Курсивпен белгілеу
<I> (Italic сөзінен), ал қарайтылған шрифтпен
белгілеу <B> (Bold сөзінен) тегінің көмегімен
жүзеге асады.
Сонымен қатар HTML тілінде emphasis
– жалпылама белгілеу ұғымы бар. Ол <EM>…</EM>
тегтерінің көмегімен жүргізіледі. Мұндай
белгілеу– құжаттың логикалық құрылысын
сипаттайды. Осындай әдіспен белгіленген
текст курсивпен кескінделеді.
Логикалық белгілеудің басқа
жабдығы ретінде келесі тегті есептеуге
болады:
<STRONG>…</STRONG>
Ол тексттің бөлігін күшейту
үшін қолданылады. Тегтің мазмұны қарайтылған
шрифтпен кескінделеді.
Келесі тегтердің көмегімен
шрифттердің өлшемін және түсін өзгертуге
болады:
<FONT параметрлер>…</FONT>
Параметрлер келесі түрде болуы
мүмкін:
SIZE=``value немесе value'' – шрифттің
абсолютті немесе тәуелді өлшемін береді.
Тәуелді өлшем базалық өлшемнің қатынасы
бойынша беріледі. Қабылдайтын мәндерінің
диапазоны – бірден жетіге дейін.
COLOR – текст түсін көрсетеді.
FACE – Microsoft Internet Explorer және
Netscape Navigator кеңеймесі.
Текст үшін гарнитураларды
(гарнитуралар тізімі, бар шрифттер жүйесінен
қажеттісі таңдалатын болады) беруге көмектеседі.
Ақырғы нәтиже жүйеде орналасқан шрифттердің
санынан және әр түрлілігінен тәуелді.
Мысал:
<FONT FACE="Arial, Times Roman">
Текстті басқа гарнитурамен белгілеу
мысалы. </FONT>
Барлық құжат үшін шрифттердің
базалық өлшемін
<BASEFONT параметрлер>
тегінің көмегімен беруге болады.
Ол бір ғана параметрден тұрады:
SIZE – шрифтің өлшемін береді.
Қолданушының назарын аудару
үшін кейде жанып-сөнетін текст қажет
болады. Ол үшін
<BLINK>…</BLINK>
тегін қолданамыз. Бұл тегті
байқап қолданған дұрыс, себебі жанып-сөнетін
обьектілерге қарау әр уақытта жағымды
емес.
Кей жағдайда құжатқа цитаталарды,
программаның бастапқы текстін немесе
қарапайым текстік құжатты қою қажет болады.
HTML тілінде бұл жағдайлар үшін мүмкіндіктер
қарастырылған.
HTML тілінде цитаталар <CITE>…</CITE>
тегтерінің көмегімен жазылады.
Құжатқа бастапқы текстті қою
үшін
<CODE>…</CODE> тегін қолдануға
болады.
Текст белгіленген ұзындығы
бойынша шрифтпен жазылатын болады.
Құжатта белгіленген форматпен
тексттің бар болу жағдайының қажеттілігі
ерекше таратылған. Мұндай мүмкіндік,
мысалға электрондық хаттардың мазмұнын
текстке немесе Usenet желісінен мақалаларды
қосқан кезде қолданылады. Мұның барлығы
<PRE>
1-текст ...
N-текст </PRE>
тегтерінің көмегімен жасалады.
Бұл жағдайда ол мына түрде кескінделуі
мүмкін:
1-текст
N-текст
HTML тілінде адрестерді жазу
үшін қолданылатын жабдық бар. Адрес
<ADDRESS>…</ADDRESS>
тегтерінің көмегімен жазылады.
Броузерлер оны курсивпен белгілейді,
яғни <ADDRESS> ул. Пирогова, д. 2 </ADDRESS>
жолы
ул. Пирогова, д. 2. түрінде
кескінделеді.
Тізімдермен жұмыс үшін қолданылатын
негізгі тегтер
HTML тілінде тізімдердің
үш түрі болады: нөмерленген, нөмерленбеген
және терминдер тізімі. Нөмерленбеген
тізім келесі блоктың көмегімен жазылады:
<UL>
<LI> элемент
<LI> элемент
...
</UL>
Тізім мына түрде бейнеленетін
болады:
Элемент 1
Элемент 2
Нөмерленген тізімнің нөмерленбеген
тізімнен айырмашылығы пунктің жанындағы
қою нүктелердің орнына пунктің реттік
нөмері қойылады. Ол мына түрде бейнеленеді: