Hover використовується на веб-сайтах роками як спосіб надати фрагмент інформації для відвідувачів, не викликаючи дії. Оскільки смартфони та планшети поступово переймають Інтернет, ми мусимо приділяти їм підвищену увагу при розробці веб-сайту. Оскільки сенсорні екрани не можуть впоратися з наведенням миші, нам потрібно шукати альтернативи ефектам наведення. Якщо ви налаштовуєте власний веб-сайт або не маєте ресурсів для використання професійного веб-дизайнера, цей підручник призначений для вас.
Ви можете керувати ефектами наведення за допомогою сенсорних екранів, але це може бути трохи незручно. Можливо, вам буде краще розробити їх цілком і повністю використовувати щось інше. Якщо ви користуєтесь ними на своєму робочому столі, у вас зазвичай три варіанти наведення ефектів на мобільних веб-сайтах:
- Видаліть їх цілком і замініть первинною дією.
- Додайте вторинне меню, де ви можете натиснути один раз для ефекту наведення курсору та ще раз для первинної дії.
- Розмістіть інформацію про наведення на власну сторінку.
Всі вони будуть добре працювати на сенсорних екранах та настільних комп’ютерах, але знадобляться деякі дизайнерські налаштування, які можна реалізувати в рамках існуючого дизайну. Ви також можете обійти його з JavaScript або розумним кодом jQuery, якщо у вас є навички, але якщо ви намагаєтесь все це зрозуміти самостійно, вам може бути краще використовувати альтернативи дизайну, ніж код. Якщо ви хочете вивчити альтернативи коду для ефектів наведення, перейдіть на цю сторінку.
Видаліть ефекти наведення курсора зі свого дизайну
Якщо ви не можете скористатись веб-дизайнером, який допоможе вам вирішити проблему, можливо, вам краще буде повністю усунути ефекти наведення. Звичайно, вони виглядають акуратно і можуть запропонувати корисну додаткову інформацію, але завжди є інші способи досягти такого ж ефекту.
Ви можете зберегти дію меню як основну дію і включити додаткову інформацію в іншому місці сторінки. Ви можете використовувати вікна прориву, спливаючі вікна, збільшувати вміст дескриптора для точки, яку ви намагаєтеся зробити, або щось інше. Якщо у вас немає навичок впроваджувати jQuery, це, мабуть, найпростіший варіант.
Додайте вторинне меню
Вторинне меню включає перший кран, який би імітував ефект наведення. Ви можете включити інформацію в меню і показати друге меню в межах того ж елемента. Це друге меню діє як власне вибір, як це відбудеться на робочому столі. Перше натискання імітує наведення миші, а друге натискання користувача, що здійснює первинну дію.
Це чітка альтернатива ефектам наведення, але обмежена розміром екрана і обмежує кількість інформації, яку ви можете додати до свого ефекту. Ефекти наведення вказівника обмежені за своєю природою, але на мобільних пристроях обмежені екраною нерухомості, з якою ви маєте справу. Якщо ви дійсно хочете включити додаткові дані нестандартним способом, це може бути все.
Розмістіть інформацію про наведення на власну сторінку
Можливо, простішим варіантом було б включити інформацію про наведення в межах власної сторінки за допомогою текстового посилання. Це спрощує ваше меню та забезпечує простоту навігації. Гіперпосилання працює на різних пристроях, і ви отримуєте додаткову сторінку для розміру сайту та SEO. Мінус полягає в тому, що вам доведеться збільшити додатковий вміст щонайменше на 300 слів, щоб змусити його працювати.
Поки ви можете розмістити інформацію досить уважно, щоб вона добре читалася та додала корисності читачеві, я особисто вважаю, що це найкраща альтернатива. Вибір рішення про те, де розмістити ці посилання на додаткові дані, залежить від вашого дизайну, але додаткові сторінки надають додаткову можливість додавати дзвінки до дії, додавати свій номер телефону, електронну адресу та будь-яку додаткову інформацію, яка може бути використана здійснити продаж.
Перебування з наведенням
Якщо ви хочете використовувати якийсь ефект наведення на ваш основний веб-сайт, вам потрібно буде запустити його на свій мобільний сайт або принаймні на мобільну версію. Є альтернативні параметри меню або рішення JavaScript, але для їх використання потрібен експерт. На цій сторінці обговорюються ваші альтернативи, якщо ви хочете вивчити їх далі.
Одна з найпростіших пасток, в яку ви потрапите, коли ви починаєте самостійно або будуєте свій перший веб-сайт - це дизайн для себе, а не для аудиторії. Вам, звичайно, потрібно розробити щось, що вам подобається, але, враховуючи зручність використання, ви повинні надати пріоритет аудиторії. Ви також повинні враховувати пристрої, якими вони користуватимуться, і спосіб, яким вони найімовірніше взаємодіють із вашим веб-сайтом.
Якщо ваша аудиторія молода, вони використовуватимуть мобільний. Якщо вони використовують мобільний, ефект наведення вказівника та інші варіанти дизайну, подібні до нього, це не найкращий варіант.