Разделы презентаций


Разработка Web - сайтов с использованием языка разметки гипертекста HTML

Содержание

Web-Web-страницы и Web-страницы и WebWeb-страницы и Web-сайтыСтруктура Структура WebСтруктура Web-страницыВставка изображений в Вставка изображений в WebВставка изображений в Web-страницыГиперссылки на Гиперссылки на Web-Гиперссылки на Web-страницахСписки на Списки на WebСписки на Web-страницахИнтерактивные

Слайды и текст этой презентации

Слайд 1Подготовила:
Учитель информатики
Потапенко Татьяна Валерьевна
Г.Бакал 2015г.

Подготовила:Учитель информатики Потапенко Татьяна ВалерьевнаГ.Бакал 2015г.

Слайд 2Web-Web-страницы и Web-страницы и WebWeb-страницы и Web-сайты
Структура Структура WebСтруктура Web-страницы
Вставка

изображений в Вставка изображений в WebВставка изображений в Web-страницы
Гиперссылки на

Гиперссылки на Web-Гиперссылки на Web-страницах
Списки на Списки на WebСписки на Web-страницах
Интерактивные формы на Интерактивные формы на WebИнтерактивные формы на Web-страницах
Источники информации
Web-Web-страницы и Web-страницы и WebWeb-страницы и Web-сайтыСтруктура Структура WebСтруктура Web-страницыВставка изображений в Вставка изображений в WebВставка изображений

Слайд 3Web-страницы и Web-сайты

Web-страницы и Web-сайты

Слайд 4Web-страницы создаются с использованием языка разметки гипертекстовых документов. В обычный

текстовый документ вставляются управляющие символы, которые определяют вид Web-страницы при

просмотре в браузере.
Для создания Web-страниц используются простейшие текстовые редакторы, которые не включают в создаваемый документ управляющие символы форматирования текста самого редактора. В качестве такого редактора в операционной системе Windows или Linux можно использовать стандартное приложение Блокнот.


Web-страницы создаются с использованием языка разметки гипертекстовых документов. В обычный текстовый документ вставляются управляющие символы, которые определяют

Слайд 5Публикации во Всемирной паутине реализуются в форме Web-сайтов, которые обычно

содержат материал по определенной теме или проблеме. Любой пользователь Интернета

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


Публикации во Всемирной паутине реализуются в форме Web-сайтов, которые обычно содержат материал по определенной теме или проблеме.

Слайд 7Web-страницы разделяются на две логические части: заголовок и содержание.
Заголовок

Web-страницы заключается в контейнер и содержит название страницы и справочную

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


Web-страницы разделяются на две логические части: заголовок и содержание. Заголовок Web-страницы заключается в контейнер и содержит название

Слайд 8Вставка изображений в Web-страницы

Вставка изображений в Web-страницы

Слайд 9Для вставки изображения используется тэг «IMG» с атрибутом SRC, который

указывает на место хранения файла на локальном компьютере или в

Интернете. Если графический файл находится на локальном компьютере в той же папки, что и файл Web-страницы, то в качестве значения атрибута достаточно указать только имя файла.
Если файл находится в другой папке на данном локальном компьютере, то значением атрибута должно быть полное имя файла, включая путь к нему в файловой системе.
Если файл находится на удаленном сервере в интернете, то должен быть указан Интернет-адрес этого файла.


Для вставки изображения используется тэг «IMG» с атрибутом SRC, который указывает на место хранения файла на локальном

Слайд 10 Вставка альтернативного текста
Пользователи иногда, в

целях экономии времени, отключают в браузере загрузку графических изображений и

читают только тексты. Чтобы не терялся смысл страницы, вместо рисунка должен выводиться альтернативный текст


Вставка альтернативного текстаПользователи иногда, в целях экономии времени, отключают в браузере загрузку

Слайд 12Гиперссылки, размещенные на Web-странице, позволяют загружать в браузер другие Web-страницы,

хранящиеся на локальном компьютере или в Интернете.
Гиперссылка создается с

помощью тэга «А» и его атрибута HREF, указывающего, в каком файле храниться загруженная Web-страница.
Если загружаемая в браузер Web-страница размещена в Интернете, то в качестве адреса указывается Интернет-адрес.
Если загружаемая в браузер Web-страница размещена на локальном компьютере в той же папке, то вместо адреса указывается просто имя файла.


Гиперссылки, размещенные на Web-странице, позволяют загружать в браузер другие Web-страницы, хранящиеся на локальном компьютере или в Интернете.

Слайд 13Гиперссылка на адрес электронной почты. Полезно на начальной странице сайта

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

связаться с администрацией сайта. Для этого необходимо атрибуту ссылки HREF присвоить адрес электронной почты и вставить ее в контейнер «ADDRESS», который задает стиль абзаца, принятый для указания адреса.


Гиперссылка на адрес электронной почты. Полезно на начальной странице сайта создать ссылку на адрес электронной почты, по

Слайд 15Довольно часто при размещении текста на Web-страницах удобно использовать списки

в различных вариантах:
Нумерованные списки, где элементы списка идентифицируются с помощью

чисел;
Маркированные списки, где элементы списка идентифицируются с помощью специальных символов (маркеров)
Списки определений - позволяют составлять перечни определений в так называемой словарной форме.


