🗊Презентация Структура, різновиди та етапи створення веб-сайтів

Нажмите для полного просмотра!
Структура, різновиди та етапи створення веб-сайтів, слайд №1Структура, різновиди та етапи створення веб-сайтів, слайд №2Структура, різновиди та етапи створення веб-сайтів, слайд №3Структура, різновиди та етапи створення веб-сайтів, слайд №4Структура, різновиди та етапи створення веб-сайтів, слайд №5Структура, різновиди та етапи створення веб-сайтів, слайд №6Структура, різновиди та етапи створення веб-сайтів, слайд №7Структура, різновиди та етапи створення веб-сайтів, слайд №8Структура, різновиди та етапи створення веб-сайтів, слайд №9Структура, різновиди та етапи створення веб-сайтів, слайд №10Структура, різновиди та етапи створення веб-сайтів, слайд №11Структура, різновиди та етапи створення веб-сайтів, слайд №12Структура, різновиди та етапи створення веб-сайтів, слайд №13Структура, різновиди та етапи створення веб-сайтів, слайд №14Структура, різновиди та етапи створення веб-сайтів, слайд №15Структура, різновиди та етапи створення веб-сайтів, слайд №16Структура, різновиди та етапи створення веб-сайтів, слайд №17Структура, різновиди та етапи створення веб-сайтів, слайд №18Структура, різновиди та етапи створення веб-сайтів, слайд №19Структура, різновиди та етапи створення веб-сайтів, слайд №20Структура, різновиди та етапи створення веб-сайтів, слайд №21Структура, різновиди та етапи створення веб-сайтів, слайд №22Структура, різновиди та етапи створення веб-сайтів, слайд №23Структура, різновиди та етапи створення веб-сайтів, слайд №24Структура, різновиди та етапи створення веб-сайтів, слайд №25Структура, різновиди та етапи створення веб-сайтів, слайд №26Структура, різновиди та етапи створення веб-сайтів, слайд №27Структура, різновиди та етапи створення веб-сайтів, слайд №28Структура, різновиди та етапи створення веб-сайтів, слайд №29Структура, різновиди та етапи створення веб-сайтів, слайд №30Структура, різновиди та етапи створення веб-сайтів, слайд №31Структура, різновиди та етапи створення веб-сайтів, слайд №32Структура, різновиди та етапи створення веб-сайтів, слайд №33Структура, різновиди та етапи створення веб-сайтів, слайд №34Структура, різновиди та етапи створення веб-сайтів, слайд №35Структура, різновиди та етапи створення веб-сайтів, слайд №36Структура, різновиди та етапи створення веб-сайтів, слайд №37Структура, різновиди та етапи створення веб-сайтів, слайд №38Структура, різновиди та етапи створення веб-сайтів, слайд №39Структура, різновиди та етапи створення веб-сайтів, слайд №40Структура, різновиди та етапи створення веб-сайтів, слайд №41Структура, різновиди та етапи створення веб-сайтів, слайд №42Структура, різновиди та етапи створення веб-сайтів, слайд №43

Содержание

Вы можете ознакомиться и скачать презентацию на тему Структура, різновиди та етапи створення веб-сайтів. Доклад-сообщение содержит 43 слайдов. Презентации для любого класса можно скачать бесплатно. Если материал и наш сайт презентаций Mypresentation Вам понравились – поделитесь им с друзьями с помощью социальных кнопок и добавьте в закладки в своем браузере.

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


Слайд 1





СТРУКТУРА, РІЗНОВИДИ ТА ЕТАПИ СТВОРЕННЯ                      ВЕБ-САЙТІВ
Описание слайда:
СТРУКТУРА, РІЗНОВИДИ ТА ЕТАПИ СТВОРЕННЯ ВЕБ-САЙТІВ

Слайд 2





Веб-сайт
Сукупність веб-сторінок певної тематики із системою навігації, що дає можливість переміщуватись між ними за допомогою гіперпосилань, які збережені на одному сервері, утворює сайт, або веб-сайт
Описание слайда:
Веб-сайт Сукупність веб-сторінок певної тематики із системою навігації, що дає можливість переміщуватись між ними за допомогою гіперпосилань, які збережені на одному сервері, утворює сайт, або веб-сайт

Слайд 3





