jQueryMobileを使って自分のサイトを作ってみる Codiqa

このゴールデンウィークに気になったもの。

Codiqa - the jQuery Mobile Prototype Builder
DEMOでも出来る


最近iPhone用サイトがカッコ良くなってると思いませんか。どうやら、簡単に構築できるデザイン・キットが使われてる様子。Javascriptとcssを組み合わせた基本セット、jQueryMobileです。ただ、コードを覚えないといけない。さすがに記憶力も衰えてるので、これは自信ない。けれど、一筋の希望が黒雲の隙間から差し込んできました。Codiqa。ブラウザでWebデザインを作るサイトです。一切コードを書かなくても完成版ができる。

さっそく codiqa.com にアクセスします。iPadだとドラッグ＆ドロップが効かないので、作業はMacで行いました。アカウントは作らず「WEB DEMO」へ。iPhone画面とパーツが並んでいます。まず「PAGES」の「New page」をクリックし新規ページを作成。名前は「main」にしてみました。それまであったページは「Delete」で削除。「main」ページに「COMPONENTS」から「Page Header」をドラッグし、ひな形の出来上がり。

タイトルだけでは何ですから「List View」を貼り付け、リンクするページも作り、メニューっぽくしました。一段落ついたところで右上「Export App HTML...」をクリック。zipファイルが落ちてきます。これを解凍すると、中にhtmlファイルがある。このファイルを、DropboxのPublicフォルダに置けば、自分だけのホームページが完成。

たとえばiPadからアクセス。DraftPadのアシストをインストールするようにしてみました。下記アドレスからどうぞ。雰囲気がつかめると思います。
https://dl.dropbox.com/u/56343898/draftpad.html

使い方とすると、個人用トップページ。パソコンを替えてもデバイスを買っても、ブラウザのブックマーク転送は面倒です。エクスポートやインポートに時間を取られるより、基本リンク集をDropboxに作っておき、そこに飛ぶだけにしておく。個人的には既にそうしてますが、とても楽ですよ。新しいリンクはReadItLaterで管理してるし。
ただ、一軍入りしたサイトの追加が今まで手間でした。でも、このCodiqaを使うとトップページがすぐ作れ、なおかつスマートフォンでも見やすいデザインになります。テキスト・エディタでの編集も簡単。HTMLのリンク・タグを書き換えるだけ。お試しあれ。
Dropboxに自分用トップページを作ってみる