Захист від копіювання контенту сайту є на сьогоднішній день одним з найважливіших завдань в інтернеті. Відомий факт, що більша частина контенту в мережі не унікальна. Це пов'язано з тим, що багато творців сайтів не ускладнюють себе написання текстів для наповнення. Зазвичай вони копіюють цікаві тексти з інших сайтів.
На це питання є однозначна відповідь -
Способів 100% захисту від копіювання інформації з web-ресурсів не існує!
Якими б витонченими вони не були завжди можна набрати текст з сайту в редакторі (наприклад, Word чи Блокнот), а будь-який малюнок перемалювати в графічному редакторі. Існуючі методи захисту дозволяють тільки ускладнити процес копіювання. Розглянемо методи, які ускладнюють процес копіювання тексту сторінок за допомогою HTML і CSS. Це найбільш прості способи, доступні будь-кому, хто володіє навичками HTML і CSS:
Захист від копіювання контенту сайту з використанням атрибута user-select в стилях css. Цей атрибут забороняє виділяти текст в будь-якому елементі (none - забороняє) Приклад:
HTML-код | Результат |
<div style="-moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none;" style="position: absolute; width: 280px; height: 150px; padding: 5px; background-color:#FFC9EA; text-align:justify">Текст в шарі захищений від копіювання за допомогою властивості user-select зі значенням none. Захист від копіювання працює в працює у всіх браузерах. |
Текст в шарі захищений від копіювання за допомогою властивості user-select зі значенням none. Захист від копіювання працює у всіх браузерах.
|
Захист від копіювання зображень сайту з використанням атрибута pointer-events в стилях css. Цей атрибут забороняє використовувати контекстне меню для збереження малюнка (none - забороняє) Для прикладу використаний прозорий малюнок:
HTML-код | Результат |
<div style=" pointer-events: none; " style="position: absolute; width: 280px; height: 150px; padding: 5px; background-color:#FFC9EA; text-align:justify"><img width="280px" src="images/sitelogo.gif" style="position: absolute" title="Малюнок захищений від копіювання за допомогою властивості pointer-events: зі значенням none. Захист від копіювання працює у всіх браузерах."> |
Для захисту графіки широко використовується практика нанесення “водяних знаків” на авторські зображення, які навряд чи хтось наважиться розміщати на своїх ресурсах. Для захисту мультимедійних ресурсів від їх показу на інших сайтах прямо з вашого достатньо належним чином налаштувати файл .htaccess на вашому сервері для захисту від хотлінкінгу.
Захист від копіювання контенту сайту з використанням властивості z-index в CSS. За допомогою нього задається порядковий номер елемента в стеку. Елемент з великим порядковим номером завжди знаходиться перед елементом з меншим порядковим номером. Це властивість можна використовувати для ускладнення процесу копіювання наступним чином. Вибираємо елемент, що містить текст. Це може бути параграф - <p></p>, заголовок - <h1></h1>, клас - <div></div> і т.д. Задаємо для нього властивість z-index. Наприклад, значення 1 - z-index: 1. Потім вставляємо малюнок розміром з наявний текст. Малюнок повинен бути порожнім прямокутником і повністю прозорим. Задаємо для нього властивість z-index: 2. Оскільки властивість z-index у малюнка більше, то він розташується поверх тексту. Таким чином, текст не можна буде виділити і скопіювати, наприклад:
HTML-код | Результат |
<div style="position: relative; width: 280px; height: 150px; padding: 5px; background-color:#FFC9EA; text-align:justify; z-index:1"><img src="images/hidden.gif" width="300" style="z-index:2; position: absolute">Текст захищений від копіювання за допомогою накладення прозорого малюнка поверх нього з використанням властивості z-index. Захист працює у всіх браузерах. |
Текст захищений від копіювання за допомогою накладення прозорого малюнка поверх нього з використанням властивості z-index. Захист працює у всіх браузерах.
|
атрибут oncontextmenu виникає, коли користувач клацає правою кнопкою миші в клієнтської області браузера для виклику контекстного меню. Таким чином, можна заборонити виклик контекстного меню, якщо привласнити даному атрибуту значення return false - oncontextmenu = "return false";
атрибут oncopy виникає при копіюванні в буфер обміну. Якщо привласнити даному атрибуту значення return false, то виділений текст не потрапить в буфер обміну - oncopy = "return false";
атрибут onselectstart виникає при виділенні об'єкта або тексту. Якщо привласнити даному атрибуту значення return false, то виділення не відбудеться - onselectstart = "return false".
атрибути спрацьовують, тільки коли у браузері користувача увімкнений javascript, а він увімкнений завжди по замовчуванню. Приклад:
HTML-код | Результат |
<div oncopy="return false" oncontextmenu="return false" onselectstart="return false" style="position: relative; width: 280px; height: 150px; padding: 20px; background-color:#FFC9EA; text-align:justify">Текст в шарі захищений від копіювання за допомогою властивості oncopy, oncontextmenu і onselectstart зі значенням return false. Захист від копіювання не працює в Opera. |
Текст в шарі захищений від копіювання за допомогою властивості oncopy, oncontextmenu і onselectstart зі значенням return false. Захист від копіювання не працює в Opera.
|
Нижче показані деякі прибамбаси, які легко обійти відключивши в браузері javascript.
Використання при копіюванні комбінації клавіш: «Ctrl + C». Багато користувачів використовують саме це сполучення клавіш, тому що це швидко і зручно. Добавте на сайт скрипт, який підтверджує авторство.
Підбірка корисних скриптів від копіювання
<script language="javascript"> function addLink() {var body_element=document.getElementsByTagName('body')[0]; var selection=window.getSelection(); var pagelink="Джерело: <a href='"+document.location.href+"'>"+ document.location.href+"</a> При копіюванні матеріалів, посилання на джерело ОБОВ'ЯЗКОВЕ!"; var copytext=selection+pagelink;var newdiv=document.createElement('div'); newdiv.style.position='absolute';newdiv.style.left = '-99999px'; body_element.appendChild(newdiv);newdiv.innerHTML = copytext;selection.selectAllChildren(newdiv); window.setTimeout(function(){body_element.removeChild(newdiv);},0);} document.oncopy=addLink; </script>
Підбірка корисних скриптів від копіювання
<!DOCTYPE html> <html> <head> <meta http-equiv="pragma" content="no-cache"/> <script language="javascript"> document.ondragstart = noselect;// заборона на перетягання document.onselectstart = noselect;// заборона на виділення document.oncontextmenu = noselect; // заборона контекстного меню function noselect() {return false;} </script> </head> <body> Цей текст не можна скопіювати! </body>
HTML-код | Результат |
<div oncopy="return false" onmousedown="javascript:if(event.button==2) alert('Користуйтеся лівою кнопкою миші! Права тут ні до чого... :))');" onKeyDown="alert('Будь ласка, використовуйте лише мишку')"; style="position: relative; width: 280px; height: 150px; padding: 20px; background-color:#FFC9EA; text-align:justify"><input type="text" value="Введіть текст"> Повний захист! Можна використовувати лише ліву кнопку миші<br></div> |
Повний захист!
Можна використовувати лише ліву кнопку миші |
Всі вище перераховані методи здатні лише ускладнити процес копіювання інформації з сайту. Але вони ніяким чином не забезпечують недоторканність контенту. Їх можна легко обійти, якщо відкрити HTML-код сторінки або безпосередньо в браузері з допомогою меню (чи натиснути Ctrl+U, при потребі відключивши javascript), або в редакторі, зберігши попередньо на диск. Навіть якщо контент захищено кодуванням (ви чудом попали на маньякальний сайт!) ви можете легко зберегти візуальний вигляд, натиснувши клавішу Print Screen і вставити результат у графічний редактор. Кінець-кінцем можна просто сфотографувати вміст екрану і здобути потрібний контент!
Захист від копіювання в Google. Нарешті самі пошуковики усвідомили необхідність боротьби з Інтернет-піратством. Дубльований контент сильно засмічує Інтернет, ускладнюючи роботу пошукових систем. Гугл дає можливість пов'язувати документи в Google+ (Гугл Плюс) з власним профілем. При цьому під час висвічування документа існує можливість автоматично налаштувати і показати фотографії того, хто його створив. Ця прив'язка дає можливість закріпити авторство документа. В майбутньому при доведенні прав необхідно підписувати справжнім ім'ям. Слід на кожній авторській сторінці залишати посилання на власний профіль у соціальній мережі, а в ньому вказувати адресу авторського ресурсу
Захист від копіювання за допомогою Яндекс. Яндексом був розроблений сервіс по захисту унікальних текстів сайту з технічного боку. Суть даного методу наступна. Перед розміщенням будь-якого унікального тексту на своєму сайті потрібно відправити його на сервіс Яндекса. Далі цей текст закріплюється за вашим сайтом. Надалі ця інформація буде використана при роботі пошукових алгоритмів. В даний момент сервіс працює в режимі тестування і доступний сайтам з ТИЦ не менше 10.
Захист від копіювання за допомогою депонування. Депонування сайту полягає у встановленні і захисту авторських прав як на сам сайт (дизайн), так і на його вміст. Тобто після процедури депонування ви будете бути власником авторських прав на свій сайт, охороняються законом. Будь-яке копіювання інформації з сайту буде вважатися порушенням авторських прав і переслідується по закону.