mdlab.jpThis domain may be for sale!
Media Queries を使って、Webサイトをスマートフォンに対応させるときの注意書き
今回このブログ - Webデザインレシピを、iPhone などでも見れるようにリデザインしました。使用したのは CSS3 の Media Queries（メディアクエリ）。メディアクエリの使い方や感想、気をつけたい注意書きをまとめてみました！ 遅ればせながらこのブログ – Webデザインレシピを、スマートフォンでも見れるように改修しました。このブログは WordPress で書いているので、スマートフォンや iPad への対応方法はいくつもあるのですが、今回は CSS3 の Media Queries（メディアクエリ）を使って、iPad、iPhone など、いろんなデバイスに対応（対応というか、一応見れる程度）にしてみました。 なので Media Queries を使ったスマートフォン対応と、リデザインしながら思ったことなどをまとめてみました。 CSS3 Media Queries 目次
Androidでfont-weight:boldを適用する方法
Androidでfont-weight:boldを適用する方法 Androidでは日本語にfont-weight:boldが適用されません。 <p style="font-weight:normal">ノーマル normal</p> <p style="font-weight:bold">ボールド bold</p> このHTMLをAndroidで確認すると次のようになります。 日本語だけ太字になっていないですね、デフォルトのフォントにbold体がないらしいんですが、デバイス毎にフォントも変わるのでfont-familyでは回避できず。 対策としてはfont-weightの代わりにtext-shadowを利用して太字にします。 <p style="text-shadow:1px 0 0 black">ボールド bold</p> ただ、この方法だとiPhoneでは太字になるけどAndroidで
lovely ui
device: iphone / ipad / android / app icons / app store / badges / buttons / calendars / capture / coach mark / comments / compose / count / detail / empty states / feed / graphs / home / icons / launch screen / list / login / maps / media player / navigation / notifications / popovers / profile / search / settings / share / stats / walk throughs / trends: circles / gradients / ghost buttons / rai
モバイルサイトデザイン集のモバイルデザインアーカイブ 公式サイト
モバイルデザインアーカイブとは？ 携帯サイトを制作する上で、「ケータイサイトを参考にしたいけど、仕事に役に立つケータイサイト集ないかなー？」と思っているデザイナーの方へ向けて公開させていただきました。 そんなモバイルデザイナーのモバイルデザイナーによるモバイルデザイナーのための国内最大の携帯サイト集です。 モバイルサイト制作を請け負ったけど、「なかなかデザインがまとまらない」「洗練 された携帯サイトのデザインを参考にしたい」といった方のために、優れたデザインの ケータイサイトを集めました。 デザインに優れた携帯サイトはもちろん、技術的に優れた携帯サイト、そして現在のウェブトレンドを捉えた携帯サイトを掲載しています。
ke-tai.org > Blog Archive > ケータイ3キャリアに対応するためのDOCTYPE宣言について
ケータイ3キャリアに対応するためのDOCTYPE宣言について Tweet 2009/10/14 水曜日 matsui Posted in 全キャリア対応, 記事紹介・リンク | 11 Comments » XHTMLを使ってケータイサイトを作成する際には、HTMLの冒頭にDOCTYPE宣言を記述する必要があります。 先日からこの「DOCTYPE宣言」に関するブログエントリーが人気を集めているようなので、当サイトも触れてみようと思います。 下記2つのサイトでは、どちらもif文でユーザエージェントを判定して、DOCTYPEを出し分けるという処理を紹介しています。 → ma-san.org 携帯サイトをHTMLではなくPHPで組むときのDOCTYPE分岐方法 [ma-san.org] → ある人のぼやき 携帯サイトのDOCTYPE分岐方法 [d.hatena.ne.jp] DOCTYPE宣言とは
ドコモ絵文字コードの種類と一覧
パソコン用ドコモ絵文字フォントを格納すると、パソコンで表示できます。Vector > フォント用ユーティリティ 内の i-mode絵文字対応外字データ などで、パソコン用ドコモ絵文字フォント（無料）をダウンロードできます。Vector > フォントエディタ 内の TTEdit などで、フォントを自作することもできます。パソコンの外字登録領域を使うので、フォントの使用には注意が必要です。 外字登録領域のユニコード文字一覧表で外字が登録されているかどうか確認して下さい。パソコンからドコモ携帯へのメール送信や携帯サイトへの投稿に使えます。 （パソコン用ドコモ絵文字フォント不要）ドコモ絵文字メール受信パソコン → パソコンパソコン用ドコモ絵文字フォントが格納されていれば、パソコンで表示できます。ドコモ携帯 → パソコンドコモのメール送信サーバで絵文字が“〓”に変換されているため、パソコンで表示でき
イケてる携帯サイトのデザインを一堂に集めたサイト | ライフハッカー・ジャパン
ライフハッカーみたいなサイトを運営していると、各所からさまざまなプレッシャーをかけられるんです。 たとえば、社長から携帯サイト化しろだとか、もしくは社長から携帯サイト化しろだとか、はたまた社長から携帯サイト化しろだとか...。ま、こうなると、「やったことないしなー」とか、「お金かかるし...」とか、「ぶっちゃけ面倒」などという「いいわけ」をグッと押し込み、形だけでも進めている素振りを見せなきゃいけないわけですな。でも、経験がないから、どこから手をつけて良いのやら、さっぱりわからない。そんなときに、とっても役立つサイトが「モバイルデザインアーカイブ」なんです。 アーカイブされているのは、その名の通り、各種企業の携帯サイトのデザインばかり。BMWやH＆Mなど、超有名企業の超優良デザインを山ほど閲覧できちゃうわけですよ。さらに便利なのは、一部のサイトだけですが、実際にPC上で体験できること。3G
[Think IT] 第1回：携帯サイトとPCサイトはここまで違う！ (1/3)
XHTML Mobile Profileに対応したHTML 本連載では、「PCサイトを制作してきたけど、携帯サイトは初めて」といった企業や個人クリエイター向けにPCとモバイルの違いなどをふまえ、携帯サイトを公開するまでの入門的なノウハウを紹介していきます。 まず、今回はHTMLの種類やタグ、CSSなど携帯ブラウザによる違いと、画面サイズやキャッシュ容量などの端末による違いについて紹介していきます。 では、早速携帯サイトを作る上でマークアップの基本となるHTMLについて説明します（図1-1）。携帯電話はPCと比べても非常に早い進化を遂げてきたため、どれも基本はHTMLを基準に作られていますが、携帯ブラウザ（iモード、EZweb、Yahoo!ケータイ）で表示可能なHTMLの仕様には実に多くの種類が存在します。 現在市場に出回っている機種ということに限定すれば、XHTML Mobile Prof
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
サービス終了のお知らせ
はたらきろく
Mobile Patterns - UI UX Inspirational Gallery for iOS and Android
http://www.designwalker.com/2009/06/mobile-web.html
ケータイFlashでさくさく動く Illustratorデータの作り方