Қазақстан Республикасы білім және ғылым министрлігі
Семей қаласы ШӘКӘРІМ атындағы МЕМЛЕКЕТТІК УНИВЕРСИТЕТІ
|
3 деңгейдегі СМК құжаты
|
ПОӘК
|
ПОӘК
042.14.2.07.1.20.хх/01-2013
|
ПОӘК
Оқытушыға арналған
«HTML-технологиялары» пәні бойынша оқу жұмыс бағдарламасы
|
03.09.2013ж
№1 басылым
|
«HTML-ТЕХНОЛОГИЯЛАРЫ»
ПӘНІН ОҚЫТУ-ӘДІСТЕМЕЛІК КЕШЕН
5В011100 - «Информатика» мамандығына арналған
ОҚУ-ӘДІСТЕМЕЛІК МАТЕРИАЛДАР
Семей
2013.
МАЗМҰНЫ
-
|
Глоссарий
|
| -
|
Дәрістер
|
| -
|
Зертханалық сабақтар
|
| -
|
Студенттің оқытушымен бірге орындайтын өздік жұмысы
|
| -
|
Студенттердің өздік жұмыстарының құрылымы
|
|
-
Глоссарий
Alt – аймақтың балама аймағы. Сілтемеге еске салушы мәтін ретінде қолданылады.
CGI программалары - жалпы шлюздік интерфейс
CSS (Cascading Style Sheets – Каскадтық стильді кестелер) – HTML,XHTML жəне т.б. белгілеу тілдерінде жазылған веб-беттердің сыртқыкөрінісін суреттейтін, əрлейтін тіл болып есептеледі.
GML – жалпы белгілеу тілі
HTML – гипермәтінді белгілеу тілі
Name – сурет картасының идентификаторы. Идентификатор сондай құжаттар арасында бірыңғай болады.
SGML – стандартты жалпы белгілеу тілі
Shape – басылатын аймақтың формасы.
Web–парақ – жеке құрылған құжат.
Web-сайт – белгілі бір тақырыпқа арналған Web-парақтардың жиынтығы.
Web-сервер – Интернетке тұрақты қосылған, тораптар орналасқан, белгілі сұраныстар бойынша Web-парақтарды тауып бере алатын компьютер.
World Wide Web – бүкіл дүниежүзілік өрмек.
WYSIWYG - (ағылшын тілінде What You See Is What You Get, «нені көрсең, соны аласың») – қолданбалы бағдарламалар мен веб-интерфейстер сипаты болып саналады, онда контент өңдеу кезінде құжат веб-бет немесе тұсаукесер ретінде соңғы шыққан контент көрінісіне өте ұқсас болып келеді.
Атрибут - ашу тэгтеріне қолданылатын сипаттамалар, түрлендірулер
Әмбебап кодтау (ағылшынша «generic coding») деп аталады. Форматталған мəтінге қатысты барлық қажет жерде өзіндік белгілеу тілдері.
Белгілеу (ағылшынша «markup») термині ағылшын тіліндегі (marking up) сөз тіркесінен туған, «белгілеу, белгілеп қою» дегенді білдіреді.
Белгілеу тілі – бағдарламалау тілдер қатарына емес, компьютерлік тіл қатарына кіреді. Белгілеу тілі – символдар мен жүйеліліктер жиынтығы, ол қарапайым мәтіннен синтаксисі жағынан өзгешелеу болып келеді. Белгілеу тілінде жазылған мәтіндік құжат тек қана мәтіннен емес, сондай-ақ тізім, ерекшеленген сөздер немесе тақырыптардан құралады.
Блокнот (ағылшынша Notepad) – кез келген Microsoft Windows операциялық жүйесінде орналасқан қарапайым мәтіндік редактор.
Браузерлер майданы – браузерлер нарқын басқару үшін болатын браузерлер арасындағы күрес.
Веб-браузер дегеніміз – интернеттегі ақпарат көздерін көру үшін оларды өңдеуге, бір беттен екіншісіне ауыстыруға арналған бағдарлама.
Гипермәтін – қосымша элементтерді басқару мақсатында ішіне арнаулы код, яғни екпінді элемент (anchor) орналасқан мәтін.
Гипермәтін - сөзі мәтінді тармақтандыру және оған жауап беру ретінде қабылданып, сәйкесінше «гипермедиа» сөзі график, аудио- видеоларды тарату мен хабарласу жиынтығы. Гипермәтіндегі «гипер» сөзі грек тілінен «үстінде», «жоғарыда» деп аударылып, ағылшын тіліндегі «super» cөзінің мағынасына сәйкес келеді.
Интернет – бүкіл әлемдегі миллиондаған шағын компьютерлік желелерді бір – бірімен байланыстырып тұрған орасан зор компьютерлік желі.
Навигация – ауысулар
Сурет карта (англ. image map, кейде cенсорлы карта немесе графикалық карта) – HTML белгілеу тілінің графикалық объектісі, ол суретпен байланысты және суретті басу арқылы белгілі бір URL-ға сілтеме жасалатын арнайы аймақты білдіреді.
Сілтеме (hyperlink) – локалды дискте немесе компьютер желісіндеорналасқан құжат ішіндегі басқа бір элементке (мəтін, тақырып, сурет жəне т.б.), басқа объектіге сілтеме беретін гипермəтінді құжаттың бір бөлігі.
Тэг - HTML тілінің бастапқы мәтінді белгілейтін командалары
Тэг (tag) дегеніміз - HTML тіліндегі командалар.
Хаттама (протокол)- бірыңғай стандарт, ережелер.
Элемент - бұл тегтердің жұбы және олардың арасында орналасқан символдық мәліметтер (мәтін немесе код)
-
ДӘРІСТЕР
Дәріс 1. HTML тіліне кіріспе.
Жоспар:
-
Гипермәтін және гипермедиа;
-
Белгілеу тілі туралы түсінік;
-
HTML тілі жайлы;
-
Нұсқалар, даму тарихы;
-
HTML құрылымы, негізгі тегтер;
Гипермәтін және гипермедиа. Компьютер немесе басқа да электронды құрылғыларда оқылатын мəтіндер гипермәтін деп аталады. Гипермәтінді оқу барысында оқырман тінтуір (mouse) немесе батырма (клавиш) басу арқылы жедел түрде мәтіндерді ауыстыра алады. Оның қарапайым мәтіннен айырмашылығы – гипермәтінде кесте, сурет және басқа да элементтер болады. Гипермәтіндер интернет құрылымының негізін құраушы болып есептеледі. Себебі бұндай форматты интернетте пайдалану оңай əрі ыңғайлы.
Гипермəтін сөзіндегі «гипер» сөзі грек тілінен «үстінде», «жоғарыда» деп аударылып, ағылшын тіліндегі “super” cөзінің мағынасына сәйкес келеді.
«Гипермəтін» және «гипермедиа» терминдерін америкалық əлеуметтанушы, философ, АТ (ақпараттық технология) саласын алғашқы зерттеушілердің бірі Тед Нельсон 1963 жылы айналымға енгізді және 1965 жылы кең қолданысқа ие болды. Автор 1992 жылы шыққан “Literary Machines” кітабында бұл екі терминге мынадай түсініктеме береді: «Қазіргі таңда «гипермәтін» сөзі мәтінді тармақтандыру және оған жауап беру ретінде қабылданып, сәйкесінше «гипермедиа» сөзі график, аудио- видеоларды тарату мен хабарласу жиынтығы болып есептеледі. Бірақ оның орнына ақылға қонбайтын «интерактивті мультимедиа» сөзін қолданады, бұл жерде төрт буын артық және ол гипермәтін сөзінің кеңейтілген мағынасын бере алмайды».
Сурет 1. Тед Нельсон
Гипермәтіннің даму тарихына қысқаша тоқтала кетейік. 1963 жылы Тед Нельсон алғаш рет сілтемелері бар контентті енгізу мен қолдану үшін «гипермәтін», «гипермедиа» терминдерін қолданды. Ол кейінірек 1967 жылы Браун университетінде Андриес ван Дам деген информатика ғылымының профессорымен бірігіп, мәтін редакциялаушы Hypertext Editing System (аудармасы «Гипермəтін Редакциялаушы Жүйе») жобасын жасайды.
Ал 1977 жылы шыққан ең алғашқы гипермедиа қосымшасы – Aspen Movie Map қаладағы жер қыртыстарының виртуалды картасын қамтиды және оның көмегімен қолданушылар көлікпен жүрер жолдарды таңдай алды.
Белгілеу тілі туралы түсінік. Белгілеу тілі – бағдарламалау тілдер қатарына емес, компьютерлік тіл қатарына кіреді. Белгілеу тілі – символдар мен жүйеліліктер жиынтығы, ол қарапайым мәтіннен синтаксисі жағынан өзгешелеу болып келеді. Белгілеу тілінде жазылған мәтіндік құжат тек қана мәтіннен емес, сондай-ақ тізім, ерекшеленген сөздер немесе тақырыптардан құралады.
«Белгілеу» (ағылшынша «markup») термині ағылшын тіліндегі «marking up» сөз тіркесінен туған, «белгілеу, белгілеп қою» дегенді білдіреді. «Белгілеу» сөзі сонау дәстүрлі баспахана тәжірибесінде қолданылып, баспаға жібермес бұрын арнайы шартты белгілер мен таңбалар арқылы қолжазбаға түзетулер енгізуді білдірген. Осылай «белгілеушілер» (markup men) мəтіннің әрбір бөлігіне шрифтердің гарнитурасын, стилін, өлшемін көрсетіп отырған. Ал қазіргі кезде бұл қызметті редакторлар, корректорлар, графикалық дизайнерлер, сондай-ақ авторлардың өздері атқарады. Белгілеу тілін компьютерлік мəтіндерді өңдеуде қолдануды алғаш рет 1967 жылғы Конференцияда Уильям Танниклифф ұсынды. Ол өз жаңалығын «әмбебап кодтау» (ағылшынша «generic coding») деп атады. Форматталған мəтінге қатысты барлық қажет жерде өзіндік белгілеу тілдері қолданылады: типографияда (SGML, TeX, PostScript, PDF), компьютердің қолданушы интерфейстерінде (Microsoft Word, OpenOffice), әлемдік желіде (HTML, XHTML, XML, WML, VML, PGML, SVG, XBRL).
HTML тілі жайлы. Гипермәтінді белгілеу тілі (HyperText Markup Language - HTML) – веб браузерде веб-беттерді жəне басқа да ақпараттарды шығару үшін қолданылатын ең басты белгілеу тілі болып есептеледі.
Бұрышты жақшалар арқылы ашылып жабылатын тег (мысалы ) деп аталушы HTML элементтерінен құралған HTML тілі веб-бет контентін тудырады. Тегтер сыңарлы жəне сыңарсыз болып бөлінеді.
Сыңарлы тегтерге мыналар жатады: , ,
және т.б. Ал сыңарсыз тегтерге
, , сияқты тегтер жатады. Сыңарлы тегтерде алғашқы тұрған тегі бастаушы, ал екінші тұрған тегі аяқтаушы деп аталады. Сондай-ақ оларды ашылушы және жабылушы деп те атайды. Осы тегтердің көмегімен веб-дизайнерлер мәтін, пікір және контентте кездесетін басқа да мәтінге ұқсас нәрселер жаза алады.
Сурет 2. HTML тілінің тарихи логотипі
Веб браузердің мақсаты – осы HTML тілінде жазылған құжаттарды оқып, веб-беттерде оқуға ыңғайлы, оқырманға көрінетіндей етіп шығарып беру. Браузерлер HTML тегтерін шығармайды, алайда сол тегтерді беттің контентін интерпретациялауда қолданады.
HTML элементтер кез келген веб-сайттардың негізгі құрушы блоктары болып табылады. HTML суреттер мен объектілерді қойып, оларды интерактивті формаларға айналдыра алады.
Тақырып, азатжол, тізім, дəйексөз сияқты мәтіннің құрылымдық семантикасын білдіріп, құрылымдық құжаттар құрады. Веб-беттердің жұмысынан әсер ететін JavaScript сияқты тілдердің скрипттерін қояды.
Веб-браузерлер контенттің сыртқы көрінісін, мәтіндердің және басқа да материалдардың орналасуын анықтау үшін каскадтық стильді кестелерді (Cascading Style Sheets - CSS) де қолданады. HTML және CSS стандарттарын қадалаушы W3C ұйымы (World Wide Web Consortium (W3C) халықаралық World Wide Web (қысқаша WWW немесе W3) стандарттау ұйымы) HTML белгілеу тіліне CSS қосып пайдаланса, көрнектілеу болатынын айтады.
Нұсқалар, даму тарихы. HTML тілінің пайда болуы сонау 1986 жылғы Халықаралық Стандарттау ұйымының (ISO) «Standard Generalized Markup Language» (SGML) деп аталатын ISO-8879 стандартын қабылдауынан басталады. Осы SGML тілі сол кезде мәтіннің құрылымдық (логикалық) белгілеуі болып, құжаттың сыртқы көрінісінің кішкене ғана сипаттамасына дейін түсінбеуші еді. Сондықтан SGML тілінде кегіл (кегель) сипаттамасы мен шрифт өлшемі сол кездегі стандартқа қайшы келіп, берілген құжаттың кросс-браузерлік және кросс- платформалық талаптарын орындай алмады. Негізі стандартты белгілеудегі мақсат – осы талаптарға жауап беру болатын. Дегенмен SGML мәтіннің белгілеу тіліне дайын жүйе болып табылмайтын және белгілі жағдайда қолданатын тілдің құрылымдық элементтерін білмейтұғын. Бұл тіл кейінірек “тег” деп аталып кеткен мәтін белгілеуінің негізгі элементтерінің жазылу синтаксисін ғана сипаттады. Құжаттарды практикалық белгілеу үшін қандай жағдайда тілдің қандай элементін қолдану керек екенін түсінетін және құжаттармен жұмыс істеуші бағдарламаларды қабылдайтын тіл ойлап табу қажет еді. SGML тілі өзінің қосымшасы сияқты халық арасында кең қолданысқа енбеді.
Алғаш рет 1991 жылы интернет арқылы гипермәтінді ақпарат алмасатын механизмге сұраныс пайда болды. Сол кезде Тим Бернерс-Ли қаңқа ретінде SGML-ді таңдап, оның негізінде HTML (Hyper Text Markup Language, «гипермәтінді белгілеу тілі») тілін ойлап тапты.
Сурет 3. Тим Бернерс-Ли
HTML тілінің 1.2 нұсқасы шамамен 40 тегтен тұрды. Ол құжаттың физикалық көрінісін сипаттамайды. Барлық қасиеті мәтінді логикалық және құрылымдық белгілеуге келіп саяды. Бірнеше тег қана бет көрінісінің физикалық қасиетін сипаттауға жақын келді. Осындай тегтердің біріне былай мінездеме берілген: «Осы тегті қолдану арқылы құрылған құжатты қарағанда, мәтін графикалық браузерлерде жартылай қою көлбеу (курсив) болып көрінеді».
В 1994 жылы Интернетті басқарушы W3 концорциумы (W3С) құрылып, бұл ұйым HTML 2.0 нұсқасының сипаттамасын жасауға кірісті, бірақ соңғы HTML 2.0 стандарты 1995 жылы қабылданды. Ал бұл кезде HTML 3.0 нұс-қасы қызу талқыға түсіп, оны жасақтауға дайындық жүріп жатқан. HTML 2.0 нұсқасының таң қалдырған жаңалығы – қолданушыдан серверге ақпарат жеткізу формасының пайда болуы еді. Дегенмен HTML- технологияда HTML 3.0 нұсқасы қарқынды серпіліс жасады. Стандарттың бастапқы нұсқасы көптеген қызықты жаңалықтар енгізді: олар кесте құратын тегтер, математикалық формулаларды белгілеу, суреттерге жазу қою және т.б. Бірақ 1995 жылы гипермәтінді беттерді визуалды дайындауға қажеттілік туды.
W3 Концорциумы HTML негіздеріне қайшы келмейтін HTML- құжаттарды визуалды дайындауға мүмкіндік беретін бөлек бір жүйе ойлап тапты. Осылай каскадтық стильді кестелері (Cascading Style Sheets, CSS) ойлап табылып, ол мүлдем өзгеше құрылымға, синтаксиске ие болды.
Тез арада, сол 1995 жылы алғашқы коммерциялық Netscape Navigator браузері пайда болып, ол Netscape Communications корпорациясының адамзат тарихында болмаған қарқынды дамуына алып келді.
1996 жылы Microsoft корпорациясы халық арасында танылмай қалған Microsoft Internet Explorer 2.0 браузерін шығарып, браузерлер нарығында пассив бақылаушы болды. Сосын сол браузердің 3-нұсқасы шығып, браузерлер нарығын Microsoft Navigator Communications-пен теңдей бөлісті. Microsoft W3 Концорциумын өз бақылауына алған соң, аз уақыт ішінде толық Microsoft Internet Explorer браузеріне бағдарланған HTML 3.2 нұсқалы стандартын жасады.
HTML 3.2 нұсқасы ВЕБ-құрылыс дамушы тілінің осы күнге дейінгі бірден-бір стандарты болып келді. HTML-дің осы нұсқасы барлық браузерлерге сай келетін белгілеу элементтерімен жүйеленді.
Соңғы жылдары, дәлірек айтқанда, 2004 жылы HTML-дің соңғы нұсқасы HTML 4.01. қабылданып, бүгінгі дейін қолданылуда. Ол жоғары кросс-браузерлі және кросс-платформалы талаптарға жауап береді.
Қазіргі таңда HTML-5 жасақталып жатыр, оның ресми шығуы 2014 жылға жоспарланған.
Сурет 4. HTML5
HTML құрылымы, негізгі тегтер. HTML құжатының құрылысы бірінің ішіне бірі салынған контейнерлерді қолдануға мүмкіндік береді. Шынында да, құжаттың өзі бұл «HTML» атымен аталатын бір үлкен контейнер. Мысалы, мына суретті алайық.
Сурет 5. «HTML» контейнері
Құжат мазмұны
HTML элементінің өзі немесе гипермәтіндік құжат – құжаттың басынан (HEAD) және денесінен (BODY) тұрады:
Құжаттың аты
Құжат денесінің мазмұны (мысалы: мәтіндер, суреттер, кестелер)
Достарыңызбен бөлісу: |