モバゲーのような携帯サイトを作るための12のTips 携帯ホームページを作ろう！ -ちょっと詳しいモバイルサイトの作り方-
当ブログが携帯サイト作成法に関する記事をかいていることから、読者の方から、 『モバゲーのような携帯サイトを作るためにはどうしたらいいんですか？』 っていう質問を最近良く受けます。 おそらく、モバゲーがとても有名で、ある種モバゲーが携帯サイト界のデファクトスタンダードのような 位置づけになってきているのでしょうか。 確かに、携帯サイトを作ってきている身としても、 モバゲーのサイトデザインにするには、結構難しいことも多いし、学ぶことも多い。しかし、最近の携帯サイトは、実機からしかアクセスできないようになっていて、PCからコードを覗くことができないことも多く、学ぶことも難しいようです。 ということで、今回は実際にモバゲータウンに携帯でアクセスして、携帯の画面を見ながら、デザインを真似て新しく自分なりに作ってみましたので、そこから得た経験をTipsとして公開したいと思います。 ちなみに、左のスクリ
参考資料・ドコモ端末のXHTMLについて - 携帯電話向けコンテンツの書き方
エヌ・ティ・ティドコモ端末でも、XHTMLに対応したフォーマが主流となっており、また、これらの端末では独自のスタイルシートも利用出来ます。 しかし、他キャリアのWAP 2.0互換端末などと較べると、余りにも使い難いものとなっております。 ここでは、そんなドコモ端末に実装されたｉモード向け XHTMLとそれと併用する事とされているｉモード向け CSS(i-CSS)について、参考までに解説する事とします。 ドコモ端末がXHTMLに対応するまで。 ドコモは独自仕様のコンパクト HTMLをベースにしたｉモード向けHTMLをｉモードの記述言語としました。 ベースとなったコンパクト HTMLはW3Cにも標準化を求めて提出されましたが、結局標準化される事はありませんでした。 その後、国際的な携帯電話インターネット標準化団体であるWAP フォーラムがよりフル規格のウェブ仕様に近いWAP 2.0を策定し、W
iモードHTMLシミュレータII | サービス・機能 | NTTドコモ
901iシリーズ以降のiモード対応HTMLとFlash®、デコメールテンプレート、901iSシリーズ以降のPDF、902iシリーズ以降のトルカ、906iシリーズ以降のデコメアニメ、2009年度上期モデルより対応したiモードブラウザ2.0（およびそれ以降）の対応コンテンツを表示する機能 を表示することができます。 ログウィンドウ機能により、HTTP通信のやり取りをチェックすることができます。 表示中のコンテンツ画面の印刷、クリップボード経由で他のアプリケーションへの貼り付けができます。 表示中コンテンツのHTMLソースの表示、編集ができます。 このツールには機種毎の動作をシミュレートする機能はありません。シミュレータと実機では動作が異なる場合がありますので、最終動作確認は実機にて行ってください。
紙を折ったようなエフェクトを実装するチュートリアル | コリス
画像を使用せずに、スタイルシートで紙を折ったようなエフェクトを矩形の角に適用するチュートリアルを紹介します。 Pure CSS folded-corner effect [ad#ad-2] 対応ブラウザはCSS3と:before疑似要素を使用しているため、Firefox 3.5+, Chrome 4+, Safari 4+, Opera 10+, IE 8+です。 デモページ 紙を折ったようなエフェクトの実装 紙を折ったようなエフェクトは、全部で4種類あります。 HTML HTMLはdiv要素を使用するだけで、class名を変更するだけです。 <div class="note"> コンテンツ </div> 適用するclassは「note」です。 全てのベースとなるスタイルシートです。 .note { position:relative; width:480px; padding:1em 1
CSSで角がまるい吹き出しを作る「CSS Speech Bubbles」とか吹き出しいろいろ - GIGAZINE
CSSを使って吹き出しを作成することができるCSSファイルとJSファイル、それから画像ファイルをひとまとめにしたセットです。XHTML1.0準拠で、Internet Explorer 6 と 7、Firefox 2.0、Safari 2.0、Opera 9.0で動作確認ができています。 ダウンロードは以下から。 willmayo.com >> CSS Speech Bubbles 実際のサンプルは以下にあります。 CSS Speech Bubbles 角をまるくしているのは、「curvyCorners」を使用しているとのこと。 ほかにもこの吹き出し方のものは以下に多くあります。 入力欄（フォーム）部分をマウスでクリックすると吹き出しが出てくるタイプ Tooltip for forms リンクの上にマウスを乗せると吹き出しが表示されるタイプ Ajax tooltip リンクの上にマウスを乗せ
Adobe HTML5 特設サイト Dreamweaver® CS6 と HTML5 で始めようスマートフォン＆タブレット対応| Adobe - 日本
Dreamweaver CS6 と HTML5 で始めようスマートフォン＆タブレット対応 HTML5 特設サイトは、HTML5/CSS3 やモバイルデバイスの活用を検討している方に最新情報をお届けするアドビ公式サイトです。 事例から Adobe®Dreamweaver® CS6 を始めとする制作環境まで、幅広い観点から Web の新しい方向性をお伝えします。 本文へ 本サイトについて 本サイト自体が、マルチデバイス対応のレスポンシブなデザインの事例として制作されています。表示される画面の大きさに応じて、閲覧し易い様にレイアウトが変化します。詳しくは「互換化とは」をご覧ください。 jQuery Mobile を使ったスマートフォン向けの専用サイトも公開中です。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
5分で分かる PHP を知らない人が PHP の便利さを学べる記事を書いたよ
Draggable | jQuery UI