Вид посилання на сайті картинкою: як це зробити і вставити на ресурс
- Види посилань на сайті
- Як вставити посилання в картинку
- Якщо зробити картинку з іншого сайту посиланням
- Правила розміщення посилань-картинок на сайті
Тематичний трафік - альтернативний підхід в просуванні бізнесу
Посилання-картинка - це коли при натисканні мишкою на зображенні користувач потрапляє на іншу сторінку, в іншу частину документа, починає здійснювати завантаження файлу, зображення і т.п.
Види посилань на сайті
Як ми вже розповідали в іншій статті , Посилання на сайті можуть бути різними. Два основних типи посилань - це текстові анкорний і безанкорние, а також посилання-зображення. Текстові посилання важливі для просування, тому що підсилюють вагу пошукових запитів з анкор-листа. Посилання-картинки так само передають вагу, але частіше їх використовують для поліпшення юзабіліті сайту.
Наприклад, в розділі "фотогалерея" для зручності користувачів логічно створювати посилання-картинки. При натисканні на іконку фотографії відбувається відкриття нового великого вікна, в якому людина може повністю розглянути зображення у великому форматі. Або, наприклад, зображення схеми проїзду можна також збільшувати при бажанні користувача. Якщо у вашому тексті представлені креслення, графіки - логічно робити посилання з превью для завантаження зображення в повному розмірі.
Посилання з зображення може вести на іншу сторінку сайту. Це може бути шлях з рекламного банера, пункту меню і т.п.
Нагадуємо, що небажано організовувати меню на вашому сайті у вигляді картинок - це незручно ні вам, ні пошуковій системі. Бажано використовувати текст.
Також посилання з картинки відправляє часто на сторонній ресурс - лічильники, банери тощо
Ось приклад такого посилання (натисніть на неї і потрапите на статтю про битих посиланнях - так це і працює):
Як вставити посилання в картинку
Більшість CMS мають вбудовані редактори, що дозволяють працювати із завантаженням зображень і установкою посилань з них.
- У візуальному редакторі зазвичай можна просто виділити зображення, натиснути на кнопку "вставити посилання" і вказати потрібний url.
- Якщо ви вставляєте посилання в картинку у вигляді HTML-коду, то використовуйте наступне написання:
<a href="путь, куди йти-url"> <img src = "http: // ваш сайт / шлях до картинки / сама картинка - url зображення" /> </a>
Тег <а> означає перехід по посиланню, a <img> вказує шлях до зображення, з якого ви відправляєте користувача кудись. Тобто спочатку ви повинні завантажити його на ваш сервер.
Додаткові вказівки:
- height, widhth - вказуємо розмір зображення;
- border - працюємо з окантовкою (рамкою);
- alt - альтернативний текст для того відвідувача, у якого не відобразилася картинка.
На зображення можна накласти тінь, змінити прозорість при наведенні покажчика миші, зміну кольору, закруглити кути - все це дозволяють кошти CSS.
Якщо зробити картинку з іншого сайту посиланням
Можна використовувати зображення з іншого ресурсу, для цього в <img> необхідно вставити його повний шлях.
Якщо ви хочете розмістити зображення на своєму сайті не завантажуючи її, тобто підтягнувши з іншого сайту:
- Пам'ятайте, що використовувати чужі зображення не бажано і взагалі не можна, так як у кожного графічного матеріалу є свій автор.
- При відображенні картинки підвантаженими з чужого ресурсу на вашому сайті, ви передаєте частину трасту вашого сайту сторонньому ресурсу до того ж розраховуєтесь більш тривалої завантаженням сторінки.
Все це погіршує результати просування сайту.
Правила розміщення посилань-картинок на сайті
- Робіть посилання тільки зі своїх зображень.
- Використовуйте унікальні зображення. Також, як і тексти, для успішного просування зображення не повинні повторюватися в Інтернеті.
- Не завантажуйте картинку величезного розміру. Візуально ви можете зменшити її за допомогою width і height в тезі <img>, при цьому на сторінці зображення буде невеликого розміру. Але фактично на сторінку кожен раз буде довантажувати повнорозмірна картинка, що збільшить час завантаження сторінки і погано позначиться на просуванні сайту. Та й якість примусово стисненого зображення буде страждати.
- Прописуйте <alt> - опис до кожної картинки. Можна прописати і <title>.
- Не захоплюйтеся застосуванням таких посилань. Все ж текстові посилання грають більш важливу роль при просуванні ресурсу.