17. Создание простой начальной страницы сайта


Министерство образования и науки Республики Казахстан
РГКП «Семипалатинский финансово-экономический колледж имени Рымбек Байсеитова»
материалы открытого урока
Предмет: «Информатика»
Тема: «Создание простой страницы сайта»
2016-2017 учебный год

Ф.219
Технологическая карта (план) урока №17
Группа Дата
1 основной ФО-2 30.05
Дисциплина: Информатика
Раздел №10 Компьютерные сети, Интернет
Тема курса №10.4: Создание простой страницы сайта
Тема урока №17: Создание простой страницы сайта
Тип урока: Комбинированный
Вид урока: Практика
Требования предъявляемые к уровню подготовленности обучающихся
Базовые компетенции БК1.Уметь анализировать, обрабатывать, синтезировать и использовать научную информациюю Владеть основными навыками работы на компьютере.
БК2. Владеть современными информационно-коммуникативнымиспособностями, полиязыковой культурой. Овладеть конкретными знаниями по информатике, необходимыми для изучения конкретных специальных дисциплин.
БК3. Способен ставить и решать прикладные задачи с использованиемсовременных информационно-коммуникационных технологий.
Профессиональные компетенции ПК 3. Способен работать с информацией в глобальных компьютерных сетях
Цели урока обучающая Создание простой начальной страницы сайта
воспитательная Воспитание информационной культуры студентов, внимательности, аккуратности, дисциплинированности, полиязыковой культуры
развивающая Развитие познавательных интересов, навыков работы на компьютере, самоконтроля, умения анализировать.
Межпредметные связи
Обеспечивающие Предмет: Иностранный язык
Тема курса №2: Relationships between countries.
Тема урока №7. London. Phrasal verbs
Обеспечиваемые Предмет: Экономическая информатика и информационные технологии
Тема курса №10.6.: Гиперссылки и навигация сайта, внедрение на WEB-страницы gif-анимаций, баннеров. Публикация сайта
Оборудование урока
Наглядные пособия Флипчарт
Раздаточный материал Инструкции к практической работе
Технические средства обучения ПК, интерактивная доска
Литература: основная В.С.Романчик «Программирование в C++ Builder»
Дополнительная Семакин И.Г., Шестаков А.П. «Основы программирования»
Содержание урока
№ эле-ментаЭлементы урока, учебные вопросы,
формы и методы обучения Дополнения, изменения
1. Организационный (4 мин)
Приветствие обучающихся
Проверка отсутствующих, заполнение учебного журнала
Постановка цели и хода урока
Активизация темы: «Подзорная труба» 2. Проверка домашнего задания (30 мин)
Найти переводы слов в форме игры «Кто возьмет миллион?»
Подразделение компонентов компьютера в форме игры «Мозаика»
Найти соотвествия: «Использование компонентов компьютера»
Вспомнить термины по теме MS Excel в форме игры «Ромашка»
Вспомнить наименования компонентов компьютера: «What picture’s name is incorrect?»
Компьютерные термины на английском языке в форме игры «Потерянные буквы»
«Известные программисты» 3. Выполнение практического задания (с изучением нового материала) (22 мин)
1. Инструктаж по выполнению практического задания
2. Выполнение практического задания
3. Проверка практического задания 4. Закрепление полученных знаний (8 мин)
Фронтальный опрос:
Which tag defines an HTML document?
Which tag defines information about the document?
Which tag defines a title for the document?
Which tag defines the document's body?
Which tag defines a paragraph?
Which tag inserts a single line break?
Which tag defines an unordered list?
What for we use the tag <font>?
What for we use the tag <ol> 5 Подведение итогов урока (4 мин) 6 Постановка домашнего задания (2 мин)
Балафанов Е.К. «30 ур. по информатике» стр. 337-343
Создание сайта о себе. Преподаватель __________ Г.К.Мукушова

The theme of the course №10.4. Creating a simple Web page
The theme of the lesson №17. Creating a simple Web page
- Who is on duty today?
- I am on duty today.
- What date is it today?
- Today is the 30th of may
– What day is it today?
- Today is Friday
– Who is absent today?
- all are present
- ___________ is (are) absent today.
- Is ______ ill?
- Yes, he is/ Not, he is not/ I don’t know.
- Are you ready for this lesson? That’s great!
I’d like to start our lesson with quote of our president:
"We need the English language to enter the global arena. Out of 10 million books published in the world 85% are in English. The science, all the new developments and information - they are all in English nowadays.”
- Do you agree with this thought?
- It means that we are going in the right direction. Because we have already started to learn English. Then, let’s begin!
- How do you think, what is it?
- Right, it’s a spyglass. Let's look through the spyglass.
- What can you see?

- Have you seen this picture? This picture is related to our lesson.
- So can you guess the topic of our lesson? Do you have any ideas?
- The theme of our lesson is “Creating a simple Web page”.
- And how do you think, what about will be our site?
- Yes, about London.
- Do you like to travel?
- In our lesson we are going to travel to London. Would you like to go to London? And would you like to go to London right now?
- But we have one problem. We don’t have enough money. There is one way to make money. You can get money, if you play the game “Who wants to be a Millionaire?”
- Who wants to play this game and make money?
Find the right translation:

