Презентация WEB-Сайт.Разработка WEB-Сайта.

WEB-САЙТ.Разработка WEB-САЙТОВ.Книжник Светлана Викторовна учитель информатики МБОУ СОШ №3. г. Кумертау Web-страница- это отдельный документ (комбинация текста, рисунков, анимации, звука и прочее), который имеет свой собственный адрес. Web-сайт– это группа Web-страниц, объединенная гиперссылками, принадлежащих какому-либо частному лицу или организации. Гиперссылка- это некоторое слово или объект документа, содержащий указатель(адрес) для перехода на другой фрагмент документа или другую Web-страницуКнижник Светлана Викторовна учитель информатики МБОУ СОШ №3. г. Кумертау Браузер - программа просмотра web-сайтов и осуществление путешествий по сети Служба WWW (World Wide Web ) – всемирная паутина (распределенная по всему миру информационная система, содержащая миллионы разнообразных документов) использует протокол HTTP (протокол передачи гипертекста). Его основное назначение- обработка гиперссылок и передача документов клиенту. Книжник Светлана Викторовна учитель информатики МБОУ СОШ №3. г. Кумертау Из истории.Первый в мире сайт info.cern.ch появился в 1991 году. Его создатель, Тим Бернерс-Ли, опубликовал на нём описание новой технологии World Wide Web (всемирная паутина), основанной на протоколе передачи данных HTTP, системе адресации URI и языке гипертекстовой разметки HTML. Также на сайте были описаны принципы установки и работы серверов и браузеров. Сайт стал и первым в мире интернет-каталогом, так как позже Тим Бернерс-Ли разместил на нём список ссылок на другие сайты. Тим Бернерс-Ли является «отцом» основополагающих технологий веба — HTTP, URI/URL и HTML, хотя их теоретические основы были заложены ещё раньше.Книжник Светлана Викторовна учитель информатики МБОУ СОШ №3. г. Кумертау Виды сайтовВеб-сервисыИнформационные ресурсыИнтернет представительстваСайты-визиткиКорпоративные сайтыИнтернет-витриныПромо-сайтыТематические сайтыИнтернет-порталыБлогиКаталоги сайтовПоисковые системыПочтовые системыИнтернет-форумыФото-, видео-, аудио-хостингиДоски объявленийСоциальные сети Разработка Web-сайтов2 способа Ручной С использованием конструктораКнижник Светлана Викторовна учитель информатики МБОУ СОШ №3. г. Кумертау ЭТАПЫ СОЗДАНИЯПодготовительныйДизайнWeb-программированиеHTML верстка сайтаРазмещение сайта в сетиРаскрутка и администрирование (поддержка) сайтаКнижник Светлана Викторовна учитель информатики МБОУ СОШ №3. г. Кумертау Создание Web-сайтов реализуется с помощью языка разметки гипертекстовых документов HTML. Код страницы набирается в любом текстовом редакторе например блокнот и оформляется с помощью команд языка HTML. Тестируются html файл с помощью любого браузера. Команды HTML задаются с помощью специальных элементов – тэгов, которые заключается в угловые скобки Существуют два типа тэгов – парные и непарные.Непарные, например - тэг перевода строкиПарные мама , выделение слова полужирным шрифтом Признаком окончания действия парного тэга служит слэш / . Основные тэги для создания Web-страницы:<html></html> - определяет формат документа<head></head> - содержит название страницы и справочную информацию о ней<title></title> - содержит название страницы, которое отображается в верхней строке браузера<body></body> - отображает в браузере содержимое страницы Структура Web-страницы Текст HTML программы Коментарии<html> начало HTML кода <head> начало головной части <title>Первый документ</title> заголовок документа </head> конец головной части <body> начало тела программы <H1> Первый HTML документ </H1> заголовок <HR> горизонтальная линия начало абзаца Кошка не похожа на собаку. А собака не похожа на кошку. именно это сходство и берем за основу. конец абзаца</body> конец тела программы</html> конец HTML кода Сохранение, редактирование Web-страницыНапечатать текст HTML программы в текстовом редакторе Блокнот Созданную Web-страничку необходимо сохранить в виде файла с расширением *.html или *.htmВ процессе создания Web-страницы приходится добавлять новые тэги и просматривать получаемый результат. Для добавления тэгов необходимо открыть файл Web-страницы с помощью Блокнотакомандой вид – просмотр HTML – кода. Например: Главная.html Вид html-страницы в:Блокноте Internet Explorer Форматирование текстаРазбиение текста на абзацы:…Центрирование объектов:<CENTER>… </CENTER>Выравнивание абзацев:, , Цвет, размер: или ; Пример: Запись текста в формате RGB Книжник Светлана Викторовна учитель информатики МБОУ СОШ №3. г. Кумертау ГиперссылкиДля определения гиперссылки используется тег <A>, структура которого имеет следующий вид:<A HREF=“filename” > текст ссылки </A>Пример: <A HREF=“foto.bmp” > фотография </A>Возможно добавление атрибута TARGET со следующими значениями:_top – открытие документа в текущем окне_blank – открытие документа в новом окнеИмя файлаТекст в HTML - документе

Вставка графических изображенийДля вставки изображений используется тег <IMG>.Рассмотрим применение этого тега на примере:<IMG SRC=“foto.jpg” WIDTH=“542” HEIGHT=“407” ALT= “Я”>Где SRC – определяет URL – адрес графического файла WIDTH – ширина, HEIGHT – высота, ALT – альтернативный текст. Изображение так же может быть гиперссылкой:<A HREF=“1.bmp” > <IMG SRC=“1.jpg” WIDTH=“542” HEIGHT=“407” ALT= “Я”></A> Фон страницы Фоновое изображение – это файл с небольшим рисунком, который многократно повторяется, заполняя все окно браузера независимо от его размера Графика, используемая в качестве фоновой, задается в теге <BODY> Пример: <BODY BACKGROUND=“FON.PNG”> -фоновая картинка <BODY BGCOLOR=“ЦВЕТ”> - цвет фона АТРИБУТЫ КАРТИНКИ {E269D01E-BC32-4049-B463-5C60D7B0CCD2}<img src="uzeron_pc.jpg">Без атрибутов - текст по умолчанию находится снизу картинки<img src="uzeron_pc.jpg" align="right">align="right" - картинка справа, текст слева<img src="uzeron_pc.jpg" align="left">align="left" - картинка слева, текст обтекает справа<img src="uzeron_pc.jpg" align="bottom">align="bottom" - как и по умолчанию, текст внизу картинки<img src="uzeron_pc.jpg" align="middle">align="middle" - текст посередине картинки литератураИванова И.А. Информатика. 11 класс: Практикум. –Саратов: Лицей, 2004. http://beluys.com/html_basics/html_page.htmlhttp://baxtop.ru/sozdanie-saita-s-pomoshhyu-html.htmКнижник Светлана Викторовна учитель информатики МБОУ СОШ №3. г. Кумертау