HTML туралы жалпы түсінік. HTML файлының анықтамасы.HTML – де қарапайым файл құру

0
2946
Иллюстрация: Freepik.com

Сынып: 11

Сабақтың тақырыбы : HTML туралы жалпы түсінік. HTML  файлының анықтамасы.  HTML – де  қарапайым файл құру   

Сабақтың мақсаты:   интернеттің қоғамдағы орны, дамуы және таралу  бағыттары, интернеттің тарихы туралы мәліметтер беру.  HTML тілі туралы түсінік беру. Атрибуттар жазылуын, файлдың  жазылу форматын, тақырыптың жазылу форматын, құжат тұлғасын  анықтау  форматын  үйрету. HTML —  де қарапайым файлдар құру  жолдарын  үйрету

Программалық дидактикалық қамтылуы :    компьютер кешені,  « Информатика 10 — 11» электронды оқулығы

Сабақтың типі :  түсіндірмелі – көрнекілікті

Оқушылардың білім – дағдыларына қойылатын талаптар :

Оқушылар білуі керек :

  • Интернет деген не ?
  • Интернет тарихы.:
  • Интернеттен ақпарат іздеу;
  • Файл атрибуттарын;
  • Файлдың жазылу форматын:
  • Тақырыпты жазу форматын;
  • Құжат тұлғасын жазу форматын;

Оқушылар үйренуі керек :

  • HTML тілінің не үшін қолданылатынын;
  • Тақырыптық элементтердің жазылуын, атқаратын қызметін;
  • Құжат құрылымын сипаттайтын элементтерді;
  • Мәтіндік элементтерді;
  • Броузер деген не ?
  • Тэганың қызметін;
  • HTML тілінің құрылымын жаза білу;
  • Файлдың құру және сақтау, ашу жолдарын;
  • HTML, HEAD, TITLE тэгаларының қызметін;

Сабақтың мазмұны :  

  • Кіріспе
           Ақпараттық қоғам заманында Интернет ақпараттарды жеткізудің  негізгі құралына айналып отыр. Интернет – барлық жүйелері хаттама деп аталатын біріңғай стандартпен, яғни ережемен жұмыс істейтін ауқымды /глобальды/  компьютерлік желі.

Интернеттің дамуы мен таралуы 3 бағытта жүргізіледі:

  • техникалық немесе аппараттық компонент;
  • программалық компонент;
  • ақпараттық компонент;

Ақпараттық компонент компьютерлердің түрлі модельдері мен жүйелерінен, байланыс арналары арасындағы механикалық,электерлік үйлесімді қамтамасыз ететін құрылғылардын тұрады. Ал ондағы мәліметті тасымалдау ісі байланыстың кабельдік және спутниктік арналарынан, радиореле жүйелерінен, теледидарға арналған кабельдік арналардан тұрады.

Программалық компонент интернеттегі түрлі типтегі компьютерлер мен құрылғылардың үлесімді жұмыс істеуін қамтамасыз етеді. Ал оның негізгі функциялары төменгідей :

  • ақпаратты сақтау, іздеу, жинақтау, қарау, тыңдау;
  • желідегі ақпарат қауіпсіздігін сақтау;
  • аппаратураның функциональдық сәйкестіктерін қамтамасыз ету;

Ақпараттық компонент желідегі  компьютерлерде сақталатын түрлі құжаттар арқылы өрнектеледі. Желідегі құжаттар бір – бірімен сілтеме адрестер арқылы беріледі.

  • Интернет — технология

Қазіргі уақытта кеңінен тараған телекоммуникациялық желілердің бірі – Интернет желісі. Енді оның тарихына қысқаша тоқталайық :

Бүкіләлемдік желінің даму тарихы 4 кезеңге бөлінеді:

1 кезең / 1969 – 1983ж/ бұл кезеңде ARPAInternet желісі пайда болды. Ол әскери және ғылыми салаларға пайданылды. Оның дереткреді жіберу каналдары өте әлсіз болды.

