Html-құжатының жалпы құрылымы


HTML-құжатының жалпы құрылымы

HTML (ағылшын сөзі HyperText Markup Language - - «гипермәтінді белгілеу тілі») - дүниежүзілік құжаттардың стандартты гипермәтіндік тілі. Web-парақшалардың көбі HTML (немесе XHTML) тілі арқылы құрылады. HTML тілі браузерлермен анықталады және ыңғайлы құжат ретінде көрсетіледі. HTML тiлi SGML-дiң (Standard Generalized Markup Language) қосымшасы болып табылады жəне əлемдiк ISO стандартына сəйкес келедi.

HTML тiлiнің негізін 1986-1991 жылдар аралығында британдық ғалым Tim Berners-Lee қалады. Бұл тiл web мамандары емес, адамдардың арасында ғылыми жəне техникалық құжаттарды алмасу үшiн құрылған. HTML арқылы қарапайым, бірақ әдемі өңделген құжатты құруға болады. құжаттың құрылымын жеңілдетумен қатар, HTML тілінде гипермәтінді қолдау енгізілген, кейіннен мультимедиялық мүмкіндіктер қосылды.

HTML құжаттарын жасау үшін мəтіндік редакторларды (мысалы, блокнот), мəтіндік процессорларды (Word) жəне визуалдық HTML редакторларын қолданады. Қарапайым блокнотта арнайы стандартты ұстана отырып, HTML кодты мəтіндік файлында жазып қойып, қатқыл дискіде . txt деген кеңейтуді . html немесе . htm құжат ретінде сақтаса, толық web-парақша алынады. Web-парақшаны ашу үшін желімен байланыста болу қажетті емес.

HTML тілі:

  • мәтінді форматтауға;
  • ол жердегі функционалдық элементтерді (батырмаларды, кестелерді және т. б. ) ажыратуға;
  • интернеттің басқа ресурстарына сілтемелер құруға (гипермәтіндер) ;
  • бейнеленетін парақшаға әр түрлі сыртқы нысандарды (кескін, дыбыс жазу және т. б. ) қоюға;
  • парақшаға программалау (мысалы, JavaScript) тілінде жазылған программалық кодтарды қосуға мүмкіндік береді.

HTML құжаттарды форматтауға нақты және дәл атрибуттарды бермейді. Құжаттың нақты түрін тек қана Интернет пайдаланушының компьютерінде программа-браузері анықтайды.

HTML-дің негізгі компоненттері:

  • Тег (tag) . HTML тегі - бұл web-браузерге абзацты құру немесе кескінді қою сияқты белгілі бір есепті орындауға команда беретін компонент.
  • Контейнер. Жұпталған тегконтейнердеп аталады. Олар екі бөліктен тұрады: ашылатын және жабылатын тегтер.
  • Атрибут(немесеаргумент) . HTML атрибуты тегті өзгертеді. Мысалы, тегтің ішінде абзацты немесе кескінді тегістеуге болады.
  • Мән. Мән атрибуттарға меншіктеледі және енгізілетін өзгерістерді анықтайды. Мысалы, егер тег үшін тегістеу атрибуты пайдаланылса, онда осы атрибуттың мәнін көрсетуге болады. типте бола алады, сонымен қатар мәні пиксельмен анықталатын кескіннің енін немесе биіктігін анықтайтын сандық типте де болуы мүмкін.

Тегтер - мәтінді белгілеу құралы болып табылады. Тегтер бас əріппен де кіші əріппен де жазыла береді. Барлық тегтер бірдей форматты: “<” белгімен басталады және “>” белгімен аяқталады. Олар жұптарымен (<html>-ашылатын және </html>-жабылатын тегтер) де, жалғыз да болады.

HTML программасы <HTML> тегімен басталып </HTML> тегімен аяқталады. Аяқталу мен басталу тегтерінің айырмашылығы - аяқтау тегінде «/» слэш таңбасының қойылуында.

<HTML>

. . . (бұл жерде программаның басқа тегтері болады)

</HTML>

HTML - программасы екі негізгі бөлімнен тұрады: атауынан және денесінен. Атауы <HEAD> және </HEAD> тегтер жұбымен шектеледі, ал денесі <BODY> және </BODY> тегтер жұбымен шектеледі.

