Презентация, доклад по информатике Создание Web-сайта

Содержание

1. Презентация по информатике Создание Web-сайта
2. Структура Web-сайта
3. Контейнеры Код страницы Заголовок Название Web-страницы Основное содержание страницы
4. Назовем Web-страницу «Компьютер» Компьютер
5. Поместим на страницу текст «Все о компьютерах»Все о компьютерах
6. Текст программы:КомпьютерВсе о компьютерах
7. Сохранять Web-страницы нужно с расширением .htmlНапример, Мой
8. Форматирование текста:Размер шрифта в заголовках задается тэгами
9. Абзацы: Разделение текста на абзацы
10. Программирование Web-сайтаКомпьютер
11. Вставка рисунка Форматы .GIF, .JPG,
12. Вставка рисункаИли
13. Создание других страниц сайта Заголовок страницы
14. Гиперссылки Гиперссылки состоят из
15. Гиперссылки
16. Адрес электронной почты вставляется так:
17. Слайд 17
18. Создание списка нумерованного Список располагается внутри
19. Создание списка маркированного Создадим
20. Создание нумерованного списка Системные программыПрикладные программыСистемы программирования
21. Создание вложенного спискаТЕКСТОВЫЕ РЕДАКТОРЫ ГРАФИЧЕСКИЕ РЕДАКТОРЫ ЭЛЕКТРОННЫЕ ТАБЛИЦЫ СИСТЕМЫ УПРАВЛЕНИЯ БАЗАМИ ДАННЫХ.
22. Слайд 22
23. Словарь компьютерных терминов:Контейнер списка определений , Внутри
24. Слайд 24
25. ТаблицыТаблица задается контейнером , внутри которого содержится
26. Вставить таблицу в файл hardware .htmlНАИМЕНОВАНИЕТИПИЗГОТОВИТЕЛЬЦЕНАПРОЦЕССОРPENTIUMINTEL2500 РУБЛЕЙМАТЕРИНСКАЯ ПЛАТАAbitGIGABAIT2700 РУБЛЕЙ
27. Слайд 27
28. Формы на Web- страницахФормы включают в себя
29. Открыть в Блокноте файл Anketa.html и добавить
30. Переключатели Пользователю предоставляется возможность
31. Открыть в Блокноте файл Anketa.html и добавить
32. Флажки Флажки задаются тэгом
33. Пример: Какие из сервисов Интернета вы используете наиболее часто:wwwe-mailFTP
34. Поля списковТеперь выясним, какой из браузеров предпочитает
35. Открыть в Блокноте файл Anketa.html и добавить
36. Текстовая областьСоздается с помощью тэга с обязательными
37. Отправка формыОтправка введенной в форму информации, а
38. Для того, чтобы при щелчке по кн.
39. Когда же был создан язык программирования BasicЯзык
40. Алфавит языкаАлфавит языка Basic представляет собой таблицу

Структура Web-сайта

Главная
Информатика
Презентация по информатике Создание Web-сайта

Слайд 1

Презентация по информатике Создание Web-сайта

Шаронова С.М.

Слайд 2Структура Web-сайта

Слайд 3Контейнеры
Код страницы
Заголовок
Название Web-страницы
Основное содержание страницы

Слайд 4
Назовем Web-страницу «Компьютер»

Компьютер

Слайд 5

Поместим на страницу текст «Все о компьютерах»

Все о компьютерах

Слайд 6Текст программы:

Компьютер

Все о компьютерах

Слайд 7

Сохранять Web-страницы нужно с расширением .html

Например, Мой сайт .html
Принято сохранять титульный

файл сайта под именем
Index.html

Слайд 8

Форматирование текста:

Размер шрифта в заголовках задается тэгами от Н1 до Н6:

Все

о компьютерах

Тип выравнивания заголовка задает атрибут ALIGN

Слайд 9
Абзацы:
Разделение текста на абзацы производится

контейнером

. Для каждого абзаца
можно применить свой тип выравнивания.
Поместим на титульную страницу текст, разбитый
на абзацы с различным выравниванием:

На этом сайте вы сможете
получить различную информацию о компьютере,
его программном обеспечении и ценах
на компьютерные комплектующие.

Терминологический
словарь познакомит вас с компьютерными терминами, а также вы сможете
заполнить анкету.

Абзацы: Разделение текста на абзацы производится контейнером . Для каждого абзаца

