Дәрістің қысқаша мазмұны HTML (Hyper. Text. Markup. Language) – бұл құжаттарды кодтау үшін қолданылатын гипертекстік белгілеу тілі. HTML ді көбі программалау тілі деп ойласа да, бұл программалау тілі емес. HTML – мәтінді белгілеу тілі. HTML құжаттарды көру үшін браузерларды қолданамыз. Браузер-программалардың саны өте көп, мысалы көп таралғандар Netscape Communicator, Microsoft Internet Explorer, Opera. HTML тiлiнде колданылатын командаларды “тег” деп айтамыз. HTML тiліндегi тегтер екi топқа бөлiнедi: жұпты, жұпсыз. Жұпты тегтер дегенiмiз, бiр тег ашылса, келесi тег оны жабады. Мысалы, <html> тегтiң жұмысын ашады да келесi </html> тегi оны жабады. <title> ашылуы, </title> жабылуы. Жұпсыз тегтер дегенiмiз, тег ашылады да қолданыла бередi.
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с. Бұл жерде border кесте сызықтарының ені. Кестенің ұяшықтарының енін пайз арқылы өзгерту үшін width атрибутн қолданса болады, мысалы: <TABLE width=50%>
Программалық жабдықтау HTML-құжаттарды жасақтау және өңдеу үшін кезкелген қарапайым мәтіндік редактор жеткілікті, мысалы Блокнот. Көп дизайнерлердің ойы бойынша таза сілтемелер тілін қолмен жазған дұрыс. Бірақ көп уақытта қолмен жазған қолданылмайды. Себебі қолмен жазған автордан көп білімді және практикалық тәжірибені талап етеді. Практикады әдетте Web-сайт жасау 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 кодын жасамайды, оған артық және «фирменный» тегтерді қосады. Көріп отырсыздар, WYSIWYG редакторларды қолданы HTML тегтерін қолмен жазуды құтқармайды, демек, Webсайттарын жасау үшін HTML тілінің кем дегенде негізін білу керек. WYSIWYG программаларыдың тізімі: Microsoft Front Page.
HTML-да кесте құру амалдары Кесте Hmtl сайттарын жасау үшін үлкен рөл атқарады. Кестені құру үшін «TABLE» тэгі қолданылады. Кесте бәріне белгілі тармақтардан тұрады, ал тармақтар ұяшықтан тұру міндет. Тармақтарды құру үшін «TR» тэгі қолданылады. Ұяшықтарды құру үшін <TH>, <TD> тэгтері қолданылады. Кестені құру мақсатында өзіне жағымды мәтінді гипермәтінді суретті өзіне ұнағандай орналастыруға болады. Кесте әрқашанда браузердін сол жағында орналасады оны өзгерту үшін «ALIGN» параметрі қолданылады оның 3 мағынасы болады left, right және center. <html> <head> <title>Таблицы</title> </head> <body> <table border="1" width="500" height="200" align="center"> <tr> <td width="300"> </td> <td> </td> </tr> <td width="300" height="150"> </td> <td height="150"> </td> </tr> </table> </body> </html>
Мысалы осындай кестені құру үшін Келесі мәтін жазылады: <HEAD> <TITLE>Пример простейшей таблицы</TITLE> </HEAD> <BODY> <TABLE BORDER> <TD>Ячейка 1 строки 1</TD> <TD>Ячейка 2 строки 1</TD> </TR> <TD>Ячейка 1 строки 2</TD> <TD>Ячейка 2 строки 2</TD> </TR> </TABLE> </BODY> </HTML>
ФОН Кестені оформлеу үшін торлардың көлемі суреттін көлемімен бірдей болу керек. Егер көлемі сәйкес келмесе суреттін жартысы көрінбей қалады: Ол үшін келесі мәтінді жазу керек: <table border="1" width="411" height="119"> <tr> <td width=113 height=113 background="image 1. jpg">ФОН 1</td> <td width=282 height=113 background="image 2. jpg">ФОН 2</td> </tr> </table> Иа HTML кодың әрқашанда жазу онайға соқпайды ал егер Namo Web. Editor 8 программасын қолдансақ ол ешбір ауырға соқпайды.
Глоссарий № Казахский /Русский/ Английский Содержание 1 Тег HTML тiлiнде колданылатын командалар Тег Tag 2 Opera Опера Софтуаре АСА компаниясы шығаратын Интернетте жұмыс істеуге арналған веб-браузер және бағдарламалық пакет. Норвег компаниясы Теленор-мен 1994 жылы жасап шығарылған. Opera 3 Html Интернетте HТМL беттерін алмасу үшін арналған хаттама. Html Hyper. Text Transfer Prоtocоl 4 Java. Script объектіге бағытталған скрипттік (немесе сценарийлер) бағдарламалау тілі. ЕЦМАСцріпт тілінің диалекті болып табылады. ЕЦМА-262 спецификациясының Цонформанце бөліміне сәйкес ЕЦМАСцріпт спецификациясының жүзеге асқан өнімі. Java. Script 5 Ғаламдық тор Всемирная паутина World Wide Web компьютердегі мәліметтер мен құжаттарды, мультимедиа элементі бар гипермәтінді жүйелерді байланыстыратын ғаламдық тор.
Тест сұрақтары
1)Интернет желісіне қосылған компьютерде міндетті түрде болады a) IP-адрес b) үйшік аты c) WEB-беттері d) URL-адрес e) жеке WEB-беті 2)WWW құжаттарын ұсынатын және қабылдауды, сұраныстарды қамтамасыз ететін программа a) браузер b) гиперссілтеме c) веб-мастер d) фрейм e) бейне-сілтеме 3)Төменде көрсетілгендердің қайсысы Web– парағын құруға арналған программалар? a) жауаптардың бәрі дұрыс b) HTML, Corel. Draw, Adobe Streamline, EXCEL c) Corel. Draw, Adobe Streamline d) HTML, Adobe Photoshop, Photo. Pain e) Adobe Illustrator, Corel. Draw, Adobe Streamline, WORD 4)Web-беттерінің кеңейтілуі (форматы). . . a) html b) txt c) Doc d) exe e) дұрыс жауабы жоқ 5)Тег бұл a) web – парағын құруға арналған команда b) элементтің бастапқы және аяққы маркері c) арнайы таңбалар пайдаланылатын мәтін d) басқа файлға немесе обьектіге сілтеме e) дұрыс жауап жоқ
Қолданылған әдебиеттер Негізгі әдебиеттер Жұмағалиева А. М. , Құлмұратова А. Ш. , Нұрғазинова А. Ж. , Смаилова Л. К. «Информатика» (ақпараттық жүйелер). Оқулық. – Алматы: Дәуір, 2011. -248 б. Медешова А. Б. , Гайбуллаев Д. Г. «Компьютер архитектурасы» . Оқулық. –Алматы: Дәуір, 2011. -192 б. Мырзабекова Г. Е. , Құлмұратова А. Ш. , Смайлова Л. К. , Тәжібай Л. К. «Интернет технологиясы» . Оқулық. –Алматы: Дәуір, 2011. -192 б. Бөрібаев Б. , Мадьярова Г. А. «Web технологиялар» . Оқулық. – Алматы: Дәуір, 2011. -360 б. Беркінбаева К. М. Информатика. Оқулық. – Алматы: Заң әдебиеті, 2007. – 421 б.
Скачать презентацию Дәрістің қысқаша мазмұны HTML Hyper Text Markup Language
sam.pptx