Нәтижесінде программа мына түрде жазылады:

<HTML>

<HEAD>

. . . (атауы)

</HEAD>

<BODY>

. . . (программа денесінің басқа тегтері)

</BODY>

</HTML>

Сонымен қатар, браузер терезесінің атауында орналасатын әрбір HTML- программаның атауы болады. Браузер терезесінің атауы <TITLE> және </TITLE> екі тегтің көмегімен құрылады және <HEAD> және </HEAD> тегтерінің арасында орналасады.

<HTML>

<HEAD>

<TITLE> HTML негіздері </TITLE> ;

</HEAD>

<BODY>

. . . (программа денесінің басқа тегтері)

</BODY>

</HTML>

HTML-программаларды жазған кезде, браузердегі құжатты жүктегенде көрінбейтін, мәтіндерді түсіндіретін - түсініктеме қою қажет болады. Осы мақсатта <!> тегі пайдаланылады. <! және > символдарының арасында орналасқанның бәрі түсініктеме болып есептеледі де браузерде бейнеленбейді.

Блокнот мәтіндік редакторына төмендегі файлды енгіземіз:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4. 01 Transitional//EN"
"http://www. w3. org/TR/html4/loose. dtd">

<html>

<head>

<title> Менің бірінші парақшам! </title>

</head>

<body>

<!-Алғашқы сөйлемді жазамын!-->

Алғашқы парақшамды құрдым!!!

</body>

</html>

Осы программа мәтінін html құжаты ретінде сақтаймыз.

HTML тіліндегі форма - пайдаланушыға жүйемен кейіннен өңдеу үшін ақпаратты енгізуге мүмкіндік беретін құжат бөлімі. HTML-дағы форма FORM элементінің көмегімен беріледі және қарапайым элементтерді белгілеуге қосымша басқару элементтері, таңба және т. б. белгілерді қамтиды.

Басқару элементтері пайдаланушының формамен өзара әрекеттесуі үшін қызмет атқарады. NAME атрибуты берілген форманың ішіндегі басқару элементінің атын анықтайды.

Форманың әрбір элементімен бастапқы және ағымдық мән байланысты. Бастапқы мән value атрибутымен (textarea, object мәндерінен басқа) берілуі мүмкін. Элементтерге сәйкес мәндер пайдаланушының немесе скрипттердің формамен өзара әрекеттесуінде өзгеруі мүмкін. Форманы тазарту барысында элементтер жаңа бастапқы мәнді қабылдайды.

HTML-құжатының негізгі басқару элементтері, атрибуттары

HTML-да келесі басқару элементтері анықталған:

  • батырма:submit, image, reset, жәнеbuttonэлементі;
  • чекбокс (жалауша) :checkboxтипі;
  • радиобатырма:radioтипі;
  • мәзір:selectэлементі ;
  • мәтін жолы:textтипі, сонымен қатарtextareaэлементі;
  • пароль: password типі;
  • жасырын өріс:hiddenтипі;
  • файл:fileтипі;
  • объект:objectэлементі;

Кейбір HTML нұсқаларында келесі

  • datalistэлементі - мәтін жолдарын автотолтыру нұсқасын бейнелейтін;
  • outputэлементі - басқа өрістер негізінде есептеу нәтижелері үшін;
  • keygenэлементі - аутентификациялау механизмінде пайдаланылатын кілттер жұбын генерациялау қосымша элементтер анықталады:.

Форма ішінде басқару элементтері орналасқан FORM элементінің көмегімен беріледі. HTML-ге ортақ атрибуттардан өзге FORM элементінде келесі атрибуттар болуы мүмкін:

  • action(амал) - форма өңдеуші URI қамтитын міндетті атрибут;
  • method(форманы жөнелту әдісі) - GET (үнсіздік бойынша) немесе POST мәндерін қабылдайтын атрибут;
  • enctype(ішіндегісі үшін кодтау типі) - үнсіздік бойынша application/x-www-form-urlencoded (барлық кезде GET әдісі үшін), бірақ негізінен multipart/form-data қолданылады;
  • accept- файлдарды жүктеу үшін MIME-типіндегі тізімдер;
  • name- форма аты;
  • onsubmit- «форма жіберілді» оқиғасының өңдеушісі;
  • onreset- «форма тазартылды» оқиғасының өңдеушісі;
  • accept-charsetқолданылатын символдар жиынының тізімі.

