iPhoneサイトのデザインがまとめられた「iPhoneデザインアーカイブ」がオープンしたとのことです

2010/5/26 水曜日 Posted in iPhone, タレコミ, 記事紹介・リンク | No Comments »

メール経由でタレコミをいただきました。 (情報提供ありがとうございます) iPhoneサイトのデザインがまとめられた「iPhoneデザインアーカイブ」がオープンしたとのことです。     → iPhoneデザインアーカイブ [iphonedesignarchive.jp]   サイトの名前を聞いてピンと来た方も多いかもしれませんが、ケータイサイトのデザインをまとめたサイトで有名な、あの「モバイルデザインアーカイブ」の姉妹サイトとなっています。   内容は、iPhone向けで良質なデザインを提供しているサイトを紹介し、カテゴリ別にまとめていくという形になっています。 モバイルデザインアーカイブでは、(当たり前ですが)日本国内のサイトだけが紹介されていたのですが、こちらのサイトでは、海外のサイトも積極に紹介されており、なんだか新鮮です。   iPhoneデザインアーカイブのサイト自体のデザインもiPhoneを模したものになっており凝っていますね。 iPhone向けのデザインをしているデザイナーさんは必見のサイトだと思います。   関連: ブックレビュー:モバイルデザインアーカイブの本。Ver.2.0 ブックレビュー:携帯Webコレクション モバイルデザインアーカイブの本。 ケータイサイトのデザインをジャンル別にまとめて紹介している「モバイルデザインアーカイブ」 Read more..

ケータイサイトでのtableタグの使い方がまとめられた記事「一歩上行く!携帯HTML/XHTMLデザイン・コーディング術(第二弾)」

2010/3/2 火曜日 Posted in デザイン, 記事紹介・リンク | No Comments »

case:MobileDesign!さんに、先日ご紹介させていただいた記事の続編が掲載されていましたのでご紹介します。 今回はtableタグのコーディングについてです。   → case:MobileDesign! モバイルサイトのデザイン紹介ブログ 一歩上行く!携帯HTML/XHTMLデザイン・コーディング術(第二弾) [d.hatena.ne.jp]   最近は対応端末がほとんどとなっているためそれほどでもありませんが、tableタグはケータイサイトを作る上ではまりやすいポイントとなっていました。   ドコモ901以前の世代に対応しなくてよいのであれば、表現力の限られるケータイサイトのデザインでは、tableタグをうまく使うことは非常に重要になってきます。 上記のブログを参考に勉強してみてはいかがでしょうか。   関連: デザインに優れたケータイサイトをキャプチャ付きで紹介しているサイト「case:MobileDesign! モバイルサイトのデザイン」 ケータイサイトのデザインをジャンル別にまとめて紹介している「モバイルデザインアーカイブ」 見栄えの良いケータイサイトを作るためのポイントがまとめられた記事「一歩上行く!携帯HTML/XHTMLデザイン・コーディング術」 Read more..

見栄えの良いケータイサイトを作るためのポイントがまとめられた記事「一歩上行く!携帯HTML/XHTMLデザイン・コーディング術」

2010/2/19 金曜日 Posted in デザイン, 記事紹介・リンク | No Comments »

コーディング絡みで良い記事がありましたのでご紹介します。 モバイルサイトのデザインを紹介しているブログ「case:MobileDesign!」で、「一歩上行く!携帯HTML/XHTMLデザイン・コーディング術(第一弾)」というエントリーがありました。 → case:MobileDesign! モバイルサイトのデザイン紹介ブログ 一歩上行く!携帯HTML/XHTMLデザイン・コーディング術(第一弾) [d.hatena.ne.jp]   横幅240pxの画像を作るときは良く考えて! リンク用画像を作るときはマージンも画像内に含めて! 左右にマージンを取ってテキストを読みやすく! XHTMLで背景を切り替える時は<div>に要注意! 今回は第一弾ということで、上記4つのテクニックが掲載されていました。 2番目のリンク用画像については、私はいつも余白を取らずギリギリで作成してしまっていたため、今度から素材を作る機会があれば活用していこうと思います。   4番目のauで背景画像に切れ目が入ってしまう件は、ハマりやすいポイントですね。 こちらのブログでも詳しく解説されているので、合わせて参考にしてみてください。 → ゆめ技:ゆめみスタッフブログ 【3キャリア共通コーディング】au(EZweb)端末で、divの隙間を消す裏技。 [yumewaza.yumemi.co.jp]   第二弾のエントリーも期待しています。   関連: デザインに優れたケータイサイトをキャプチャ付きで紹介しているサイト「case:MobileDesign! モバイルサイトのデザイン」 ケータイサイトのデザインをジャンル別にまとめて紹介している「モバイルデザインアーカイブ」 ゆめみのmod_ktaiがとうとうリリース、しかも無償利用が可能 Read more..