2 кезең /1983 – 1989 ж/ . мұнда ARPANet 185 компьютердің орталығына айналды. Ол орталықтар АҚШ- та, Англияда, Норвегияда орналасты. Желілер бойынша ақпараттар жіберу телефондық каналдар немесе  байланыстың спутниктік каналдары арқылы жүзеге асты.

3 кезең /1989 – 1994ж/ бұл кезең WWW қызметінің пайда болуымен байланысты. 1986 жыл бүкіләлемдік компьютерлік желі Интернеттің пайда болуы деп жарияланды.

4 кезең / 1994 – 1996ж/ бұл кезең қолданушылар арасындағы қарысм –қатынас тәсілін арттырумен сипатталады. Мұнда көпөлшемді интерактивтік модель VRML пайда болды.

  • HTML тілі туралы  жалпы түсінік

Интернеттегі мәліметерді бейнелеу HTML тілінде жазылады. Бірақ программалауға ұқсас болғанмен программалау тілі емес, гипермәтінді белгілеу тілі деп аталады.

Web – парақтарының жазылу тілі  HTML тілі болып табылады.

HTML /Hyper Text Maker Language/ ағылшын тілінен аударғанда мына мағынаны білдіреді : гипермәтінді белгілеу тілі. Web бетті HTML файл деп атаймыз.

HTML – компьютерлер арасындағы мәліметтер алмасудың жаңа хаттамасы. Ол Интернеттегі мәтін бөліктерінің атқаратын қызметін белгілеп, оларды әрбір тұтынушыға жеткізе алатын құжатты түрде белгілейтін тіл болып табылады.

HTML  файлының кеңейтілуі   htm немесе    html

HTML элементтерін мына категорияларға топтауға болады :

  • тақырыптық элементтер
  • құжат құрылымын сипаттайтын элементтер
  • мәтіндік элементтерБроузерлер

Броузер  — бұл Web  — беттерін /гипермәтіндік беттерді/ қарауға негізделген программа.

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

HTML файлын құрастырар алдында  жұмыс үстелінде құрылған Web беттерді сақтайтын « Lesson HTML» бумасын  құрып аламыз.

HTML файлдарды құрастыру үшін  Блокнотты пайдаланамыз.

Ол үшін :

Пуск – Программы – Стандартные – Блокнот  әрекеттер тізбегін орындап, Блокнот программасын іске қосамыз да, HTML мәтіндерін теріп сақтаймыз. Сақтау жолы :

  1. Файл – сохранить как командасын орындаймыз
  2. Сохранить как терезесінде папка  бөлігіне    рабочий стол  -ды белгілеп, оның ішінен  папка « Lesson HTML» — ды орнатамыз.
  3. Имя файла бөлігіне « Lessonhtml »  деп  ат береміз.
  4. Тип файла бөлігіне все файлы орнатамыз
  5. Сохранить батырмасына шертеміз

Осы файлды ашудың екі жолы бар :

1 – тәсіл :    1. Жұмыс үстеліндегі « Lesson HTML»  бумасын  ашамыз.

  1. « Lesson1.html » файлына 2 рет шертеміз, сонда Блокноттатерілген HTML мәтінінің  Web парақтағы тұлғасын көреміз.
  1. Құжат тұлғасына әрі қарай өзгерістер енгізу үшін  Вид – Просмотр HTML кода командасын орындаймыз.   Сонда бізге алдыңғы Блокноттағы жазылған HTML мәтіні  ашылады.