Формаларды жөнелтудің екі формасы бар: GET және POST. GET әдісін, мысалы, іздеу сияқты қосымша амалдар орындалмайтын жағдайда серверде формаларды өңдеу кезіндегі жағдайда пайдалану ұсынылады. Кері жағдайда POST әдісін пайдалану талап етіледі.

Парақшалар браузердегі құжаттардың қылығына, құрылу тәсіліне қарай статикалық және динамикалық болып бөлінеді.

Пайдаланушының браузеріндегі құжатқа байланысты:

  • статикалық html парақшалар;
  • динамикалық html парақшалар болып бөлінеді.

Статикалық парақша - пайдаланушының әрекетінен тәуелсіз барлық кезде біркелкі көрінетінін білдіреді. HTML түріндегі серверде орналасқан парақшалар статикалық парақшалар болып табылады. Динамикалық парақшалар пайдаланушының әрекетіне әсер етуі және өзгеруі мүмкін. Браузер сұранысы бойынша сол мезетте генерацияланатын парақшалар динамикалық парақшалар болып табылады.

Web парақшалардың динамикасын құру үшін кеңінен таралған тілі - JavaScript тілі пайдаланылады. Vbscript (visual basic script) тілі де web парақшалардың динамикасын құруға арналған, тек алдыңғы тілмен салыстырғанда сирек қолданылады.

Perl, SSI, PHP, ASP, Python, Java, Бинарлық код (Си немесе С++ программалары) программалау тілдерінің көмегімен «динамикалық» парақшаларды генерациялайтын скрипттерді жазуға болады. Бұл тілдердің әрқайсысының өзінің ерекшеліктері бар. Скрипттерді кез келген тілде жазуға болады. Ең бастысы олардың мықты және әлсіз жақтарын және тиімді пайдалана білу керек.

Қазір гибридті жүйе көп қолданыста. Соның ішінде AJAX (Asyncronous JavaScript And XML) жүйесі. Бұл технология скрипттарға JavaScript-те сервердегі қандай да бір скриптке қатынауға және серверден ақпарат алуға мүмкіндік береді.

Мысалы, сіз желіге қандай да бір кітапты салғыңыз келсін. Кітап жазылған, ол өзгерілмейді. Бұл жағдайда кітапты статикалық html құжат ретінде безендірген қолайлы және тиімдірек болып келеді.

Егер сайтта өзгеретін ақпарат болса, онда скриптті пайдаланған дұрыс. Скрипттің бір кемшілігі: олар өздерінің жұмыстары үшін серверден қосымша ресурстарды талап етеді. Егер html парақшаны серверден оқу және браузерге жіберу керек болса, онда скриптті алдымен жүктеу және орындау керек болады. Сонымен қатар, скрипттер өзгерілетін мәліметтер үшін көбінесе МҚБЖ-н пайдаланады, ал бұл өз алдына қосымша жүктеме береді.

Скрипт - программалау тілдерінің бірінде жазылған интернет үшін программа және сайттың сервистарының біреуін ұйымдастыру үшін арналған. Скриптті қолдану үшін программалау білімін қажет етпейді, жақсы скрипт инсталлятормен қамтамасыз етілген. Ол керек конфигурациялық файлды өзі құрады.


HTML құжаттарының тегтері

1-кесте. HTML тегтерінің анықтамалары

