- flash анімація для сайту
- Що потрібно для перегляду FLASH
- Де взяти вихідні для створення сайту.
- Створення та редагування флешок.
- Як вставити Flash в HTML сторінку.
- Приклад вставки Flash-фільму в HTML-сторінку:
- Розташувати DIV поверх Flash.
- параметри:
- Оптимізація Flash сайтів
- Для вирішення цієї проблеми існує кілька способів:
flash анімація для сайту
Якщо Ви початківець веб майстер і вирішили оживити сторінки свого сайту за допомогою Flash (флеш) анімації або готових Flash роликів, то інформація на цій сторінці для Вас.
Flash (в перекладі з англійської «спалах») технологія почала свій розвиток з 1996 р і на сьогоднішній день навіть початківець веб майстер знайомий з такими термінами як:
А цілі Flash-сайти, які включають в себе чати, гостьові книги, голосування та форуми стали з'являтися в мережі все частіше і частіше.
З появою Flash анімації створення сайтів придбало новий напрямок.
Сайт, зроблений за допомогою флеш технологій, сильно відрізняється від своїх HTML побратимів. Перше, що завжди привертає увагу користувача - це всілякі рухається, блискучі, миготливі, переливаються елементи сторінки.
Що потрібно для перегляду FLASH
Для перегляду флеш анімації, або будь-якого іншого флеш-контенту до браузеру повинен бути встановлений флеш-плагін, який можна завантажити безпосередньо з сайту-розробника Flash - Macromedia (нині входить до складу компанії Adobe). Варто однак зазначити, що на відміну від Internet Explorer, який може встановити plug-in flash в автоматичному режимі, інші браузери, начебто Opera або FireFox-а, вимагають окремої інсталяції. Всі необхідні програми ви можете завантажити з офіційного сайту флеш - adobe.com.
Де взяти вихідні для створення сайту.
на створення флеш анімації потрібно багато часу, зусиль і знань. Часто буває, що чогось одного, а іноді і відразу все катастрофічно не вистачає. І тут на допомогу приходять так звані flash исходники. У мережі повно безкоштовних шаблонів ФЛЕШ сайтів, а там то і знаходяться файли з розширенням .... .FLA. В шаблонах міститься безліч анімаційних ефектів і красивих переходів, вам не доведеться реалізовувати той чи інший ефект, досить взяти його з шаблону. Також шаблони полегшать вам створення свого flash сайту: відкривши шаблон і змінивши або додавши в нього інформацію, ви отримаєте приголомшливий flash сайт за короткий час і з мінімумом прикладених зусиль.
Завантажити шаблон flash (флеш) сайту безкоштовно (50 flash початкових кодів)
Створення та редагування флешок.
Для створення flash роликів необхідно вибрати для себе програму за допомогою, якої Ви будете працювати з флеш.
На сьогодні безумовним лідером серед flash редакторів є продукт компанії Macromedia Adobe Flash Professional CS3. Flash CS3 - це промисловий стандарт для розробки інтерактивних мультимедійних програм під будь-які платформи. Flash можна застосувати для створення ігор, веб-сайтів, CD-презентацій, банерів і мультфільмів.
можливості
• Імпорт Adobe Photoshop (PSD) і Adobe Illustrator (AI) файлів, із збереженням шарів і структури, з можливістю подальшого редагування їх в Adobe CS3 Flash Professional. Можливість оптимізації і настройки великої кількості опцій при імпорті файлів
• З'явилася можливість миттєво конвертувати анімацію графіки в код ActionScript 3.0, який може бути легко відредагований, повторно використаний і поліпшений розробниками. Можна копіювати анімацію з одного об'єкту на інший
• Економте час, використовуючи новий ActionScript 3.0, більш гнучкий і інтуїтивно зрозумілий
• налагоджувати скрипти тепер можна новим потужним ActionScript отладчиком, який забезпечує більшу гнучкість, а також узгоджений з Adobe Flex Builder 2 налагодження
• Розробка, перегляд і тестування контенту для мобільних пристроїв з використанням Adobe Device Central CS3, в даний час об'єднаних в Adobe Creative Suite 3
• Створення та випробування інтерактивних додатків і інтерфейсів переглядаються Flash Lite-му
• Збільшення інструменти редагування, повністю сумісні з Illustrator CS3, дозволять скорегувати форму графічних елементів на етапі розробки. Є навіть можливість абсолютно коректного копі-паста з ілюстратора.
Flash Professional CS3 є визнаним стандартом в області створення інтерактивних веб сайтів і мобільного контенту.
Але найголовніше полягає в тому, що в основному всі flash исходники, які знаходяться в безкоштовних шаблонах флеш сайтів зроблені в Adobe Flash Professional, а отже, що б ними скористатися потрібна саме ця програма.
Як вставити Flash в HTML сторінку.
Найпростіший спосіб - це скористатися веб - редактором. наприклад: Adobe Dreamweaver CS3 , Який всю роботу візьме на себе і Flash ролик буде правильно відображатися у всіх браузерах. (Докладний приклад з тривимірним хмарою посилань . )
Для вставки Flash-фільмів в HTML-сторінку в ручну використовуються одночасно два тега - <object> та <embed>. Тег <embed> вставляється всередину тега <object>. Така конструкція є наслідком того, що частина браузерів не підтримує технологію ActiveX і тег <object>.
Приклад вставки Flash-фільму в HTML-сторінку:
<Object classid = "clsid: D27CDB6E-AE6D-11cf-96B8-444553540000" codebase = http: //download.macromedia.com/pub/shockwave/ cabs / flash / swflash.cab # version = 6,0,0,0 width = "550" height = "400" id = "myflash"> <param name = name value = "myflash"> <param name = movie value = "myflash.swf"> <param name = quality value = high> < embed src = "myflash.swf" quality = high width = "550" height = "400" name = "myflash" swliveconnect = true type = "application / x-shockwave-flash" pluginspage = "http: //www.macromedia .com / go / getflashplayer "> </ embed> </ object> Якщо порівняти ці два коди, то нескладно помітити, що Dreamweaver (тільки CS3) додає javascript. Він вирішує проблему запуску активного вмісту SWF-файлу для браузера «Опера». А саме, щоб флеш ролик активувався без додаткового кліка по флешки. Файл, який генерує програма, так і називається: AC_RunActiveContent.js розташовується в папці Scripts.
Розташувати DIV поверх Flash.
Іноді стикаєшся з такою ситуацією, коли просто необхідно, розмістити який-небудь контент (текст, фото і т. Д.) На флешці.У цьому випадки досить вказати лише один параметр для тега: <param name = "wmode" value = "opaque"> і для тега: wmode = "opaque" І не забути прописати в переданих параметрах функції AC_FL_RunContent (): 'wmode', ' opaque '
Остаточний код кросбраузерності вставки Flash в HTML сторінку.
Працює у всіх сучасних браузерах без додаткового кліка для активації.<Script type = "text / javascript"> AC_FL_RunContent ( 'codebase', 'http: //download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0', 'width', '1000', 'height', '405', 'src', 'header', 'quality', 'high', 'pluginspage', 'http: //www.adobe.com/shockwave/download /download.cgi?P1_Prod_Version=ShockwaveFlash','movie','header','wmode','opaque '); // end AC code </ script> <noscript> <object classid = "clsid: D27CDB6E-AE6D-11cf-96B8-444553540000" codebase = "http://download.macromedia.com/pub/shockwave/cabs/flash/ swflash.cab # version = 9,0,28,0 "width =" 1000 "height =" 405 "> <param name =" movie "value =" header.swf "> <param name =" quality "value =" high "> <param name =" wmode "value =" opaque "> <embed src =" header.swf "quality =" high "pluginspage =" http://www.adobe.com/shockwave/download/download.cgi ? P1_Prod_Version = ShockwaveFlash "type =" application / x-shockwave-flash "width =" 1000 "height =" 405 "wmode =" opaque "> </ embed> </ object> </ noscript>
В необхідно підключити файл « AC_RunActiveContent.js »
<Script src = "Scripts / AC_RunActiveContent.js" type = "text / javascript"> </ script> (і не забувайте відправити на сервер) подивитися приклад
параметри:
SRС - шлях до завантажуваного фільму (тільки для <embed>)
movie - шлях до завантажуваного фільму (тільки для <object>)
classid - ідентифікатор ActiveX (тільки для <object>)
width - ширина Flash-фільму в пікселах
height - висота Flash-фільму в пікселах
codebase - URL, за яким браузер буде намагатися завантажити Flash-додаток, якщо воно не встановлено у відвідувача (для <object>)
pluginspage - URL, за яким браузер буде намагатися завантажити Flash-додаток, якщо воно не встановлено у відвідувача (для <embed>)
play - визначає, чи починати програвання фільму відразу після завантаження чи ні. Може приймати значення true або falsh
loop - визначає, чи буде фільм програватися в нескінченному циклі. Може приймати значення true або falsh
quality - якість відображення фільму. Може приймати значення: best, high, medium, autohigh, autolow, low. Значення best відповідає максимальній якості.
bgcolor - колір фону
scale - визначає параметри масштабування фільму, якщо розміри у властивостях width і height задані у відсотках.
Приймає значення:
- showall - розтягує фільм для заповнення заданої для нього області зі збереженням пропорції фільму (використовується за умовчанням). Якщо пропорції фільму і певної для нього області не збігаються, то при відображенні можуть з'явитися рамки по сторонам фільму
- noborder - повністю займає виділену під фільм область. Чи не вмістилися частини фільму обрізаються при збереженні пропорцій.
- noscale - фільм не масштабується
- exactfit - масштабує фільм за розмірами заданої області. Пропорції не зберігаються.
base - основний URL, який використовується при відносній переадресації, якщо фільм складається з декількох фільмів, що зберігаються в різних каталогах
menu - тип контекстного меню, що з'являється при натисканні правої кнопки миші в області фільму. Може приймати значення true або falsh. Значення true відображає повне меню.
wmode - визначає параметри прозорості.
Приймає значення:
- window - відображається у власному прямокутному вікні, використовується за умовчанням
- opaque - фільм поміщається на задній план сторінки
- transparent - встановлює прозорий фон фільму (для <object>)
swliveconnect - застосовується для дозволу передачі даних між JavaScript і Flash-фільмом (для <embed>). Значення true дозволяє передачу даних, false (за умовчанням) - забороняє.
Оптимізація Flash сайтів
Красива, анімаційна шапка, банер або логотип - цілком можуть прикрасити Ваш професійний сайт.
Але з точки зору оптимізації, створення сайту повністю на основі Flash є великою помилкою. Такий сайт приречений на відсутність гарного рейтингу в пошукових системах. Це відбувається тому, що пошукові системи практично не розуміють Flash!
Пошукові системи сприймають і аналізують на сторінці Вашого сайту заголовки, текст і посилання. Якщо все це «заховано» в swf формат, пошукачі не в змозі розпізнати чи є всередині файлу тексти або посилання. Просто немає даних для правильного ранжирування такої сторінки!
Для вирішення цієї проблеми існує кілька способів:
HTML з елементами Flash - Якщо ваші сторінки мають індексовані заголовки, контент сторінки і навігаційні елементи, в міру обмежене використання Flash на сторінках сайту не повинно вплинути на рейтинги і видачу сайту пошуковими системами.
Фрейми - Спробуйте розташувати Flash у фреймі, а індексований текст поза фреймів. Поки обидві частини будуть мати однаковий контент, у пошукових систем не повинно виникнути проблем з індексацією.
Розділіть сайти - створіть Flash-сайт для користувачів і окремий HTML-сайт для пошукових систем. Далі використовуйте файл robots.txt, щоб заблокувати Flash-сайт від індексації пошуковими системами.
Cgi?Cgi ?
