◎ Google DriveやDropboxなどのクラウドストレージをホスティングサーバーとして利用する方法を試してみた（１）Google Driveの場合。

この先、個人的にデザインサンプルやお知らせ的な単独のwebページを作る機会が多くなりそうなので、良さそうなホスティングサーバー（レンタルサーバー）を探していたが、維持経費や使い勝手の問題で迷い、決めかねていた。

しかし、よくよく考えてみれば、日頃利用させてもらっているクラウドストレージのGoogle DriveやDropboxなどでもホスティングサーバーとしての利用が可能なはずなので、試してみた。

Google Driveを利用する場合

Google Driveは、無料で5GBまで利用できる。ホスティングサービスとしては十分な領域といえる。もし、他のファイルで無料の領域をいっぱいに利用している場合は、別なアカウントを作るという手もある。ただし、HTML、CSS、javascript、ico程度のものしかアップできない。それでも、使い勝手は悪くないし、なによりも他の無料のレンタルサーバーのようなCMやクレジットが入らないのがありがたい。

また、Google Driveがホスティングサービスに対応したのは、最近のことなので、ここに記すやり方は今後変更されるかもしれない。

作成手順

• Googleのアカウントで、Google Driveにログインする。
• 【新しいフォルダ】ボタンをクリックする。

• 「新しいフォルダ」ダイアログが開くので、フォルダの名前を決め、【作成】ボタンをクリックする。

• そのフォルダを選択して右クリックするか、上部に表示される【その他…】をプルダウンして、【共有…】を選び、更に表示されるウィンドウから【共有…】を選ぶ。

• 「共有設定」ダイアログが開くので、「限定公開 - 下記のユーザーだけがアクセスできます」の右側の「変更…」をクリックする。

• 次の「共有設定」画面で、「ウェブ上で一般公開」にチェックを入れる。下側に「アクセス:全員（ログイン不要）」の文字が加わる。【保存】ボタンをクリック。

• 元の「共有設定」画面に戻る。「限定公開…」が、「ウェブ上で一般公開 - インターネット上の誰でも検索、閲覧できます」に変わっている。下側にある【完了】ボタンをクリックする。

• 元のフォルダ一覧画面（マイドライブ）に戻るので、先ほどのフォルダを開き、公開用のhtmlや、このhtmlに関連する「css」フォルダ、「img」フォルダ、「js」フォルダなどをアップする。フォルダごと画面にドラッグ & ドロップはできないようなので、各フォルダを作成して、この中に各ファイルをドラッグ & ドロップする。下の画像は先にフォルダを作成し、htmlをアップしたところ。

• 目的のhtmlをクリックして、編集画面を表示する。相対パスの修正など、編集が必要ならここで編集する。日本語などマルチバイト文字が化けるが、公開時には問題なく表示される。日本語部分を編集する場合は、テキストエディターなどで編集し直してから再アップしたほうが分かりやすい。
  
• 編集が終わったら「プレビュー」ボタンをクリックする。

• htmlがプレビューされる。
• そしてこのとき表示しているURLが、そのまま公開用になる。

• このURLをコピーしておき、必要に応じて、公開する。

サンプル：

https://googledrive.com/host/0BwZ9MZO-YH1gdUYwT3VXYnJ2aDg/bs-layout-check.html

ちなみに、このサンプルは、twitter Bootstrapをカスタマイズする際にセレクターの振る舞いを確認するためのもの（このブログで紹介済） 。
詳細はこちら：http://ipodtouchmtb.blogspot.jp/2013/02/jquerytwitter-bootstrapcsscsshtml.html