Тег атаулары
Тегтердің қысқаша сипаттамасы
Тег атаулары: <a>
Тегтердің қысқаша сипаттамасы: Сілтеме құру үшін арналған
Тег атаулары: <abbr>
Тегтердің қысқаша сипаттамасы: Мәтіндегі аббревиатураны ерекшелейді. Әдетте үзілмелі сызықпен сызылады.
Тег атаулары: <acronym>
Тегтердің қысқаша сипаттамасы: Мәтіндегі акронимді ерекшелейді. Әдетте үзілмелі сызықпен сызылады.
Тег атаулары: <address>
Тегтердің қысқаша сипаттамасы: Құжаттың авторы мен оның адресі көрсетіледі. Әдетте курсивпен көрсетіледі.
Тег атаулары: <area>
Тегтердің қысқаша сипаттамасы: <map> тегінің ішінде орналасатын, басқа немесе өзіне сілтеме болатын карта-бейненің аймағын анықтайды
Тег атаулары: <b>
Тегтердің қысқаша сипаттамасы: <strong> тегіне ұқсас. Мәтін түрі қалың болады.
Тег атаулары: <bdo>
Тегтердің қысқаша сипаттамасы: Мәтіннің шығу бағытын анықтайды.
Тег атаулары: <bgsound>
Тегтердің қысқаша сипаттамасы: Құжатқа дыбысты файлды енгізеді.
Тег атаулары: <big>
Тегтердің қысқаша сипаттамасы: Мәтінді ірі жасайды.
Тег атаулары: <body>
Тегтердің қысқаша сипаттамасы: Құжаттың мазмұнын көрсететін құжаттың «денесі».
Тег атаулары: <blockquote>
Тегтердің қысқаша сипаттамасы: Дәйек сөздерді құру үшін арналған.
Тег атаулары: <br>
Тегтердің қысқаша сипаттамасы: Жолды ауыстыру.
Тег атаулары: <center>
Тегтердің қысқаша сипаттамасы: Құжаттың ортасына барлық элементтерді көлденең туралау.
Тег атаулары: <cite>
Тегтердің қысқаша сипаттамасы: Дәйек сөздерді курсивпен ерекшелейді.
Тег атаулары: <code>
Тегтердің қысқаша сипаттамасы: Мәтінді программалық кодпен белгілейді. Әдетте біркелкі қаріппен көрсетіледі.
Тег атаулары: <dd>
Тегтердің қысқаша сипаттамасы: Анықтамалар тізімін сипаттайды.
Тег атаулары: <del>
Тегтердің қысқаша сипаттамасы: Құжаттың жаңа нұсқасында жойылған мәтінді ерекшелейді. Ерекшеленген мәтін сызылып тұрады.
Тег атаулары: <dfn>
Тегтердің қысқаша сипаттамасы: Мәтінді анықтама ретінде курсивпен белгілейді.
Тег атаулары: <div>
Тегтердің қысқаша сипаттамасы: HTML блогын анықтайды. CSS-пен бірге қолданылады.
Тег атаулары: <dl>
Тегтердің қысқаша сипаттамасы: Анықтама тізімін құрады.
Тег атаулары: <dt>
Тегтердің қысқаша сипаттамасы: Анықтамалар тізімін анықтайды.
Тег атаулары: <em>
Тегтердің қысқаша сипаттамасы: Мәтіннің ең негізгі бөлігін ерекшелейді.
Тег атаулары: <font>
Тегтердің қысқаша сипаттамасы: Қаріп.
Тег атаулары: <frame>
Тегтердің қысқаша сипаттамасы: Құжаттың фреймдік құрылымында фреймді анықтайды. <frameset> тегінің ішінде орналасады.
Тег атаулары: <frameset>
Тегтердің қысқаша сипаттамасы: Құжаттың фреймдік құрылымын анықтайды. <body> тегінің сонына қолданылады.
Тег атаулары: <h1>
Тегтердің қысқаша сипаттамасы: Мәтінді тақырып жасайды. Мәні 1-ден 6-ға дейін болады.
Тег атаулары: <head>
Тегтердің қысқаша сипаттамасы: "Құжаттың аты.
Тег атаулары: <hr>
Тегтердің қысқаша сипаттамасы: Көлденең сызық сызады.
Тег атаулары: <i>
Тегтердің қысқаша сипаттамасы: Мәтінді көлбеу жасайды.
Тег атаулары: <img>
Тегтердің қысқаша сипаттамасы: Графикалық бейнені (суретті) енгізеді.
Тег атаулары: <ins>
Тегтердің қысқаша сипаттамасы: Құжаттың жаңа нұсқасында жаңа мәтнді ерекшелейді.
Тег атаулары: <li>
Тегтердің қысқаша сипаттамасы: Тізім элементін сипаттайды. Нөмірленген немесе нөмірленбеген тізімдерде қолданылады.
Тег атаулары: <link>
Тегтердің қысқаша сипаттамасы: Құжаттың қандайда бір сыртқы файлмен байланысын көрсетеді.
Тег атаулары: <marquee>
Тегтердің қысқаша сипаттамасы: Сырғымалы жол.
Тег атаулары: <meta>
Тегтердің қысқаша сипаттамасы: Браузерлер және іздеу жүйесіне арналған мета тегтар ақпаратын іздейді.
Тег атаулары: <nobr>
Тегтердің қысқаша сипаттамасы: Жолдардың жылжуын болдырмайды. <br> тегінің мәніне қарама-қарсы.
Тег атаулары: <ol>
Тегтердің қысқаша сипаттамасы: Нөмірленген тізімді анықтайды.
Тег атаулары: <p>
Тегтердің қысқаша сипаттамасы: Параграф құрады.
Тег атаулары: <script>
Тегтердің қысқаша сипаттамасы: Парақшаға скрипт енгізеді.
Тег атаулары: <small>
Тегтердің қысқаша сипаттамасы: Мәтінді шағын жасайды.
Тег атаулары: <span>
Тегтердің қысқаша сипаттамасы: Ішкі мәтін үшін контейнерді анықтайды. CSS-пен бірге қолданылады.
Тег атаулары: <strike>
Тегтердің қысқаша сипаттамасы: Мәтінді сызады. <s> тегіне ұқсас.
Тег атаулары: <sub>
Тегтердің қысқаша сипаттамасы: Төменгі индекс.
Тег атаулары: <sup>
Тегтердің қысқаша сипаттамасы: Жоғарғы индекс.
Тег атаулары: <table>
Тегтердің қысқаша сипаттамасы: Кесте құрады.
Тег атаулары: <td>
Тегтердің қысқаша сипаттамасы: Кестеде бөлек ұяшық құрады.
Тег атаулары: <th>
Тегтердің қысқаша сипаттамасы: Кестеде тақырып ретінде анықталатын ұяшық құрады.
Тег атаулары: <title>
Тегтердің қысқаша сипаттамасы: Құжаттың тақырыбы және аты.
Тег атаулары: <tr>
Тегтердің қысқаша сипаттамасы: Кестеде жолды жасайды.
Тег атаулары: <tt>
Тегтердің қысқаша сипаттамасы: Мәтінді біркелкі жасайды.
Тег атаулары: <ul>
Тегтердің қысқаша сипаттамасы: Нөмірленбеген тізімді анықтайды.
Тег атаулары: <var>
Тегтердің қысқаша сипаттамасы: Мәтінде айнымалыларды ерекшелейді.
Тег атаулары: <wbr>
Тегтердің қысқаша сипаттамасы: Жолды ауыстыруға рұқсат береді.
Тег атаулары: <xmp>
Тегтердің қысқаша сипаттамасы: Мәтін қалай терілді, сол қалпында көрсетеді.
... жалғасы

Сіз бұл жұмысты біздің қосымшамыз арқылы толығымен тегін көре аласыз.
Ұқсас жұмыстар
WORLD WIDE WEB және HTML тілі туралы
Мәтінді пішімдеу
Қарапайым Internet - қосымшаларың жасау
Гипермәтіндік белгілеу принциптері. Құжаттар құрылымы
HTML синтаксисі
World Wide Web және HTML
HTML тілінің тегтері
Құжаттың HTML - HEAD бас контейнері
HTML тэгтер тобы
HTML – базалық технологиясы
Пәндер



Реферат Курстық жұмыс Диплом Материал Диссертация Практика Презентация Сабақ жоспары Мақал-мәтелдер 1‑10 бет 11‑20 бет 21‑30 бет 31‑60 бет 61+ бет Негізгі Бет саны Қосымша Іздеу Ештеңе табылмады :( Соңғы қаралған жұмыстар Қаралған жұмыстар табылмады Тапсырыс Антиплагиат Қаралған жұмыстар kz