2 – тәсіл:  Microsoft  Internet Explorer броузері программасын жүктеңіз де, мына команданы орындаңыз :

  1. Файл – открыть
  2. Открыть хабар алмасушы терезесінен «Обзор» белгісіне басып,  Рабочий стол  -ды белгілеп, оның ішінен  папка « Lesson HTML» — ді  белгілеп « Lesson1.html »  файлына 2 рет шертеміз немесе открыть батырмасына шертеміз, сонда Блокнотта терілген HTML мәтінінің  Web парақтағы тұлғасын көреміз.
  3. Құжат тұлғасына әрі қарай өзгерістер енгізу үшін  Вид – Просмотр HTML кода командасын орындаймыз. Сонда бізге алдыңғы Блокноттағы жазылған HTML мәтіні   ашылады.
  • Тэгамен жұмыс

  HTML  тілінің бастапқы мәтін белгіленетін командалары белгі немесе

тэг/ tag/ деп аталады. Тэг символдар тізбегінен тұрады.

Барлық  тэг « кіші » <  символынан басталады да, «үлкен » >  символымен аяқталады. Бұларды бұрыштық жақшалар деп атайды. Олардың жазылуында әріптер регистрі ешқандай роль атқармайды, яғни үлкен әріпті де, кіші әріпті де қолдана беруге болады. Бірақ тэг атауларын жай мәтіннен айыру мақсатында оларды бас әріпен жазу қалыптасқан.Бұл тэгалардың бірі – ашады, екіншісі – жабады. Ашатын тэг (< …> ) белгілі бір әсер тегісін бастайды, ал жабатын тэг (</ …> ) – сол әрекетті аяқтайды.

Тэгтердің екі түрі болады :

1.Бір элементті тэг. Ол белгілі бір әрекетті орындау үшін оны қажетті

орынға жазып қою керек.

Мысалы : <BR> — келесі қатарға  көшу.

  1. Қосарланған тэг. Ол ашылу және жабылу тэгтерінің ортасындағы

                                    мәтінге ғана әсер етеді.

Мысалы : <BODY> …</BODY>

Тэганы жазу ережесі :

<Тэг – 1 > <Тэг – 2 > … </Тэг — 2></Тэг — 1>   — дұрыс жазылуы

<Тэг – 1 > <Тэг – 2 > … </Тэг — 1></Тэг — 2>   — қате жазылуы

  • HTML тілінің құрылымы :

HTML құжаты сол құжаттың негізгі мәтінінен және белгілеу тэгтерінен тұрады да, қарапайым символдар жиыны болып табылады.

  1. HTML құжатының кез келгені <HTML> тэгінен басталып, соған сәйкес

</HTML> түріндегі жабылу тэгімен аяқталады. Осы екеуінің ортасында

құжаттың тақырыптық бөлігі мен тұлғасы болып келетін негзгі бөлігі

орналасады.

  1. Құжаттың тақырыптық бөлігі <HEAD> және </HEAD> тэгаларының

ортасында тұрады да , жалпы  құжат туралы мәлімет береді.

Әдетте бұл бөлікте <TITLE> …  </TITLE> тэгаларымен шектелетін

құжаттың ресми атауы орналасады. Көптеген броузерлер бұл атауды Терезе

тақырыбындағы файл аты есебінде пайдаланады. Мыс : « Lesson1.html »  .

  1. Жазылатын мәтін құжат тұлғасы деп аталатын <BODY> … </BODY>

тэгаларының ортасына жазылады.

<HTML> <HEAD> <TITLE>  құжат тақырыбы    </TITLE>   </HEAD>  <BODY>    Экранға шығатын мәтін          </BODY> </HTML>

  • Осы құжат жұмысы нәтижесінде экранға <BODY> … </BODY> арасында жазылған мәтін ғана шығады.

Практикалық жұмыс  — 1

  1. Өз жұмыс орындарыңда « Lesson HTML — өз атың » бумасын  құрыңдар.
  2. Блокнотты ашып, HTML  тілінің құрылымын жазып шық.
  3. Жазылған құжатты мына ретпен сақтауды орында:
  4. Файл – сохранить как командасын орындаймыз
  5. Сохранить как терезесінде папка  бөлігіне    рабочий стол  -ды белгілеп, оның ішінен  папка « Lesson HTML- өз атың » — ды орнатамыз.
  6. Имя файла бөлігіне « Lesson1.html »  деп  ат береміз.

             4.Тип файла бөлігіне все файлы орнатамыз.