Слайд 10

Программирование Web-сайта

Компьютер

получить различную информацию о компьютере, его программном обеспечении и ценах на компьютерные комплектующие.

Терминологический словарь познакомит вас с компьютерными терминами, а также вы сможете заполнить анкету.

Слайд 11Вставка рисунка
Форматы .GIF, .JPG, .PNG.

Тэг с атрибутом SRC, который указывает место хранения файла (путь к файлу).
Расположение рисунка относительно текста –атрибут ALIGN:
1. TOP
2. MIDDLE
3. BOTTON
4. LEFT
5. RIGHT
Вставить рисунок в контейнер перед абзацем текста.

Вставка рисунка Форматы .GIF, .JPG, .PNG. Тэг с атрибутом SRC,

Слайд 12Вставка рисунка

Или

Слайд 13Создание других страниц сайта

Заголовок страницы

Создайте страницы Программы, Словарь,

Комплектующие, Анкета.
Сохраните их в файлах с названиями:
software.html
glossary.html
hardware.html
anketa.html

Создание других страниц сайта Заголовок страницы Создайте страницы Программы, Словарь, Комплектующие, Анкета.Сохраните их в файлах с

Слайд 14
Гиперссылки

Гиперссылки состоят из указателя ссылки и

адресной части ссылки.
Адресная часть – URL – адрес документа.
Принято размещать гиперссылки в нижней
части титульной страницы, поэтому разместим их
после введенного текста в новом абзаце.
В качестве указателя гиперссылок выберем
названия страниц нашего сайта: Программы,
Словарь, Комплектующие, Анкета.
Указатели гиперссылок разделяются пробелами ( ) . Для каждой гиперссылки определим
адрес перехода, (контейнер ) с атрибутом HREF, значением которого является URL – адрес.

Гиперссылки Гиперссылки состоят из указателя ссылки и адресной части ссылки.

Слайд 15Гиперссылки

[Словарь]
[Комплектующие]
[Анкета]

Слайд 16
Адрес электронной почты вставляется так:
Полезно на странице

помещать ссылку на адрес электронной
почты, по которому посетители могут связаться с
администрацией сайта.

E-mail:
mailbox@provaider.ru

По щелчку мыши по ссылке на адрес электронной почты
будет открываться программа Outlook Express, где в строке
Кому будет указан заданный в ссылке адрес

Адрес электронной почты вставляется так: Полезно на странице помещать ссылку на адрес электронной

Слайд 17

Слайд 18
Создание списка нумерованного
Список располагается внутри контейнера , а

каждый элемент списка – тэгом

. С помощью атрибута TYPE тэга <ОL> можно задать вид нумерации: арабские цифры по умолчанию, “I” (римские цифры), “а” (строчные буквы).
Открыть в Блокноте файл Software.html и добавить следующий HTML-код, задающий список:

Системные программы
Прикладные программы
Системы программирования

Создание списка нумерованного Список располагается внутри контейнера , а каждый элемент списка – тэгом . С

Слайд 19

Создание списка
маркированного

Создадим теперь вложенный маркированный список

для
одного из элементов основного списка. Список располагается
внутри контейнера

, а каждый элемент
списка определяется также тэгом

. С помощью
атрибута TYPE тэга

Прикладные программы.

Создание списка маркированного Создадим теперь вложенный маркированный список для одного из

Слайд 20
Создание нумерованного списка

Системные программы
Прикладные программы
Системы программирования

Слайд 21
Создание вложенного списка

ТЕКСТОВЫЕ РЕДАКТОРЫ
ГРАФИЧЕСКИЕ РЕДАКТОРЫ
ЭЛЕКТРОННЫЕ ТАБЛИЦЫ
СИСТЕМЫ

УПРАВЛЕНИЯ БАЗАМИ ДАННЫХ.

Слайд 22

Слайд 23Словарь компьютерных терминов:
Контейнер списка определений ,
Внутри него термин – тэг

определение -

Процессор Центральный процессор, производящий вычисления в двоичном коде.: Центральный процессор, производящий вычисления в двоичном коде.
Оперативная память Устройство, в котором хранятся программы и данные: Устройство, в котором хранятся программы и данные

Слайд 24

Слайд 25Таблицы
Таблица задается контейнером , внутри которого содержится описание структуры таблицы и