Ознаки класифікації сайтів
Описание слайда:
Ознаки класифікації сайтів

Слайд 4





Доступність сервісів
Описание слайда:
Доступність сервісів

Слайд 5





Природа вмісту сайту
Описание слайда:
Природа вмісту сайту

Слайд 6





Способи взаємодії користувача сайтом
Описание слайда:
Способи взаємодії користувача сайтом

Слайд 7





Фізичне розміщення сайтів
Описание слайда:
Фізичне розміщення сайтів

Слайд 8





За схемою подання вмісту
Описание слайда:
За схемою подання вмісту

Слайд 9


Структура, різновиди та етапи створення веб-сайтів, слайд №9
Описание слайда:

Слайд 10





Сайти можна також поділити на:
Описание слайда:
Сайти можна також поділити на:

Слайд 11





Структура сайту та її складові
Описание слайда:
Структура сайту та її складові

Слайд 12





Структура сайту
Описание слайда:
Структура сайту

Слайд 13





Внутрішня структура сайту
Описание слайда:
Внутрішня структура сайту

Слайд 14





Банер – невеличке рекламне зображення, що розміщується на одній сторінці й посилається на іншу
Описание слайда:
Банер – невеличке рекламне зображення, що розміщується на одній сторінці й посилається на іншу

Слайд 15





Навігація по сайту
Користувач у будь-який час має знати відповіді на такі запитання:
Де він знаходиться?
Куди можна перейти?
Як туди дістатися?
Як повернутися назад?
Описание слайда:
Навігація по сайту Користувач у будь-який час має знати відповіді на такі запитання: Де він знаходиться? Куди можна перейти? Як туди дістатися? Як повернутися назад?

Слайд 16





Розрізняють такі види навігації:
Описание слайда:
Розрізняють такі види навігації:

Слайд 17





Заставка
Замість головної сторінки сайту може з'явитися заставка – велике фото із звуковим супроводом або відеороликом. Такі сторінки створюють, щоб привернути увагу користувача.
Описание слайда:
Заставка Замість головної сторінки сайту може з'явитися заставка – велике фото із звуковим супроводом або відеороликом. Такі сторінки створюють, щоб привернути увагу користувача.

Слайд 18





Головна сторінка сайту
Головна сторінка сайту має задовольняти правилу “3 по 3”, тобто 3 абзаци по 3 речення про тематику, зміст, авторів та призначення сайту.
Описание слайда:
Головна сторінка сайту Головна сторінка сайту має задовольняти правилу “3 по 3”, тобто 3 абзаци по 3 речення про тематику, зміст, авторів та призначення сайту.

Слайд 19





Сайт має відповідати таким вимогам:
Описание слайда:
Сайт має відповідати таким вимогам:

Слайд 20





Поняття дизайну 
Залежно від засобу створення сайти можуть мати однакові елементи структури: логотип, графічний декор, назва сайта, фірми чи сторінки, гіперпосилання чи панель навігації сайта, дані, які наповнюють вміст сторінки сайта, контактні дані тощо. 
Більшість сайтів побудовані з використанням адаптованого дизайну компонування веб-сторінок, тобто такого, що налаштовується до зміни розмірів екрана.
Описание слайда:
Поняття дизайну Залежно від засобу створення сайти можуть мати однакові елементи структури: логотип, графічний декор, назва сайта, фірми чи сторінки, гіперпосилання чи панель навігації сайта, дані, які наповнюють вміст сторінки сайта, контактні дані тощо. Більшість сайтів побудовані з використанням адаптованого дизайну компонування веб-сторінок, тобто такого, що налаштовується до зміни розмірів екрана.

Слайд 21





Веб-сторінка
Веб-сторінка – документ або інформаційний ресурс, доступ до якого здійснюється за допомогою веб-браузера. 
Веб-сторінки створюються  мовою HTML чи XHTML та можуть містити гіперпосилання для швидкого переходу на інші сторінки.
Описание слайда:
Веб-сторінка Веб-сторінка – документ або інформаційний ресурс, доступ до якого здійснюється за допомогою веб-браузера. Веб-сторінки створюються мовою HTML чи XHTML та можуть містити гіперпосилання для швидкого переходу на інші сторінки.

Слайд 22





