スマートフォン向けサイト作成に役立つツール

※この記事は読者によって投稿されたユーザー投稿のため、編集部の見解や意向と異なる場合があります。また、編集部はこの内容について正確性を保証できません。

1.デザイン
2.画像編集
3.シミュレート

スマートフォン向けサイトを作成するにあたって、役に立つツールをご紹介いたします。デザインと画像編集に関してはブラウザ上で動作するツールとなっています。インストールする面倒がなく利用できる利点があります。

■1.デザイン

【CSS3 Generator】
スマートフォンで使われる角丸や影などのスタイルを簡単に作成できるツール。
http://css3generator.com/

【CSS 3.0 MAKER】
スマートフォンで使われる角丸や影などのスタイルを簡単に作成できるツール。
http://www.css3maker.com/

■2.画像編集

【befunky】
ブラウザ上で画像編集ができるツール。無料でも十分使える。日本語版がないのが残念だがいろいろ触っているとかっこよく編集できる。
http://www.befunky.com/

【PHOTOX】
ブラウザ上で画像編集ができるツール。一般的な画像編集ソフトをオンライン化したもの。
http://photox.linkstudio.biz/

■3.シミュレート

【iPhoneシミュレーター】
iPhoneSDK に含まれるツール。技術者向けのため導入が難しい。再現性は本家であるので高い。Macのみ。
http://developer.apple.com/iphone/index.action

【Androidシミュレーター】
AndroidSDK に含まれるツール。技術者向けのため導入が難しい。再現性は本家であるので高い。様々なOSで利用可能。
http://developer.android.com/sdk/index.html

【FireMobileSimulator】
ブラウザFireFoxのアドオン。モバイル用シミュレータで有名。導入は簡単。FireFoxのインストールが必要。レンダリングエンジンが異なるため実機と異なることがある。Viewportのinitial-scaleが効かない。様々なOSで利用可能。
http://firemobilesimulator.org/

【Mobilizer】
Adobe Air により作成されたツール。Andoridには対応していないが、海外製のいくつかのスマートフォンに対応している。導入は簡単。よく再現できている。キャプチャも簡単に撮れる。Viewportのinitial-scaleが効かない。様々なOSで利用可能。
http://www.springbox.com/mobilizer/

【iBBDemo2】
ブラウザSafariを利用したiPhone用のシミュレータ。比較的導入が簡単。Safariのインストールが必要。レンダリングエンジンがiPhoneとほぼ同じためリアルに再現。横向きも可能。Viewportのinitial-scaleが効かない。様々なOSで利用可能。
http://www.puresimstudios.com/ibbdemo/

これらを利用してよりリッチなスマートフォンサイトを作りましょう。

=============================
掲載元のブログではわかりやすい画像つきで公開しています。
■aishipスマートフォン&モバイルEC事例・ノウハウ集
http://www.aiship.jp/knowhow/archives/935
=============================

この記事が役に立ったらシェア!
メルマガの登録はこちら Web担当者に役立つ情報をサクッとゲット!

人気記事トップ10(過去7日間)

今日の用語

インデックス
検索エンジンがWebページをデータベースに保存しているデータベース。データベース ...→用語集へ

インフォメーション

RSSフィード


Web担を応援して支えてくださっている企業さま [各サービス/製品の紹介はこちらから]