CSSで画像を印刷できないようにする方法
「ライセンスを掲載したいがダウンロードされたくない」というクライアントの要望に対して、出来る限りの事はしましたが、CSSで画像を右クリック保存させないようにする方法でも書きましたが、キャプチャーを撮られたら終わりなんですよね。
対策を練ってたら思ったことだけど、データ以外に紙で印刷されないようにもしないと!と思いましたので、画像を印刷できないようにする方法を書き残しておきたいと思います。
「ライセンスを掲載したいがダウンロードされたくない」というクライアントの要望に対して、出来る限りの事はしましたが、CSSで画像を右クリック保存させないようにする方法でも書きましたが、キャプチャーを撮られたら終わりなんですよね。
対策を練ってたら思ったことだけど、データ以外に紙で印刷されないようにもしないと!と思いましたので、画像を印刷できないようにする方法を書き残しておきたいと思います。
最近(と言っても去年の8月くらい)から、仕事でWordPressを使うことが多くなってますが、今回書く記事はCSSなのでどの環境でも使えるネタかもしれません。
そこで今回は絶対配置を利用したレイヤー構造のようなCSSです。
イラスト整理してたらChrome発見した。
「これ要らない」って外されたイラストだったな。まあゲラにこれは要らないか。
遊魚船 北斗の2万円HPをデザインしてるときにIllustrator上で作ったものかも。
MS Outlook | abcdefg hijklmnopqrstuvwxyz ABCDEFG HIJKLMNOPQRSTUVWXYZ 0123456789 |
---|---|
Symbol | abcdefghijklmnopqrstuvwxyz ABCDEFGHIJKLMNOPQRSTUVWXYZ 0123456789 |
Wingdings | abcdefg hijklmnopqrstuvwxyz ABCDEFG HIJKLMNOPQRSTUVWXYZ 0123456789 |
Wingdings 2 | abcdefg hijklmnopqrstuvwxyz ABCDEFG HIJKLMNOPQRSTUVWXYZ 0123456789 |
Wingdings 3 | abcdefg hijklmnopqrstuvwxyz ABCDEFG HIJKLMNOPQRSTUVWXYZ 0123456789 |
SEO対策用にグローバルナビ編集したのは昨日ですが、なんかトップページ(ボタンだけ)が、"../"になってたので、こちらを修正。これだとタウンネットブログにリンクされます。
何でこんなリンク先の書き方してるかと言うと、自分がまだ相対パスのリンク付けに慣れてないからです。だからいち早く覚えるためにこの書き方にしてます。
相対パス → ../iha/
絶対パス → http://blog.town-nets.com/iha/
"./"で今居る階層(ディレクトリ)から。
"../"でひとつ上の階層(ディレクトリ)から。
"../../"で二つ上の階層(ディレクトリ)から。
"/"からでも、おk。階層(ディレクトリ)が分かってれば。
でも"/"だけのリンクにすると、「タウンネットブログ」に行くんじゃないかな?
一旦、トップページの「トップページ」ボタンだけテスト・・・
*** オリジナルデザインでテスト中 ***
2012.04.01 17:45
テスト完了!
やっぱタウンネットブログにリンクされますね。という事で"../iha/"に戻しました。
でもサイトマップのソースだけは絶対パスになってますね。修正したいけど、アレ、PHP側でしかできないから一般管理ページからは無理だな。
2012.04.21 21:10
サイトマップのリンクソースですが、考えてみればindex.htmlと同じディレクトリにあるわけですから"./sitemap.html"で出来ました。一般管理ページから修正できます。
昨日・・いや一昨日から、5万円HPでFlashの制作をすることになりました。しかもフリーソフトでFlash制作。
んで、これは昨日の話。
今回使用したフリーソフトは'parafla'です。DLした後はZIPを解凍し、起動。
最初は使い方を全然知りませんし、Adobe以外の製品で制作って・・的な抵抗がありました。が、ネット上には無数のマニュアルが存在するし、paraflaに備わってるヘルプよりも読み易く、分かり易くて仕事をしながら勉強&制作に取り掛かってました(笑)
paraflaでの実作業は直感的で数値を入力していればFlashが出来上がっていくので結構簡単に出来上がります。しかし、難点があります。それはレイヤーやタイムラインが無い事です。
無かったけど調べて行く内に分かったことがあります。それが「深度」と呼ばれる存在。階層ではなく深度・・何故、深度なんだろう?とか疑問を持ちますが、前面に置きたいオブジェクトの重要度とでも言った方が良いでしょうか、それがキーでした。
深度は数値が上がるほど前面に来ます。最初は0と1だけしか使ってなかったのですが、それだとプレビューしたとき1つのスプライトしか動いてませんでしたので、2以上の深度をもってプレビューしたとき初めて2つのスプライトが動かせました。
※スプライトは、「Flashの中にFlashを作成するもの」と例えられていました。確かにその通りです。敢えて補足すると、複数のレイヤーを同時に動かしたいときに用いる方法です。動かす為の「メイン」というものを第1階層に分類されオブジェクトを1つしか動かせないので、スプライトをメインの中に作り、その中でオブジェクトを動かすというものでした。要するにフォルダみたいなものだと言う事。
この仕組みが分かると作業効率が一気に良くなりFlashが完成。SWFファイルにした後、HTML編集用にHTMLファイルとして保存しました。
残るは5万円HPのクライアントページに貼るだけなのですが、貼り付けてもページでは見れないという結果になりました。<object>で貼り付けたんですがNG。なら<embed>を<object>内に埋め込んだけど表示されないどころか、入力した文字列が消えていました。これはおかしいのでJavaScriptでも貼り付けてみたんですが、結果NG。
という訳で、この仕事は一端保留になりました(>_<)・・・Flashは出来てますよ。ただ、ページに貼り付けても反映されないだけの話です。
ケソケソさん、Flashの指導ありがとうございます。
Anjiさん、JavaScriptありがとうございます。