Css синтаксисі
CSS-ті оқуды қарапайым мәтіндік стильдерді қарастырудан бастаймыз. Егер есімізге түсірсек, <ADDRESS> тэгі сайттың иесінің адресін сипаттайды және оның қиғашынан жазылатын стилі бар. Егер де HTML-де бұл тэгтің логикасын сақтап, бірақ қиғаштығын қолданбай жазуға болмайды. Ал CSS-те стильдерді қосып қана қоймай оларды алып тастауға да болады. Мысалы:
<ADRESS STYLE=”font-style:normal”>Алтынсарин көшесі</ADRESS>
Мұнда, <STYLE> HTML мен CSS-тің арасындағы «өткізгіш» ретінде қолданылады. “font-style” – қиғаштыққа жауап беретін стиль (тек қана қиғаш жазуға!), “normal”- стильдің мәні, яғни қиғаштықтың жоқтығын білдіреді.
Керісінше, қиғаштығы жоқ тэгке оны қоса аламыз. Мұнда “italic” мәні бар “font-style” стилін қолданамыз. Мысалы:
<P STYLE=”“font-style:italic”>)қиғаш жазу</P>
Сонымен қатар, бейнелерді <IMG> тэгін қолданбай жазуға да болады:
<DIV STYLE=”background-image:url(‘foto.gif’);width:150;height:150”><DIV>
Бұл HTML тэгтерін екі тэгке, яғни <DIV> және <SPAN> тэгтеріне келтіру мүмкіндігіне әкелді. <DIV> блокты деңгейлердегі (бөлімдер, абзацтар) эементтер үшін қолданылады және өзінен кейін жаңа жолға ауысуды береді (<BR> тэгін жазғандай тәрізді көрінеді), ал <SPAN> жол деңгейінде қолданылады (әріптерді, сөздерді, жолдарды өңдеу үшін), ол жаңа жолға көшуді жасамайды.
Құжаттың логикасы мен құрылымына HTML жауап беретін болса, ао ол құжат «қалай көрінетініне», яғни оның дизайнына CSS жауап береді.
Мәтіндік стильдерді жалғастырамыз.
<SPAN STYLE=”font-stile:italic;font-wieght:bold”>text</SPAN>
Мұнда белгілі қиғаш жазу тэгінен басқа «font-wieght:bold» стилімен берілген қою жазу қосылды.
Егер біз бірнеше стильдерді жазатын болсақ, оларды нүкте-үтірмен белгілейміз. Стильдер HTML атрибуттарға ұқсас, бірақ бір-бірімен нүкте-үтір арқылы бөлінеді және «=» теңдік белгісінің орнына екі нүкте «:» қойылады.
Тағы да бір жаңалық: CSS-те қою жазу “bold” және “normal” тэгтерімен ғана емес “600” тэгімен де жазылады және ол “bold” тэгіне қарағанда өте қою. Мысалы, бір бағанға бірдей өрнекті жазып тексеріп көрейік:
<SPAN STYLE=”font-stile:italic;font-wieght:bold”>text</SPAN>
<SPAN STYLE=”font-stile:italic;font-wieght:600”>text</SPAN>
Айырмашылығы бар, яғни бірінші жолға қарағанда, екінші жолдағы text сөзі өте қою жазылады.
Енді келесі стильдік жолды қарастырайық:
<SPAN STYLE=”font-stile:italic;font-wieght:bold;font-family:matura mt script capitals, cursive”>text</SPAN>
Шрифт гарнитурасы «font-family» стилімен беріледі. Альтернативті мүмкін гарнитуралардың бірнешеуін үтір арқылы жазуға болады. Егер сіздің компьютеріңізде бірінші шрифт гарнитурасы болмаса, браузер автоматты түрде екіншісін қабылдай береді.
CSS тілінде пиксельдерден басқа келесідей өлшем бірліктерін қолдануға болады:
Пиксельдер (px)
Нүктелер (pt)
Пайыздар (%)
Миллиметрлер (mm)
Сантиметрлер (cm)
Дюймдер (in)
Өлшем бірлігі саннан кейін жазылады. Егер де өлшем бірлігін жазбасаңыз, үнсіздік бойынша пиксельдер болып саналады. Максималды өлшемі – 65535 дюйм.
Мәтіннің түсі “color” стилімен (red, green және т.б.) сөздермен беріледі, оналтылық триплет (#0000ff – торды міндетті түрде қою керек!) немесе сандары 0 ден 255 дейін немесе 0 ден 100% өзгеретін ондық RGB-мән арқылы жазыла береді. Барлық көрсетілген төрт мысалда қызыл түсті береді:
<SPAN STYLE=”color:red”>text</SPAN>
<SPAN STYLE=”color:#ff0000”>text</SPAN>
<SPAN STYLE=”color:rgb(255,0,0)”>text</SPAN>
<SPAN STYLE=”color:rgb(100%,0,0)”>text</SPAN>
Бірақ келесідей жазуға болмайды:
<SPAN STYLE=”color:rgb(ff,00,00)”>text</SPAN>
Енді кодты қысқартып көреміз. CSS-те егер тэгке бірнеше стильдер қолданылса және стильдер атаулары екі немесе бірнеше сөзден тұратын болса, ең алғашқысы ортақ болса:
<SPAN STYLE=”font-stile:italic;font-wieght:bold;font-family:matura mt script capitals, cursive;font-size:10mm”>text</SPAN>,
оны келесідей жазуға болады
<SPAN STYLE=”font:italic bold 10mm matura mt script capitals, cursive”>text</SPAN>
Мұнда стильдердің мәндерінің реті бойынша italic және bold тэгтерінің орындарын ауыстырып жазуға болады, ал 10mm –ді басқа орынға қоюға болмайды.
“Color” стилі “font” командасынан басталмайтын болғандықтан, оны қысқартуға болмайды:
<SPAN STYLE=”font:italic bold 10mm matura mt script capitals, cursive;color:red”> text </SPAN>.
Астын сызу келесі стильмен беріледі:
<SPAN STYLE=”text-decoration:underline”>text</SPAN>
Астын сызылған сөзден басқа төбесі сызылған сөздің “overline” және үсті сызылған “line-through” стильдері бар. Бұл стильдерді бірге жаза беруге болады, себебі олар бір-бірімен конфликтке түспейді:
<SPAN STYLE=”text-decoration:underline overline line-through ”>text</SPAN>.
CSS-те мәтіндік верстка үшін кернинг және жол арасы интервалдарды басқаратын стильдер қажет. Әріптер арасындаға ара-қашықтықты “letter-spacing”, сөздер арасы “word-spacing” және жолдың биіктігі “line-height” стильдерімен жазылады.
SSI технологиясы (Server Side Includes – сервер жағына қосылу) арнайы дескрипторларды қолдануды қарастырады, яғни HTML-кодына қойылатын директивтер және Web-серверге берілетін тапсырмалар.
Келесі сұрақтарды оқып білу:
Элементтерді қою.
Z-index.
Фильтрлер.
CSS тілін кестелерде қолдану
Тапсырманы өткізу мерзімі: 7 апта
Бақылау формасы: ауызша сұрау, жазбаша бақылау
Балл___5___
Әдебиеттер:
Негізгі әдебиет
Леонтьев, Б. К./ Б. К. Леонтьев Энциклопедия WEB-дизайнера /. - 7-е изд., испр. и доп. - М. : Новый издат. дом, 2004. - 640 с
Прохода А.Н. / А. Н. Прохода. - М Обеспечение интернет- безопасности : практикум. : Горячая линия-Телеком, 2007. - 180 с.
Баловсяк Н. Интернет: Новые возможности. / Н. Баловсяк. - СПб. : Питер, 2008. - 304 с. - (Трюки & эффекты)
Билл Сандерс. Flash 5 Эффективная работа. – СПб: Питер 2001. – 352 с.
Блэк, Юлесс. Сети ЭВМ: протоколы, стандарты, интерфейсы. / под ред. Василькова, М.: 1990 г.
Дмитриева М. Java Scrіpt. Быстрый старт. – Санкт Петербург: БХВ-Петербург, 2002. – 336 с.
Леонтьев Б. Web –дизайн: Рук-во пользователя. – Москва: Познават. книга плюс, 2001. – 320 с.
Тихонов А.И. Динамический HTML – М.: ЗАО «Издательство БИНОМ», 2001. – 496 с.
Қосымша әдебиет
Лапшинский В.А. Локальные сети персональных компьютеров. Часть-2, М., МИФИ, 1994 г.
Науманн Ш., Вер Х. Компьютерная сеть. Проектирование, создание, обслуживание. М.: ДМК, 2000. –336 стр.
Олифер В.Г., Олифер Н.А. * Компьютерные сети. Принципы, технологии, протоколы. 3-е издание. – СПб: Питер, 2005 г. – 958 стр.
Основы создания сетей и протоколы. Master mind/ NIIT. Web: www. printpulse.com.
Танненбаум Э. Компьютерные сети. 4-ое издание. – СПб: Питер, 2003 г. – 992 стр.
Успенский И. * Интернет как инструмент маркетинга.- СПб.: 1999.
Тақырып 4.
Dream Weaver, 3D-Max технологиялары.
Өздік жұмыстың мақсаттары:
Photoshop, Dream Weaver, 3D-Max технологияларымен жұмыс жасай білу.
Web- беттерді жасау үшін әркім өз құралдарын өздері таңдайды. Олар MS FrontPage немесе Macromedia DreamWeaver, Allaire HomeSite немесе 1st Page 2000 болуы мүмкін. Ал кейбір қарапайым мәтіндік редакторды, мысалы Блакнотта (Notepad) пайдалануы мүмкін.
Мәтіндік редакторларды үлкен емес беттерді құрауда пайдалануға болады, себебі олардың көп кемшілік жақтары бар:жобалармен жұмыс істеу мүмкіндігі жоқ, «мәтінді жарықтандыру» мүмкін емес... жалпы алғанда, онымен тек HTML тілін білетін маман ғана жұмыс істей алады.
Біз визуалды HTML- редактор DreamWeaver -ді қарастырайық. Бұл бағдарламалық өнім HTML тілін тіпті білмейтіндерге арналған, алайда мұнда белгілі білім иесі болмай-ақ та сайттарды құруға болады DreamWeaver соншалық қарапайым, сондықтан тіпті енді бастаған дизайнерлердің өзі маманданған Web- сайт құра алады. DreamWeaver-де Macromedia Flash форматында анимациялар құруға, Microsoft Office мәліметтерін пайдалануға, rollover – графиктерді оңай алуға, Fireworks-тан мәзір және батырмаларды енгізуге болады. Macromedia компаниясы веб- сайттарды құру үшін бағдарламаларды өндіруде қолбасшы болып табылады, сонымен қатар осы сала сәнінің заңшылы болып келеді. Соңғы уақытты ол осы сала сәнінің заңшылы болып келеді. Соңғы уақытты ол осы өнімдердің бірінен кейін бірі шығара бастады, яғни әр шығарылымында олар жетілдіріліп жатыр. DreamWeaver -3,-4,-6 және ол шек емес. Әрбір жаңа шығарылымында одан да көп функционалды мүмкіндіктер енгізілуде, ол бірден немесе екіден емес, ондаған түрде енгізіледі. Веб-сайттардың көптеген жасаушылыары DreamWeaver-ді ең ыңғайлы HTML-редакторлардың бірі деп санайды, бастаушы веб-дизайнерлер үшін де, тәжірбиелі программистер үшін де.
DreamWeaver баптау – дұрыс баптау сапалы қортындыға жетуді өте маңызды болып табылады. DreamWeaver-ді жұмыс барысында бағдарлама неге дұрыс жұмыс істемей жатыр демейтіндей баптауды дұрыс жасау керек.
Баптаудың бірінші бастамасы осындай болады. DreamWeaver-дің өте көптеген баптаулары бар, соған орай олар категорияларға (сол жақтағы қатар) бөлінген. Алайда біз тек жұмысқа қажеттілерін ғана қарастырамыз, ал HTML Colors немесе Highlighting сияқты пункттерге тиіспейміз.
Б
ірінші
бастамада тек 2 затты ғана баптау керек:
Options: Add Extension When Saving – егер жұмыс тек .html (.htm) файылдарымен немесе тек .shtml файылдарымен, немесе басқаларымен жұмыс істесе қажетті кеңейтілуді көрсету қажет. Сонда DreamWeaver сақталымда қажетті кеңейтілімді қосып отырады.
History палитрасы қадамдарының санын көбейту, мысалы 100-ге дейін (Maximum Number of History Steps). Сонда қателік жіберуді түзету үшін аз қадам қажет болады.
К
елесі
терезеден DreamWeaver-дің СSS-пен қалай жұмыс
істейтіні көрсетілген (СSS дегеніміз не
және оны қалай құру керек екендігі
төменде көрсетілген). Оның айырмашылығы
мында: СSS параметрлері «қысқартылған»
жазылымының осындай типін пайдалану
керек, ол үшін осы терезедегі пункттерді
қосу қажет.
К
елесі
баптау сыртқы редакторларды баптауға
көмектеседі. Өте ыңғайлы зат. Мысалы,
HTML (сол Home Site 4,5), GIF,JPG- Adobe Image Ready үшін жеке
редакторларды баптауға болады. Енді
оны тек бір батырманы басу арқылы
редакторлеуге болады, ыңғайлы. Reload
Modified Filed және Save on launch пункттеріне назар
аудару керек.
Оларды сол Prompt қалпында қалтыру керек.
Сонда компьютер әркез сайын жаңа
редакторда ашуда файылды сақтау керек
екендігін сұрайды және жұмыс істеп
болған соң сыртқы редактрда ашу керек
пе екендігін сұрайды.
Floating palettes терезесі DreamWeaver-дің сыртқы түрін қалыпқа келтіруге көмектеседі. Мұнда қай палитра құжаттың экраны үстіне тұратынын және қайсылары «навигаттр панелімен» құратын көрсетуге болады.
Б
ұл
бөлім- ең маңыздылырдың бірі. Дұрыс емес
баптағанда осы жерде мәселелер туындап
жатады. Ең жоғарғы пунктке назар аудару
керек – Default Encoding нақ осыны дұрыс баптауды
келтіру керек міндетті түрде. Ең
оптималдылардың бірі – Windows 1251 кодталуды
тандау. Егер DreamWeaver-ді дұрыс баптамасы
ол, автоматты түрде мәтіндерді кодтай
бастайды. Яғни мәтін мынандай болуы
мүмкін: «iieiue eca?ao». Одан басқа, бұл терезеде
негізгі шрифтерді қалпқа келтіруге
болады. Яғни мәтін сол өлшемде көрсетіліп
отырады.
Ең маңызды терезелердің бірі – ол HTML Format (HTML форматы). Маңызды бөлімдердің бірі мұнда DreamWeaver сақтаған HTML кодтың ағымдағы түрі қандай болатыны қалыпқы келтіреді. Негізінен бұл бөлім HTML-дің сыртқы түрін қалпына келтіреді – қандай шегерілімдер қолданылыды, қандай өлшем, қандай колонкадан кейін жолды кесу керек екендігі көрсетіледі. Бірақ одан да маңызды пункттер бар, мысалы Line Breaks пункті жолды аударуда қандай таңбамен қалыпқа келтірілуі керек екендігі көрсетіледі.
HTML
Rewriting пункті де маңызды. Егер оны дұрыс
қалпына келтірмесе қателіктерге ұрынуға
болады. Себебі DreamWeaver парсермен
жабдықталған (тексеруші модульмен),
файлды ашуда ағымдағы HTML-
код
тексеріліп, ондаған қателіктер туралы
қорытынды шығарылады. Кейде DreamWeaver
қате
деп санайтыны ондай болып шықпайды.
Сондықтан Rewrite HTML:
Fix Invalidly Nested and Enclosed Tags және Extra Closing Tags
пункттерін алып тастаған жөн. Дұрыс
қалыпқа келтірілген DreamWeaver
сонда
да «жаман» тегтерді сары түспен көрсетіп
тұрады. Егер керек болса, оны өшіріп
тастауға болады қолмен.
L
ayers
пункті DreamWeaver-де құралатын қабаттар
параметрлерін қалыпқа келтіреді. Ең
жақсысы Netscape 4 Compatibility-ді қосу керек,
сонда Netscape-ті көрсетуде кедергілер
туындамайды. Көптеген Веб-дизайнерлер
қабаттарды қолдануды ұсынбыйды, себебі
олар әртүрлі браузерлер версияларында
бірдей көрінбейді.
FTP – ді баптау. Бұл пунктті дұрыс баптамасық өз веб-серверлерімізге файылдарды көшіру мүмкін болмай қалады. Тәжірбие жүзінде барлық пунктерді солай қалтыру керек, тек Firewall Host пунктіне назар аудару қажет. Мұнда өз серверіміздің адресін көрсету қажет. Әйтпесе ештеңе жүзеге аспайды.
DreamWeaver –дің қуатты кәсіби ортасы әртүрлі қиындықтағы және масштабтағы HTML беттерді генерация үшін қажетті барлық құралдарды иеленеді. Ол визуалды жобалау режимін қамтамасыз етеді (WYSIWYG или What You See Is What You Get – «не көрсен, сону аласын»), веб-құжаттардың ағымдағы мәтінімен өте таза жұмысымен ерекшеленеді, үлкен желілік жобаларды қолдайтын ендірілген құрылғылары бар. Қазіргі уақытта бар редакторлардың ешбірінде WYSIWYG конепциясы толықтай жүзеге жүзеге асырылған. DreamWeaver бағдарламасы бәсекелестерге қарағанда, тікелей жұмыс істеу алынып тасталмаған, біріқ ол саналы минимуға жақындатылған. Бағдарламада тек визуалды жобалаудың қуатты арсеналының құралдары ғана бар емес, сонымен қатар ол веб-парақтарды көрсетудің арнайы бағдарламалары сияқты көрсету қабілетті: Microsoft Internet explorer немесе Netscape Navigator.
Macromedia Dreamweaver MX –қазіргі замандағы интернет стандарттарын қолдайтын және өте қиын тапсырмалары орындауды жеңілдететін ең қуатты бағдарламалардың бірі. Сонымен қатар онда енді бастаған пайдаланушыға жұмысқа тез кірісуіне көмектесетін құрамында интерактивті сабақтар мен дамыған айтып беру жүйесі бар.
Бағдарлама интерфейсі алдыңғы версияларымен салыстырғанда, көптеген өзгерістерге ұшырады. Жаңа стиль бағдарламалармен жұмысты едәуір жеңілдетеді. Егер алдыңғы версияларда терезелер арасында жеке қосылуларды жүзеге асырып отырсақ, қазір кодпен де, соңғы сайт түрімен бір уақытты жұмыс істеуге болады. Ол жұмысты екі есе жеңілдетеді.
С
урет
17. Macromedia Dreamweaver MX алғашқы беті
Dreamweaver-ді қосқанда бастапқы терезе пайда болады ол құрылушы
құжат типін таңдауға (HTML, ColdFusion, PHP және т.б.) немесе дайын үлгі бойынша құжат құруға (CSS Style Sheets, Framesets және т.б.) мүмкіндік береді, сонымен қатар жақын арада қолданылған құжаттарды ашуға болады. Содан басқа, интернет – ресурстарға сілтемелерде болады: Dreamweaver MX Exchange сайты, Dreamweaver MX бағдарламасын қарау және Dreamweaver MX бойынша анықтама ақпараттары.
Dreamweaver жұмыс аймағында келесідей терезелер мен панельдер бар:
Құжат кодын қарау мен редакторлеу мүмкіндік беретін құжат терезесі. Онда құжаттың болашақ түрін (Design) немесе біруақутта код және сыртқы түрін (Split) көруге мүмкіндік бар. Сонымен қатар, интернет браузерде құжатты көруге қателерді тексеруге және т.б. мүмкіндіктер бар.
Сурет
18. 
Құжат
терезесі
Стандартты ашылатын мәзір (File, Edit, View, Insert, Modify, Text, Commands, Site, Window, Help)
Стандартты ашылатың мәзір
П
анельдер
тобы: Design (CSS стильдері бар), Code ( тегтер,
объектілер және, әр түрлі технологиялардың
функциялары жайында анықтама бар),
Application (мәліметтер базасы, компаненттер
және т.б туралы ақпарат болады),
Files(файлдар диспечері).Dreamweaver MX – те web – беттерді шаблондар негізінде құрумүмкіндігі пайда болады, алайда ол өзінің басты бәсекелесі Microsoft – тан кейін келе жатыр. Әрине мұнда өз шаблондарын құру мүмкіндігі бар және жаңа шаблондарды интернеттін алуға болады.
Мәтінмен жұмыс: Dreamweaver мәтінді тегтерді редактрлеуге бармай-ақ форматтауға болады. Ол үшін мәтінді енгізіп, беттің визуалды дизайнында мәтінді таңдап, тышқанның оң жақ батырмасын басу керек және пайда болған мәзірден абзац форматын, тізім типін, шектердің тиістелуін, шрифтті, стильді немесе шаблоннан таңдап алуға болды. Соның ішінде мәтіннен гиперсілтеме жасауға болады. Мәзірдің бұл пункттері төменде, қасиеттер панелінде орналасқан. Сонымен қатар, бұл панельде мәтін түсін де қоюға болады. Тағы мұнда, яғни Dreamweaver – де орфографияны тексеру енгізілген.
Қою (Вставка) панелі,келесідей қосымшалардан тұрады: Негізгі (Общие)- гиперсілтемелер, кестелер, суреттер, коментарийлер және т.б. қою, сонымен қаттар Tag Chooser (тегті таңдау); Орнату (Размещение) – мазмұнын қоймас бұрын құжатқа белгі қою үшін ұяшықтар мен кестелерді пайдалану; Пішіндер (формы) – пішіндердің әр түрлі түрлерін енгізу; Мәтін (текст) – мәтінді форматтау және Font Tag Editor (мәтіндегі тег редакторы); HTML- көлденең сызықтарды, кестелер, фреймдер, head қасиеттерін, скрипттер элементтерін қосу; Қосымшалар (приложение) – ақпараттық құралдармен жұмыс; Flash элементері (Flash элементы) – Flashроликтерін қосу, Таңдамалы (избранное) – жеке қосымшаға жиі қолданылатын объектілерді енгізу мүмкіндігі.
Сурет 18. Қою панелі
Қою панелі терезенің жоғарғы жағында ең ыңғайлы панель Қою орналасқан, ол құжат түрінде орындалған және оны анық қарап алу керек.
Негізгі мәзір
Бірінші негізгі мәзір гиперсілтемелерді қою мүмкіндігін береді. Ол басқа адрестерге сілтеме жасау үшін. Бұл батырманы басқаннан кейін немесе беттің қажетті жеріне әкелгеннен кейін мәзір пайда болады.Онда сілтеме мәтінін, адрес енгізу немесе қаттар дискте құжатты таңдауға болады. Мақсатты таңдау (_blank қарау бағдарламасының жаңа бос терезесі, _parent- ағымдағы фреймнің ата-аналық фреймдік құжатты, _self-ағымдағы фрейм, _top-құрамдық бөліктерге ағымдағы фреймнің сыртқы құжаты) және сілтемелер тақырыптары.
Келесі батырма E-mail-ға сілтеме құрады. Пайда болған мәзірге сілтеме мәтінін және E-mail адресті жазу қажет.Келесі батырма зәкірді құрады. Зәкір беттер ішінде сілтеме құру үшін қажет. Төртінші батырма кестелерді құрады. Диалоктік терезеде енді, биіктікті, бағаналар санын, бағананы, кесте нөмерін, рамка өлшемін және ұзындыққа тегістелу немесе еніне тегістелуін таңдауға болады. Кестені құрағаннан кейін атын енгізуге, тақырыбын және тегістеу типтері бар терезе пайда болады. Келесі батырма тәуелсіз позицияланатын элементтер үшін қабаттарды салуға мүмкіндік береді.
Рет бойынша алтыншы батырма суретті қояды. Ашу диалоктік терезесіндегі суретті таңдағаннан кейін альтернативті мәтінді және сипатталуды енгізу терезесі пайда болады. Және де суретті кез келген жерден де, негізгі мәліметтерден де таңдауға болады. Қасиеттер төменгі панелінде сурет атын, енін,биіктігін, тік ашақ жерін, көлденең ашық жерін, адреске сілтеме беруге, басқа сурет қоюға, мөменгісін таңдауға, мақсатын таңдауға, сыртқы редакторде редакторлеуге, тегістеуге, рамка өлшемін қоюға және сурет өлшемдерін алып тастауға мүмкіндіктер бар. Келесі батырма сурет – толтырушыны құрады. Сегізінші және тоғызыншылары Macromedia Fireworks HTML және Macromedia Flash объектілерін импорттайды. Бұрушы суретті батырма 2 суретті қояды, негізгі және сурет. Тышқанды жақындатқанда бір-бірін алмастыратын бұрушылар, батырманы шерткенде, пайдаланушымен енгізілген сайтқа ауысады.
Навигация панелі батырмасы сурет түрінде безендірілген гиперсілтемелердің колонкаларын немесе жолдарын құру үшін пайдаланылады. элементтер тізімінде барлық бар навигация элементтерінің жалақылары көрсетілген. Бір элементті таңдап алып, оның қасиеттерін немесе жаңасын құруға болады. Элемент атын енгізу жолында ат енгізіледі. Жоғарғы сурет жолында қалыпты жағдайда көрсетілетін сурет файлының аты енгізіледі. Сурет үстінен енгізу жололында пайдаланушы тышқан курсорын әкелгенде ғана шығатын сурет файлының аты енгізіледі. Төменгі сурет – тышқанды шерткеннен кейінгі файылдың аты, ал жоғарыдан төменге қарай сурет жолында – пайдаланушы курсорды әкеп қойған шертілген гиперсілтеме суреті файлының аты. Әрбір енгізу жолында қарау батырмасы бар. Альтернативті мәтін жолында – альтернативті мәні енгізіледі. Төменгі суретті басында көрсету опциясында – алғашқысында шертілген батырма суреті жүктеледі, ал preload image жалаушасы Dreamweaver-де код құрауға көрсетеді. Навигация жолын құрғаннан кейін HTML – коды қарауға болады және Dreamweaver қаншалықты көп жұмыс істеуге тура келеді: кестені қалыптастыру, көрсетілген барлық графикалық суреттер енгізілді, оларды гиперсілтемелерге айналдыру жүрді – ең бастысы оларды басқаратын сценарий жазылды.
Он екінші батырма көлденең сызғыш. Көлденең сызғышты құрады. Қасиеттер жолында ұзындықты, енді, өлшем бірлігін (пиксельдер немесе пайыздар) көрсетуге болады, тегістеу, және көлеңкенің болуын тандауға болады. дата батырмасы – күнді қоюға мүмкіндік береді. Пайда болған мәзірге тек күн, уақыт, дата форматын көрсетіп, сақтауда автоматты түрде жаңалауға жалауша қою керек. Датадан кейін кестелік мәлімдеттер болады. Онда кестелік мәліметтері бар файлдар көрсетіледі. Одан кейін коментарийлер. Әрбір мәзірде негізгі батырмалардан басқа көмекші батырмалар да орналасқан.
Орналастыру мізірі
Орналастыру мәзірінде стандартты түр және орналастыру түрі арасында қосылуларды жүзеге асыруға болады. Бұл операциялар тек дизайн терезесінде ғана қол жетімді. Стандартты түрде тек кесте қоюға немесе қабат салуға болады, ал орналастыру түрінде кесте немесе ұяшық салуға болады.
Пішін мәзірі
Бұл мәзірдің көмегімен тіркеуші пішінін, сұрастыру пішіндерін және т.б. құруға болады. Бірінші батырма бос пішінді құрады. Пішін атын енгізу жолында пішіннін өз аты енгізіледі әрекет жолында серверлік бағдарламаның интернет – адресі енгізіледі. Комбинацияаланған тізімдегі қойылады: POST, GET, DEFAULT. Келесі батырма пішін элементтерін құрайды. Ол мәтіндік жол – пішінде басқарудың ең танымал элементтері.
Жасырынған жол – ол басқарудың веб – парақта көрінбейтін ерекше элементі. Бұл жолға берілген мәтін қарапайым сайт қараушы өзгерте алмайды.
Төртінші батырма мәтін аймағын құрады. Келесі 3 батырмадан құралған топ пішіннің маңызды элементтерін құрады: жалауша, радиобатырма, радиотоп. Барлық 3 элементтің қасиеттері бір – біріне ұқсас: ол уникалды ат, батырма мәні және бастапқы жағдайы.
Тізім\мәзір батырмасы пайдаланушы қасиеттер панелінде не таңдауына байланысты тізім құрап береді.
Оныншы батырма – сурет алаңы. Бұл атырманы шерткенде сурет файылының атын көрсетуге боладын диалогтік терезе пайда болады. Сурет алаңы – ол қарапайым графикалық сурет, ол тағы шерткенде серверге мәліметтерді жібері ролін атқарады.
Файл алаңы – кейбір кезде серверге файлды жібері керек болады, ол үшін файл алаңы батырмасы қолданылады. Бірден-бір шарт: мәліметтер multipart/form-data кодталуын пайдалана отырып кодталу керек және POST көмегімен жіберілуі қажет.
Келесі батырма атты батырма батырмаларды құрады. Батырма пішінді жіберу үшін немесе түсіру үшін қолданылады.
Соңғы 2 батырмалар – басқарудың қосымша элементі. Олар мәліметтерді енгізу үшін емес, парақты көрушілерге ыңғайлы болу үшін құрылған. Олар тек Internet Explorer v5.0 және одан жоғары, Netscape Navigator v5.0 және одан жоғарғы, сонымен қатар Opera және Mozilla-ныңғ барлық версияларында ашылады.
Таңба – басқару элементіне қосылатын мәтіндік қол. Элементке таңба қою үшін оны белгілеп алып, таңба батырмасын шерту керек.
Алаң жиынтығы – ол басқарудың бірнеше элементтерін біріктіретін және мәтіндік таңбасы бар қарапайым тікбұрыш.
Мәтін мәзірі
Мәтін мәзірі мәтіннің таңдалып алынған бөлігін форматтауға арналған. Мұнда тег шрифтерінің редакторын таңдауға болады – тег редакторы <font>. Пайда болған мәзірде шрифті , түс, өлшем, стиль, бағыт, тілі көрсету керек. Өз шрифттерін импорттау мүмкіндіктері бар. Жырный батырмасы мәтінді семіз қылады, курсив – курсивті болады, сильный – күшті және вырозить – курсивпен ұқсас екрекшелейді.келесі үш батырма – ол абзац , яғни форматталған мәтін, тырнақшадағы блок, форматталған мәтін (кодта көрсетілгендегідей болады). Ары қарай – бірінші, екінші және үшінші деңгейлер тақырыптары одан кейін тізім, тәртіпке келтірілген тізім типін. Оның көрсетілімін және стилін өзгертуге болады. Соңғы екі батырма мәтінне аббревиатура және акроним жасайды. Пайда болған мәзірде толық мәтін мен тілін енгізу қалады.
HTML мәзірі
Метатег – web парақтың өзі жайлы мәліметтерді web – парақта кодқа орналастыруға арналған ерекше HTML тегі. Бұл ақпарат негізінен, іздеу агенттерімен, web – қараушылармен және web – редакторлармен қолданылады.
Тақырып мәзірі метатегтерді тез қою қызметін атқарады. Мета батырмасын шерткенде, метатег қоюдың диалогтік терезесі пайда болады. Тізімнен құрылушы метатегтің типін таңдау қажет. Аты немесе НТТР – эквивалент.
Парақты метатегке орналастыру үшін келттік сөздер батырмасын шерту қажет. Ал парақ сипатын құру үшін сипат батырмасы пайдаланылады. Ағымдағы парақты қайта жүктеу батырмасын шерту керек.
Мәзірдің соңғы батырмасы екі түрлі web – парақтар арасында байланыс орнататын немесе web – парақтар арасында және басқа файлдар арасында байланыс орнататын метатег құрады.
Table – батырма кесте құрады, яғни кесте қою батырмасына сәйкес келеді, негізгі мәзір. Сонын ішінде: тег кестелер, кесте қатары, кесте тақырыбы, кесте мәліметтері, кесте тақырыбы. Артынан қасиеттер панелінде кестенің қалпын өзгертуге болады.
Frame – батырмасының көмегімен фреймдерді құруға болады. Мыналарды таңдауға болады: сол жақ фрейм, оң жақ фрейм, жоғарғы фрейм, төменгі фрейм, төменгі және сол жақтан қойылған фрейм, төменгі және оң жақтан қойылған фрейм, сол жақ және төменнен қойылған фрейм, оң жақ және төменнен қойылған фрейм, үстіңгі және төменгі фреймдер, сол жақ және жоғарғыдан қойылған фрейм, оң жақ және үстіден қойылған фрейм, жоғарғы және сол жақтан қойылған фрейм, жоғарыда және оң жақтан қойылған фрейм. Қалған үш батырма фреймдер жинағы фрейм, жүзуші фреймдер тегі қоюға мүмкіндік береді, ал соңғысы фрейм жоқ.
Скрипт – бұл батырма скриптінің тегін құруға мүмкіндік береді. Тег құру үшін, скрипттін бірінші батырмасын шертіп, пайда болған терезеде скриптің мазмұнын енгізу қажет. Тіл мәзірінде скрипт тілін таңдауға болады. Скриптінің өзін құрып болғаннан кейін қасиеттер мәзірінде тілін, мазмұнын өзгертуге, қайнар көзін таңдап типін өзгертуге болады (client-side немесе server-side).
Noscript - батырмасының көмегімен noscript тегі жасалды, ал қосу батырмасын шерткенде, сервер ретінде қарастырыладын файлды таңдау ұсынылады.
Ќосымша
Шаблон – барлық беттерге тән жалпы элементтері бар web – беттердің өзіндік үлгісі. Шаблон негізнде жаңа бетті құруда қалатыны, тек қажетті жерге осы беттің уникалды мазмұнын жазып оның сақтау керек. Соңынан шаблонды өзгертуге болады – Dreamweaver бет негізінде барлық құрылғандарды өзі жаңартады.
Web – шаблон құрудың 2 тәсілі бар: біріншіден – оны нөлден бастап құру керек және оны қарапайым web –парақтар сияқты толтыру қажет; екіншісі – бар бетті шаблон ретінде сақтап, оны редакторлеу керек. Онда мазмұнының барлығын өшіріп, тек маңызды элементтерін ғана қалдыру қажет.
Жаңа шаблонды құру үшін шаблон құру батырмасын шерту жеткілікті. Соңынан қалай сақтау керек мәзірі пайда болады.
Енгізілген шаблон. Бұл мүмкіндік тек Dreamweaver МХ – те ғана бар. Енгізілген шаблон – бұл басқа шаблон негізінде жасалған шаблон.
Редактрленетін аймақ. Редактрленетін аймақ шаблонда өзгертілетін ішкі аймақтарды құру үшін қызмет етеді. Ол тік бұрыш түрінде болады және оның өзінің қайталанбас аты болуы керек.
Dreamweaver МХ – те бірнеше мүмкіндіктер пайда болды: ол қосымша аймақ, қосымша аймақ – міндетті емес өзгермейтін аймақ.
Қайталанушы аймақ қажетті көптеген мазмұннан тұратын өзгермейтін аймақты құрады.
Және ең ыңғайлы мүмкіндіктердің бірі – кестелік аймақ. Ол қарапайым қайталанушы аймақ, ол тек кесте түрінде жасалады. Мұндағы әрбір ұяшықта өзгермелі аймақ болады.
Символдар – арнайы символдарды қою үшін қажет, яғни олар йена, доллар белгісі, тырнақшалар, жұлдызшалар және т.б.
Сызықтың бөлінуі – өзінен кейінгі символдарды келесі жолға ауысуын міндеттейтін ерекше тег.
Медиа мәзірі
Macromedia Dreamweaver MX және Macromedia Flash MX – тек бір фирмадан жасалып қана қоймай, олар бір – бірімен тығыз интеграциядағы екі қуатты танымал пакеттер. Егер бір компьютерде Flash және Dreamweaver орнатылған болса, онда Flash – ты Dreamweaver – ден қосуға болады. Суреттерді салып. Dreamweaver терезесінде ашық web – парақтарға қоюға болады. Flash батырмасы пайдаланушыға документке файлды қоюға мүмкіндік береді және ол flash форматында болады. Бірақ Dreamweaver ұсынған құралдарды пайдалануға болады.
Flash мәтіні – мәтін жолы бар және сурет – гиперсілтеме ретінде жұмыс істейтін Flashформатындағы сурет. Flash мәтін батырмасы көмегімен осында суретті құрып, оны параққа орналастыруға болады.
Shockwave батырмасының көмегімен shockwave объектісін қоюға болады. Java апплеттерін қою үшін апплет батырмасын пайдалануға болады. Ал келесі батырма тег <param> - ды редакторлейді.
Осы бағдарламаны қорта келгенде Dreamweaver – ол HTML –дің жазылуын жеңілдететін бағдарлама екенін анықтадық. Ол басқа да ұқсас бағдарламалар сияқты HTML код құруды жеңілдету құралы ретінде компьютердегі көптеген ресурстарды алмастыратын қуатты бағдарламаның бірі. Dreamweaver автоматтауға болатындардың барлығын автоматтайды. Менің ойымша, Dreamweaver – HTML – ді құру үшін ең жақсы бағдарлама, алайда басқа да көптеген бағдарламалар бар мүмкін. Соған қарамастан, MacroMedia компаниясы бір орнда тұрған жоқ, ол үлкен қадамдармен алған қарай жылжуда. Мысалға алатын болсақ, Dreamweaver –4 версиясында өте пайдалы екі режим: Code View и Split View пайда болды. Олар HTML – кодты және дизайнды жеке – жеке қарастыру мүмкіндігін берсе, олардыбіріктіріп қарастыру мүмкіндігі де бар. Ал Dreamweaver – 6 МХ –те, бұл берілген бағдарламалық өнімнің соңғы версиясы, жаңа функциялар пайда болған, алдыңғы версияларға қарағанда, жұмысты жеңілдететін панельдердің орналасуы да өзгерген. Соңғы версияның басты басымдығының бірі – web беттердің стандартты шаблондар кітапханасының пайда болуы. Бұл web – парақтардың шаблондары жобалау кезінде көп уақытты үнемдеуге мүмкіндік беред. Біріқ бағдарламада орыс тілінде және көптеген зат көптеген басымдықтар болса да, HTML – ді таза түрінде білу және түсіну қажет.
Мультимедиялық оқулықты ұйымдастыру компьютерлік өнімдер нарығында оқыту программалары, электронды оқулықтар саны жыл сайын қарқындап өсіп келеді. Сонымен қатар, “электрондық оқулықтың” қандай болуы керек екндігі, оның атқару қызметтері қандай болуы керек екендігі жөнінде көптеген даулар да тоқтайтын емес. ЭО әдеттегі құрылымы мынадай: оқыту материалын табыстау, тәжірибе, сынақ.
Қазіргі кезде бұл оқулықтарға келесі талаптар қойылады:
1. Тандалған курс бойынша берілетін ақпарат, жақсы құрылымды болып, жаңа түсініктердің шектелген санынан тұратын, курстың аяқталған фрагменттері болуы тиіс.
2. Әрбір фрагмент, мәтінмен бірге, ақпаратты аудио –немесе видеобейне түрінде берілуі тиіс (“шынайы лекциялар”). Шынайы лекциялардың міндетті интерфейсінің элементі болып, лекцияны кез-келген жерден жалғастыратын, айландыру жолағы болу керек.
3. Мәтіндік ақпарат, шынайы лекциялардың бөліктерін қайталауы мүмкін;
күрделі модельдер мен құрылғыларды таныстыратын иллюстрацияларда, курсордың қимылымен синхронды түрде, иллюстрацияның (карта, сызба, өнімді жинақтау сұлбасы, объектіні басқару пульті) бөлек элементтері бойынша, пайда болып, қайта жоғалатын бір мезеттік демеуші болуы тиіс.
4. Мәтіндік бөлім қажетті ақпаратты жылдам табуға мүмкіндік беретін, көптеген тоғысқан сілтемелермен сүйемелденуі тиіс, және күшті іздеу серверімен қамтамасыз етілуі тиіс.
5. Жай бейнелеуде түсіну қиынға соғатын бөлімдерді, видео ақпарат немесе анимациялар сүйемелденуі тиіс. Бұл талаптарды орындаған жағдайда, әдеттегі, басқа оқулықтармен салыстырғанда, пайдаланушылар уақытын 5 - 10 есе үнемдеуге болады. Ал мысалы адам ешқашан сарқыраманы немесе отты көрмесе, бұл кейбір құбылыстарды адамға жай сөзбен түсіндіруге жеткіліксіз болып табылады. Ал видеоклиптар уақыт масштабын өзгертуге - бейнені тездетілген немесе баяулатылған темпте, немесе іріктеулі түсірумен көрсетуге мүмкіндік береді.
Аудиоақпараттың болуы, ол көптеген жағдайда, оқулықтың негізгі, тіпті кейде айырылмас мағынасы болып табылады.
Тапсырманы өткізу мерзімі: 11 апта
Бақылау формасы: ауызша сұрау, жазбаша бақылау
Балл___10___
Келесі тапсырмаларды орындаңыз:
Өзіңіздің Web-сайты үшін алғашқы бет құрыңыз (автор жайлы және сайтты құру мақсаты туралы ақпарат жазыңыз).
Web-бетке файлдағы кестені орналастыр (мысалы, Тарих.doc).
Web-бетке кескін қосыңыз (мысалы, symbol1.htm бетінде Қазақстан Республикасының елтаңбасын gerb.gif орналастыр).
Бетке фон беріңіз (мысалы, бетке фонды fon.jpg файлынан беріңіз).
Сайттың логотипін құрыңыз да, оны өз сайтыңыздың үйдегі бетіне орналастырыңыз.
Оқу орнына түсушілерге Web-бет жасаңыз.
Форманың барлық элементтерін пайдалана отырып, келушілерге арналған анкета жасаңыз және мәліметтерді өз электрондық поштаңызға жіберіңіз.
Іздеу беттеріне стандартты форма құрыңыз.
Web-беттердегі мәтіндік гиперcілтемелерді сурет кескінімен алмастыр және басқа Web-бетке гиперсілтеме құырыңыз.
Web-бетте өз пошта адресіңе гиперcілтеме құр.
Әдебиеттер:
Негізгі әдебиет
Леонтьев, Б. К./ Б. К. Леонтьев Энциклопедия WEB-дизайнера /. - 7-е изд., испр. и доп. - М. : Новый издат. дом, 2004. - 640 с
Прохода А.Н. / А. Н. Прохода. - М Обеспечение интернет- безопасности : практикум. : Горячая линия-Телеком, 2007. - 180 с.
Баловсяк Н. Интернет: Новые возможности. / Н. Баловсяк. - СПб. : Питер, 2008. - 304 с. - (Трюки & эффекты)
Билл Сандерс. Flash 5 Эффективная работа. – СПб: Питер 2001. – 352 с.
Блэк, Юлесс. Сети ЭВМ: протоколы, стандарты, интерфейсы. / под ред. Василькова, М.: 1990 г.
Дмитриева М. Java Scrіpt. Быстрый старт. – Санкт Петербург: БХВ-Петербург, 2002. – 336 с.
Леонтьев Б. Web –дизайн: Рук-во пользователя. – Москва: Познават. книга плюс, 2001. – 320 с.
Тихонов А.И. Динамический HTML – М.: ЗАО «Издательство БИНОМ», 2001. – 496 с.
Қосымша әдебиет
Лапшинский В.А. Локальные сети персональных компьютеров. Часть-2, М., МИФИ, 1994 г.
Науманн Ш., Вер Х. Компьютерная сеть. Проектирование, создание, обслуживание. М.: ДМК, 2000. –336 стр.
Олифер В.Г., Олифер Н.А. * Компьютерные сети. Принципы, технологии, протоколы. 3-е издание. – СПб: Питер, 2005 г. – 958 стр.
Основы создания сетей и протоколы. Master mind/ NIIT. Web: www. printpulse.com.
Танненбаум Э. Компьютерные сети. 4-ое издание. – СПб: Питер, 2003 г. – 992 стр.
Успенский И. * Интернет как инструмент маркетинга.- СПб.: 1999.
Тақырып 5.
CGI бойынша сұраулар мен жауаптардың атаулары. PERL, PHP, ASP, SSI-дің серверлік сценарийлеріне және Java, JavaScript, VBscript технологияларына шолу
Өздік жұмыстың мақсаттары:
WEB – технологияларының қолдану салалары мен даму перспективалары.
Java тілі. Java тілімен байланысты технологиялар Internet-ті жаулап алды, бұл өте орынды болып табылады, өйткені ол келген World Wide Web – құжаттарына атқарылатын элементтер енгізді. Атқарылатын элементтер – ішінде орындалатын, құжаттарға салынған бағдарламалардан тұрады. Дәл осы, Java технологиясы, аплеттер деп аталатын, HTML тілі көмегімен жасалған, Java тіліндегі кішігірім бағдарламаларды Web бетіне орнықтыруға мүмкіндік берді. Программалаудың Java тілі Sun Microsystems фирмасы жасап, Oak тілінен бастама алды. Java тілі компиляцияланатын болып табылады. Программа алдымен архитектуралық байт – кодта компиляцияланады, одан кейін, Java мен қолданатын, Web-броузерде интерпретацияланады.
Java тілін жасау – ақырғы 20 жыл ішіндегі программалау ортасын құру саласындағы маңызы зор қадамдардың бірі болып табылады. HTML тілі WWW (World Wide Web) “Әлемдік торында” беттерді статикалық орналастыру үшін қолданылды. Java тілі Internet жүйесінде интерактивті өнімдерді жасаудағы сапалық қадамда қарқындатуға қажетке жарады.
Java тілінің технологиясында үш басты элемент бірігіп, қазіргі кезде барлық барды келесі белгілер бойынша айырықша етті:
- Java ең алдымен кеңінен қолдану үшін, Web беттеріне орналастырылатын, кішігірім, сенімді, қарқынды, платформаға тәуелді емес белсенді жүйелік қолдануларды - өзінің аплеттерін ұсынады;
- Java жай және таныс синтакисты жұмыста сенімді, әрі қолайлы құру ортасымен үйлестіріп, қолданбалардың объектілік – бағдарлық жұмыстарының қуатын босатады. Бұл программистердің көпшілігіне жаңа программалар мен аплеттер жасауға мүмкіндік береді.
- Java программистке, көптеген жүйелік функцияларын анық абстракциялау үшін, терезелермен жұмыс атқару кезінде пайдалынатын, жүйемен және енгізу-шығару үшін пайдалынатын, объект класстарының үлкен жиынтығын ұсынады. Бұл кластардың негізгі нышаны болып, кең спектрі үшін, қолданылған абстракция платформасына тәуелсіз жүйелік интерфейстерді жасауды қамтамсыз ететіні болып табылады.
Java тілі әртүрлі тұрмыстық заттарға арналған озық програмалық жасақтаманы құрудың жобасының бір бөлігі ретінде пайда болды. Жобаны іске асыру шаралары С++ тілінде басталған болатын, бірақ көп ұзамай бірқатар мәселелер пайда болғандықтан, оны шешудің басты шешімі ретінде, құралдың өзін өзгерту - программалау тілін өзгерту болып табылды. Программалудың платформаға тәуелді емес, әрбір архитектураға бөлек компиляциялауды қажет етпейтін, және әртүрлі операциялық жүйелері бар әртүрлі процессорларда қолдануға болатын, программаларды құру мүмкіндігін беретін программалау тілі керек екендігі айқын көрінді. Java-ның көптеген, жайлылық, қауіпсіздік, объектілік бағдарланған болу, сенімділік, интерактивтік, ЭЕМ архитектурасына тәуелсіздік, жоғары өнімділік, бай объектілік орта сияқты, артықшылықтары бар. Java-ның үлкен артықшылықтары, әртүрлі платформаларда жұмыс атқара алатын, бұл тілде қолданбаларды жасауға болатындығы болып табылады. Internet жүйесіне – Пентиум ПС, Макинтош, Sun жұмыс стансалары, т.с.с. әртүрлі типтегі компьютерлер қосылған.
Intel негізінде жасалған компьютер шеңберінің өзінде, бірнеше платформа бар, мысалы, олар: Microsoft Windows 3.1., Windows 95, Windows NT, OS/2, Solaris, Windows – Х графикалық қоршамы бар, әртүрлі операциялық жүйе түрлері – UNIX. Сонымен бірге, Internet жүйесінде Web-серверін құра отырып, сіз оны адамдардың көпшілігі пайдалануын қалар едік. Бұл жағдайда, сізге Java қолданбалары көмекке келеді, олар процессордың және операциялық жүйенің нақты бір түріне тәуелсіз, және әртүрлі платформаларда жұмысын атқара алады.
Java программалық тілінде жасалған программалар, мақсаттары бойынша екі топқа болады: бірінші топқа арнайы интерпретациялық Java машинасының басқаруымен дербес жұмыс үшін арналған, оған Java қолданбалары жатады, бұл машинаны іске асырулары барлық негізгі компьютерлік платформаларға арналған. Екінші топқа – аплеттер жатады. Аплеттер барлық қазіргі замандық броузерлерге құрылғыланған, виртуалдық Java машинасымен интерпретацияланатын, Java қолданбаларының әр түрінен тұрады
Бірінші топқа жататын қолданбалар (біз оларды жай ғана, Java деп атаймыз) – олар кәдімгі дербес программалар. Олардың машина кодтары болмағандықтан, және арнайы интерпретациялық машинасының басқаруымен жұмыс атқаратындықтан, олар мысалы С++ программалау тіліндегі кәдімгі прграммаларға қарағанда, өнімділік жылдамдығы біршама төмен болып табылады. Бірақ, Java программалары қайта аудармалаусыз кез – келген платформада жұмысын атқара алатынын ұмытпау керек, өйткені осының өзі, Internet жұмыстарына маңызы зор болып табылады.
Java Script 1995 жылдың аяғында дайын болып, қазіргі кезде өте танымал болып, көпшілік броузерлермен қолданады. Java Script тілі Netscape Communication Corporation компаниясы Sun Microsystems компаниясымен біріге отырып жасады. Java Script тілінің бастапқы атауы Live Script болды. Одан кейін Java тілі әлемге танымал болғаннан кейін, Live Script атауын Java Script атауына өзгертті. Бұл шараларды Netscape компаниясы, коммерциялық тұғырдан ала отырып жасаған болу керек: Java атауының барлығы да үлкен қызығушылық тудыратын.
Java Script программалау тілін жасау кезінде, басында, ол маман еместерге арналған болатын. Java Script қолдану жағынан қарапайым болғандықтан, ол Basic тіліне ұқсас келеді, бірақ оның көмегімен мамандар өте күрделі, әрі пайдалы міндеттерді шеше алады. Java Script дербес программалар мен аплеттерге арналмаған, сондықтан, ол С++ және Java тілінен біршама айырықшаланады. Java Script құрылымдары HTML құжаттарының бастапқы мәтініне тура енгізіледі және бұл құжаттады жүктеу барысында броузермен интерпретацияланады. Сонымен қатар, Java Script тілінің көмегімен, HTML құжаттарының жүктелінетін мәтіндердің динамикасын құрып, және оны өзгерте аласыз. Java Script тілінің тағы бір маңызды жағы, ол оның обектілік бағдарланған болуы. С++ немесе Java қарағанда, Java Script тілінің обектілік бағдарлану төмендеу болғанымен, ол бірақ бұл тілде де бар. Программистерге көптеген объектілер мүмкін, броузерге орнатылған және оған HTML жүктелінетін құжаттары, HTML құжаттары, фреймдер, формалар, сілтемелерді басқа құжаттарға, т.с.с. Өзіндік кластарды жасау, сонымен қатар, объектілерді топтастыру және негізгі кластарды кеңітуге аналған мәліметтер құрлымын топтастыру жіберіледі. HTML құжаттарына енгізілген Java Script құрылымы арқылы, шаралаларды да өңдеуге болады. Бұл шаралар қолданушы броузер терезесіне енгізілген HTML құжаттарына бірқатар әртүрлі операцияларды жасағанда пайда болады. Бұл әртүрлі визуалды әсер алуға мүмкіндік береді, мысалы, тышқан курсоры олардың үстінде тұрғанда, басқару мүшелерінің сырт пішінінің өзгеруі. Web серверіне өңдеу үшін, оған жөнелтудің алдында форма шеттеріне қолданушы енгізген, мәліметтерді алдын-ала тексеруге болады, сонымен қатар, броузер терезесіне HTML құжатын жүктеуге дейін өзіндік әрекеттер жасауға болады, және басқа да пайдалы жұмыстарды атқаруға болады. Java Script күрделі программаларды жасау үшін жасалмаған болатын. Ондай мәселелерді басқа программалау тілімен жасаған дұрыс, мысалы, Java тілі көмегімен. Бірақ, Java Script көмегімен сіз жеткілікті күрделі мінез-құлқы бар, белсенді беттерді жасай аласыз. Бұл тілді оқып – үйрену қиын емес, ал оның көмегімен жасалған программалар, оңай кейінге қалдырылады.
CGI инетрфейс. CGI - Common Gateway Interface НТТР түріндегі Web серверімен сыртқы қосымша программасының интерфейс стандарты болып табылады. Әдетте, WWW серверінен алынатын гипермәтіндік құжаттарда статистикалық мәліметтер болады. CGI көмегімен, CGI – программаларды жасауға болады, олар шлюдер немесе CGI – скриптер деп аталады, олар мәлімет базасының басқару жүйесі, электронды таблица, іскерлік графика және т.б. сияқты қосалқы программалармен араласа отырып, қолданушы экранына динамикалық ақпарат бере алады. Common Gateway Interface-тің басты мақсаты – серверде бастама алатын, сервер мен қосалқы программа арасында бірқалыпты сарынды мәліметін қамтамасыз ету. CGI – скипт WWW серверімен уақыттың шынайы ауданында, жіберіледі. WWW сервері пайдаланушының сұранысын шлюзға жөнелтілуін қамтамасыз етеді, ал ол, өз кезегінде, қосалқы жүйе құралдарын пайдалана отырып, сұранысты өңдеу нәтижелерін қолданушы экранына жөнелтеді. Программа – шлюз Pascal, С/С++ , Fortran, Perl, TCL, Unix Schell, Visual Basic, Apple Script және т.б. жазыла алады. Атқарушы модуль болғандықтан, ол әдетте, директория ішілік, WWW сервердің sgi – bin атымен жазылады.
Сервердің бұл Web-беттің жай ғана HTML құжаты емес, мұнда SSI –директивалары бар екенін білу үшін, файлға арнайы *.shtml немесе *.shtm кеңейтілулер беріледі. Серверге қандай блокты қою керек екенін көрсету үшін арнайы жазу формасы келесі комментарий түрінде жазылады:
<!--#command param=”value”-->
Мұнда “#” белгісі SSI-қойылымның басталуын білдіреді, command SSI-ға команда береді, param SSI- командасының параметрлерін анықтайды, ал value осы параметрлердің мәндерін көрсетеді. Барлығы оншақты SSI-командалары белгілі.
CGI-сценарий (немесе скрипт) – Web-серверде клиенттің (сайтқа кірушінің) сұрауы бойынша орындалатын программа. CGI – сценарийлар жазылатын программалау тілі емес, бұл сценарийлерді жүргізуді орындайтын арнайы интерфейсті анықтайтын технология атауының аббревиатурасы (Common Gateway Interface – орталық шлюздің интерфейсі). CGI-сценарийі қалай жұмыс жасайды? Сіздің Web-сайтыңызға кіруші арнайы формадағы сұрақтарға жауап береді де submit батырмасын басады, оның нәтижесінде CGI-сценарийі қосылады. Бұл сценарий алдына-ала программаланған әрекеттерді орындайды, яғни формадағы сұрақтарды оқиды және сервердегі қонақ кітабінің файлына жазады. Содан кейін, сайтқа кірушінің браузеріне жай HTML-кодта жазылған мәлімет жібереді. Мысалы, Сайтымызға кіргеніңіз үшін рахмет.
CGI-прграммасы кез-келген программалау тілінде жазыла береді. Ең бастысы, сервер бұл программаны орындай алу керек, яғни серверде сәйкес программалау тілінің интерпретаторы немесе компиляторы орнатылған болу қажет. CGI-сценарийлерін келесі программалау тілдерінде жазуға болады: C/C++, Perl, Shell, Visual Basic, Delphi және т.б.
JavaScript – қолданушының машинасында әртүрлі әрекеттерді орындауға арналған сценарийлер жазу тілі. JavaScript-сценарийлері HTML-құжатының ішінде немесе *.js кеңейтілу бар файлдарда орналасады.
HTML-құжатында JavaScript-сценарийлер қойылымы <SCRIPT> ашылу дескрипторы және </SCRIPT> жабылу дескрипторынан басталады. <SCRIPT> ашылу дескрипторының JavaScript мән берілген LANGUAGE міндетті емес параметрі болуы мүмкін. Сонымен қатар, <!—және //--> комментарий дескрипторын қолданады.
Мысалы,
<SCRIPT LANGUAGE =” JavaScript”>
<!—
Alert (‘Сәлем!’)
//-->
</SCRIPT>
Бұл сценарийдің орындалу нәтижесінде экранға Сәлем! деген мәлімет шығады.
Тапсырманы өткізу мерзімі: 14 апта
Бақылау формасы: ауызша сұрау, жазбаша бақылау
Балл___5__
Әдебиеттер:
Негізгі әдебиет
Леонтьев, Б. К./ Б. К. Леонтьев Энциклопедия WEB-дизайнера /. - 7-е изд., испр. и доп. - М. : Новый издат. дом, 2004. - 640 с
Прохода А.Н. / А. Н. Прохода. - М Обеспечение интернет- безопасности : практикум. : Горячая линия-Телеком, 2007. - 180 с.
Баловсяк Н. Интернет: Новые возможности. / Н. Баловсяк. - СПб. : Питер, 2008. - 304 с. - (Трюки & эффекты)
Билл Сандерс. Flash 5 Эффективная работа. – СПб: Питер 2001. – 352 с.
Блэк, Юлесс. Сети ЭВМ: протоколы, стандарты, интерфейсы. / под ред. Василькова, М.: 1990 г.
Дмитриева М. Java Scrіpt. Быстрый старт. – Санкт Петербург: БХВ-Петербург, 2002. – 336 с.
Леонтьев Б. Web –дизайн: Рук-во пользователя. – Москва: Познават. книга плюс, 2001. – 320 с.
Тихонов А.И. Динамический HTML – М.: ЗАО «Издательство БИНОМ», 2001. – 496 с.
Қосымша әдебиет
Лапшинский В.А. Локальные сети персональных компьютеров. Часть-2, М., МИФИ, 1994 г.
Науманн Ш., Вер Х. Компьютерная сеть. Проектирование, создание, обслуживание. М.: ДМК, 2000. –336 стр.
Олифер В.Г., Олифер Н.А. * Компьютерные сети. Принципы, технологии, протоколы. 3-е издание. – СПб: Питер, 2005 г. – 958 стр.
Основы создания сетей и протоколы. Master mind/ NIIT. Web: www. printpulse.com.
Танненбаум Э. Компьютерные сети. 4-ое издание. – СПб: Питер, 2003 г. – 992 стр.
Успенский И. * Интернет как инструмент маркетинга.- СПб.: 1999.
Тапсырма 1: Келесі сұрақтарды оқып білу:
Клиент жағында орындалатын қосымшаларды құру технологиясы.
Интерактивті әрекеттесу (CGI, серверлік қосылу).
HTTP сұраулары мен жауаптарының атаулары.
CGI интерфейсі, CGI- программаларының атаулары.
Сервер жағында орындалатын қосымшаларды құру технологиясы (CGI, PERL, PHP).
Тапсырма 2: Java Scrіpt тілін пайдаланып келесі тапсырмаларды орындаңыз:
«Премияны есептеудің» программасын құрыңыз.
«Оқытушының жүктемесін» есептеу анкетасының программасын құрыңыз.
Тізім түрінде берілген тестілеу нәтижесінің программасын құрыңыз
Жалау, ауыстырғыш және тізімдер элементтерінің қасиеттерін анықтайтын сценарий құрыңыз.
«Емтихан жүргізудің нәтижелері» бойынша программа құрыңыз.
Кестелер стильдері мен құжатты байланыстырудың программасын құрыңыз.
«Қабаттарды басқару» программасын құрыңыз