Контент
Відомості на веб-сторінці можуть подаватися у різних формах: текст, статичні та анімовані графічні зображення, аудіо, відео тощо.
Інформаційний вміст веб-сторінки називають контентом
Описание слайда:
Контент Відомості на веб-сторінці можуть подаватися у різних формах: текст, статичні та анімовані графічні зображення, аудіо, відео тощо. Інформаційний вміст веб-сторінки називають контентом

Слайд 23





Типи  веб-сторінок
Описание слайда:
Типи веб-сторінок

Слайд 24





Статичні та інтерактивні веб-сторінки
Веб-сторінки статичних веб-сайтів створюються за допомогою мови HTML. 
Основою мови є теги – команди, що вказують на правила, за якими форматуються документи.
При створенні інтерактивних веб-сторінок використовують спеціальні скрипти на мовах сценаріїв JavaScript та VBScript, які можуть використовуватися за наявності певних дій користувача під час завантаження веб-сторінки. 
Для забезпечення інтерактивності веб-сторінки можна використовувати флеш-фрагменти або Flash-ролики.
Описание слайда:
Статичні та інтерактивні веб-сторінки Веб-сторінки статичних веб-сайтів створюються за допомогою мови HTML. Основою мови є теги – команди, що вказують на правила, за якими форматуються документи. При створенні інтерактивних веб-сторінок використовують спеціальні скрипти на мовах сценаріїв JavaScript та VBScript, які можуть використовуватися за наявності певних дій користувача під час завантаження веб-сторінки. Для забезпечення інтерактивності веб-сторінки можна використовувати флеш-фрагменти або Flash-ролики.

Слайд 25





Форми
Форма – частина веб-сторінки, до якої користувач може записувати свої відомості та надсилати їх на сервер, де розміщується веб-сторінка. Такі запити опрацьовуються на сервері, на якому генеруються відповідні вихідні дані.
Форми містять поля для заповнення, списки чи перемикачі для вибору одного чи кількох елементів.
Описание слайда:
Форми Форма – частина веб-сторінки, до якої користувач може записувати свої відомості та надсилати їх на сервер, де розміщується веб-сторінка. Такі запити опрацьовуються на сервері, на якому генеруються відповідні вихідні дані. Форми містять поля для заповнення, списки чи перемикачі для вибору одного чи кількох елементів.

Слайд 26





Двигунець сайту – система управління сайтом
CMS – система управління сайтом. Засоби розробки сайтів забезпечують відокремлення змістової частини (контенту) від дизайну (шаблону веб-сторінки), що дозволяє змінювати зміст сайту, не змінюючи  дизайн, або змінювати шаблон сайту, не змінюючи вміст його веб-сторінки. 
Такі двигунці мають багато різних модулів: форуми, гостьові книги, поштові розсилки, контакти, опитувальники, форми реєстрації, форми пошуку, систему обміну повідомленнями між користувачами та інші компоненти, які перетворюють сайт з інформаційного засобу на комунікаційний.
Описание слайда:
Двигунець сайту – система управління сайтом CMS – система управління сайтом. Засоби розробки сайтів забезпечують відокремлення змістової частини (контенту) від дизайну (шаблону веб-сторінки), що дозволяє змінювати зміст сайту, не змінюючи дизайн, або змінювати шаблон сайту, не змінюючи вміст його веб-сторінки. Такі двигунці мають багато різних модулів: форуми, гостьові книги, поштові розсилки, контакти, опитувальники, форми реєстрації, форми пошуку, систему обміну повідомленнями між користувачами та інші компоненти, які перетворюють сайт з інформаційного засобу на комунікаційний.

Слайд 27





Популярні системи управління сайтами
Описание слайда:
Популярні системи управління сайтами

Слайд 28





Домашня сторінка
Описание слайда:
Домашня сторінка

Слайд 29





Етапи створення веб-сайту
Описание слайда:
Етапи створення веб-сайту

Слайд 30





Пошукова оптимізація 
SEO – пошукова оптимізація, комплекс заходів для підняття позицій сайта в результатах пошуку пошукових систем за певними запитами користувачів. SMO – оптимізація сайта під соціальні мережі та блоги.
Описание слайда:
Пошукова оптимізація SEO – пошукова оптимізація, комплекс заходів для підняття позицій сайта в результатах пошуку пошукових систем за певними запитами користувачів. SMO – оптимізація сайта під соціальні мережі та блоги.