ее содержимого.
Любая таблица состоит из строк, которые задаются контейнером , в который помещается описание ячейки.
Формат ячейки и ее содержание помещается в контейнер , а заголовки ячеек в контейнер .
Толщина разделительных линий задается атрибутом BORDER, а для выравнивания информации - атрибут ALIGN.

ТаблицыТаблица задается контейнером , внутри которого содержится описание структуры таблицы и ее содержимого.Любая таблица состоит из строк,

Слайд 26Вставить таблицу в файл hardware .html

НАИМЕНОВАНИЕ
ТИП
ИЗГОТОВИТЕЛЬ
ЦЕНА

ALIGN="CENTER">ПРОЦЕССОР
PENTIUM
INTEL
2500 РУБЛЕЙ

МАТЕРИНСКАЯ ПЛАТА
Abit
GIGABAIT
2700 РУБЛЕЙ

Вставить таблицу в файл hardware .htmlНАИМЕНОВАНИЕТИПИЗГОТОВИТЕЛЬЦЕНАПРОЦЕССОРPENTIUMINTEL2500 РУБЛЕЙМАТЕРИНСКАЯ ПЛАТАAbitGIGABAIT2700 РУБЛЕЙ

Слайд 27

Слайд 28Формы на Web- страницах
Формы включают в себя текстовые поля, раскрывающиеся списки,

флажки, переключатели и т.д. Формы заключаются в контейнер
Текстовые поля задаются тэгом со
значением атрибута type=“text”.
Атрибут NAME является обязательным и служит
для идентификации полученной информации, Атрибут SIZE задает длину поля ввода данных.
Для того, чтобы анкета читалась необходимо разделять строки с помощью тэга перевода строки
.

Формы на Web- страницахФормы включают в себя текстовые поля, раскрывающиеся списки, флажки, переключатели и т.д. Формы заключаются

Слайд 29Открыть в Блокноте файл Anketa.html и добавить следующий HTML-код, задающий текстовые

поля для ввода данных. Просмотреть результат в браузере:

Открыть в Блокноте файл Anketa.html и добавить следующий HTML-код, задающий текстовые поля для ввода данных. Просмотреть результат

Слайд 30Переключатели
Пользователю предоставляется возможность отнести

себя к одной из групп пользователей: учащийся,
студент, учитель.
Переключатели создается тэгом со значением атрибута type=“radio”. Все элементы в группе должны иметь одинаковые значения атрибута Name=“Group”
Другим обязательным атрибутом должно быть VALUE, принимающий, в нашем случае, значения "schoolboy“, "student“, "teacher"

Переключатели Пользователю предоставляется возможность отнести себя к одной из групп пользователей:

Слайд 31Открыть в Блокноте файл Anketa.html и добавить следующий HTML-код, задающий группу

переключателей. Просмотреть результат в браузере:

Укажите, к какой группе пользователей вы себя относите:

NAME="group" value="schoolboy">учащийся

NAME="group" value="student">студент

NAME="group" value="teacher">учитель

Слайд 32Флажки
Флажки задаются тэгом со значением

атрибута type=“checkbox”
Флажки, объединенные в группу могут иметь
одинаковые значения атрибута Name=“Group”
Другим обязательным атрибутом должно быть
VALUE, принимающий, в нашем случае, значения
“www“, “e-mail“, “ftp“
Добавить HTML-код, задающий флажки для
выбора нескольких элементов. Просмотреть
результат в браузере:

Флажки Флажки задаются тэгом со значением атрибута type=“checkbox”

Слайд 33Пример:
Какие из сервисов Интернета вы используете наиболее часто:

www

TYPE="checkbox"
NAME="group" value="e-mail">e-mail

NAME="group" value="ftp">FTP

Пример: Какие из сервисов Интернета вы используете наиболее часто:wwwe-mailFTP

Слайд 34Поля списков
Теперь выясним, какой из браузеров предпочитает посетитель сайта. Перечень браузеров

представим в виде раскрывающегося списка, из которого можно выбрать только один вариант. Используется контейнер , в котором каждый элемент списка определен тэгом

Поля списковТеперь выясним, какой из браузеров предпочитает посетитель сайта. Перечень браузеров представим в виде раскрывающегося списка, из

Слайд 35Открыть в Блокноте файл Anketa.html и добавить следующий HTML-код, задающий раскрывающий

