52546

Внутрішні гіперпосилання на веб-сторінках

Конспект урока

Педагогика и дидактика

Ввести поняття внутрішнього посилання, ознайомити з правилом запису внутрішнього посилання, навчити учнів створювати внутрішні гіперпосилання на веб-сторінці, розвивати пізнавальну активність, вміння індивідуально працювати за комп’ютером, виховувати інтерес до інформатики і біології, формувати інтерес учнів до природи рідного краю і питань збереження рослин.

Украинкский

2014-02-16

107.5 KB

14 чел.

План-конспект відкритого заняття спецкурсу «Основи веб-дизайну» з інформатики. 7 клас

Тема:  Внутрішні гіперпосилання на веб-сторінках

Мета: ввести поняття внутрішнього посилання, ознайомити з правилом запису внутрішнього посилання, навчити учнів створювати внутрішні гіперпосилання на веб-сторінці, розвивати пізнавальну активність, вміння індивідуально працювати за комп’ютером, виховувати інтерес до інформатики і біології, формувати інтерес учнів до природи рідного краю і питань збереження рослин.

Тип: інтегрований

Обладнання: комп’ютери з програмою Internet Explorer, завдання на картках.

Наочність: Презентація, інформаційні картки рідкісних рослин.

Хід уроку

1. Вступне слово вчителя. Епіграф уроку.

„Пам’ятайте, що у рослин і тварин немає депутатів, їм нікому писати і скаржитись, за них нікому заступитись, крім нас, людей, які разом з ними населяють цю планету”.

Дж. Дарелл

Урок у нас сьогодні не звичайний, а інтегрований: інформатика і біологія. Епіграфом до уроку є слова Дж. Дарелла…

Яким чином ми можемо донести інформацію до користувачів щонайшвидше?

(прогнозована відповідь учнів: через Інтернет, веб-сайт…)

  1.  Актуалізація опорних знань („Мозковий штурм”)

Питання з біології

  1.  Чим обумовлене панівне положення покритонасінних у сучасній флорі?
    1.  Назвіть причини які викликають зменшення чисельності рослин.
    2.  Якими шляхами ми можемо зберегти сучасний рослинний світ? (одна із форм – інформування населення через сучасні інформаційні засоби: телебачення, Інтернет, веб-сторінки…)

Питання з інформатики

  1.  Що таке веб-сайт? (група веб-сторінок, об’єднаних спільною тематикою й посиланням одна на одну та розміщених, як правило, на одному сервері)
    1.  Що називають гіперпосиланням? (Гіперпосилання — це вказівка для браузера, до якого об'єкта у межах або поза межами HTML-документа він має звернутися.)
  2.  Мотивація навчальної діяльності 

ЗАХИСТИТИ І ЗБЕРЕГТИ

У природно-ландшафтному спектрі України особливе місце відведено  Житомирщині — чудовому поліському краю. У лісах, що займають більше третини її території, мальовничих річках, озерах, водоймищах і ставках, на заболочених заплавних долинах, у степовій зоні і на луках водяться і зростають сотні видів флори і фауни. І кожен вид рослин чи тварин — це дивовижний витвір природи, який ми мусимо зберегти для нащадків.

Рідкісні та зникаючі види тварин і рослин України занесені до Червоної книги, яка вийшла у світ двома випусками у 1994 і 1996 роках. Але, на жаль, тираж книг був невеликим і вони не потрапили до багатьох природоохоронців, вчителів-біологів, відсутні у більшості бібліотек.

Щоб у якійсь мірі заповнити цю прогалину, останнім часом в Україні створюються місцеві Червоні книги. У них дається не лише перелік зникаючих, рідкісних видів живої природи, а й повідомляється, на якій території вони росли і перебували колись, де їх можна зустріти тепер, чому вони зникають, що треба зробити, аби не допустити цього.

Саме тому на цьому уроці ми продовжимо працювати над створенням електронної Червоної книги Житомирщини. Наш веб-сайт містить зображення рідкісних рослин, класифікацію, морфологію, особливості розвитку, легенду, ареал, причини зміни чисельності та шляхи збереження. Відомо, що час – це гроші, тому потрібно його берегти і розумно використовувати. Допоможемо відвідувачам нашого сайту зручною навігацією по сторінці.

  1.  Оголошення теми, мети, завдань уроку

Темою уроку є: Внутрішні гіперпосилання на Web-сторінках

На цьому уроці ми повинні:

Ознайомитися з:

а) поняттям внутрішнього посилання;