Слайд 31





Дизайн веб-сторінок
Дизайн веб – це робота, яка спирається на знання основних понять дизайну (понять точки, лінії, текстури, фактури, форми, кольору, пропорції, композиції, симетрії, асиметрії, рівноваги, динаміки, ритму, гармонії, контрасту, колориту, перспективи, центру мас), використання правил ергономіки та решти складових веб-дизайну
Описание слайда:
Дизайн веб-сторінок Дизайн веб – це робота, яка спирається на знання основних понять дизайну (понять точки, лінії, текстури, фактури, форми, кольору, пропорції, композиції, симетрії, асиметрії, рівноваги, динаміки, ритму, гармонії, контрасту, колориту, перспективи, центру мас), використання правил ергономіки та решти складових веб-дизайну

Слайд 32





Основні складові веб-дизайну
Описание слайда:
Основні складові веб-дизайну

Слайд 33





Поради веб-дизайнеру
Недоцільно використовувати великі анімовані зображення, на головній сторінці, рядки, що розбігаються у різні сторони, миготливі елементи;
Не слід використовувати широкі зображення;
Не варто розміщувати на головній сторінці велику кількість кнопок, емблем каталогів, посилань;
Недоцільно розміщувати на сторінці довгі тексти (до 2-3 екранів);
Не слід робити кольорову гаму занадто яскравою;
Наявність помилок псують враження про важливість сайта;
Правило “п’ятірки”: Не більше 5 шрифтів на сторінці;
Не використовувати напис Сторінка в розробці.
Описание слайда:
Поради веб-дизайнеру Недоцільно використовувати великі анімовані зображення, на головній сторінці, рядки, що розбігаються у різні сторони, миготливі елементи; Не слід використовувати широкі зображення; Не варто розміщувати на головній сторінці велику кількість кнопок, емблем каталогів, посилань; Недоцільно розміщувати на сторінці довгі тексти (до 2-3 екранів); Не слід робити кольорову гаму занадто яскравою; Наявність помилок псують враження про важливість сайта; Правило “п’ятірки”: Не більше 5 шрифтів на сторінці; Не використовувати напис Сторінка в розробці.

Слайд 34





Програми створення веб-сторінок
Описание слайда:
Програми створення веб-сторінок

Слайд 35





Створення веб-сторінки в мережі
Для створення веб-сторінки у мережі Інтернет, можна скористатися одним із сайтів, які надають відповідні засоби та інструменти для створення сайту та послугу безкоштовного хостингу.
Для цього потрібно спочатку пройти процедуру реєстрації на обраному сайті, а потім слідувати відповідним вказівкам.
Описание слайда:
Створення веб-сторінки в мережі Для створення веб-сторінки у мережі Інтернет, можна скористатися одним із сайтів, які надають відповідні засоби та інструменти для створення сайту та послугу безкоштовного хостингу. Для цього потрібно спочатку пройти процедуру реєстрації на обраному сайті, а потім слідувати відповідним вказівкам.

Слайд 36





Переваги та недоліки різного компонування сторінок сайту 
Сторінки умовно поділені на області, кожна з яких має своє призначення: 
Верхня частина сторінки містить логотип, емблему, назва фірми чи інших важливих відомостей; 
Центральна частина – область розміщення тексту, 
Нижня частина сторінки використовується для розміщення контактів чи даних, менш важливих,ніж ті, що розміщені у верхній частині;
Лівий та правий контейнери використовуються для форм, гіперпосилань на панелі навігації сайта (одна з них може бути відсутньою).
Описание слайда:
Переваги та недоліки різного компонування сторінок сайту Сторінки умовно поділені на області, кожна з яких має своє призначення: Верхня частина сторінки містить логотип, емблему, назва фірми чи інших важливих відомостей; Центральна частина – область розміщення тексту, Нижня частина сторінки використовується для розміщення контактів чи даних, менш важливих,ніж ті, що розміщені у верхній частині; Лівий та правий контейнери використовуються для форм, гіперпосилань на панелі навігації сайта (одна з них може бути відсутньою).

Слайд 37





Приклади шаблонів
Описание слайда:
Приклади шаблонів

Слайд 38





Код розмітки веб-сторінки  мовою HTML
Описание слайда:
Код розмітки веб-сторінки мовою HTML

