メンテナンス中画面を出す正しい作法と.htaccessの書き方 | Web担当者Forum
今回は、Webサイトやサービスをメンテナンス中にする場合に、どのURLにアクセスしても「メインテナンス中です」の画面を出す正しいやり方を、人間にも検索エンジンにも適切にする作法を主眼に解説します。 この週末の土曜深夜～日曜早朝にかけて、データセンターの設備メインテナンスのため、Web担を含むインプレスグループのほとんどのWebサイトが、どのURLにアクセスしても「メンテ中です」という表示になっていました。 なのですが、その実装がちょっと気になったので、「正しいメンテナンス画面の出し方」を説明してみます。 ※2010-01-16 Retry-Afterを指定するHeaderの指定を修正しました（コメント参照） ※2009-06-17 RewriteCondから [NC] 条件を削除しました（コメント参照） ※2009-06-16 Retry-Afterの記述をGMTに変更しました（コメント参
Webサイトを作ったらまずやるべきことチェックリスト | Web担当者Forum
今日は、Webサイトを作ったらまずやるべきことのチェックリストを紹介しましょう。サイトは作るまでも大切だけど、作ってからのアクションも同じかそれ以上に大切。 すでにサイトを運営している人は、やってないものがないか確認してみましょう。 サイト運営日記をスタートする（変更点を日付と一緒にメモしていく）XMLサイトマップを作って更新内容が含まれるようにするGoogleウェブマスターツールにサイトを登録する → https://www.google.com/webmasters/sitemaps/XMLサイトマップを登録するURLのwwwあり／なしの統一を指定するサイトリンクの表示をチェックして調整（以降随時）Yahoo!サイトエクスプローラーにサイトを登録してXMLサイトマップを登録する → http://siteexplorer.search.yahoo.co.jp/live Webmaste
資料請求を増やす、当たり前（でもとっておき）の秘策（前編） | 実践編
訪問者の半数、5,000人が見込み客と考えてみよう。つまり、資料請求を増やすための大きな戦術としては、 直帰している訪問者のうち、見込み客になる人を帰らせないようにするサイトを何ページも見ている人が資料請求に進むようにするということになるだろう。 資料請求する人の気持ちのなかにある“警戒感”資料請求をする、というのを訪問者側の立場で考えると、どんなものになるだろう。一般的に資料請求はフォームを使って行われる。つまり、会社名、部署名、氏名、所番地、電話番号、メールアドレスなどを書き込まなければならないのだ。 物理的には資料を宅配してもらうために、所番地や電話番号も必要なのだが、もしかすると、ここで所番地を書いたがために、ダイレクトメールががんがん届くようになるかもしれない。電話での営業攻勢が始まるかもしれないのだ。個人情報の扱いが粗くて、どこかに漏れ出す危険もあるだろう。そう思うと、入力する
デザインを魅力的なものにする、シンプルな10個のテクニック
デザインを魅力的なものにする、シンプルな10個のテクニックをSmashing Magazineから紹介します。 10 Simple and Impressive Design Techniques 以下、その意訳です。 手間のかかるデザインテクニックは高度な効果を与えることができますが、間違ったところに使用してしまうと、意図したフォーカスとは異なり、ユーザーの気をそらすだけになってしまうことがあります。 これらのテクニックは、効果的に見せるために必要なデザインかもしれません。しかし、よりシンプルなテクニックでも充分な効果を与えることができます。 シンプルなテクニックやエフェクトというのは、デザインの基本です。 「less is more」の考えを元に、デザインの概観とパフォーマンスを劇的に改善できる非常にシンプルで印象的な10のデザインテクニックを紹介します。 1. Add Contras
不況時代に適した費用対効果重視型ウェブサイトリニューアル手法
◆本コラムのサマリ ・限られた予算の中で最大の成果を創出する場合におすすめなウェブサイトリニューアル手法として、「シナリオベースリニューアル」がある。 ・「シナリオベースリニューアル」とは、ウェブサイト内のシナリオ（ユーザーー心理と行動導線）に注目し、シナリオ上にある問題点の大きさと改善コストや改善による期待効果の大きさを考慮して、費用対効果が高い部分に特化したリニューアルを行うことを指す。 ・ウェブサイトの画面設計や、ウェブサイト外からの集客施策を検討する上でもシナリオは活用できるため、費用を抑えつつ中途半端ではなく着実に成果にフォーカスしたリニューアルを実施することができる。 費用対効果が高いウェブサイトリニューアル手法の必要性 2008年末からの世界同時不況は国内企業に直接・間接的に大きな影響を与えており、2009年は新規投資の見直し・凍結が相次ぎ企業活動が縮小する年となりそうです。
画像などのファイルへの直リンクを禁止する方法
.htaccessを使用して、他のサイトが画像などのファイルを無許可で使用するのを禁止する方法をThe Web Squeezeから紹介します。 Stop Image Hotlinking with .htaccess 「.htaccess」に、下記を記述します。 ※必要の無い箇所は、削除・修正して使用してください。 ※「.htaccess」を修正する場合は、必ずバックアップをしてください。 ※有効範囲は、設置ディレクトリの配下です。 <textarea name="code" class="html" cols="60" rows="5"> #Stop Image Hotlinking RewriteEngine on RewriteCond %{HTTP_REFERER} !^http(s)?://(www\.)?yourdomain.com [NC] RewriteCond %{HTT
jmblog.jp - ソースコードを表示させるのに使うべきHTMLタグは？
ソースコードをWebページで表示させるために、どんなHTMLを書いてますか？私はこれまで、<pre>…</pre> を使っていました。<code>…</code> というタグは知っていましたが、これだと半角スペースや改行がうまく反映されていない、という理由で使っていなかったのです。 が、Web標準の教科書という本を読んで、目からうろこが落ちました。 （pre要素の解説で） pre要素は、code要素と組み合わせてスクリプト言語やプログラミング言語のソースコードを示すのに使うのが一般的である。 （code要素、var要素、samp要素、kbd要素の解説で） コンピュータに特有のテキストを定義するには、次の4つの要素を使用する。 （略） これらはインライン要素であり、インライン要素やテキストを含むことができる。 そうだったのかー！code要素はインライン要素なので、半角スペースや改行が反映
Flickrからデザインのインスピレーションを得る方法 - GIGAZINE
オンライン写真共有サイト「Flickr」には山ほど写真があり、それらは「pool」という名前でいろいろなグループに分けられています。 その中にいくつかデザインのインスピレーションを得るのに非常に適したものがあります。デザインのいい案が思い浮かばないときにパラパラと見ていけば、きゅぴーんと来るものがあるかも……。 詳細は以下の通り。ジャンルは全部で28種類。 design fckr | Featured | Flickr as a source of inspiration インスピレーションを得るためのpoolは以下の28種類。どれもこれもなかなか変わったデザインからオーソドックスなものまで幅広く入っています。 Flickr: The Cover of a Magazine Pool Flickr: The Book Cover Club Pool Flickr: The Posters
ヤフーがyimg.jpを使う本当のワケ - 最速配信研究会(@yamaz)
ヤフーの画像はなぜyimg.jpドメインなのか？ サイト高速化の手法とヤフーの失敗例 でヤフーがなぜドメインを変えて画像サーバを運用しているかが書かれている.「静的なコンテンツに対してクッキーフリードメインを使うことによって速度向上を狙う」というのが理由とあって,これはこれでもちろん正しいのだけれど,これはどちらかというと副次的な理由で本当の理由は違う. クッキーフリードメインを使うことで悪意あるFlashコンテンツなどから自社ドメインのクッキーを守るためというのが本当の理由で,これはあちこちで使われているテクニックだ.Flashコンテンツは外部の業者さんに作ってもらったり,広告の入稿素材として入ってくるので,信頼できないデータとして取り扱う必要があり,万一まずいデータがアップされることがあっても大丈夫にしておく必要がある. 最近ユーザからの任意のコンテンツを受けつけて同一ドメインで配信し
ブログのトップページに出す記事数はいくつが最適なのかを計算する方法&自動計算ツール | 初代編集長ブログ―安田英久
2009年最初のコラムですから、普通は「2009年の抱負」とか「今年はこうなる」とか、そういった内容にするのが普通なのでしょうけれども、あまりそういったことは気にせずに、ふつうの内容でいきます。 今日のお題は、「トップページに掲載するコンテンツの数はいくつが適切なのか」。 ブログのトップページに何記事出すのが良いのでしょうか。また、企業サイトのトップページの「新着情報」には何項目出すのが良いのでしょうか。通常は、「まぁ7つかな」とか、デザイン的な要素をベースに判断することが多いと思います。しかし、本当にそれでいいのでしょうか？ 答を先に出すと、アクセス解析のデータからリピーターの訪問頻度を調べ、自分のサイトの更新頻度と併せて判断して、更新されたコンテンツをできるだけ多くの人が逃さない数を導き出すというのが良いでしょう。 トップページの役割は、いろいろありますが、今回は「常連さんに対して更新
マックの新サイトも導入した「LPO」対策とは？
Webサイトのページビューがなかなか伸びない。アクセス解析をすると、せっかくサイトに来てくれた訪問客の多くが、ページを開いてはすぐに帰ってしまっているようだ――。 「直帰率」や「離脱率」の問題を解決し、サイト内の滞在時間を伸ばしたり、最終的なコンバージョンを高める方法として注目されているのが「LPO（Landing Page Optimization）」だ。LPOとは、検索エンジンなどの外部サイトから訪れる人が最初に開く“着地ページ”を最適化すること。もう少し具体的にいえば、検索キーワードによってページの内容を一部を書き換えたり、関連性の高いページへ誘導する方法だ。 このLPOの仕組みを新たに取り入れたのが、9月25日にリニューアルされた日本マクドナルドのWebサイト（http://www.mcdonalds.co.jp/）だ。以前の白を基調としたポップなイメージから、ブラウンをベースにし
第2回 なぜ、楽天の商品ページはものすごく縦に長いのか？ | gihyo.jp
みなさんはオンラインショッピングモールの「楽天市場」に出店しているの店舗の商品ページをご覧になったことがありますか？ その中で「何で、楽天のお店の商品ページは、こんなに縦長いんだ？」と思われたことはありますか？ おそらく、楽天市場を利用したことのある方のほとんどは、「ものすごく縦長い商品ページ」を見たことがあるのではないかと思います。 ではなぜ、このように縦長いページが多いのでしょうか。そこにはネットショップで売上を上げるためのポイントが多く含まれていたのです。 ショッピングモールの商品ページが「ものすごく縦長い」理由 前回の記事「ネットショップに訪れるお客様の意識」にて、楽天市場やYahoo!ショッピングなどのオンラインショッピングモールを利用するお客様は「お買い物がしたい」という気持ちが強い、と解説しました。 モールに出店している店舗は、このお客様の高い購入意欲をより一層高め、商品を
CSS: Map Pop - Mike’s Experiments
Mike’s Experiments - CSS: Map Pop An image map can be very useful but normally employs JavaScript. Not this time. This experiment uses a single unordered list and a pair of spans to create such a map, with CSS pop-ups providing more information about the mapped hot-spots. This is CSS put to the test. Get the XHTML, CSS, source. Go to back to the Mike’s Experiments index. Popsville Community Map Us
HTML/JavaScriptをインクルード表示させる方法 | エンタープライズ | マイコミジャーナル
WebページでHTMLやJavaScriptを表示させる場合に厄介な問題がある。実際のソースコード、たとえばそれはHTMLやJavaScriptだったりするわけだが、実際に使われるそういったコード保守する必要があるほか、そのコードを表示させているHTMLの方に含まれているコードも保守する必要があるということだ。 大量のチュートリアルを作成している場合などは特に面倒なことになる。デモコードを書き換えるごとに、それを表示させているHTMLの方に含まれているコードも変更しなければならない。編集を忘れてしまえば実際に動作しているコードと表示されるコードが違うという事態にもなる。 同じことを考えるプログラマは多いようだ。Christian Heilmann氏は1月29日(米国時間)、Displaying source code with Ajaxのタイトルのもと、外部のファイルをインクルードして表示
[Think IT] 第1回：携帯サイトとPCサイトはここまで違う！ (1/3)
XHTML Mobile Profileに対応したHTML 本連載では、「PCサイトを制作してきたけど、携帯サイトは初めて」といった企業や個人クリエイター向けにPCとモバイルの違いなどをふまえ、携帯サイトを公開するまでの入門的なノウハウを紹介していきます。 まず、今回はHTMLの種類やタグ、CSSなど携帯ブラウザによる違いと、画面サイズやキャッシュ容量などの端末による違いについて紹介していきます。 では、早速携帯サイトを作る上でマークアップの基本となるHTMLについて説明します（図1-1）。携帯電話はPCと比べても非常に早い進化を遂げてきたため、どれも基本はHTMLを基準に作られていますが、携帯ブラウザ（iモード、EZweb、Yahoo!ケータイ）で表示可能なHTMLの仕様には実に多くの種類が存在します。 現在市場に出回っている機種ということに限定すれば、XHTML Mobile Prof
3G端末（FOMA・WIN・3GC）のモバイルサイトのコーディング＆デザイン - livedoor ディレクター Blog(ブログ)
こんにちは。『Cure』や『livedoor 歌詞』を担当しているモバイルディレクターの吉沢です。 つい最近、PC サイトのディレクターが初めてモバイルサイトの開発を担当するという機会がありました。 どの情報を伝えれば初めてモバイルサイトを担当する人にもスムーズに進められるのか、PC とモバイルで一番特徴のあるコーディングとデザインについて、これだけ覚えておくと簡単な3G（FOMA・WIN・3GC）端末用モバイルサイトが作れてしまうノウハウをご紹介したいと思います。 【01】対応端末について こちらの記事にもあるとおり、3G 端末（FOMA・WIN・3GC）がアクセスの9割を占めているため、これからオープンさせるサイトの対応端末は、3G 端末で十分そうですね。 サイトの内容にもよりますが、下位端末（PDC・P型・C型など）を対応端末として含めてしまうと、機能や容量制限などに悩まされ、逆に運
制作会社で働く人向け「はじめての正規表現」 - あと味
制作会社で働いてると、ディレクターやライターであればライティング作業をすることがあるし、マークアップエンジニアであればHTMLやCSSを処理するし、プログラマーであればコードを書きます。 制作会社に勤めていれば全員何らかの形で、文字列を扱うことになります。 そんな時に正規表現という超強力な文字列処理のテクニックを身につければ、今以上に作業がはかどるし、いろんな問題が解決するのかなーと思い、先週1時間弱の勉強会を開催しました。 プログラマーは普段から使ってるんですけど、なかなか他の部門の人に紹介する機会がないのが現状だったので、多少なり役立ったんじゃないかと思ってます。 せっかくなので、その勉強会で使ったスライドを動画にしてニコニコ動画にアップしたので、ご紹介します。*1 ついでにウェブページ形式にもしてみました。 はじめての正規表現 って中の人が言ってました。 追記： Twitterのフォ
面白いPhotoshop用テキストエフェクト集:phpspot開発日誌
50 Great Photoshop Text Effect Tutorials, Part II | Photoshop Tutorial 面白いPhotoshop用テキストエフェクト集。 布地に糸で縫ったようなエフェクトや、スプレー、３Ｄ、氷、スターウォーズ風、木目など色々なテキストエフェクト集がまとまっていました。 Text In Stitches Colorful Glowing Text Effect Spray Paint Text Reflective Glass Tutorial Spiderman III Furry Text Icey Styles in Photoshop Design a Lego Typography in Photoshop Stunning 3D effects in 30 minutes Creating the Sky Logo Star
[CSS]大胆なドロップダウン型のナビゲーションを実装するスタイルシート
CSSplayのエントリーから、透過PNG画像を使用した大胆なドロップダウン型のナビゲーションを実装するスタイルシートの紹介です。 Professional drop-down #13 with png transparency デザイン的に面白いだけでなく、通常のドロップダウンに比べ領域が広いため、マウス操作を誤ってドロップダウンが非表示になってしまうということも少ないと思います。 対応ブラウザは、IE6, IE7, Firefox, Opera, Safari(PC) and Google Chrome Betaとなっています。 IE6対策には、ドロップダウンの箇所にtable、背景画像にfilter(AlphaImageLoader)が使用されています。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://www.plannel.net/naniwacg/archives/164