список. Просмотреть результат в браузере:

Слайд 36Текстовая область
Создается с помощью тэга с обязательными атрибутами: NAME, задающим

имя области, ROWS – число строк , COLS – число столбцов.
добавить HTML-код, создающий текстовую область. Просмотреть результат в браузере:
Какую еще информацию вы хотели бы видеть на нашем сайте?

ROWS=4 COLS=30><br>    </TEXTAREA<br>    <BR><br><br>                                </div>
                            							<div class="image">
								<a href="/img/thumbs/2a29d545a633ba7dae52d5426a10744a-800x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Текстовая областьСоздается с помощью тэга  с обязательными атрибутами: NAME, задающим    имя области, ROWS – число строк , COLS – число столбцов.добавить HTML-код, создающий текстовую область. Просмотреть результат в браузере:    Какую еще информацию вы хотели бы видеть на нашем сайте?           "><img src="/img/thumbs/2a29d545a633ba7dae52d5426a10744a-800x.jpg" title="Презентация по информатике Создание Web-сайта Текстовая областьСоздается с помощью тэга с обязательными атрибутами: NAME, задающим" alt="Текстовая областьСоздается с помощью тэга с обязательными атрибутами: NAME, задающим   имя области, ROWS – число"></a>
							</div>
														<hr>
						</div>
											<div class="descrip" id="slide37">
							<h2><a href="/img/thumbs/190611389851c7d33406e338edf67d9e-800x.jpg" target="_blank">Слайд 37</a>Отправка формы<br>Отправка введенной в форму информации, а также очистка полей от</h2>
                                                            <div class="text">
                                    уже введенной информации осуществляется кнопками. Для создания кн., отправляющей инф-ю, атрибуту TYPE=“submit“, value=«Отправить».<br>Для создания кн., очищающую инф-ю, атрибуту TYPE=“reset“, value=«Очистить».<br>добавить HTML-код, создающий текстовую область. Просмотреть результат в браузере: <br><INPUT TYPE="SUBMIT"<br>value="Отправить"><br><INPUT TYPE="RESET"<br>value="Очистить"><br><br>                                </div>
                            							<div class="image">
								<a href="/img/thumbs/190611389851c7d33406e338edf67d9e-800x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Отправка формыОтправка введенной в форму информации, а также очистка полей от уже введенной информации осуществляется кнопками. Для создания кн., отправляющей инф-ю, атрибуту TYPE=“submit“, value=«Отправить».Для создания кн., очищающую инф-ю, атрибуту TYPE=“reset“, value=«Очистить».добавить HTML-код, создающий текстовую область. Просмотреть результат в браузере: "><img src="/img/thumbs/190611389851c7d33406e338edf67d9e-800x.jpg" title="Презентация по информатике Создание Web-сайта Отправка формыОтправка введенной в форму информации, а также очистка полей от" alt="Отправка формыОтправка введенной в форму информации, а также очистка полей от уже введенной информации осуществляется кнопками. Для"></a>
							</div>
														<hr>
						</div>
											<div class="descrip" id="slide38">
							<h2><a href="/img/thumbs/3bf90ee92e44259441d279ea1eb1e708-800x.jpg" target="_blank">Слайд 38</a>Для того, чтобы при щелчке по кн. «Отправить» данные из формы</h2>
                                                            <div class="text">
                                    передавались на сервер и там обрабатывались необходимо указать адрес и программу обработки. Для этого используется атрибут ACTION контейнера <FORM>. <br><FORM ACTION=http:/www.mycompany.ru/ogi-bin/bd.exe"<br>                                </div>
                            							<div class="image">
								<a href="/img/thumbs/3bf90ee92e44259441d279ea1eb1e708-800x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Для того, чтобы при щелчке по кн. «Отправить» данные из формы передавались на сервер и там обрабатывались необходимо указать адрес и программу обработки. Для этого используется атрибут ACTION контейнера . "><img src="/img/thumbs/3bf90ee92e44259441d279ea1eb1e708-800x.jpg" title="Презентация по информатике Создание Web-сайта Для того, чтобы при щелчке по кн. «Отправить» данные из формы" alt="Для того, чтобы при щелчке по кн. «Отправить» данные из формы передавались на сервер и там обрабатывались"></a>
							</div>
														<hr>
						</div>
											<div class="descrip" id="slide39">
							<h2><a href="/img/thumbs/bd410b248d2ea23a89bb484ab15852c3-800x.jpg" target="_blank">Слайд 39</a>Когда же был создан язык программирования Basic<br>Язык программирования Basic был создан</h2>
                                                            <div class="text">
                                    в 1964 году двумя профессорами Дартмунского университета Джоном Кенеми и Томасом Куртцом.BASIC - это первые буквы английских слов Beginner's All-purpose Symbolic Instruction Code (Всецелевой язык программирования для начинающих). В настоящее время существует множество версий этого языка, которые иногда очень сильно отличаются друг от друга. Для учебных заведений самыми распространенными являются версии MSX, впервые реализованная на японском компьютере "Ямаха", и версии фирмы Microsoft для компьютеров IBM. Кроме этого в нашей стране популярностью пользуется версия Turbo-Basic фирмы Borland. Без преувеличения можно сказать, что сегодня Бейсик является самым распространённым языком программирования. После появления мощных компиляторов Visual Basic этот язык стал популярен и у профессиональных программистов. Бейсик относится к языкам программирования высокого уровня. Как и другие языки, этот язык имеет алфавит, синтаксис, семантику. <br>                                </div>
                            							<div class="image">
								<a href="/img/thumbs/bd410b248d2ea23a89bb484ab15852c3-800x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Когда же был создан язык программирования BasicЯзык программирования Basic был создан в 1964 году двумя профессорами Дартмунского университета Джоном Кенеми и Томасом Куртцом.BASIC - это первые буквы английских слов Beginner's All-purpose Symbolic Instruction Code (Всецелевой язык программирования для начинающих). В настоящее время существует множество версий этого языка, которые иногда очень сильно отличаются друг от друга. Для учебных заведений самыми распространенными являются версии MSX, впервые реализованная на японском компьютере "Ямаха", и версии фирмы Microsoft для компьютеров IBM. Кроме этого в нашей стране популярностью пользуется версия Turbo-Basic фирмы Borland. Без преувеличения можно сказать, что сегодня Бейсик является самым распространённым языком программирования. После появления мощных компиляторов Visual Basic этот язык стал популярен и у профессиональных программистов. Бейсик относится к языкам программирования высокого уровня. Как и другие языки, этот язык имеет алфавит, синтаксис, семантику. "><img src="/img/thumbs/bd410b248d2ea23a89bb484ab15852c3-800x.jpg" title="Презентация по информатике Создание Web-сайта Когда же был создан язык программирования BasicЯзык программирования Basic был создан" alt="Когда же был создан язык программирования BasicЯзык программирования Basic был создан в 1964 году двумя профессорами Дартмунского"></a>
							</div>
														<hr>
						</div>
											<div class="descrip" id="slide40">
							<h2><a href="/img/thumbs/ace1dff5d71be688cad0083ced254308-800x.jpg" target="_blank">Слайд 40</a>Алфавит языка<br>Алфавит языка Basic представляет собой таблицу символов ASCII. Первая половина</h2>
                                                            <div class="text">
                                    этой таблицы (символы с кодом 0-127) - стандартная. Вторая половина (символы с кодом 128-255) специфична для каждой страны. В этой таблице каждый символ имеет 8-битовое обозначение. Итак, в алфавит языка Basic входят все прописные и заглавные буквы английского и русского алфавитов, цифры, а также набор специальных символов, который имеется на клавиатуре компьютера. <br>                                </div>
                            							<div class="image">
								<a href="/img/thumbs/ace1dff5d71be688cad0083ced254308-800x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Алфавит языкаАлфавит языка Basic представляет собой таблицу символов ASCII. Первая половина этой таблицы (символы с кодом 0-127) - стандартная. Вторая половина (символы с кодом 128-255) специфична для каждой страны. В этой таблице каждый символ имеет 8-битовое обозначение. Итак, в алфавит языка Basic входят все прописные и заглавные буквы английского и русского алфавитов, цифры, а также набор специальных символов, который имеется на клавиатуре компьютера. "><img src="/img/thumbs/ace1dff5d71be688cad0083ced254308-800x.jpg" title="Презентация по информатике Создание Web-сайта Алфавит языкаАлфавит языка Basic представляет собой таблицу символов ASCII. Первая половина" alt="Алфавит языкаАлфавит языка Basic представляет собой таблицу символов ASCII. Первая половина этой таблицы (символы с кодом 0-127)"></a>
							</div>
														<hr>
						</div>
									</div>

