Технологии создания сайтов. Язык HTML, Java Script презентация

Содержание

Слайд 1Лекция №6. Технологии создания сайтов. Язык HTML, Java Script
© Vizer

Julia Jurievna

Слайд 2План лекции:
Сайты. Основные понятия. История.
Этапы Веб-разработки. Язык HTML.
Веб-программирование.
Облачные платформы для создания

сайтов

Слайд 3Сайт
Сайт - совокупность логически связанных между собой веб-страниц; также место расположения

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


Слайд 4Первый Веб-сайт
Первый в мире сайт info.cern.ch появился 20 декабря 1990 года.

Его создатель, Тим Бернерс-Ли, опубликовал на нём описание новой технологии World Wide Web, основанной на протоколе передачи данных HTTP, системе адресации URI и языке гипертекстовой разметки HTML

Слайд 5Страницы сайтов
Страницы сайтов – это набор текстовых файлов, размеченных на языке

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

Слайд 6Язык HTML
Язык HTML позволяет форматировать текст, различать в нём функциональные элементы,

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

Слайд 7Основные понятия сайтов
Веб-сервер
Хостинг

Слайд 8Основные понятия сайтов
Виртуальный хостинг
Зеркало

Слайд 9Классификация сайтов по технологии отображения

Слайд 102. Основные этапы Веб-разработки
Веб-разработка – процесс создания веб-сайта или веб-приложения

Слайд 11Основные этапы веб-разработки

Слайд 12Основные этапы веб-разработки

Слайд 13Основные этапы веб-разработки

Слайд 14Основные этапы веб-разработки

Слайд 15Язык HTML
Непарные тэги
Непарный тэг говорит о том, что в этом месте

надо вставить какой-то элемент, например, рисунок или разделительную линию. Например, тэг
означает переход на новую строку в тексте (без абзацного отступа).

Парные тэги

Парный тэг состоит из двух частей – открывающего и закрывающего тэгов. Закрывающий тэг имеет то же самое имя, что и открывающий, но перед именем ставится знак / (слэш). Действие парного тэга распространяется на всё, что находится между ними. Например, парный тэг:


...

Слайд 16Простейшая веб-сраница

Слайд 17Цвет в языке HTML

Слайд 18Цвет в языке HTML
По имени
Green
Black
White
Red
Yellow
Blue

Шестнадцатеричный код
Цвет записывается в виде трех

пар шестнадцатеричных цифр, перед которыми ставится символ #.
Каждая пара цифр может принимать значения в интервале от 00 до FF (или от 0 до 255 в десятичной записи).

Слайд 19Цвет в языке HTML
Запись цвета
Первая пара обозначает яркость красного (R

— red), вторая и третья - яркости зеленого (G — green) и синего (B — blue) в этом цвете. Всего такая форма записи позволяет задать более 16 миллионов разных цветов (режим True Color — истинный цвет)

Коды базовых цветов модели RGB

#FFFFFF — белый
#000000 — черный
#FF0000 — красный
#00FF00 — зеленый
#0000FF — синий

Слайд 20Тэги для определения свойств текста
Body
Тэг позволяет задать общие свойства для

всей страницы. Например, цвет текста (параметр TEXT) и цвет фона (параметр BGCOLOR). Например, тэг

...


Слайд 21Тэги для определения свойств текста
Тэг Font
имеет три основных параметра:
COLOR — цвет

текста
FACE — начертание (название) шрифта
SIZE — размер шрифта (принимает целые значения от 1 до 7)
Например, тэг:

...

устанавливает для текста внутри области действия тэга шрифт Courier желтого цвета размера 2.

Слайд 22Тэги оформления текста
... (от английского bold), а также — это

жирный текст
... (от английского italic), а также — это курсив
... (от английского strike out) — это зачеркнутый текст
... (от английского underline) — это подчеркнутый текст

Слайд 23Тэги оформления абзацев
парный тэг (от английского paragraph — абзац), позволяющий

ограничить абзац.
У тэга

есть параметр ALIGN, который может принимать значения:
LEFT — выровнять по левой границе
RIGHT — выровнять по правой границе
CENTER — выровнять по центру
JUSTIFY — выровнять по ширине (левая и правая границы).