Слайд 39





Поняття тегу
HTML-код, набір тегів, який вказує браузеру, як відображатиметься елемент сторінки.
Назва кожного тега – це одна або декілька літер, взятих у кутові дужки (<,>), яким відповідають певні англійські слова, що пояснюють їх призначення.
Тег записують так: 
<Тег>…текст… </Тег>
Відкриваючий тег, вміст контейнера, закриваючий тег
Теги існують одинарні і парні. Один тег може мати кілька параметрів – атрибутів. Закриваючий тег не містить жодних параметрів, лише показує на місце закінчення дії контейнера. У відкриваючому тегу вказують всі необхідні параметри.
Описание слайда:
Поняття тегу HTML-код, набір тегів, який вказує браузеру, як відображатиметься елемент сторінки. Назва кожного тега – це одна або декілька літер, взятих у кутові дужки (<,>), яким відповідають певні англійські слова, що пояснюють їх призначення. Тег записують так: <Тег>…текст… </Тег> Відкриваючий тег, вміст контейнера, закриваючий тег Теги існують одинарні і парні. Один тег може мати кілька параметрів – атрибутів. Закриваючий тег не містить жодних параметрів, лише показує на місце закінчення дії контейнера. У відкриваючому тегу вказують всі необхідні параметри.

Слайд 40





Правила запису параметрів тегу
Після назви тегу після пропуску зазначають ім'я параметра (наприклад, Align – ім'я параметра, який вказує на спосіб вирівнювання тексту), далі вказують “=“ й у лапках записують значення параметра (наприклад, Align=“center”). За необхідності далі вказують інші параметри через пропуск. Після останнього параметра ставлять символ “>”.
Теги можуть бути вкладеними, тобто один контейнер може перебувати  всередині іншого.
Описание слайда:
Правила запису параметрів тегу Після назви тегу після пропуску зазначають ім'я параметра (наприклад, Align – ім'я параметра, який вказує на спосіб вирівнювання тексту), далі вказують “=“ й у лапках записують значення параметра (наприклад, Align=“center”). За необхідності далі вказують інші параметри через пропуск. Після останнього параметра ставлять символ “>”. Теги можуть бути вкладеними, тобто один контейнер може перебувати всередині іншого.

Слайд 41





Структура html-файлу
<html>
<head> 
<title> веб-сторінка</title>
</head>
<body>
<hr>
<h1> <b>Вітаю ВАС на веб-сторінці </b></h1>
<hr>
<p>Проста сторінка створена за допомогою простих тегів</p>
</body>
</html>
Описание слайда:
Структура html-файлу <html> <head> <title> веб-сторінка</title> </head> <body> <hr> <h1> <b>Вітаю ВАС на веб-сторінці </b></h1> <hr> <p>Проста сторінка створена за допомогою простих тегів</p> </body> </html>

Слайд 42





Графіка на веб-сторінці
Під час створення веб-сторінок можна вставляти до них різні графічні зображення: файли форматів GIF, JPG, PNG.
Cторінки веб-сайтів можуть містити і мультимедійні обєкти. Аудіо- і відеофайли можуть відображатися  безпосередньо у вікні браузера.
Описание слайда:
Графіка на веб-сторінці Під час створення веб-сторінок можна вставляти до них різні графічні зображення: файли форматів GIF, JPG, PNG. Cторінки веб-сайтів можуть містити і мультимедійні обєкти. Аудіо- і відеофайли можуть відображатися безпосередньо у вікні браузера.

Слайд 43





Технології  відтворення  мультимедіа
Приймання потокових мультимедійних даних має кілька переваг порівняно із звичайним завантаженням файлів із веб-сервера. У разі приймання даних у потоковому режимі, їх фрагмент відтворюється відразу після його отримання. У потоковому передаванні даних не діють обмеження на довжину файла, що передається.
Описание слайда:
Технології відтворення мультимедіа Приймання потокових мультимедійних даних має кілька переваг порівняно із звичайним завантаженням файлів із веб-сервера. У разі приймання даних у потоковому режимі, їх фрагмент відтворюється відразу після його отримання. У потоковому передаванні даних не діють обмеження на довжину файла, що передається.



Похожие презентации
Mypresentation.ru
Загрузить презентацию