Тақырыбы: «html де гиперсілтеме құру» Сабақтың мақсаты

индукция әдісі арқылы интерактивті оқыту қолдана отырып өткен тақырыптарды жүйелі қамту

- «Ағылшын», «Ақпараттық ресурстар»

• 
  компьютер;
  
• 
  интерактивті тақта;
  
• 
  тест бағдарламасы;
  
• 
  үлестірмелі материалдар
  

Оқушылармен амандасып, сабаққа қатысымдарын тексеру.

Үй тапсырмасын сұрау

ІІ. «ОЙ ТОЛҒАУ» КЕЗЕҢІ. Оқушылардың білімін тексеру. (5 мин)

1. 
   Белгілеу тіліне қандай тіл жатады?
   
2. 
   Гипермәтін дегеніміз не?
   
3. 
   Браузер дегеніміз не?
   
4. 
   Тег дегеніміз не?
   
5. 
   Веб бетке сурет қою үшін қандай тег қолданылады?
   
6. 
   Келесі жолға көшу тегі
   
7. 
   Кесте қай тег арқылы жасалады?
   
8. 
   Кесте тақырыбы қандай тегпен беріледі?
   
9. 
   Мәтінді туралау үшін қандай атрибут қолданамыз?
   
10. 
    Тізім құру тегі
    

Әр оқушы еркін тақырыпта веб парақ құру

• 
  HTML тілінің құрылымын көрсету
  
• 
  HTML тегтерін топтау (Пішімдеу, графика, кесте, тізім бойынша)
  

Сілтеме локальді дискте немесе компьютер желісінде орналасқан құжат ішіндегі басқа бір элементке (мәтін, тақырып, сурет т.б) басқа объектіге сілтеме беретін гипермәтінді құжаттың бір бөлігі.

Сілтеме енгізу үшін А (anchor) тегі қажет болады. Сілтеменің қайда апаратыны көрсету үшін тегтің href (hypertext reference) атрибутын пайдаланамыз.

• 
  Мысалы сілтеме Қазақша Уикипедияға апаратын болса, HREF атрибутының мәні “http://kkk.wikipedia.org” тең болады. Осы тырнақшаның ішіндегі жазу Қазақша Уикипедияның толық адресі немесе сайттың URL деп аталады.
  

• 
  Егер бір беттен екінші бетке көшу керек болса, онда беттің толық адресі керек емес. Мысалы: Екінші бетке көшу үшін басыңыз
  
• 
  Егер 2_bet.html беті website бумасында орналасқан болса, ал сілтеме басатын бірінші бетіміз (1_bet.html) буманың сыртында орналасқан болса
  

• 
  Беттің ішінде беттің әр бөлігіне көшіп отыратын сілтемелер жасауға болады. Ол үшін id атрибутын және # белгісін қолданамыз. Сілтеме беретін элементті id атрибуты арқылы белгілеп аламыз.
  

Бас тақырып

Енді осы элементке, яғни бас тақырыпқа # белгісі арқылы сілтеме жасаймыз. # белгісі браузерге сілтеменің осы беттің ішінде болатынын хабарлайды. # белгісінен соң біз сілтеме арқылы көшетін тегтің id ын жазамыз. Мысалы

• 
  Гиперсілтеме ретінде сөз тіркесін ғана емес суреттерді пайдалануға болады . Суреттер мәтін сияқты сілтеме бола алады. Oл үшін тегі сілтемелерді анықтайтын тегінің арасында орналастырылады. Осындай суретке курсорды алып барсақ, ол курсорды сілтеме мәтінге бағытталған кездегідей түрге келеді.
  Мысалы: Жолында тіркесі гиперсілтеме ретінде кішкене компьютер суретін береді, оны шерту арқылы компьютер туралы мәлімет беретін файлына comp.html ауыстырады.
  
• 
  Сонымен бірге дыбысқа да сілтеме жасай аламыз. Мысалы:
  

sound.wav”> дыбыс

Тапсырма 1

Веб параққа сурет пен дыбысқа сілтеме құру

дыбыс

сурет

Есерту: дыбыстық файл мен сурет файлы орналасуын анықтау
Тапсырма 2 Оқу орны туралы веб парақ құру (сурет, сырғымалы жол, гиперсілтемені кірістіру)

Ескерту: колледж тарихы, мамандықтар туралы, колледж жетістіктері парағын дайындап алу керек. (барлық парақтар бір бумада орналасуын ескеру)

Тапсырма 3 Беттің ішінде беттің әр бөлігіне көшіп отыратын сілтемелер жасау (Әр оқушы өзі туралы веб парағын құра отырып, сілтемені бір беттің ішінде орналастыру )

Мазмұны:

І тарау. Өмірбаян

І тарау. Өмірбаян

VI. «ЖЕТІСТІК» КЕЗЕҢІ Жаңа сабақты бекіту. (10 мин)

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

1. 
   ҚОСЫМША АКПАРАТ сілтеме кайда бағытталган?
   

1. 
   мәтінге
   
2. 
   суретке
   
3. 
   сайтқа
   
4. 
   барлығы дұрыс
   

2. 
   КЕЛЕСІ сілтеме кайда бағытталған?
   

1. 
   ДЫБЫСҚА
   
2. 
   БЕЙНЕГЕ
   
3. 
   ПАРАҚҚА
   
4. 
   ПОШТАҒА
   

3. 
   Сілтеме түсі
   

1. 
   
   
2. 
   
   
3. 
   
   
4. 
   
   

4. 
   Өтілген сілтеменің түсі
   

1. 
   
   
2. 
   
   
3. 
   
   
4. 
   
   

5. 
   id жэне # белгісін не үшін қолданамыз
   

1. 
   келесі бетке өтуге жасалатын сілтеме
   
2. 
   бумаға жасалатын сілтеме
   
3. 
   бір беттің ішінде жасалатын сілтемелер
   
4. 
   дыбысқа жасалатын сілтеме
   

6. 
   id атрибутынын мәні неден турады
   

1. 
   heading1 сөзінен
   
2. 
   кез келген сөзден
   
3. 
   саннан
   
4. 
   латын әрпінен және саннан
   

7. 
   Сілтеменің кайда апаратынын көрсететін атрибут
   

1. 
   img
   
2. 
   id
   
3. 
   href
   
4. 
   А
   

8. 
   Кай элементке сілтеме беруге болмайды?
   

1. 
   Суретке
   
2. 
   мәтінге
   
3. 
   тақырыпқа
   
4. 
   барлығына болады
   

9. 
   Кандай белгі браузерге сілтеменің осы беттің ішінде болатынын хабарлайды?
   

1. 
   # белгісі
   
2. 
   id белгісі
   
3. 
   a белгісі
   
4. 
   href белгісі
   

10. 
    Microsoft компаниясынын Web-парағының алғашкы бетіне көшу
    

1. 
   Microsoft
   
2. 
   Microsoft
   
3. 
   Microsoft
   
4. 
   
   

VIІ. СЕРГІТУ КЕЗЕҢІ. Психологиялық тренинг. « Мен кіммін?» (3 мин)
VIІ. ҚОРЫТЫНДЫ (5 мин)

Бағалау

Үй тапсырмасы: Өз тобыңыздың веб парағын құру
Әдебиеттер:

1. 
   «HTML негіздері» оқу әдістемелік құрал 2012 ж
   
2. 
   Полонская Е.П. «Самоучитель HTML»
   
3. 
   Мержевич В. «Создание Web страниц»
   
4. 
   «HTML в примерах. Как создать свой Web-сайт: Самоучитель» Дригалкин В. В. 2004.