Презентация презентация

Содержание

Содержание урока Как работает интернет Что такое сайт Что представляет собой веб-страница Виды сайтов Процесс разработки сайта Что такое гипертекст, теги и атрибуты Подготовка рабочего места Простой пример HTML странички Пример

Слайд 1Урок 1
Знакомство с интернетом.


Слайд 2Содержание урока
Как работает интернет
Что такое сайт
Что представляет собой веб-страница
Виды сайтов
Процесс разработки

сайта
Что такое гипертекст, теги и атрибуты
Подготовка рабочего места
Простой пример HTML странички
Пример сложной веб-страницы
Горячие клавиши для перемещения по документам

Слайд 3Что такое интернет?

Интернет – это множество компьютеров по всему миру, объединенными

в единую сеть, которые постоянно обмениваются какой-либо информацией.

Слайд 4Каждый компьютер в сети имеет свой уникальный ip-адрес
Пример: 192.168.100.99


Слайд 5Доменные имена
ru, com, net, рф – 1 уровень
prog-school.ru, google.com – 2

уровень proglive.tiu.ru – 3 уровень

Слайд 6Что такое сайт?
Сайт – это совокупность электронных документов(веб-страниц), объединенных под одним

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

Слайд 7Браузеры





Internet Explorer (Trident)
Mozila Firefox (Gecko) Opera (Presto)
Google Chrome (Webkit) Safari (Webkit)


Слайд 8Устройство сайта
Шапка
(header)
Основное содержимое
(content)
















Меню (вертикальное и/или горизонтальное)
Рекламные баннеры
Дополнительные модули
(голосование, опрос)


Нижний колонтитул
( footer)























Слайд 9Виды сайтов


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

виде, в котором хранится на сервере.
Динамические – содержимое генерируется при помощи серверных языков программирования.

Слайд 11По схеме представления информации
Коммерческие – сайты компаний, интернет- магазины и т.д.
Информационные

– доносят до пользователя какую-либо информацию.
Веб-сервисы (порталы) – поисковые системы, электронная почта, форумы, социальные сети.

Слайд 12По размеру
Фиксированной ширины «Резиновые»



Слайд 13Основные протоколы
HTTP (Hypertext Transfer Protocol )

HTTPS (Hypertext Transfer Protocol Secure)

FTP (File

Transfer Protocol)

Слайд 14Что происходит, когда мы набираем адрес сайта?


Слайд 15Схема HTTP-запроса страницы



сервер
клиент









sql запрос


База данных






данные


Слайд 16Процесс разработки сайта

















Заказчик

Идея
Менеджер проекта
Дизайнер
Тех. задание
Тех. задание






















Программист
Верстальщик
Копирайтер
S E O










php и mysql,

javascript

html и css, javascript

photoshop

Шаблоны

Макет


Слайд 17Что такое гипертекст?
Гипертекст в HTML —документы (веб- страницы), связанные между собой

ссылками.

Слайд 18Теги HTML документа.
Предназначены для управления конструкциями разметки:

Заголовки
Абзацы
Картинки
Таблицы
Списки


Слайд 19Виды тегов.


Слайд 20Парные теги


Пример:
Какой прекрасный день


Слайд 21Одиночные теги


Пример:




Слайд 22Атрибуты тегов
Определяют какие либо дополнительные, уточняющие параметры того или иного тега.

атрибут2=“значение_атрибута2”>



Слайд 23Примеры атрибутов
Контакты


Слайд 24Оформление тегов и атрибутов
Название тега и атрибута - строчными буквами.
… …
Значение атрибута

– строчными буквами и в двойных кавычках.




Парный тег – обязательно закрыт.



Слайд 25Создание простой странички


Слайд 26Инструменты
Текстовый редактор – Notepad++;
Браузер – Internet Explorer;
Графический редактор (photoshop, gimp)



Слайд 27Расширение HTML-страницы
.html
.htm


Слайд 28Простейшая веб-страничка
Привет мир!
Это моя первая веб-страница.


Слайд 29Результат




Слайд 30Горячие клавиши
Alt + tab – перемещение между открытыми окнами.
Ctrl + z

– отменить действие.
Ctrl + y – вернуть действие.
Ctrl + x – вырезать.
Ctrl + c – копировать.
Ctrl + v – вставить.
Ctrl + s – сохранить.
Ctrl + a – выделить все.
Ctrl + tab – перемещение м/у открытыми вкладками.
F5 – обновить страницу.
F2 – переименовать.
Shift + Tab – вернуть одну табуляцию назад.
Shift + home – выделить с указанного места до начала строчки.
Shift + end – выделить с указанного места до конца строчки.
Shift + стрелка – при зажатом shift выделять в указанную стрелками сторону.

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

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

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

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

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


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

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