はじめてのスマートフォンサイト制作「jQuery Mobile を使った制作編」
前回の基礎知識や開発環境の準備編で、基本的な勉強や開発環境は揃えましたので、本記事では具体的な制作に入っていきます。 どんな風に作るのか ハイクオリティで広範囲のプラットフォームに対応したスマートフォンサイトを作りあげるにあたって jQuery Mobile を使用していきます。また URL は統一して（スマホサイトを別 URL で作成せず）スマホアクセス時にスマホ用の出力に最適化します。そのため、サイトの構造に変更は加えませんが、全てのページにおいてスマホ用のレイアウトを出力できるように変更を加えていきます。 jQeury Mobile について スマホサイトの作成に jQuery Mobile について学んでいきます。今まで jQuery Mobile を使用したことがありませんので、今回一から全て勉強しました。といっても、基本的なことは全て下記サイトにありますので、jQuery Mo
WordPressでKtai Styleを使ってjQuery Mobileスマートフォンサイトを制作する流れ
前回のエントリーからjQueryMobileでスマートフォンサイトを制作し、その後幾つかの修正を重ねそれなりの形になってきたので作業の流れをまとめました。 WordPressのプラグインKtai Styleを使ったjQuery Mobileスマートフォンサイトを制作する流れです。 前回のエントリーからjQueryMobileでスマートフォンサイトを制作し、その後幾つかの修正を重ねそれなりの形になってきたので 作業の流れをまとめました。 やり方は人それぞれだと思いますが、 作業の参考になってくれたら幸いです。 ラフの作成 HTMLマークアップ デザイン（テーマ）のカスタマイズ WordPressテーマ作成 Tipsなど 1.ラフの作成 一般的なwebサイト制作と同様にまずラフを制作します。 また、jQuery Mobileの特徴でもある画面遷移時の効果や、 表示のされ方などもこの時点で決めて
iPhoneやAndroid向けのUIパターンギャラリー・Mobile Design Pattern Gallery
カテゴリがしっかり分けられていて 凄く見やすかったのでご紹介。iPhone やAndroid向けのUIパターンギャラリー です。アプリデベロッパーさんや アプリデザイナー、モバイル向けの デザインの参考にいかがでしょう。 パターンギャラリーはもうすでにいくつもありますけど、ここは特にちゃんと分けてくれているので見やすい印象でした。 左サイドに大まかなカテゴリーがあります。それぞれには更に細かいパターンに分けられています。たとえば、ナビゲーションならリストタイプ、メガメニュー、カルーセル真紀など。 こちらは検索のカテゴリ。検索ボックスや、オートコンプリート、ソート機能付きなどなど。 インビテーション・・・サイトツアーみたいなやつです。こういうのあんまり紹介されてませんよね。 パターンはその場でLightbox風に表示するのでページ推移も必要ありません。 みたいな感じのパターンギャラリーです。
jQuery Mobile が必須スキルになる！と思うのでこれから勉強する際に参考になる記事まとめ | バシャログ。
Adobe の Creative Suite 5.5 が発表になりましたね。 Dreamweaver の進化っぷりが凄まじいです。マジで。 HTML5+CSS3への対応が目に付きますが、個人的にはjQuery MobileとPhoneGapフレームワークの導入に注目します。 アプリ開発はこれまで、Objective-Cやjavaが主流でしたがDreamweaverでアプリへの書き出しまで出来てしまうなんて…。今後、モバイルアプリケーションの統合開発環境のデファクトスタンダードになる予感が。 ってことで、まずはjQuery Mobileを理解せねば！ jQery Mobile についてはまだ書籍はあまりなく洋書しかありませんでしたので、参考になる記事を取り上げてみます。 http://jquerymobile.com/ 本家サイト jQuery Mobile Gallery http://w
Japanese Mobile | Drupal.org
Japanese Mobile is a theme aimed at making a functional Drupal site for Japanese mobile phones(DoCoMo, au, Softbank). Since Drupal doesn't work with Japanese mobile phones by default, the theme uses a number of overrides in order to make Drupal compatible with them. Features User agent detection & dynamic header depending on a carrier Inline CSS in order to deal with DoCoMo's inability to use exte
[XHTML] 携帯サイト（ガラケー）用 XHTML仕様まとめ
各キャリアの最小サイト構成サンプルと備考 Docomo XHTMLバージョンにより、DOCTYPE宣言内のLocale部分の数値が変わる。 content-typeがapplication/xhtml+xmlでないとXHTMLとして認識されない。 Content-Length（ファイルサイズ）が必須。サーバーが付けてくれない場合はmeta手書き。 HR要素のsize属性/height属性の値に関わらず、常に0.5emのマージンを取る。 <?xml version="1.0" encoding="Shift_JIS"?> <!DOCTYPE html PUBLIC "-//i-mode group (ja)//DTD XHTML i-XHTML(Locale/Ver.=ja/1.0) 1.0//EN" "i-xhtml_4ja_10.dtd"> <html xmlns="http://www
![[XHTML] 携帯サイト（ガラケー）用 XHTML仕様まとめ](https://cdn-ak-scissors.b.st-hatena.com/image/square/8d71ff5111e05619a10d29bb40d7aebaa75c8fbc/height=288;version=1;width=512/https%3A%2F%2Fs0.wp.com%2Fi%2Fblank.jpg)
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
jQuery Mobile 1.1.0 日本語リファレンス
Adobe モバイル＆デバイス デベロッパーセンター