モバイルサイトを構築するときに役立つフレームワーク5選

five-mobile-frameworks

スマートフォンやタブレットなどのモバイル端末の普及に合わせて、モバイル端末によるWEBサイトへのアクセスやモバイルアプリケーションの需要が多くなってきていることを感じます。

今回はモバイル端末に最適化されたWEBサイトやアプリケーションを制作するときに役立つフレームワークを5つご紹介します。

jQuery Mobile

「jQueryMobile」はjQueryとHTML5、CSSをベースに構築されたフレームワークです。ライセンスは「MIT license」にて、配布されています。スマートフォンやタブレットだけでなく、デスクトップにも対応するレスポンシブ対応のWEBサイトを構築することができます。レイアウトをはじめ、各種ボタン、ナビゲーション、フォームデザインなど一般的なユーザーインターフェースが揃っています。

jQuery-Mobile-Demos

Apache Cordova

「Apache Cordova」はモバイル向けのアプリケーション開発用に構築されたフレームワークです。ライセンスは「Apache License v2.0」にて配布されています。「Apache Cordova」はアプリケーションをJavaやObjective-Cなどのプログラミングコードを使わずに、HTML、CSS、そしてJavaScriptを用いてアプリケーションを構築するコンセプトで作られており、iOSアプリとAndroidアプリ間でシームレスな開発を行うことができるなどのメリットがあります。

「Apache Cordova」HTML、CSS、JavaScriptなどのファイル群で、開発するためには各プラットフォームのSDKやコマンドラインからビルドする必要があります。

Apache-Cordova

Lungo

「Lungo」はHTML5、CSS、JavaScriptをベースにスマートフォンやタブレット向けのシンプルなモバイルインターフェースを構築することができるフレームワークです。ライセンスは「GPLv3」にて配布されています。手軽にモバイル向けのWEBサイトを構築したい場合などに向いてそうです。

Lungo

jQT

「jQT」はHTML5、CSS、JavaScriptをベースにスマートフォン向けのシンプルなモバイルインターフェースを構築することができるフレームワークです。ライセンスは「MIT license」にて、配布されています。レイアウトやボタンなどもシンプルなので、カスタマイズしやすそうです。時計表示などのオブジェクトがあるのも特徴的です。

jqtjs

Junior

「Junior」はHTML5、CSS、JavaScriptをベースにスマートフォン向けのモバイルインターフェースを構築することができるフレームワークです。画像スライドなどWEBサイト向けのインターフェースがあるのが特徴的です。

justspamjustin

以上、5つをご紹介いたしました。モバイル向けのフレームワークはこれら以外にもありますので今後も注目してみたいと思います。

関連記事

【JavaScript】国産ライブラリtmlib.jsを使ったアニメーション入門

「tmlib.js」はゲームやブラウザツールを簡単に作る事ができる国産のJavaScriptライブラリです。「tmlib.js」を使うとアニメーションや画像表示、サウンドなどゲームなどに必要な処理がプログラミングしやすいようになります。 WEBサイトなどにもアニメーショ...続きを読む

2015.03.11HTMLコーディング

【CSS】CSS3による枠線の新しい表現方法

CSS3より定義された「Border Radius」「Border Image」を使うことで角丸のボックスや、罫線の装飾によってこれまで画像で作成していた要素をCSSのみでデザインすることができるようになりました。 角丸(border-radius) 「b...続きを読む

2015.02.08CSSHTMLコーディング

地方の中小企業Web担当者が知っておきたいChatGPT無料版でできるWeb運営の7つの使い方

「ホームページはあるけれど、問い合わせにつながらない」 「何を直せばいいのか分からず、更新が止まっている」 そんな悩みを感じたことはありませんか。 地方の中小企業では、Web専任の担当者を置くのが難しく、 経営者や事務担当者がWeb担当を兼ねて...続きを読む

2025.12.18

HTML5の可能性とメリット

HTML5とは? W3C より2008年1月22日にHTML5のドラフト(草案)が発表、2014年には正式に勧告されるのではないかと言われています。 HTML5は、ウェブページのヘッダ情報を示すhead要素、ナビゲーションのブロック用のnav要素、コピーライトなどのフッタ...続きを読む

2015.02.06HTMLコーディング

【CSS】CSSカウンター入門|番号を自動で付与する基本と活用例

CSSカウンターとは?初心者でもできる番号自動付与の基本 Webサイトを作っていると、リストや段落に番号を振りたい場面が多々あります。 HTMLの<ol>タグを使えば自動的に番号が付与されますが、「思った通りにデザインできない」...続きを読む

2025.10.02CSSHTMLコーディング