モバイルサイトの3キャリア共通CSSと最新コーディング事情 : LINE Corporation ディレクターブログ
こんにちは、「livedoor Blog」を担当している吉沢です。 スマホの登場で、すっかりケータイ (フィーチャーフォン/ケータイ/ガラケー) が日陰に追いやられた感がありますが、ケータイも毎年進化していて、モバイルサイトの開発が行いやすいケータイがユーザへ浸透してきています。 livedoor Blog では、スマートフォン分野に注力しながら、月間15億PV あるケータイ版のUI最適化にも引き続き取り組んでいます。今回は、livedoor Blog で採用した事例を元に、この先1〜2年のケータイ開発・運用に役立てられる、3キャリア共通の CSS から最新のコーディング事情を紹介したいと思います。 アクセスシェア〜ライブドアの場合 まずはどの世代のケータイをメインに開発して表示くずれを起こさないようにするか検討するため、アクセスシェアを把握します。 1年前と比べると、iモードブラウザ2.
Top - FireMobileSimulator.org
FireMobileSimulatorはFirefox/Chrome版ともに配布・メンテナンスを終了しました。本ページの内容は記録のみの目的で残しています。 FireMobileSimulatorとは？ FireMobileSimulatorは、主要３キャリア（DoCoMo/Au/SoftBank）の携帯端末ブラウザをシミュレートして、モバイルサイト開発を容易にするために作成されたGoogle Chrome/Firefoxの拡張機能です。携帯端末のHTTPリクエスト、絵文字表示、位置情報送信機能などの動作をシミュレートすることができます。 モバイルサイトをPCで閲覧するために、従来からある方法として、キャリア公式シミュレータの使用、Proxyの使用、Firefoxのuseragentswitcher+modify headersの組み合わせ等、色々と手段はありましたが、これらの方法はそれぞ
ke-tai.org > Blog Archive > ケータイ大規模サービスの開発・運用に関する資料のまとめ
ケータイ大規模サービスの開発・運用に関する資料のまとめ Tweet 2009/2/18 水曜日 matsui Posted in 記事紹介・リンク | 5 Comments » 先月末に「満足せる豚。眠たげなポチ。大規模サービスの運用事例まとめ」という大変素晴らしいブログエントリーがあり、ブックマークしていたのですが、なかなか時間を作れずに目を通せずにいました。 本日読んでみると、とてもためになる情報が多かったため、まとめのまとめという形ですが、資料の中からケータイ関係の事例を抽出して、簡単にコメントをつけてみました。 まず、大元の記事はこちらです。 → 満足せる豚。眠たげなポチ。 大規模サービスの運用事例まとめ [blog.hacklife.net] → 満足せる豚。眠たげなポチ。 「大規模サービスの運用事例まとめ」に補記 [blog.hacklife.net] → livedoor 開
書籍「携帯サイト コーディング＆デザイン」が発売になります 携帯サイトを作ろう！ -ちょっと詳しいモバイルサイトの作り方-
携帯サイトの作り方を詳しく解説した本 「携帯サイト コーディング＆デザイン」が12月26日（金）に発売（予定）になります。 非常に反響の大きかったThinkITの今から始めるモバイルサイト制作以来の執筆（単著）です。 ────────────────────────────── 携帯サイト コーディング&デザイン 12/26 発売予定 ISBN 978-4-7973-4848-4 著者 高木 悠介（ペンネーム） 価格 2,709円 ページ数 260 出版社 ソフトバンククリエイティブ ────────────────────────────── 今までも、携帯サイトの制作に触れた本はあったのですが、 各キャリアが公表している仕様をただ右から左に流しているだけの書籍や 携帯サイトだけではなく、デコメや着メロ、アプリの作り方など 携帯サイトでできることを鳥瞰したような広く浅い内容で、 誰に向け
「PHP x 携帯サイト デベロッパーズバイブル」が発売になりました
PHPによる携帯サイトの作り方を完全詳解した「PHP x 携帯サイト デベロッパーズバイブル」が発売になりました。 いままで携帯サイトの仕様についてかかれた本などはあったのですが、プログラム特化した決定版の本がなかったので、今回は実際に携帯サイトが簡単に作成できるような完全詳解本をということで執筆しました。 PHPに特化して各仕様を明らかにした上で、プログラムの実装方法をわかりやすく説明しています。 あえてPHPやApacheのインストールキャプチャなどをなくし、最初のページから最後のページまで携帯サイト開発一色の348ページ超のボリュームの大型サイズ本となっています。 こだわったところは初めての携帯開発の方でも理解しやすいように、1章読み進める毎に出来ることが増えるようなフローで説明しているところですね。 「PHP x 携帯サイト デベロッパーズバイブル」各章のフロー ↓Chapter.
携帯サイトをUTF-8で出力するかShift_JISで出力するか - F.Ko-Jiの「一秒後は未来」
携帯サイトをUTF-8で出力しようかShift_JISで出力しようか悩んでいました。 超手抜きでウェブサイトをモバイル対応 2008 – 15Pubを読むと「UTF-8でも大丈夫」とあるのですが、ウノウラボ Unoh Labs: 携帯サイト作成時のXHTMLでの相違点では「文字コードはShift_JIS」と書いてあります。 ネットで調べてみるとポイントになっているのは au の仕様で、公式ページには「EZwebでサポートする文字コードはShift-JISです」とあるにも関わらず、UTF-8でも文字化けすることなく表示できてしまうとのこと。 色々迷った挙げ句、「楽だから」という理由でまずはUTF-8で出力することにしました。 HTMLのContent-Typeは以下のように記述。 <meta http-equiv="content-type" content="application/xht
モバイル開発＠symfony :: handsOut.jp
スライド1: モバイル開発@sym fony第35回PHP勉強会@トライコーン亀本 大地(a.k.a: yudoufu)2008/08/31 スライド2: 自己紹介・ ゆどうふ(id:Yudoufu)・ ゆどうふと焼き肉が大好きなぺちぱー・ 実は今日が誕生日・ 焼き肉好きぺちぱーなのにヤサイ(831)の日生まれ・ …これは懇親会。。。き 期待なんてしてないんだからねっ><・ あっ、石を投げないでっ! スライド3: 今日話すこと・ モバイルサイト開発のポイント・ キャリアごとの違い(3G限定で)・ symfonyでモバイル開発・ symfony(1.0)でどう解決していったか・ 具体的な実装の話 スライド4: モバイルサイト開発・ キャリア/端末の違いを意識した開発が必要・ キャリア/端末情報の取得・ 独自定義のHTTPヘッダー等から取得・ HTML/CSS・ 文字コードのgdgd・
3キャリア対応ケータイXHTMLのTIPS 8つ : アシアルブログ
という素敵仕様なので、泣く泣く各タグ内にstyle属性を書きます。 どーしても我慢できない場合は、外部スタイルシートをインライン展開するようなフィルターを作成するとかでしょうか。ググッてみたら、HTML::DoCoMoCSSというPerlモジュールを作成されている方もいらっしゃいました。 ■画像形式 GIFとJPEGであれば大丈夫なようです。 ・iモード対応コンテンツ作成時の仕様 | サービス・機能 | NTTドコモ ・KDDI au: 技術情報 > 機種別情報一覧 ・ソフトバンク 端末情報 Part1 ～ ソフトバンク 端末情報 Part4 ・Mobile Creation 対応フォーマット一覧 ただ、SoftBankの場合、 ソフトバンク 端末情報 と気になる記述があったりするのですが、この2機種は、 ・V801SHをご利用のお客さまへ ・V-NM701/V801SAをご利用のお客さま
Persistence is Power:ケータイサイトで機種情報を取得する Rails プラグイン mbterm_db - livedoor Blog（ブログ）
実は前から公開してたんだけど、最近の機種情報を追加ついで、あと Rails のプラグインを書く勘を取り戻しついでに、ちょっと手を入れたので、改めて紹介しときます。 mbterm_db は Ruby on Rails でケータイサイトをつくる際に、ブラウザのバージョンや画面サイズを取得する Rails プラグインです。 このプラグインは、以前モバイル勉強会で紹介した機種情報 DB の出力の一形式です。機種情報 DB には、基本的に僕が必要なものしか入れてないのですが、最近は FlashLite に傾倒気味なので、そのうち FlashLite のバージョンくらいは入れるかもしれません。 こんなデータベースを持たずとも、ドコモ以外は HTTP リクエストヘッダにそこそこの情報が含まれているのですが、リクエストヘッダの情報は微妙に足りなかったり(一行の文字数とか)、SSL したら取れない事が
jkondoに憧れて » 超手抜きでウェブサイトをモバイル対応 2008
◆追記 評判良かったので大幅に加筆訂正してみました。 ちょっと昨日、一昨日と携帯向けサイトを作っていたのですが、最近の携帯電話事情がわからず、どういうタグを使えばいいのかとか、CSSは対応しているのかとか、文字コードの問題はどうするのかとかいろいろわからないところが多かったので、ちょっと自分なりに調べてまとめてみます。 間違いが含まれている可能性が非常に高いです。 突っ込み大歓迎。 前提 キャリア別とか2G用にテンプレートを複数作って対応というのは個人で出来るレベルじゃないので、モバイル向けは１ページごとに１枚のテンプレート追加で作る。 なるべくPC向けのテンプレートを大幅に修正しなければいけないようなものは避ける。 長くなるので最初にまとめ ・文字コードはUTF-8。 ・マークアップ言語はXHTML Basic。 ・画像はJPEGかGIF。 ・CSSはインラインで書く。
mysql:13693
From: Shogo Kawada <Shogo Kawada <kawada@xxxxxxxxxx>> Date: Thu, 25 Jan 2007 19:17:17 +0900 Subject: [mysql 13693] モバオク勉強会のご案内 始めて投稿します。ディー・エヌ・エーの川田と申します。 携帯オークションサイト、モバオク(mbok.jp)での MySQL, Perl, FastCGI の活用をテーマにした以下のような 勉強会を予定しております。 ご興味ございましたら、是非お申込みください。 -----------DeNAテクノロジーセミナーへのお誘い--------- ○はじめに このたび株式会社ディー・エヌ・エーではネット業界の先端で活躍 するエンジニアの方々との交流、意見交換を目的に、ＤｅＮＡテク ノロジーセミナーを開催します。モバオク、モバゲータウンなど携帯 メガ
絵文字データベースと相互変換マッピングデータベースのJSONファイルを公開します。
こんにちは、亀本です。 === 追記：みなさんいっぱいはてブしてくれたようなので、せっかくなのでちょっと宣伝です（＾＾； この絵文字データベースは、携帯専用イベント支援サイト「あつまろ☆ねっと」というサイトの、メーリングリスト連動型の掲示板を構築していく過程で出来上がったものです。 「あつまろ☆ねっと」は現在ベータ版ですが、ぜひ利用してやってください<(｡_｡)>ﾍﾟｺﾘ === 携帯サイト作成の際に頭を悩ます最初の関門が、絵文字の取り扱いだと思います。 各社とも絵文字のデータ形式や相互変換表などを公開してくれていますが、取り扱いやすいデータ形式で統一的にまとめてある情報がなかなか存在しなかったりして、車輪の再発明が非常に多い分野ではないかな、という気がしました。 そこで、どうせなら利用しやすいようにきっちり整理しようと思い、各種文字コードや表示形式を統括的に扱う絵文字データと、それらの絵
ke-tai.org » Blog Archive » PHPでケータイからセッションを使う場合の設定方法
PHPでケータイからセッションを使う場合の設定方法 Tweet 2007/12/12 水曜日 matsui Posted in PHP, サーバ | 23 Comments » 今回は、ケータイ上からPHPのセッションを使う場合の設定方法についてです。 ケータイからPHPのセッションを機能を使う場合、端末によってはクッキーが利用できない場合があるため、そのままでは使うことができません。 セッションを使いたい場合は、インストール時のconfigureオプションに、「–enable-trans-sid」を付ける必要があります。 ※Windowsの場合は特に設定の必要はありません。 また、「php.ini」の設定で、次のように設定してください。 ※設定変更後はWebサーバの再起動が必要です session.use_trans_sid = 1 もしくは「.htaccess」でも設定することができま
ケータイコンテンツのデバッグ事情 : LINE Corporation ディレクターブログ
こんにちは、livedoorにてモバイルを担当しているディレクターの岡本です。今日は、社内のケータイコンテンツに関するデバッグ事情をご紹介します。 まず、皆さんは以下のケータイに関することを憶えてますか？ もしくは、知っていますか？ ・ケータイにカメラが搭載された時のこと ・QVGA規格のケータイが発売されて画面の解像度が格段にあがったこと ・DoCoMoのFOMA900シリーズが発売されて大容量のデジタルコンテンツが楽しめるようになったこと ・Vodafone（現SoftBank）の3G規格ケータイの到来により、どのケータイサイトも対応に四苦八苦したこと 上記の出来事はとても昔のことのように思えますが、実際にはほんの何年か前の出来事なんです。そんな歴史を物語るのが以下の写真です。 早いですよね……、モバイルの流れは。私の所属しているモバイルメディア部では、ひとり3〜4台のケータイ、多い人
はてなグループの終了日を2020年1月31日(金)に決定しました - はてなの告知
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
CodeZine：携帯シミュレータ入門（開発ツール, まとめ）
はじめに 携帯サイトは、PCのWebブラウザではテストできません。携帯のWebブラウザにはさまざまな機種依存仕様があるからです。マークアップ言語の違い（HTML/HDML）絵文字表示可能な画像形式（gif/png/jpg、カラー/モノクロ、色数、サイズ）受信サイズアクセスキー これらは携帯の実機でテストする必要がありますが、開発中に携帯の実機でテストをするのは大変です。実機ではソースを見ることもできませんし、経費もかかります。 そこで携帯シミュレータの出番です。すべての機種依存仕様を正確にシミュレートできるわけではありませんが、上記のうち、1. 、2. 、5. をテストすることができます。本稿では、携帯サイトの開発に必須となる携帯シミュレータの紹介と、使用上のポイントを説明します。対象読者 携帯向けWebサイトの開発者必要な環境 Windows 2000/XP携帯シミュレータ一覧 携帯シ
モバイルサイトのスピード構築術 - livedoor ディレクター Blog
こんにちは、櫛井です。 現在はPC版のPICSやAuthなどのPCサイトを主に担当していますが、昨年の4月に公開されたlivedoor PICSのモバイル版の開発についてお話しようかと思います。 （当時はモバイルの部署におり、livedoorのモバイルサイトを色々と作っていました） 機能面などはプレスリリースや開発日誌などをご覧いただくとして、livedoor PICSモバイル版の開発は以下の手順で行いました。 ■モバイルサイト作成の下準備 元々PC版でlivedoor PICSというPCサイトをスタートしていたので、基本的にはモバイル版で見る際の要件をまとめ、連携する他のコンテンツの状況を調査し、見せ方を資料に落とし込んでいく作業というのをまず行います。 私の場合は最初は手書きです。要件やイメージをざっくり形にするだけなので大抵は30分くらいで一気に書きます。 かなり汚いですが、こういう
携帯端末の個体識別情報(uid)取得方法
携帯サイトでユーザー認証をする方法はいくつかあります。 一番簡単なのは、ユーザ名とパスワードを使う方法です。 しかし、毎回入力するのはユーザにとっては面倒ですよね。 PCサイトならばクッキーを使ってこれらの情報を保存しておけるので 毎回入力する必要はありません。 しかし携帯サイトではクッキーが使えない(一部機種によって可能らしい)ので 別の手法を取ることを考えなくてはいけません。 そこで出てくるのが、携帯端末の個体識別情報(uid)を使うというやり方です。 携帯電話は電話番号と同じように、その端末を識別するIDのようなものを持っています。 これを利用すれば、アクセスしてきたのがどのユーザなのかを判別することが可能になるというわけです。 キャリアによって取得方法や制限などがあるので、以下に紹介します。 なお、個体識別情報はキャリアによって様々な言い方があるようですが ここでは便宜上「端末ID
ウノウラボ Unoh Labs: 携帯サイト作成時の注意点(au編)
こんばんは。harukです。 前回のSoftBank編に続き、今回はau編です。 なお、HDMLに関しては扱ったことがないため、含まれていません。 mailtoに半角カタカナは使えない 半角カタカナを受け付けない端末があり、その端末ではメーラが起動してくれません。 テキストボックスに改行が入力できる auはテキストボックスでもtextareaと同じように改行が普通に入力できます。 テキストボックスだからといって安心はできません。 お気に入りに追加するリンクが使える 以下のようなタグで簡単にお気に入りに追加させることができます。 <a href="device:home/bookmark?url=URL&title=タイトル">お気に入りに追加</a> ※URLエンコードが必要です。 device:は他にも色々あるみたいです。調べればすぐ見つかります。 cookieが使える
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Amazon.co.jp: プロセス・オブ・モバイル・サクセス: 企画・発案から制作・運営・SEMまで携帯サイトを成功に導く55のポイント: 美谷広海: 本