Now we have enough money.
What do you think? How can we get to London? Which transport will we choose? (by plane). So let’s take a plane and go on an imaginable trip to London. To get on a plane we must do the task. It’s Puzzle. Let’s do it.

What can you see in the picture?
How it is called? This is the double-decker. We will drive around the city on this bus. Let’s to visit the interesting places in London.
Our first stop is the Houses of Parliament and Big Ben. Do you want to know about this place? Then you must do the next task:
What are they used for?

The Houses of Parliament and Big Benы
The Houses of Parliament is a long grey building with towers. The large clock in one of the towers is Big Ben. It is the name of the clock and the bell of the clock tower. You can hear the sound of Big Ben every hour in London. The clock got its name after Sir Benjamin Hall. He was a tall man, whose nickname was Big Ben.
The second place that we are going to visit is Buckingham Palace. To get more information, you need to do the following task:

Buckingham Palace
The Queen of England lives in Buckingham Palace. It is a wonderful building with a monument in front of it which is the Queen Victoria Memorial.
Let's continue our tour of London. Our third stop is Trafalgar Square.

Magnifier
Trafalgar Square
It is the center of London. Some people say it is the most beautiful place in London. In the middle of the square stands a tall column. It is a monument to Admiral Nelson. Four bronze lions look at the square from the monument. There are two beautiful fountains in the square. It is the favorite place of tourists.
Our fourth stop is The London Eye. To find out about this landmark let’s do following task.

The London Eye
The London Eye is a giant Ferris wheel. The London Eye stands 135 metres high. The London Eye can carry 800 passengers at a time on a thirty-minute ride.
Our fifth stop is Tower Bridge. To find out about this landmark let’s do following task.

Tower Bridge
This is Tower Bridge, built in 1894. It is one of the famous bridges across the Thames. It opens and ships go up and down the river Thames.
Our journey is over. We have enough information about London. And now we can create the simple web page about this great city.
The theme of the course №10.4. Creating a simple Web page
The theme of the lesson №17. Creating a simple Web page
In this lesson we should create the simple web site like this:

To create web page like this we need following tags:
Basic HTML TagsTagDescription
<html> Defines an HTML document
This tag tells your browser that this is the start of an html document.
<head> Defines information about the document
<title> Defines a title for the document
<body> Defines the document's body
The text between the <body> tags is the text that will be displayed in your browser.
<p> Defines a paragraph
Think of a paragraph as a block of text. You can use the align attribute with a paragraph tag
<p align="left|right|center|justify"> The align attribute specifies the alignment of the text within a paragraph.
<br> Inserts a single line break
The <br> tag is used when you want to start a new line
<ul> Defines an unordered list
An unordered list is a list of items marked with small black circles. Each list item starts with the <li> tag<ol> Defines an ordered list
An ordered list is also a list of items. The list items are marked with numbers. Each list item starts with the <li> tag<img src= "..."> Displays an image
To display an image on a page, you need to use the src attribute. Src stands for "source".
<a href = "...">...</a> Defines a hyperlink
<font size= "..."; color="..."> The <font> tag specifies the font size, and color of text.
Let’s start to create web page about London with HTML.
Who want to work on this computer? Arman, come here. And other students will work in their places.
What should we do at first?
At first we must open text editor, like Notepad. Right click on the desktop and choose Create-Text document.
Double click new document and open it.
What should we write on the first line? On the first line type <html>. This tag tells the computer you're starting a web-page. It will be closed last, so at the end of the document, close it off by typing: </html>
Add the heading of the page.
Give your page a title “London”.
Type <body> to open the body tag. Then close the body tag by typing </body>.
Type the text: Welcome to London! Put an exclamation |ˌɛkskləˈmeɪʃ(ə)n| mark at the end of the sentence.
This text should be in the center. Give it the size equal to seven and red color.
Insert a single line break: type the tag <br>
Put the picture from the folder onto your web page, the HTML code for pictures is <img src="URL">.
Close the paragraph tag.
Write the sentence «Top Places to Visit in London:». Put colon at the end of sentence.
This text must be on the left of page, give it the size equal to 6 and black color. And type the <br> tag.
Under this text we will write a list of London attractions.
Which tag defines an unordered list? <ul>
The next step is making the hyperlink. To find out more about it let’s to watch the short video.
Following the video we must write a tag <a href> ...
On the bottom of the web page we can see scrolling text.
Let’s watch video about how can we do that.
Do the scrolling text with tag <marquee>.
Go to "save as", put a filename with an .html extension (such as "London.html") and choose "all files" or "text" under file type. Go find the page wherever you saved it, double click it, and your default web browser should open up your web-page.
<html>
<head>
<title> London </title>
</head>
<body>
<p align=center> <font size=7; color="red">Welcome to London!</font>
<br><img src="1.png"></p>
<p align=left><font size=6; color="black"><br>Top Places to Visit in London:
<ul>
<li><a href="BigBen.html">The Houses of Parliament and Big Ben </a>
<li><a href="Buckingham.html">Buckingham Palace</a>
<li><a href="Trafalgar.html">Trafalgar Square</a>
<li><a href="Westminster.html">Westminster Abbey</a>
<li><a href="Tower.html">Tower Bridge</a>
<li><a href="Eye.html">London Eye</a>
</ul>
<marquee>Welcome to London!</marquee>
</body>
</html>
Teacher G.Mukushova

Приложенные файлы


Добавить комментарий