Слайд 24Тэги для гиперссылок
Ссылка устанавливается с помощью парного тэга  (от английского anchor - якорь). Тэг

имеет параметр HREF, который указывает адрес документа. Ссылкой является вся информация, расположенная между открывающим <А> и закрывающим тэгами.

Слайд 25Тэги для списков
Нумерованные списки. Каждый элемент такого списка имеет номер. Нумерация

может быть числовой или буквенной. Список ограничен парным тэгом
    (от английского ordered list — упорядоченный список).
    Каждый элемент списка начинается с непарного тэга
  1. , после которого можно располагать текст, рисунки, таблицы и т.п. Список заканчивается закрывающим тэгом
.



  1. Вася
  2. Петя
  3. Коля


Слайд 26Тэги для рисунков
На больших сайтах может использоваться очень много рисунков. Чтобы

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


Слайд 27Тэги для таблиц



Таблица из одной строки
из

трех столбцов
без указания ширины таблицы и ячеек.




Слайд 28Тэги для таблиц
Таблица начинается тэгом (от английского table — таблица)

и заканчивается парным ему тэгом . Параметр BORDER тэга обозначает ширину рамки таблицы.
Содержимое таблицы описывается по строкам сверху вниз (начиная с верхней строки). Каждая строка начинается тэгом (от английского table row – строка таблицы) и заканчивается парным ему тэгом .

Ячейки в строке описываются слева направо. Каждая ячейка начинается тэгом

. В ячейку можно помещать все, что угодно, в том числе текст, рисунки и даже другие таблицы (вложенные таблицы).


Слайд 293. Веб-программирование
Веб-программирование – раздел программирования, ориентированный на разработку веб-приложений (программ, обеспечивающих

функционирование динамических сайтов Всемирной паутины).

Слайд 30Веб-программирование

Слайд 31Серверные языки программирования. Расширения файлов

Слайд 32Скриптовые языки программирования
PHP (Hypertext Preprocessor) – скриптовый язык общего назначения, интенсивно

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

Слайд 33Perl
Perl – высокоуровневый интерпретируемый динамический язык программирования общего назначения, созданный Ларри

Уоллом, лингвистом по образованию. Название языка представляет собой аббревиатуру, которая расшифровывается как Practical Extraction and Report Language — «практический язык для извлечения данных и составления отчётов». Символом языка Perl является верблюд.

Слайд 34Python
Python – высокоуровневый язык программирования общего назначения, ориентированный на повышение производительности

разработчика и читаемости кода. Python поддерживает несколько парадигм программирования, в том числе структурное, объектно-ориентированное, функциональное, императивное и аспектно-ориентированное. Код в Python организовывается в функции и классы, которые могут объединяться в модули (они в свою очередь могут быть объединены в пакеты).

Слайд 35Языки программирования .NET
Языки программирования .NET (Языки с поддержкой CLI или

CLI-языки) – компьютерные языки программирования, используемые для создания библиотек и программ, удовлетворяющих требованиям Common Language Infrastructure

Слайд 36Облачные платформы для создания сайтов

Слайд 37Wix.com

Слайд 38Ключевые возможности Wix

Слайд 39Ключевые возможности Wix

Слайд 40Ключевые возможности Wix

Слайд 41Сайты Google

Слайд 42Google сайты

Слайд 44Ключевые возможности uCos

Слайд 45Ключевые возможности uCos

Слайд 46Ключевые возможности uCos

Слайд 47Конструктор сайтов uCoz

Похожие презентации

Трикотажные полотна 897
Александра Гончарова Руководитель группы по работе с клиентами Интернет-магазин: привлечь и удержать клиента. 218
Вебинар Особенности преподавания русского языка в начальной школе в условиях реализации Федерального государственного образовательного стандарта начального общего образования 281
Городской транспортный комплекс. Линейные обустройства транспортной сети. (Тема 8.Лекция 3) 325
Осетровая рыба 635
Интенсивности полос ИК поглощения адсорбированных молекул – новый спектральный критерий их активации в гетерогеных кислотно-каталитических реакциях 198

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

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

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

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

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

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

Яндекс.Метрика
(от английского table data — данные таблицы) и заканчивается парным ему тэгом