近年、何か不祥事起こしたときに、自社のWEBサイトに画像で謝罪文を出す企業が増えてきました。
「普通にテキストで文章をアップロードすればいいのになんで画像なの？」という方のために簡単に説明すると、画像だとテキストがGoogleにインデックスされないからです。
追記：一部のみの抜粋や改変を防ぐためというメインの理由もあるようです。
そうすることで、ユーザーが、企業のことを調べようと検索しようとしたときに、過去の不祥事を見つけづらくすることができます。
最近だと、「アホ男子かるた」を発売しようとした株式会社ユーメイドの「『アホ男子かるた』発売延期のお詫び」や
ちょっと前なら、セクハラで学長が解任された上智大短大サイトが丸々1枚の画像になっていたなんてこともありました。
今回は、そんな検索よけ謝罪文の新たな一手となりそうな方法「CSS謝罪文」が面白い手法だったのでご紹介。
この記事は、記事を一部修正した（関連記事を付け加えた）ため2016年11月の更新になっていますが、2014年2月3日に公開したものです。内容自体は古いかもしれないのでご了承ください。
スポンサーリンク
目次
CSS謝罪文作成手法
まずは、謝罪文を掲載する場所に以下のHTMLを記載します。
1 | <div id="s"><p><p><p><p><p></div> |
次にCSSファイルかstyleの埋め込みタグ内に以下のように書きます。CSS謝罪文には、SCSS/Compassで書かれたものがありますので、そちらの方がわかりやすいかも。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 | #apology p:first-child { font-weight: bold; font-size: 120%; } #apology p:not(:first-child) { text-indent: 1em; } #apology p:nth-child(1):before { content: "お 詫"; } #apology p:nth-child(1):after { content: " び"; } #apology p:nth-child(2):before { content: "平素は弊社のサービスをご利用いただき、誠にありがとうございます。"; } #apology p:nth-child(3):before { content: "先月の頭くらいに本サービスから、お客様の氏名年齢性別住所電話番号、クレジットカード番号とCVV2が流"; } #apology p:nth-child(3):after { content: "出しているとの指摘があり、株主総会で黒字を強調したあとで発表するように、しばらく調査を伏せさせました。"; } #apology p:nth-child(4):before { content: "理由はとても公表できないようなお粗末な理由だったので言えませんが、とりあえず被害者には賠"; } #apology p:nth-child(4):after { content: "償として、弊社のサービスでしか金銭的価値を持たないクーポン券をばらまいておきます。被害者よりも会社の黒字を維持する方が大切ですが世間がうるさいので、口先だけ謝罪するので許してください。"; } |
これらの記入方法のポイントは以下だそうです。
- CSSに本文が書いてあるので、画面上は表示されているがGoogleでのキーワード検索には引っかからない
- 「流出」などの嫌な単語は:beforeと:afterに「流」「出」を分けて書くことで、自然言語解析を回避
表示
ブラウザで表示させるとこのように表示されます。実物の表示はこちらを参照してください。
CSSってこんな使い方もできるんですね。
その他の謝罪文の手法まとめ。
今朝、原発関連情報の検索に関するこんなニュースを読みました。
原発関連文書に「検索対策疑惑」持ち上がる 「ロ」を「口」、「力」を「...
2016-04-26 19:44
まあちまたではインデックスされないようにとか言われてるけどそんな理由ならhtaccessではねればいいだけで、一部のみの抜粋や改変を防ぐためというのがメインの理由です。もうちょっと頭を使いましょう。