б) поняттям зовнішнього посилання;

в) правилом запису внутрішнього посилання.

Навчитися:

а) створювати внутрішні посилання на веб-сторінці.

  1.  Вивчення нового матеріалу

Гіперпосилання або просто посилання є найпопулярнішим елементом Web-сторінок. З їх допомогою користувач може переходити до різних частин поточної сторінки, звертатися до інших сторінок або Web-вузлів.

Завдання.Записати на дошці створення гіперпосилання

На дошці записано створення зовнішнього посилання. На цьому уроці ми з’ясуємо які посилання підтримує мова HTML і як створюються внутрішні посилання.

Мова HTML підтримує внутрішні і зовнішні гіперпосилання. Якщо посилання забезпечує перехід до іншого документа, розташованого на іншому Web-вузлі, то це зовнішнє посилання. Якщо посилання здійснює перехід у межах того самого документа, то його називають внутрішнім.

Гіперпосилання

Зовнішні

внутрішні

забезпечує перехід до іншого документа, розташованого на іншому Web-вузлі

посилання здійснює перехід у межах того самого документа

<A href=”URL-адреса”>текст</A>

1.html

http://www.mail.ru

mailto://my_post@ukr.net

<A href=”# назва_мітки ”>текст</A>

(може складатися з літер та цифр, але не повинно містити символів пробілу. Якщо на сторінці є кілька міток, то всі вони повинні мати різні назви)

<A name=”назва_мітки ”>текст</A>

Створення внутрішнього посилання

