右クリック禁止でコピーされるのを防ぐ|takememo Vo.1

こんにちは!コーダーのたけうちです。

AIコミュニケーションでコーダーとしてホームページを中心に制作を担当していますが、制作する中で新たに発見することや効率の良い方法を見つけることって以外に多いんですよね。「この使い方知らなかった!」とか「この方法のほうが効率がよかった・・・」などなど。

たけうちの場合、何度も見て、制作して、を繰り返さないと覚えれないので覚えたことや知ったことはノートにメモするようにしていますが、AIブログでアウトプットしてブログを見てくださる方と情報を共有できたら一石二鳥!「takememo」と題して今回から(自分自身もっと身につくことも祈って!)アウトプット記事をはじめようと思います☆

右クリックで画像でコピーされるのをガード!|takememo Vo.1

第1回目のメモは右クリック禁止について!

ホームページのテキスト上や画像上で右クリックすると「名前をつけて画像を保存」と出てくるかと思いますが、ここから一生懸命書いた文章や画像、素材を勝手に保存されたらたまりませんよね。

パソコンやスマートフォンではスクリーンショットが出来てしまうので完全に保存させない方法はもはや存在しませんが、少しでも保存をさせないよう右クリックを禁止して保存されないようにしましょう!

右クリック禁止タグ

タグは下記の1文のみ!簡単!

oncontext="return false;"

あとは何を右クリック禁止にするかでこのタグを入れる位置を変えればOKです。

画像を右クリックする場合は、

<div>img src="画像のパス" oncontext="return false;"</div>

段落テキストを右クリックする場合は、

<p oncontext="return false;">テキストを入れる</p>

とHTMLのタグに入れてしまえば完了です!

もちろんbodyタグの中に、

<body oncontext="return false;">テキストを入れる</body>

といれれば全体を右クリック禁止にすることも可能です!本当に簡単!!

まとめ

ここまで書いておいてなんなんですが、右クリックで前ページに戻ったり、ページの再読み込みができなくなるので、実際右クリックを禁止することはユーザビリティを考えるとあまりよくないといった意見も少なくありません・・・。

こういったデメリットも踏まえ、本当に使用したいときだけ使用するのがよさそうですね!

それではまたԅ( ˘ω˘ԅ)

竹内

竹内

デザインを考えたり物を作るお仕事がしたいと思い、パソコンスクールでWebの勉強をしたのち、AIコミュニケーションに入社しました。主にHP制作を担当しています。わからないことのほうが多いですが、日々物づくりに携われるこの環境の中で働くことができてとても嬉しいです。新しい技術が増え続けるWeb業界の中で多くのことを吸収し、会社や仲間とともに自分自身成長していきたいと思っています。