Twitterの検索APIを利用して、ペラ1枚のサイトを作っていますが、レスポンシブデザインにならなくて難儀しております。
headタグの間に、viewportをはさめばOKかと思っていましたが、その通りになりません。とすると、このとき対策としては次の3つが考えられます。
- JavaScriptでPCサイトからスマホサイトに誘導する
- サーバー側の.htaccessでPCサイトからスマホサイトに誘導する
- CSSフレームワークであるBootStrapを使う
個人的にはこの3つぐらいかと思ってましたが、本日Gunosy経由で配信された、Google ウェブマスター向け公式ブログの記事を読むと、第4の対策が紹介されていました。
Web FundamentalsとWeb Starter Kit
記事を読んでいると、「現在使われている様々な端末に対応したウェブサイトの開発方法」ということで、Web FundamentalsとWeb Starter Kit の、2つのサイトが紹介されています。
Web Fundamentals
ウェブサイト作成のベスト プラクティスを集めた用例集のことです。Web Fundamentals に書かれた適切な作り方に従うことで、Google が推奨している、検索に適したレスポンシブ デザインのサイトを作ることができます。
Web Starter Kit
Web Fundamentals の用例を応用して、ウェブサイトを一から作るためのフレームワークです。トップページでマルチスクリーンへの対応や、異なるデバイスでも同期して対応するなどの特徴が説明されています。
注意点
2つを適切に使うことによって、Google のアルゴリズムが、ページがレスポンシブ デザインであることを検出しやすくなるというのは、大変魅力的です。ただし、内容をよく見ると注意する点が2つあります。
説明がほとんど英語
見出しなどで日本語で説明されているところがありますが、ほとんど英語で説明されています。
この記事を書いた時点（2014年10月8日）で、”Web Fundamentals とは”で検索しても、一部を除いて、日本語で解説されているサイトがありません。
UNIXコマンドの操作
Web Starter Kitは、NodeJS、NPM、Ruby および Sass に依存しています。NodeJSやそのパッケージであるnpmや、RubyとSaSSの環境が必要で、インストールやバージョン確認に際して、コマンドラインによる操作が必要になります。
〔参考サイト〕