ブックレビュー:モバイルデザインアーカイブの本。Ver.2.0

2010/2/16 火曜日 Posted in ブックレビュー | No Comments »

著者の津田様よりご献本いただきました。 ありがとうございます。 レビューを書かせていただきたいと思います。   → Amazon モバイルデザインアーカイブの本。Ver.2.0 (携帯Webコレクション) [www.amazon.co.jp]   「モバイルデザインアーカイブの本。Ver.2.0 携帯Webコレクション」は、昨年発売された「モバイルデザインアーカイブの本」の続編です。 → そのときのレビューはこちら   今回は前巻よりも12サイト多い、計126サイトのキャプチャが収録されています。 (もちろん収録サイトに重複はありません) 内容としてはこちらのケータイサイトデザインを紹介するサイト「モバイルデザインアーカイブ」が、書籍になったという位置づけで、スクリーンキャプチャ集という感じです。 → モバイルデザインアーカイブ トップ [mobiledesignarchive.jp]   前巻の時もそうでしたが、今回もamazonではさっそく品切れ状態となっているようですね、本書の人気のほどが伺えます。 使い方としては、サイトのデザイン作成を行う場合に、参考にしたいデザインのサイトを探したり、クライアントとの打ち合わせでイメージを掴む、といった形になると思います。 サイトのデザインを考える際の打ち合わせで、みんなで小さなケータイの画面を覗き込んで打ち合わせする、といった状態になったりしなくても済むのは嬉しいですね。   掲載サイト数も増えて、かつフルカラーなのにも関わらず、1600円という安価なお値段も助かるところです。 ケータイサイト構築にかかわる方であれば、即購入で後悔のない一冊といえるのではないでしょうか。   関連: ブックレビュー:「ケータイ白書2010」 – プレゼン資料や企画書の作成に欠かせない一冊 ブックレビュー:ケータイサイトのレイアウト ブックレビュー:Linux-DB システム構築/運用入門 Read more..

livedoorディレクターブログに掲載されたモバイルデザインに関する記事「そのモバイルサイト見やすい? 使いやすい? ユーザビリティをアップさせるチェックポイント7」

2010/1/14 木曜日 Posted in 記事紹介・リンク | 1 Comment »

これまで何度か取り上げさせていただいたことのあるlivedoorディレクターブログに、ケータイサイトのユーザビリティに関するエントリーがありましたのでご紹介させていただきます。   → livedoorディレクターブログ そのモバイルサイト見やすい? 使いやすい? ユーザビリティをアップさせるチェックポイント7 [blog.livedoor.jp]   モバイルサイトが少しでも見やすく、使いやすいサイトになるよう、チェックすべき7つのポイントがあげられています。 必要な情報がファーストビューに表示されていますか? 情報と情報の間に適度な空間がありますか? センター寄せのテキストが意図しない部分で折り返されていませんか? サイトにアクセス→表示まで時間がかかりすぎていませんか? 横幅いっぱいの画像がつぶれて表示されていませんか? サイトのカラーリングに一定のルールがありますか? ページが長すぎるページがありませんか?   ケータイサイトはPCに比べてどうしても制限が多いため、より一層ユーザビリティに配慮しなければなりません。 基本的な項目も多いですが、livedoorのような大手がどのようなポイントをチェックしているかがわかって参考になりますね。 皆さんも自サイトを確認してみてはいかがでしょうか。   関連: モバイルSEOのチェックリストがまとめられた記事「ディレクターなら押さえておきたいモバイルSEO34項目」 ブックレビュー:ケータイサイトのレイアウト ブックレビュー:携帯Webコレクション モバイルデザインアーカイブの本。 Read more..