Довольно часто при размещении текста на Web-страницах удобно использовать списки в различных вариантах:Нумерованные списки, где элементы списка

Слайд 16Нумерованные списки. Нумерованный список располагается внутри контейнера «OL», а каждый

элемент списка определяется тэгом «LI».
Список терминов. Список терминов

располагается внутри контейнера «список определений» «DL». Внутри него текст оформляется в виде термина, который выделяется одинарным тэгом «DT» и определения, которое следует за одинарным тэгом «DD».


Нумерованные списки. Нумерованный список располагается внутри контейнера «OL», а каждый элемент списка определяется тэгом «LI». Список терминов.

Слайд 17 Интерактивные формы на Web-страницах

Интерактивные формы на Web-страницах

Слайд 18Для того чтобы посетители сайта могли не только просматривать информацию,

но и отправлять сведения его администраторам, на страницах сайта размещают

интерактивные формы. Формы включают в себя элементы управления различных типов: текстовые поля, раскрывающиеся списки, флажки, переключатели и т.д. вся форма заключается в контейнер «FORM». В первую очередь выясним имя посетителя нашего сайта и его электронный адрес, чтобы иметь возможность ответить ему на замечания и поблагодарить за посещение сайта.


Для того чтобы посетители сайта могли не только просматривать информацию, но и отправлять сведения его администраторам, на

Слайд 19Текстовые поля. Для получения этих данных разместим в форме два

однострочных текстовых поля для ввода информации.
Текстовые поля создаются с

помощью тэга «INPUT». Атрибут NAME является обязательным и служит для полученной информации. Значением атрибута SIZE является число, задающее длину поля ввода в символах.
Для того чтобы анкета «читалась», необходимо разделить строки с помощью тэга перевода строки «BR».


Текстовые поля. Для получения этих данных разместим в форме два однострочных текстовых поля для ввода информации. Текстовые

Слайд 20Переключатели. Далее, мы хотим выяснить, к какой группе пользователей относит

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

студент, учитель.
Для этого необходимо создать группу переключателей. Создается такая группа с помощью тэга «INPUT». Все элементы в группе должны иметь одинаковые значения атрибута NAME.


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

Слайд 21Флажки. Далее, мы хотим узнать, какими сервисами Интернета наш посетитель

пользуется наиболее часто. Здесь из предложенного он может выбрать одновременно

несколько вариантов, пометив их флажками.
Флажки создаются с помощью тэга «INPUT». Флажки, объединенные в группу, могут иметь различные значения атрибута NAME.
Еще одним обязательным атрибутом является «VALUE», которому присвоим значения «WWW» «e-mail». Значение этого атрибута должно быть уникальным для каждого флажка, т.к. при его выборе именно оно передается серверу.


Флажки. Далее, мы хотим узнать, какими сервисами Интернета наш посетитель пользуется наиболее часто. Здесь из предложенного он

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

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

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


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

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

на наших страницах, какую информацию следовало бы в них добавить.

Так как мы не можем знать заранее, насколько обширным будет ответ читателя , отведем для него текстовую область. В такое поле можно ввести достаточно длинный текст.
Создается текстовая область с помощью тэга «TEXTAREA» с обязательными атрибутами: NAME, задающим имя области, ROWS, определяющим число строк, и COLS – число столбцов области.


Текстовая область. В заключение поинтересуемся, что хотел бы видеть посетитель на наших страницах, какую информацию следовало бы

Слайд 24Отправка данных из формы. Отправка введенной в форму информации осуществляется

с помощью щелка по кнопке.
Щелчком по кнопке Отправить можно отправить

данные из формы на определенный адрес электронной почты. Для этого атрибуту ACTION контейнера «FORM» надо присвоить значение адреса электронной почты. Кроме того, в атрибутах METOD необходимо указать и форму передачи данных.


Отправка данных из формы. Отправка введенной в форму информации осуществляется с помощью щелка по кнопке.Щелчком по кнопке

Слайд 25Угринович Н. Д. Информатика и ИКТ: учебник для 8 класса.

– М. : БИНОМ. Лаборатория знаний, 2008. – 178 с.
http://images.yandex.ru/yandsearch?text=%D0%98%D0%BA%D1%82%20%D0%BA%D0%B0%D1%80%D1%82%D0%B8%D0%BD%D0%BA%D0%B8&stype=image&noreask=1&lr=10830
http://mediasubs.ru/group/uploads/so/sozdat-svoj-sajt-mechta-kazhdogo-chelovekakotoryij-hotya-byi-2-3-raza-zahodil-v-internet/image2/AtODUzZmY.jpg



Угринович Н. Д. Информатика и ИКТ: учебник для 8 класса. – М. : БИНОМ. Лаборатория знаний, 2008.

Обратная связь

Если не удалось найти и скачать доклад-презентацию, Вы можете заказать его на нашем сайте. Мы постараемся найти нужный Вам материал и отправим по электронной почте. Не стесняйтесь обращаться к нам, если у вас возникли вопросы или пожелания:

Email: Нажмите что бы посмотреть 

Что такое TheSlide.ru?

Это сайт презентации, докладов, проектов в PowerPoint. Здесь удобно  хранить и делиться своими презентациями с другими пользователями.


Для правообладателей

Яндекс.Метрика