<div class="custom"  >
	
<div id="yandex_rtb_R-A-637067-9"></div>
<script>window.yaContextCb.push(()=>{
  Ya.Context.AdvManager.render({
    renderTo: 'yandex_rtb_R-A-637067-9',
    blockId: 'R-A-637067-9'
  })
})</script></div>
				<div class="url"><a href="/informatika/prezentatsiya-po-informatike-sozdanie-web-sayta/download">Скачать презентацию</a></div>
							</div>
			<div class="right">
				<div class="banners">

<div class="custom"  >
	
<div id="yandex_rtb_R-A-637067-8"></div>
<script>window.yaContextCb.push(()=>{
  Ya.Context.AdvManager.render({
    renderTo: 'yandex_rtb_R-A-637067-8',
    blockId: 'R-A-637067-8'
  })
})</script></div>
				</div>
				<div class="list related">
					<h2>Похожие презентации</h2>
											<div class="wrapper">
							<a href="/informatika/prezentatsiya-i-fayl-s-zadaniyami-po">
								<img src="/img/thumbs/609ba9c9be4781a04d96977e32596644-800x.jpg" alt="Презентация и файл с заданиями по информатике Форматирование абзацев(9 класс) Стили заголовок 1 выровнять по середине (Ctrl+E), абзац интервал перед 20, после 24, размер шрифта 18Задание№2. Напечатать текст, а затем отформатировать, его так как указано в ">
								<span class="desc">
            				<span>Презентация и файл с заданиями по информатике Форматирование абзацев(9 класс) Стили заголовок 1 выровнять по середине (Ctrl+E), абзац интервал перед 20, после 24, размер шрифта 18Задание№2. Напечатать текст, а затем отформатировать, его так как указано в </span>
            				<span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 165</span>
            			</span>
							</a>
						</div>
																	<div class="wrapper">
							<a href="/informatika/prezentatsiya-multimediyaly-prezentatsiyany-konstruktory">
								<img src="/img/thumbs/f7a466ce4cac73a92122a5920a45c558-800x.jpg" alt="Презентация Мультимедиялық презентацияның конструкторы">
								<span class="desc">
            				<span>Презентация Мультимедиялық презентацияның конструкторы</span>
            				<span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 134</span>
            			</span>
							</a>
						</div>

