
Сьогодні мова йтиме не про те що писати в презентаціях, про те як їх створювати.
Отож для більшості синонімом слова „презентація“ є слово ПаверПоінт. Якщо вам близька ця теза і ви не хочете нічого міняти, то далі читати не обов’язково.
Сьогодні ж піде мова про альтернативу до класичного підходу створення презентацій.
Слід обмовитись, що цей метод підійде далеко не всім.
Але ті кому він підійде будуть щасливі:)
А щасливими будуть розробники. А особливо — веб-розробники.
ПаверПоінт від всім відомого софтверного гіганта — хороша програма для створення презентацій, для її освоєння не потрібно особливих навичок, простий інтерфейс та масса шаблонів дозволяють швидко зробити візуально досить симпатичну презентацію.
Іншими словами : ПаверПоінт — стандарт де-факто в створенні презентацій. Стоп-стоп-стоп… Який з них? 2007? Чи 2003?
Не знаю як ви, а я досі знаю чимало контор котрі досі не перейшли на новий офісний пакет, а тут вже і 2010 офіс не за горами. Отож — перша проблема: з появою нових версій — губиться єдиність формату. А буває і гірше — павер-пойнту може не бути взагалі(!). Так, трапляються такі випадки, коли на комп’ютері, приєднаному до проектора — відсутня ця програма. Ну що ж, від цього можна врятуватись використавши в’юер, або створивши виконавчий файл з презентацією. Та і це не завжди вихід.
А як бути користувачам альтернативних операційних систем?
Мало того, за ПаверПоінт, який входить в склад Майкрософтівського офісу треба ще й гроші платити.
Звісно тут на допомогу нам приходять безкоштовні офісні пакети типу ОпенОфіса, але це теж не вихід, бо в останнього в плані презентацій багато глюків, особливо з перенесенням шрифтів.
Презентації в html:
Переваги:
Переносимість
Дуже важко знайти комп’ютер без браузера, не важлива навіть операційна система, показувати слайди можна хоч на мобільному телефоні. (скоро це може стати актуально, з появою мобілок з вбудованими проекторами) Також жодних проблем не виникне з оприлюдненням презентації в вебі, оскільки вона вже являє собою веб-сторінку.
А при відключенні стилів презентація магічним чином з набору слайдів перетворюється у звичайну сторінку, яку можна без проблем переглянути і роздрукувати.
Незалежність від параметрів екрану.
Сучасні проектори мають різну розподільчу здатність, від 800х600 до 1280х1024. Часто створюючи презентацію, ви наперед не знаєте, на чому вона буде відображена, і те що презентація була розрахована на екран з іншими параметрами призводить до зниження її читабельності та якості відображення.
Хтмл-презентації позбавлені цього недоліку завдяки можливості масштабування як засобами броузера, так і спеціальними властивостями CSS, зокрема такою як „@media projection“
Можливість підправити в будь який момент
Для редагування презентації не потрібно жодного додаткового софту, достатньо простого блокноту. Це часто рятує в екстренних ситуаціях.
Малий розмір.
Вручну написаний хтмл-код зазвичай матиме менший розмір, ніж машинно згенерований XML (формати МС-Офіс2007 та ОпенОфіс)
Звичні технології html+css. Всі їхні можливості і гнучкість
Як на мене, сучасні презентаційні пакети сильно втрачають в силі, коли вам замість вбудованого шаблону потрібно використати свій дизайн. На хтмл+цсс зараз можна зробити все що завгодно, плюс якщо у вас/вашого продукту є веб-сайт, то для оформлення презентації можна використати дизайн сайту, адаптувавши його під ваші потреби.
Окрім цього, якщо ви презентуєте веб-продукт, ви запросто можете в слайд презентації вставити наглядну демонстрацію вашого проекту, або наприклад з допомогою додаткового джаваскрипту чи флеш зробити сторінку інтерактивною
Зворотня сторона медалі:
Потрібна підготовка
Людині непідготовленій буде важко редагувати таку презентацію, а от веб-розробнику — навпаки, не доведеться навіть вилазити зі звичного серидовища і розбиратися з монструозними пакетами. Також існують інструменти автоматичної генерації хтмл-презентацій.
Важко запхнути все в один файл
Невеличкий недолік — презентація складається з набору файлів (хтмл-код, зображення, файли стилів) тож замість одного файлу отримуємо теку.
Та все ж не забувайте про можливість створення mht-архівів, які нівелюють цей недолік (і ускладнюють можливість редагування).
Немає прямої інтеграції з іншими офісними програмами.
Вставити в презентацію діаргаму з можливістю пізнішого корегування значень, якщо ви не спеціаліст по canvas+javascript буде складніше:).
Відсутність або мінімум анімацій при зміні слайдів
А хто сказав що це не долік? Це якраз плюс! Усі професійні презентації робляться без гламурних ефектів переливання та накладання слайдів
Тепер конкретно про технології.
Наразі, найпоширенішими є три фреймворки для створення html-презентацій
W3C Slidy, OperaShow, S5.
Усі вони надають приблизно один набір можливостей.
Для себе я вибрав W3C-Slidy через зручні хоткеї, відсутність зайвих ускладнень. Плюс — це міжнародний стандарт html-презентацій.
OperaShow — власна розробка OperaSoftware. Саме на її базі будуються усі презентації цієї компанії. ЇЇ основними перевагами є відсутність Джаваскрипту та зручний генератор презентацій (в даний момент чомусь не працює) який дозволяє створювати їх людям без знань html та css. Недоліком ОпераШоу є те що працює він найкраще з Оперівським браузером, а в інших браузерах можуть виникати несподіванки.
S5 — проект основою якого був попередній фреймворк, оптимізований до повної крос-браузерності (довелось застосувати джаваскрипт). ОпераСофтвер пропонує затвердити його як стандарт замість W3C-Slidy. Поки що їй це не вдається:)
Робота з презентаціями
Дуже просто. Всі слайди знаходяться всередині однієї хтмл-сторінки. Кожен слайд являє з себе окремий блок-елемент:
<div class="slide">
<h1>Заголовок нашого суперського слайду</h1>
<p>Текст слайду</p>
<ul>
<li>Елемент списку</li>
<li>Ще один елемент списку</li>
</ul>
</div>
Оформлення виконується з допомогою CSS
Можна використовувати усі можливості html та css.
Також в фреймворках існують додаткові css-класи для елементів що з’являються поступово та інших смаколиків.
Зразки презентацій:
W3Slidy (офіційна презентація)
http://www.w3.org/Talks/Tools/Slidy
(Більш обіграні стилі та прийоми почергової появи)
http://www.w3.org/2006/02/woa/
S5 (офіційна презентація)
http://meyerweb.com/eric/tools/s5/s5-intro.html
(Симпатична презентація про python співробітників Яндексу)
http://softwaremaniacs.org/blog/wp-content/rit/
OperaShow
(Офіційна презентація)
Як презентація працює тільки в Опері, або якщо у вас є проектор.
http://www.howtocreate.co.uk/operaStuff/operaShowPresentation.html
Додатково по темі:
Самі робимо презентацію без фреймворків. (Англ)
W3C Slidemaker — генератор презентацій від W3C
коментарі:
Може є плагіни до тогож павер поїнта які вміють зберегти презентацію в ХТМЛ?
Інша справа, що можливі втрати в якості і глюки. Я віддаю перевагу ручному верстанню.
Але краще він би цього не робив. Жах.
Як трохи потужнішу альтернативу гуглодоківським презентаціям — 280 слайдиків
Латех суттєво програє перед хтмл в купі речей. В плані презентацій.
По перше, латех призначений для друкованої продукції, і зовсім не підходить для відображення на екрані.
По друге — він просто так не рендериться. треба гнати в pdf або ps.
По третє — немає того роздолу технологій що є в хтмл, жабоскриптівські фреймворки, флеш, фішки цсс-у. Цього всього в латеху нема, і він не призначений для динамічної взаємодії.
Короче, ЛаТеХ це не варіант:)
Якщо хто не знає, готується презентація у LaTeX, а не виході - PDF. І завдяки підтримці Javascript в Acrobar Reader, можливостей там більше, ніж у PP. Ще можна врахувати, що Acrobar Reader при інсталяції звичайно інсталює й плагіни до IE та FF, так що можна й через веб презентувати.
Щодо використання для презентацій HTML, чомусь мені це не спадало на думку, а дійсно, за допомогою jQuery різні гарні переходи та інші ефекти намалювати настільки просто, що спосіб безумовно заслуговує на увагу, автору подяка.
Тільки от з CSS морочитись не люблю.