Подякувати Студентському архіву довільною сумою
Admin
26.02.2023 12:38
Дякуємо, що користуєтесь нашим архівом!
Розробка анімаційних елементів сайту
Інформація про навчальний заклад
ВУЗ:
Вінницькій національний технічний університет
Інститут:
Не вказано
Факультет:
Комп'ютерна інженерія
Кафедра:
Не вказано
Інформація про роботу
Рік:
2016
Тип роботи:
Лабораторна робота
Предмет:
Інформаційні технології
Частина тексту файла (без зображень, графіків і формул):
Міністерство освіти і науки України
Вінницький національний технічний університет
Факультет інформаційних технологій та комп’ютерної інженерії
Кафедра комп’ютерних наук
Лабораторна робота №6
Тема: «Розробка анімаційних елементів сайту»
Вінниця 2016
Мета: розробка анімаційних елементів сайту.
Теоретичні відомості
Кожен власник сайту хоче мати яскравий, що запам'ятовується веб-ресурс, здатний порадувати відвідувача функціональними і візуальними достоїнствами. І тому сучасні сайтовладельцев віддають перевагу сайтам, створеним з використанням анімованих елементів, здатних порадувати відвідувача красивим, інтерактивним оформленням і схилити до повторного відвідування сайту.
Для яких цілей на сайті використовується анімація?
В першу чергу - для залучення уваги відвідувача до певних місць на сторінці сайту. У більшості подібних випадків, анімацію використовують для залучення уваги до комерційно значущих модулів і блокам ресурсу.
По друге - для додання ресурсу більшої динаміки. Найчастіше анімацію на сайті використовують що б "оживити" статичний сайт.
По-третє - для представлення інформації в компактному вигляді. Зокрема використання динамічних flash-елементів, таких як інтерактивна галерея, здатне заощадити не мало місця на сторінці.
І по-четверте - для вирішення індивідуальних технічних і дизайнерських завдань.
Найбільш поширеними технологіями web-анімації є використання графічних зображень у форматі .gif а також елементів flash-анімації.
GIF-АНІМАЦІЯ НА САЙТІ
Gif-анімація є найбільш простим, в плані вимогливості, видом web-анімації, так як для відображення графічних елементів в форматі .gif браузеру не потрібно довантажувати сторонні плагіни і розширення. По суті gif-анімація на сайті - це впровадження в дизайн сайту графічних елементів з послідовно змінюються картинками, кожен з яких має свій часовий інтервал. За рахунок використання в gif-ролику оптимізованих для веб зображень, він має порівняно невеликий розмір і практично не впливає на "вагу" сторінки при завантаженні сайту. Крім того використання на сайті анімованих .gifов не вимагає постійного зв'язку сайту з сервером, так як файли анімації завантажуються на сторінку один раз.
Основним недоліком використання формату .gif як web-анімації є повна відсутність інтерактивності і порівняно невисокий рівень якості анімаційних роликів. На відміну від технології flash, gif-анімація не дозволяє створювати реалістичні ролики з "гладкими" інтерактивними ефектами.
FLASH-АНІМАЦІЯ НА САЙТІ
Технологія flash на сьогоднішній день є однією з найбільш використовуваних для розробки повноцінних ресурсів і спеціальних ефектів для сайтів.
Використання flash-анімації на сайті незамінне в тих випадках, коли зовнішній вигляд сайту стоїть на першому місці, і основною його метою є привернення уваги та створення позитивного стильового образу. На сайтах, створених з використанням технології flash, основний акцент зроблено саме на візуальне сприйняття ресурсу користувачем, а вже в другу чергу на його функціональні можливості.
Але для того, що б ваш сайт мав яскравий, динамічний вигляд, зовсім не обов'язково створювати повноцінний flash-сайт, достатньо обмежиться лише вставкою окремих flash-елементів, що становлять лише частина в оформленні сторінок ресурсу. Даний підхід дозволяє перетворити сайт в інтерактивний, динамічний інтерфейс зі збереженням його функціональних можливостей. Крім усього іншого, даний підхід при розробці flash-сайтів дозволять розробляти ресурси з необмеженими можливостями в плані адміністрування, в той час як повноцінні flash-сайти мають лімітований адміністративний функціонал, пов'язаний з використанням анімованих елементів, внесення правки в які вимагає використання спеціалізованих програм для редагування flash-роликів.
Основними функціональними можливостями технології flash є створення інтерактивних областей сайту та окремих анімованих роликів, здійснення зв'язку сайту з базою даних і підтримка XML, інтеграція на сторінки ресурсу аудіо і відео роликів, здійснення доступу до додатків в режимі реального часу.
Однак варто пам'ятати, що в будь-якій справі потрібно знати міру, і використання flash-анімації в створенні сайтів не виняток. Динамічні flash-ролики в рази важче статичних елементів сайту, і це безпосередньо позначається на швидкості завантаження сторінок сайту, а це вже мінус, так як сучасний Інтернет-користувач два рази подумає, а чи варто ваш ресурс очікування? і не продовжити пошуки цікавить його послуги або товару на іншому більш "спритно" сайті. Так що якщо використання flash-анімації на сайті не є необхідною умовою, продиктованим іміджевою політикою фірми, або не є частиною дизайнерського задуму творців сайту, то варто подумати про альтернативні рішення.
Одним із способів вирішення цієї дилеми є використання flash-анімації не на кожній сторінці сайту, а в одному або декількох спеціалізованих розділах сайту, наприклад в пункті "презентація". Це дозволить скоротити швидкість завантаження сайту і в правильному напрямку зорієнтувати користувача.
Ще одним альтернативним підходом при розробці анімованих елементів на сайті є використання технології HTML5, яка незабаром, не тільки замінить, але і перевершить можливості flash-анімації, як по функціоналу, так і за ступенем адоптірованності для Інтернету.
Приймаючи рішення про те, чи варто чи ні розміщувати на сайті flash-елементи слід провести глибокий аналіз, цільової аудиторії майбутнього проекту. В результаті проведених досліджень слід з'ясувати, чи доцільно використовувати на сайті анімацію як таку і якщо так, то який сценарій динамічних роликів більш кращий для даної групи користувачів. Крім сценарію flash-елемента необхідно також визначитися з його місцеположенням на сайті, і розміщувати динамічні об'єкти лише в тих місцях, куди необхідно залучити найбільшу увагу користувача.
Так як процес створення flash-елементів та flash-сайтів в цілому дуже трудомісткий процес, дуже важлива грамотна постановка задачі і складання замовником максимально докладного Технічного Завдання, в якому слід вказати не тільки технічні дані, на кшталт розмірів ролика і його допустимого "ваги", але також і кращий сценарій, затвердити графічні елементи і динамічні ефекти. Залежно від того на скільки детально було складено завдання буде залежати не тільки кінцевий результат, а й його ціна, тому що постійне внесення правок в ході роботи безпосередньо відбитися на остаточній вартості.
Якщо ви вважаєте, що на вашому сайті неодмінно має бути присутня flash-анімація або ж він повинен бути повністю побудований за технологією flash - ми готові реалізувати це для вас.
У перелік послуг web-студії HINEX.RU входить створення flash-банерів, листівок, інтерактивних презентація, електронний варіант каталогу продукції та інших елементів, виконаних з використанням flash.
WEB-АНІМАЦІЯ за допомогою скриптів.
Домогтися динаміки в оформленні сайту можна не тільки за допомогою специфічних елементів в форматах спочатку припускають анімацію, а й за допомогою java-скриптів.
В даному випадку анімація програється на клієнтської, браузерної стороні сайту, а не в самому елементі, як це відбувається з об'єктами в форматі .gif і flash.
Створення web-анімації засобами javascript варто довіряти тільки досвідченим програмістам, добре знайомим з цією мовою web-програмування, а так само мають досвід роботи з яваскрипт-бібліотеками на кшталт jquery, так як неграмотно написана javascript-анімація, по-перше, може негативно вплинути на швидкість завантаження сайту, по-друге неправильно відображатися в деяких Інтернет-браузерах, і по-третє викликати появу помилок, які будуть перешкоджати індексації сайту пошуковими ботами.
HTML5 + CSS3 АНІМАЦІЯ САЙТУ
За допомогою анімації за допомогою html5 і css3 можна домогтися ефектів не відмітних від результатів тієї ж flash-анімації, хоча і тут є свої "але". Якщо javascript-анімація на сайтах дуже поширена, то інтерактивної динаміки, створеної за допомогою html5 і css3, немає. Це обумовлено тим, що обидві ці технології поки не є офіційними стандартами і адекватно відображаються на сайтах не всіма браузерними клієнтами, хоча, наприклад, формат html5 вже сьогодні називають повноцінною заміною flash-анімації на сайті.
Наведемо приклади того, в чому саме формат html5 і css3 анімація перевершує flash-анімацію: мова html5 і css3 не сурми установки користувачем додаткових плагінів на комп'ютер, формат html5 і css3 на відміну від Флеш-анімації індексується пошуковими системами, сайти створені за допомогою html5 і css3 набагато "легше", в плані швидкості завантаження, сайтів анімованих за допомогою flash, сайти на html5 css3 порівняно дешевше проектів побудованих на технології flash.
Висновок: Протягом виконання лабораторної роботи було розроблено анімаційні елементи сайту.
Ділись своїми роботами та отримуй миттєві бонуси!
0%
Оголошення від адміністратора