5.Сохранить батырмасына шертеміз.

  1. 1 – тәсіл : Жұмыс үстеліндегі « Lesson HTML өз атың »

                     бумасын  ашамыз.

  1. « Lesson1.html » файлына 2 рет шертеміз, сонда Блокнотта

терілген HTML мәтінінің  Web парақтағы тұлғасын көреміз.

  1. Құжат тұлғасына әрі қарай өзгерістер енгізу үшін

                        Вид – Просмотр HTML кода командасын орындаймыз.

Сонда бізге алдыңғы Блокноттағы жазылған HTML мәтіні

ашылады.

Практикалық жұмыс — 2

  1. Блокнотты ашып, HTML  тілінің құрылымын жазып шық.

<HTML>
<HEAD> <TITLE>  практикалық жұмыс </TITLE>
</HEAD>
<BODY>

9 класс

</BODY>

</HTML>

  1. Жазылған құжатты мына ретпен сақтауды орында:
  2. Файл – сохранить как командасын орындаймыз
  3. Сохранить как терезесінде папка  бөлігіне    рабочий стол  -ды белгілеп, оның ішінен  папка « Lesson HTML- өз атың » — ды орнатамыз.
  4. Имя файла бөлігіне « Lesson1.html »  деп  ат береміз.
  5. .Тип файла бөлігіне все файлы орнатамыз.
  6. Сохранить батырмасына шертеміз.
  1. 1 – тәсіл : 1. Жұмыс үстеліндегі « Lesson HTML өз атың » бумасын  ашамыз.
  2. « Lesson1.html » файлына 2 рет шертеміз, сонда Блокнотта

терілген HTML мәтінінің  Web парақтағы тұлғасын көреміз.

  1. Құжат тұлғасына әрі қарай өзгерістер енгізу үшін

                        Вид – Просмотр HTML кода командасын орындаймыз.

Сонда бізге алдыңғы Блокноттағы жазылған HTML мәтіні

ашылады.

Үйге тапсырма :   бақылау сұрақтарына  дайындық

Бақылау сұрақтары :

  1. HTML тілінің анықтамасы.
  2. HTML тілінің атқаратын қызметі.
  3. HTML тілінің кеңейтілімі/ типі/
  4. HTML тілінің элементтерінің категориялары
  5. Браузер деген не?
  6. HTML тілінің бастапқы мәтінді белгілейтін командасы қалай аталады?
  7. HTML тілі құжатының басталуы мен аяқталуын көрсету  тэгасы қалай жазылады.
  8. Тэга атауларының жай мәтіннен айырмашылығы неде?
  9. Бір элементті тэганың атқаратын қызметі?
  10. Қосарланған тэганың атқаратын қызметі?
  11. Құжаттың тақырып бөлігін көрсету тэгасы.
  12. Құжаттың ресми атауын көрсететін тэга.
  13. Жазылатын мәтін құжат тұлғасы.
  14. HTML тілінің құрылымы қайда жазылады?

Дереккөз: «Ұстаз» ғылыми әдістемелік журналы

Басқа материал:

  1. Информатикадан глоссарий тізімі. 3D панорама, дендрит, синапс деген не?
  2. Информатикадан тест тапсырмалары
  3. Жасанды интеллект деген не?
  4. Информатика пәніне қатысты глоссарий
  5. Бұлттық технологиялар туралы толық мәлімет
  6. «Заман шындығы» бөлімі бойынша қазақ әдебиетінен тест тапсырмасы
  7. «Ғасырлық туынды» бөлімі бойынша қазақ әдебиетінен тест тапсырмалары
  8. «Әдебиеттегі сын-сарын» бөлімі бойынша қазақ әдебиетінен тест тапсырмалары

ПІКІР ҚАЛДЫРУ