Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
4 МП WEB-5к.docx
Скачиваний:
0
Добавлен:
01.07.2025
Размер:
7.3 Mб
Скачать

10 Порад для створення html5-шаблонів

Для того щоб створити хороший, якісний шаблон за допомогою HTML5, слід дотримуватися деяких правил і порад, про які й піде мова в цій статті.

1. У першу чергу важливо завжди створювати план створення сайту і всіх елементів його дизайну, перед тим як приступати до його розробки. Завдяки цьому Ви зможете заощадити чимало часу.

2. Після того, як Ви визначилися з концепцією сайту та його призначенням, то потрібно приступати до огляду наявного «матеріалу». А саме до різних доступним шаблонами та програмами, які зможуть Вам у нагоді і полегшити роботу.

3. Коли Ви приступите до роботи з дизайном, то не забувайте про підказки коду, в тому випадку якщо вони передбачені програмою. Що стосується роботи з тегами, то слід завжди уважно стежити за тим, щоб вони всі були закриті. В іншому випадку шаблон може відображатися не зовсім коректно.

4. Той факт, що коментування відіграє велику роль, всім чудово відомий. Якщо для Вас важливо, щоб у Вашому коді крім Вас могли розбиратися і інші люди, то одних слів може не вистачити. Тому можна використовувати скріншоти з пояснювальними підписами.

5. Коли Ви приступаєте до роботи з зображеннями, дуже важливо переконатися в тому, що Ви встановлюєте значення для атрибутів height і width, причому параметри самої картинки їм відповідають. Це відіграє велику роль, тому що якщо висота і ширина вказані вірно, то проблем з масштабуванням не повинно виникнути. Якщо ж встановлені значення більше, ніж розміри реального зображення, то буде відбуватися масштабування. У тому випадку, якщо воно не більше 20%, то це допустимо, в іншому випадку це призведе до спотворення картинки.

6. При роботі з зображеннями необхідно використовувати тег alt. Це буде плюсом для подальшої оптимізації та просування сайту, простіше кажучи, SEO.

7. Що стосується відео, то у плеєра обов'язково повинні бути кнопки управління і користувач повинен мати можливість самостійно управляти переглядом.

8. Посилання на сайті повинні побут інформативними, в такому випадку це буде грати на руку SEO, а значить і просування сайту.

9. Кількість тегів div повинно бути мінімальним.

10. Ну і, звичайно ж, необхідно використовувати валідатор validator.w3.org, який буде перевіряти зовнішній вигляд Вашого сайту в різних браузерах.

Можливі експерименти з html5

Сам по собі HTML5 не можна вважати безпосередньо новим трендом, але прийдешній web-стандарт в 2013 буде сильно впливати на Webdesign. Все, що насправді виходить за межі HTML5 і буде в змозі дати однакові результати і на мобільному пристрої і на Desktop - все це буде робити ці технології цікавими для дизайнера.

Браузер ще краще буде справлятися з HTML5 і в 2013 ми побачимо в області вебдизайну багато несподіваних експериментів. Ці експерименти по-новому виміряють межі можливого, і на традиційних статичних сторінках можна буде побачити багато інтерактивного.

HTML5 буде і далі імплементований в браузери та системи контент -менеджменту, і все далі він буде відсувати межі можливого. Ці експерименти в новому році будуть всюди: інформація стане впізнаваною в повному розумінні цього слова - візуально.

Статичні елементи, звичайно, будуть присутні теж, але чому цікаву інформацію не уявити цікаво, анімаційно ? Прості Hover - ефекти будуть витіснені впізнаваними та живими інтерактивними або продовжені ними. Якщо на певний Triggerpunkt ми вкажемо мишкою, то замість простих Tooltips ми побачимо комплексні вікна .

Окремо потрібно зауважити Parallax Scrolling, як частина еволюції HTML5/CSS3. Одна з цікавих форм представлення інформації називається Parallax Scrolling. При цьому мається на увазі візуальний ефект, який проводиться через два один над одним лежачих рівня, що рухаються з різною швидкістю. Цей цікавий ефект застосовується і сьогодні, але в новому році тенденція буде зростати.