Презентация «Разработка сайтов»
Смотреть слайды в полном размере 
Вы можете ознакомиться с презентацией онлайн, просмотреть текст и слайды к ней, а также, в случае, если она вам подходит - скачать файл для редактирования или печати. Документ содержит 25 слайдов и доступен в формате ppt. Размер файла: 187.50 KB
Pic.1
Розробка сайтів Макет сторінок Лекція №2
Pic.2
Макет сторінки Макет дозволяє створити цілісну картину елементів сторінки, єдність та відчуття неподільного образного ряду. Макет впорядковує структуру сторінки, робить її зручною та зрозумілою …
Pic.3
Завдання макетування Веб-сторінка фактично розглядається як набір прямокутних блоків, які складаються в певному порядку. Завдання макетування полягає у гармонійному розташуванні різноманітних …
Pic.4
За сталими традиціями інформація розподіляється наступним чином: За сталими традиціями інформація розподіляється наступним чином: В верхній частині сторінки (шапка, хедер, header) містяться: Логотип. …
Pic.5
Модульна сітка Модульна сітка є набором невидимих ліній, вздовж яких розташовуються елементи сторінки. Це полегшує розміщення даних в документі, забезпечує візуальний зв'язок між окремими …
Pic.6
Типова схема одноколонної модульної сітки. Як правило, спостерігається чотири основні блоки: Заголовок сторінки. Набір посилань на інші сторінки сайту (навігація). Власне сам текст. Контактна …
Pic.7
Двохколонна структура Це один з найпоширеніших варіантів при використанні на сайтах. За такою модульною сіткою, зазвичай, лишаються незмінними верхній та нижній блоки сторінки, а основний (середній) …
Pic.8
Типи структури
Pic.9
Позиціювання сторінки у вікні браузера Веб-сайт є електронним аналогом друкованого видання. Звісно, що інформація в любому складному документі має бути впорядкованою, і тут випливає основна …
Pic.10
Фіксований дизайн «Фіксованим» називають дизайн, коли ширина інформативної частини сторінки є визначеної величини в пікселах і не залежить від роздільної здатності монітора. Найчастіше при розробці …
Pic.11
Еластичний дизайн «Еластичним» називають дизайн, коли сторінка розгортається на весь екран по ширині незалежно від встановленої роздільної здатності монітора. Наприклад, і при роздільній здатності …
Pic.12
Комбінований дизайн Існує так званий «псевдо-еластичний» дизайн: ширина сторінки є фіксованою, але візуально сторінка як би заповнює весь екран. Такий ефект досягається за допомогою спеціальних …
Pic.13
Меню (навігаційні панелі) Меню є основним функціональним елементом сайту, що складається з набору посилань на різні сторінки. Кожне таке посилання називається пунктом меню і призначене для переходу …
Pic.14
Меню(навігаційна панель) Як правило, має ієрархічну структуру і буває 3-х видів: Випадне меню. Автоматично випадає при наведенні вказівника мишки на пункт меню. Меню, що розкривається. При натисненні …
Pic.15
Меню ієрархії документів Досить зручним для відвідувачів сайту є зазначення місця сторінки в структурі сайту. Це можна реалізувати рядком у верхній частині сторінки приблизно такого вигляду: Головна …
Pic.16
Інтерактивність гіперпосилань Часто до гіперпосилань застосовують елементи інтерактивності. Вони відображають реакцію гіперпосилання на різні події, найчастіше на наведення користувачем вказівника …
Pic.17
Піраміда Маслоу
Pic.18
Піраміда Веб-дизайна
Pic.19
Структура веб-сторінки Один HTML-файл І багато-багато ресурсних файлів Таблиці стилів Клієнтські скрипти Фонові картинки Зображення на сторінці Мультимедійні файли
Pic.20
Процес завантаження сторінки Передзавантаження Білий екран в браузері користувача Інтерактивне завантаження JavaScript-файли Повне завантаження Картинки і мультимедіа Пост-завантаження Після події …
Pic.21
Після основного завантаження «Ненав'язливий» JavaScript JavaScript – це розширення, а не основний функціонал Знаходимо DOM-елементи і забезпечуємо їх взаємодію з користувачем Модульне …
Pic.22
Основні задачі Зменшення часу передзавантаження Максимально швидко показати користувачеві попередню картинку Прискорення основного завантаження Розпаралелити потік завантаження Забезпечити комфортну …
Pic.23
Основні методи Паралельне завантаження об'єктів Зменшення часу чекання відповіді Оптимізація CSS Оптимальна структура стильових правил Оптимізація JavaScript Усунення дублювання в клієнтських …
Pic.24
Обратна сумісність
Pic.25
Поради з розробки ефективного дизайну: Відвідувачі спочатку дивляться на ліву верхню частину сторінки, а згодом тоді переводять погляд нижче і правіше. Інтерфейс більшості програм дотримується цього …
Если вам понравился сайт и размещенные на нем материалы, пожалуйста, не забывайте поделиться этой страничкой в социальных сетях и с друзьями! Спасибо!