<div class="custom"  >
	
<script>window.yaContextCb.push(()=>{
  Ya.Context.AdvManager.render({
    type: 'fullscreen',
    blockId: 'R-A-637067-10'
  })
})</script></div>
											<div class="wrapper">
							<a href="/informatika/iskusstvo-illyuzii">
								<img src="/img/thumbs/63c83247b9746bb1b283cbadf7ab3c42-800x.jpg" alt="Искусство иллюзии">
								<span class="desc">
            				<span>Искусство иллюзии</span>
            				<span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 214</span>
            			</span>
							</a>
						</div>
																	<div class="wrapper">
							<a href="/informatika/prezentatsiya-po-robototehnike-robototehnika-kak-instrument">
								<img src="/img/thumbs/da45e9499f0cf03b2e54ea07590582eb-800x.jpg" alt="Презентация по робототехнике Робототехника как инструмент формирования инженерной компетенции обучающихся в рамках реализации ФГОС">
								<span class="desc">
            				<span>Презентация по робототехнике Робототехника как инструмент формирования инженерной компетенции обучающихся в рамках реализации ФГОС</span>
            				<span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 235</span>
            			</span>
							</a>
						</div>
																	<div class="wrapper">
							<a href="/informatika/urok-po-teme-informatsiya-edinitsy-izmereniya">
								<img src="/img/thumbs/db568eae3c2d3cfca7b4076b441afd0b-800x.jpg" alt="Урок по теме: Информация. Единицы измерения информации">
								<span class="desc">
            				<span>Урок по теме: Информация. Единицы измерения информации</span>
            				<span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 143</span>
            			</span>
							</a>
						</div>
																	<div class="wrapper">
							<a href="/informatika/interaktivnyy-test-po-programmirovaniyu-8-klass">
								<img src="/img/thumbs/8cb867960f435e81ef97ae1fe48fd97d-800x.jpg" alt="Интерактивный тест по программированию 8 класс">
								<span class="desc">
            				<span>Интерактивный тест по программированию 8 класс</span>
            				<span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 232</span>
            			</span>
							</a>
						</div>
																<div class="clear"></div>
				</div>
			</div>
		</div>
	</div>
