ブックレビュー：ケータイサイト解体新書 – デザインパターンから理解する実装テクニック

2010/6/24 木曜日 Posted in ブックレビュー | No Comments »

昨日に続いて本日もブックレビュー記事です。 発行・発売元のワークスコーポレーション様からご献本いただきました。 ありがとうございます。   →　Amazon　ケータイサイト解体新書 - デザインパターンから理解する実装テクニック [amazon.co.jp] ※発売日は2010年6月26日で、現在予約可能です。   本書「ケータイサイト解体新書 - デザインパターンから理解する実装テクニック」は、デザイン目線で書かれたケータイ解説書です。 著者は「モバデビ」のホシナカズキさん、サイト製作協力は「これからゆっくり考L」のsakaki0214さんとなっています。 目次は次の通りです。 CHAPTER 1　ケータイサイトを取り巻く環境 CHAPTER 2　ケータイサイトの構築とキャリア仕様 CHAPTER 3　デザインをはじめる前に CHAPTER 4　実例にみるケータイサイトデザイン CHAPTER 5　デザインの実践 CHAPTER 6　マークアップ&コーディング 巻末資料   詳細な目次はこちらから見ることができます。 また、内容の一部も立ち読みできます。 →　ワークスコーポレーション　ケータイサイト解体新書　―デザインパターンから理解する実装テクニック ／ホシナカズキ 著 [www.wgn.co.jp]   帯にWebデザイナー必読、HTMLコーダー必読、というキャッチコピーがありますし、冒頭の挨拶文でもデザイン目線でという話が書かれていますが、本当にデザインだけの内容というわけではなく、序盤にはケータイ業界の現状と動向がまとめられていたり、ところどころ技術的な内容も出てきます。   ただしその技術的な箇所の内容は残念ながら少し怪しいようです。 キャリア振り分けのmod_rewriteを使った.htaccessの記述例に「Options +FollowSymLinks」という記述があったり（別にあってはダメというわけではないですが関係ないと思います）、RewriteRuleの記述に不必要と思われる[OR]があったりします。 誤植なのかわかりませんが、スペースが必要なところに入っていませんし、少なくともこのサンプルの通り入力しても動作しないでしょう。   またGoogleマップをケータイサイトに導入するというページでは、「出力はGIF形式になるのでSoftBank端末の一部では表示することができない」という旨の記述がありますが、現在のGoogleMapStaticAPIではformatを指定できると思います。　→　参考 少なくとも1年半前からはformat指定ができたはずなので、少し情報が古いようですね。 そもそも現時点のソフトバンク端末（旧J-Phone端末は停波されたので）であればGIFは全ての機種で見れるはずですし、本書の巻末資料や3章の画像形式のページでもソフトバンク端末のGIF欄は全て「○（表示可能）」になっており矛盾があります。   ただこれらは発売前の見本誌だからかもしれません。直っていることを期待します。 （※もし直っているようでしたら、本記事はすぐ訂正しますのでご指摘をお願いします） 追記(2010/6/25) ご連絡をいただきました、直っていないようです。 随時こちらのURLの「お詫びと訂正」に公開するとのことでした。   それはさておき、デザインに関する記述はというと、こちらはなかなか使えるものになっています。 CHAPTER 4「実例にみるケータイサイトデザイン」という章では、EC系、ポータル系など各系統別の有名サイトのデザイン解説と、そのHTMLソースが掲載されています。 これらは各サイト内にちりばめられたテクニックや工夫が見て取れ、とてもためになります。 またCHAPTER 5「デザインの実践」・CHAPTER 6「マークアップ&コーディング」にも、ぜったい抑えておきたい基本的な内容から、他の書籍ではなかなか載っていないようなマニアックなTIPSまでが紹介されており、参考になるでしょう。   技術的な記述に若干の不安はあるものの、それは内容のごく一部ですし、全体としては魅力的な一冊になっていると思います。 ケータイサイトデザインに関わる方はチェックしてみてはいかがでしょうか。   関連： ブックレビュー：ユーザー視点でつくる　携帯サイト制作の基礎知識 ブックレビュー：mixiアプリをつくろう!OpenSocialで学ぶソーシャルアプリ ブックレビュー：Ruby on Rails携帯サイト開発技法 Read more..

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..

« Previous Entries