Is it possible to prevent users from taking screenshots of webpage ? - GeeksforGeeks

21 Nov, 2021
The screenshot is a feature of OS in windows. We can simply press the print screen ( print screen ) on the keyboard to take screenshots. If the keyboard doesn’t have prt sc key, we can use Fn + Windows logo key + Space Bar. Also, we can use Snip & Sketch or Snipping tool by pressing the Windows logo key + Shift + S and select an area for the screenshot.
 In MacOS, we can use Command + Shift + 3 and Command + Shift + 4 for taking screenshot.
All these commands are controlled by our operating system, and we can’t disable or block them in the browser using HTML/CSS/JavaScript. So, we can’t prevent users from taking screenshots.
Besides all these things if the user wants to get the content of our webpage, they can copy it, print it, use some third-party applications or take a picture of it using some other devices. So it’s very difficult to prevent users from taking screenshots or content of our webpage.
We cannot stop this, but we can use some methods to avoid this all to some extent.
Example 1: In this example, we will disable the printing option of our webpage.
HTML
<!DOCTYPE html><html lang="en"> <head>    <style>                 /* We are stopping user from        printing our webpage */        @media print {             html,            body {                 /* Hide the whole page */                display: none;            }        }    </style></head> <body>    <div>        Python is a high-level, general-purpose        and a very popular programming language.        <br />Python programming language (latest        Python 3)is being used in web development,        <br />Machine Learning applications, along        with all cutting edge technology in        Software Industry.<br />Python Programming        Language is very well suited for Beginners,        <br />also for experienced programmers with        other programming languages like C++ and        Java.<br />    </div></body> </html>
 
Output: This will simply output the content of our webpage but when we try to print it, we will get nothing.
Printing will not work
Example 2. In this example, we will change the text selection feature using CSS.
HTML
<!DOCTYPE html><html lang="en"> <head>    <style>        html {            user-select: none;        }    </style></head> <body>    <div>        Python is a high-level, general-purpose        and a very popular programming language.        <br />Python programming language (latest        Python 3)is being used in web development,        <br />Machine Learning applications, along        with all cutting edge technology in        Software Industry.<br />Python Programming        Language is very well suited for Beginners,        <br />also for experienced programmers with        other programming languages like C++ and        Java.<br />    </div></body> </html>
Output: This will stop the user from selecting and copying our text contents.
copying is not happening
Example 3. In this example, we will display a warning message to the user to not copy/steal/print/screenshot of our web page.
HTML
<!DOCTYPE html><html lang="en"> <head>    <script>        alert("Do not take screenshot of this page");    </script></head> <body>    <div>        Python is a high-level, general-purpose and        a very popular programming language.<br />        Python programming language (latest Python 3)        is being used in web development,<br />        Machine Learning applications, along with all        cutting edge technology in Software Industry.        </br />Python Programming Language is very well        suited for Beginners, also for <br />        experienced programmers with other programming        languages like C++ and Java.<br />    </div></body> </html>
 
Output: This will show an alert message to the user that he should not take any screenshot of this webpage.
warning alert message
Example 4. In this example, we will add a copyright message of our webpage that will show all the content of this web page belongs to us, and it is strictly not allowed to use our content in any form.
HTML
<!DOCTYPE html><html lang="en"> <head>    <style>         /* Styling the footer */        footer {            text-align: center;            padding: 10px;            background-color: green;            color: white;        }    </style></head> <body>    <div>        Python is a high-level, general-purpose and        a very popular programming language.<br />        Python programming language (latest Python 3)        is being used in web development,<br />        Machine Learning applications, along with all        cutting edge technology in Software Industry.        </br />Python Programming Language is very well        suited for Beginners, also for <br />        experienced programmers with other programming        languages like C++ and Java.<br /><br />    </div>     <footer>          <p>            © 2021 GFG All the content of this            webpage belongs to us        </p>      </footer></body> </html>
 
Output: We added a copyright message in the footer with a simple message.
footer message
Attention reader! Don’t stop learning now. Get hold of all the important HTML concepts with the Web Design for Beginners | HTML  course.
gulshankumarar231
varshagumber28
CSS-Properties
CSS-Questions
HTML-Questions
Picked
CSS
HTML
Web Technologies
HTML
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
How to set space between the flexbox ?
Design a web page using HTML and CSS
Form validation using jQuery
How to style a checkbox using CSS?
Search Bar using HTML, CSS and JavaScript
How to set the default value for an HTML <select> element ?
Hide or show elements in HTML using display property
How to set input type date in dd-mm-yyyy format using HTML ?
REST API (Introduction)
How to Insert Form Data into Database using PHP ?