</div>

<div class="container bottom">
		<div>
			<div class="whatis">
				<h4><i class="fa fa-info text-red"></i>Что такое shareslide.ru?</h4>
				<p> Это сайт презентаций, где можно хранить и обмениваться своими презентациями, докладами, проектами, шаблонами в формате PowerPoint с другими пользователями. Мы помогаем школьникам, студентам, учителям, преподавателям хранить и обмениваться учебными материалами.</p>
<hr />
<p><a href="/privacy">Для правообладателей</a></p>				
				<a href="https://metrika.yandex.ru/stat/?id=62259274&from=informer"
				   target="_blank" rel="nofollow"><img src="https://informer.yandex.ru/informer/62259274/3_1_FFFFFFFF_EFEFEFFF_0_pageviews"
													   style="width:88px; height:31px; border:0;" alt="Яндекс.Метрика" title="Яндекс.Метрика: данные за сегодня (просмотры, визиты и уникальные посетители)" class="ym-advanced-informer" data-cid="62259274" data-lang="ru" /></a>
				
				
				<script type="text/javascript">
					document.write('<a href="//www.liveinternet.ru/click" '+
						'target="_blank"><img src="//counter.yadro.ru/hit?t15.3;r'+
						escape(document.referrer)+((typeof(screen)=='undefined')?'':
							';s'+screen.width+'*'+screen.height+'*'+(screen.colorDepth?
							screen.colorDepth:screen.pixelDepth))+';u'+escape(document.URL)+
						';h'+escape(document.title.substring(0,150))+';'+Math.random()+
						'" alt="" title="LiveInternet: показано число просмотров за 24'+
						' часа, посетителей за 24 часа и за сегодня" '+
						'border="0" width="88" height="31"><\/a>')
				</script>
				
			</div>
            <div class="links">
				            </div>
			<div class="call_back">
				<h4><i class="fas fa-bullhorn"></i>Обратная связь</h4>
				<p>Email: <a href="#" class="js_hidden_email" data-address="shareslide" data-domain="ya.ru">Нажмите что бы посмотреть</a> </p>			</div>
			<div class="clear"></div>
		</div>
	</div>
	<script src="/templates/presentation/js/script.js?2447e50ae9548e2940ba7a21ee06d344"></script>
</body>
</html>

Презентация, доклад по информатике Создание Web-сайта

Содержание

Слайд 1

Слайд 2Структура Web-сайта

Слайд 3Контейнеры Код страницы Заголовок Название Web-страницы Основное содержание страницы

Слайд 4Назовем Web-страницу «Компьютер» Компьютер

Слайд 5Поместим на страницу текст «Все о компьютерах»Все о компьютерах

Слайд 6Текст программы:КомпьютерВсе о компьютерах

Слайд 7Сохранять Web-страницы нужно с расширением .htmlНапример, Мой сайт .htmlПринято сохранять титульный

Слайд 8Форматирование текста:Размер шрифта в заголовках задается тэгами от Н1 до Н6:Все

Слайд 9Абзацы: Разделение текста на абзацы производится

Слайд 10Программирование Web-сайтаКомпьютер

Слайд 11Вставка рисунка Форматы .GIF, .JPG, .PNG.

Слайд 12Вставка рисункаИли

Слайд 13Создание других страниц сайта Заголовок страницы Создайте страницы Программы, Словарь,

Слайд 14 Гиперссылки Гиперссылки состоят из указателя ссылки и

Слайд 15Гиперссылки

Слайд 16Адрес электронной почты вставляется так: Полезно на странице

Слайд 17

Слайд 18Создание списка нумерованного Список располагается внутри контейнера , а

Слайд 19Создание списка маркированного Создадим теперь вложенный маркированный список

Слайд 20Создание нумерованного списка Системные программыПрикладные программыСистемы программирования

Слайд 21Создание вложенного спискаТЕКСТОВЫЕ РЕДАКТОРЫ ГРАФИЧЕСКИЕ РЕДАКТОРЫ ЭЛЕКТРОННЫЕ ТАБЛИЦЫ СИСТЕМЫ