Отже, внутрішні посилання служать для переходів з однієї частини документа до іншої. Цей вид посилань доцільно використовувати, коли всі частини великого документа не відображаються цілком у вікні броузера. Внутрішнє посилання, як і зовнішнє, задається за допомогою елемента якірного тегу <А> з атрибутом href. Але, на відміну від зовнішнього посилання, у значенні атрибута href указується не URL, а назва мітки (мітка позначається знаком #). Наприклад, такий тег

 href="#rozdil1">Лілія лісова</А>

задає посилання на елемент документа, позначеного міткою "rozdil1". Саме посилання має вигляд виділеного тексту «Лілія лісова». Мітка створюється за допомогою якоря <А>, однак у ньому замість атрибута  href використовується атрибут name.

<А  name=" rozdil1">Лілія лісова</А>

Маємо сторінку, в якій міститься інформація про 10 рідкісних рослин Житомирщини. Якщо людині цікаво, наприклад верба чорнична, то нам доведеться рухатися смугою прокрутки майже до закінчення документа, а за допомогою внутрішніх гіперпосилань це можна зробити одним кліком.

Розглянемо створення внутрішніх посилань на конкретному прикладі. Наприклад, нам потрібно створити електронний варіант книги «Рідкісні рослини Житомирщини» і необхідно, щоб із змісту на кожній сторінці можна було переходити по посиланнях до відповідних пунктів. HTML-код усього документа матиме такий вигляд:

<HTML>    <head> <title> Рідкісні рослини </title> </head>

<Body> 

<a name="roz11"><h1>зміст</h1></a>

<br><a href="#roz1">ЛІЛІЯ ЛІСОВА</a>

<br><a href="#roz2">ПІДСНІЖНИК БІЛОСНІЖНИЙ</a>

<br><a href="#roz3">ПАЛЬЧАТОКОРІННИК ФУКСА</a>

<br><a href="#roz4">САШНИК ІРЖАВИЙ</a>

<br><a href="#roz5">БЕРЕЗА НИЗЬКА</a>

<br><a href="#roz6">РОДОДЕНДРОН ЖОВТИЙ</a>

<br><a href="#roz7">КАДИЛО МЕЛІСОЛИСТЕ</a>

<br><a href="#roz8">СТРАУСОВЕ ПЕРО ЗВИЧАЙНЕ</a>

<br><a href="#roz9">ВЕРБА ЧОРНИЧНА</a>

<br><a href="#roz10">ЯЗИЧНИК БУКОВИНСЬКИЙ</a>

<a name="roz1">Лілія лісова</a>

<a href="#roz11">до змісту</a>

ЛІЛІЯ ЛІСОВА

<br>Lilium martagon L.

<!—Далі йде текст пункту 1 ->

<br>

<a name="roz2">Підсніжник білосніжний<a/>

<br><a href="#roz11">до змісту</a>

<br>ПІДСНІЖНИК БІЛОСНІЖНИЙ

<br>Galanthus nivalis L.

<!—Далі йде текст пункту 2 ->

 <a name="roz3">Пальчатокорінник фукса</a>

<br><a href="#roz11">до змісту</a>

ПАЛЬЧАТОКОРІННИК ФУКСА

<br>Dactylorhiza fuchsii (Druce) Soo (Orchis fuchsii (Druce) Soo)

<!—Далі йде текст пункту 3 ->

<a name="roz4">Сашник іржавий</a>

<br><a href="#roz11">до змісту</a>

САШНИК ІРЖАВИЙ

<br>Schoenus ferrugineus L.

<!—Далі йде текст пункту 4 ->

<a name="roz5">Береза низька</a>

<br><a href="#roz11">до змісту</a>

БЕРЕЗА НИЗЬКА

<br>Betula humilis Schrank

<!—Далі йде текст пункту 5 ->

<a name="roz6">Рододендрон жовтий</a>

<br><a href="#roz11">до змісту</a>

<font color="green"><b><h2>Класифікація</b></h2></center> </font>

РОДОДЕНДРОН ЖОВТИЙ

<br>Азалія понтійська

<!—Далі йде текст пункту 6 ->

<a name="roz7">Кадило мелісолисте</a>

<br><a href="#roz11">до змісту</a>

КАДИЛО МЕЛІСОЛИСТЕ

<br>Melittis melissophyllus (L, 1758)

<!—Далі йде текст пункту 7 ->

<a name="roz8">Страусове перо звичайне</a>

<br><a href="#roz11">до змісту</a>

СТРАУСОВЕ ПЕРО ЗВИЧАЙНЕ

<br>Matieuccia struthiopteris (L.) Tod 

<!—Далі йде текст пункту 8 ->

<a name="roz9">Верба чорнична</a>

<br><a href="#roz11">до змісту</a>

ВЕРБА ЧОРНИЧНА

<br>Salix myrtilloides L.

<!—Далі йде текст пункту 9 ->

<a name="roz10">Язичник буковинський</a>

<br><a href="#roz11">до змісту</a>

ЯЗИЧНИК БУКОВИНСЬКИЙ

<!—Далі йде текст пункту 10 ->

</Body></Html>

Учні, зверніть увагу на те, що для того, щоб повернутися до головного меню, можна використовувати теж внутрішні посилання.

Демонстрація вчителем веб-сторінки.

  1.  Вправи для очей. Хвилинка релаксації
  2.  Практична робота
    1.  Інструктаж з ТБ.
    2.  Пояснення принципів проведення практичної роботи та оцінювання результатів.

Ми готуємо роботу до участі в обласному екологічному фестивалі „Голос Землі”, тому завдання кожної групи індивідуальні, а результат роботи груп є внеском у спільний проект. Допоможемо один одному, щоб отримати відмінний кінцевий результат.

Практичні завдання

Прізвище, ім’я____________________    Комп’ютер №___

Практичне завдання

Бали

Само-оцінка

1

Створити зміст на сторінці Index *. html з книги „Рідкісні рослини Житомирщини” за допомогою внутрішнього посилання. Матеріал до теми знаходиться на D:\student1\ Робоча папка\ Веб-сайт\

* - номер вашого комп’ютера

7

2

Зробити внутрішнє гіперпосилання до змісту сторінки.

3

3

Оновити веб-сторінку, переглянути отриманий результат

1

Всього

11

  1.  Демонстрація отриманих результатів.
  2.  Домашнє завдання 

Продовжити роботу над індивідуальним проектом.

  1.  Підсумок уроку.

1. Яким елементом HTML задається внутрішнє посилання?

2.  Як створити внутрішнє посилання? Наведіть приклад.

3. Які моменти із створених веб-сайтів ми можемо використовувати не тільки на уроках інформатики і біології? (література, історія,  географія, природознавство…)

Рефлексія

„Пам’ятайте, що у рослин і тварин немає депутатів, їм нікому писати і скаржитись, за них нікому заступитись, крім нас, людей, які разом з ними населяють цю планету”.

Дж. Дарелл 

Повертаючись до епіграфу уроку, чи зможемо ми допомогти відновленню рідкісних рослин Землі?

Чи достойна робота бути представленою на конкурсі?

Чи корисним був урок?

PAGE  1


 

А также другие работы, которые могут Вас заинтересовать

62864. Изготовление изделий из проволоки 2.19 MB
  Формировать умения работать с инструментами предназначенными для гибки тонколистового металла и проволоки. Оборудование: молоток слесарные тиски оправки плоскогубцы заготовки металла и проволоки.