マックの新サイトも導入した「LPO」対策とは？
Webサイトのページビューがなかなか伸びない。アクセス解析をすると、せっかくサイトに来てくれた訪問客の多くが、ページを開いてはすぐに帰ってしまっているようだ――。 「直帰率」や「離脱率」の問題を解決し、サイト内の滞在時間を伸ばしたり、最終的なコンバージョンを高める方法として注目されているのが「LPO（Landing Page Optimization）」だ。LPOとは、検索エンジンなどの外部サイトから訪れる人が最初に開く“着地ページ”を最適化すること。もう少し具体的にいえば、検索キーワードによってページの内容を一部を書き換えたり、関連性の高いページへ誘導する方法だ。 このLPOの仕組みを新たに取り入れたのが、9月25日にリニューアルされた日本マクドナルドのWebサイト（http://www.mcdonalds.co.jp/）だ。以前の白を基調としたポップなイメージから、ブラウンをベースにし
jQueryで作る“Amazon風”インターフェイス (1/5)
「最近、どこでよく買い物していますか？」――こう聞かれて「Amazon！」と答える方も少なくないかもしれません（特に本誌読者であれば）。当初は書店の店頭で入手が難しい書籍の購入などに重宝していたAmazonですが、取扱商品が増えた今では、ペットボトルの水からパソコンまで何でも買える便利なECサイトとして、ネット利用者の生活に定着しました。 もっとも、Webサイトを作る立場から見ると、Amazonの魅力は品揃えやサービスだけではありません。Webサイトのデザイン面からAmazonを見ても優れた点は多数あり、実際、国内外の非常に多くのECサイトがAmazonをお手本にしたUIを採用しています。今回は、「Amazon.co.jp」を参考にさせてもらいましょう。 今回のお手本サイト：『Amazon.co.jp』 米アマゾン・ドットコムの日本法人アマゾンジャパンが2000年から運営するECサイト。現
Web制作に超便利！無料のプロトタイプ作成ツール
本格的なWebデザインに取り掛かる前に作るプロトタイプ。特に受託サイトの制作やチームで制作する場合にはある程度きっちり作っておきたいものだが、「なかなかちょうどいい作成ツールがない」という人も少なくないのではないだろうか。 FireworksやillustratorからVisio、PowerPointまで、プロトタイプの制作に使えるツールはいろいろあるが、今回は無償で使える便利な専用ツールを紹介しよう。それが、オープンソースの「Pencil」だ。Firefox 3のプラグインとして動作するものだが、実際の使い勝手としては独立したアプリケーションのように動く。 使い方は簡単だ。インストールが済むと、Firefoxの[ツール]に[Pencil Sketching]という項目が追加される。Pencilの起動はここをクリックしよう。 プロトタイプを作るための基本操作は、左側に並んでいるGUI部品を
悟空、村の中で文書を探す (1/7)
「1兆ページ以上」といわれる世界中の膨大なWebページの中から、目的の情報を的確に見つけ出すGoogleの検索サービス。日々、当たり前のように利用しているGoogleの検索エンジンがどのような仕組みで動いているか、ご存知ですか？ 本連載では東京大学 情報基盤センター 図書館電子化研究部門 助教の清田陽司氏が解説します。 私はここ数年間、欠かさずにパソコンで日記をつけています。といってもおおげさなものではなく、今日何をしたのか、どこに行ったのか、誰と会ったのか、思いついたアイディアを箇条書きにするだけです。当初は仕事上の必要に迫られてつけはじめたのですが、パソコンで日記をつける大きなメリットに気づいてからはやめられなくなってしまいました。 たとえば、土曜日の夕方に久しぶりに再会する友人と食事をする約束をしたとします。「せっかくの機会だから美味しい店で一緒に食事を楽しみたいなあ。できればスパゲ
LPO導入で用語辞典からASCII.jpへの誘導が2倍に！ (2/4)
LPOで用語辞典からASCII.jpへの回遊を促す ASCII.jpデジタル用語辞典からASCII.jpへの回遊を促すといっても、そもそもデータベースサーバーが別であり、用語辞典側に記事を表示するには、何らかの形でASCII.jpのデータを取り出す必要がある。その点、ASCII.jpのCMSは自社開発であり、データベースの構造を熟知するエンジニアが私の目の前の席に座っているので話が早い。「ASCII.jpのデータをこんな仕様のXML形式で取り出せるようにしてよ」というと、すぐに開発が始まり、ASCII.jpのデータをXMLで出力するインターフェイスが完成した。 私の横には優秀なプログラマーU君が座っている。以前、U君が「Ajaxでデータをやりとりするプログラムを書かせろ」と、生意気なことを言っていたのを思い出し、「ASCII.jpの記事を、ユーザーがWebサイトを訪れた経路に応じて表示する
2日目：顔文字を顔画像に変換しよう (2/2)
顔文字プラグインを使ってみよう それでは、作成したプラグインをHTMLに組み込んで使ってみましょう。 最初にjQueryライブラリファイル、続いてプラグインファイルを読み込ませるため、以下のように書きます。 <script type="text/javascript" src="js/jquery-1.2.6.min.js"></script> <script type="text/javascript" src="js/facemark.js"></script> 次に、ページが読み込まれた後に顔文字変換が実行されるように、スクリプトを書き加えます。ID名が「sampleDoc」のエレメントだけ顔文字に置換する場合は以下のように書きます。 <script type="text/javascript"><!-- $(function () { $("#sampleDoc").facemar
LPOって何？ 始める前に読む基礎知識 (1/3)
Webサイト運営者にとってすっかりポピュラーな存在になった「SEO（検索エンジン最適化）」。企業サイトから個人サイトまで、何らかの方法でSEOを施すことはもはや当たり前になりました。その一方、ここ最近急速に注目されるようになってきたのが、「LPO（ランディングページ最適化）」という考え方です。LPOは大規模サイトを中心に導入が進んでいますが、まだまだ現場のサイト運営やWeb制作者が“使える”情報は多くありません。本特集では今回から3回にわたって、「自分でできるLPO」（セルフLPO）をテーマに、LPOの考え方から個人サイトでも試せる手軽な実装方法までご紹介します。 LPOは「最初に見るページ」をよりよくする方法 そもそも、「LPO」とは何でしょうか？ 具体的にどんなことをするのでしょうか？ LPOはSEO（検索エンジン最適化）やSEM（検索エンジンマーケティング）に比べるとまだまだ知名度が
JavaScriptで飛び出すWebページへ！
「解像度が低く画面領域が狭いPCでも見やすくページを表示させたい」「すっきりとしたレイアウトに見せたい」――そうした、Webページのコンテンツの表示／非表示を切り替えたいことがある。そんなときには、やはりJavaScriptを使うのが便利。上下・左右にコンテンツを折りたためるようにするJavaScriptライブラリはいくつもあるが、今回はちょっと変わった楽しい演出で表示を切り替えてくれるライブラリを紹介しよう。それが「jQuery pageSlide」だ。 jQuery pageSlideは、jQueryのプラグインとして動作するオープンソース（MITライセンス）のJavaScriptライブラリ。このpageSlideをWebページに組み込むと、特定のリンクをクリックするだけで右側から別のコンテンツがスルッとスライドで飛び出してくるようになる。そのまま左側の領域をクリックすると、今度は左か
Google APIがブラウザーで試し放題！
Google Maps、Earth、Search……と、ものすごい数のAPIを公開しているグーグル。それらをマッシュアップして新しいサービスを作ったり、Webページに埋め込んで呼び出したりといった作業をするときに、それぞれのドキュメントやサンプルをいちいち調べるのは面倒だ。そこで活用したいのが、グーグル謹製の「AJAX APIs Playground」だ。 AJAX APIs Playgroundは、ブラウザー上でGoogle AJAX APIのサンプルコードを試せるサービス。単にコードを見るだけではなく、その場で編集してすぐに実行結果をプレビューできるスグレモノだ。 使い方は簡単だ。まず、「Pick」と書かれている左カラムから使いたいAPIを選択する。ツリー状に分類されているリストから選べるほか、検索窓にキーワードを入れても探せる。APIを選択すると、今度は右カラムの「Edit」にJav
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
