タグ

携帯とWeb制作に関するtofu-kunのブックマーク (29)

  • 携帯サイトを作る時に役立ちそうな情報まとめ - かちびと.net

    Tips携帯サイト構築 どうもTwitterやってるとiPhoneAndroidなどのスマートフォンの 話題ばかりなので忘れそうですが、 携帯サイトはビジネスには必須 ですので備忘録として記事に。 ちょっと必要に迫られたのでメモ。 どうもTwitterやってるとiPhoneAndroidなどのスマートフォンの 話題ばかりなので忘れそうですが、 携帯サイトはビジネスには必須 ですので備忘録として記事に。 以前にも何度かまとめ記事が話題に上がっているので今更感も否めませんが自分のブログにあったほうが探しやすいのでメモします。 予備知識モバイルサイト構築前に知っておきたいユーザビリティ10のポイント ファーストビューの重要性、色の大事さ、リンク操作に関して記載されています。 モバイルサイト構築前に知っておきたいユーザビリティ10のポイント 携帯サイト(html)の制作に入る前に確認してお

    携帯サイトを作る時に役立ちそうな情報まとめ - かちびと.net
  • はてなブログ | 無料ブログを作成しよう

    来年も作りたい!ふきのとう料理を満喫した 2024年春の記録 春は自炊が楽しい季節 1年の中で最も自炊が楽しい季節は春だと思う。スーパーの棚にやわらかな色合いの野菜が並ぶと自然とこころが弾む。 中でもときめくのは山菜だ。早いと2月下旬ごろから並び始めるそれは、タラの芽、ふきのとうと続き、桜の頃にはうるい、ウド、こ…

    はてなブログ | 無料ブログを作成しよう
  • PHPを使って3分で作る3キャリア対応ケータイサイト | ke-tai.org

    PHPを使って3分で作る3キャリア対応ケータイサイト Tweet 2009/11/17 火曜日 matsui Posted in ソフト紹介, 全キャリア対応 | 28 Comments » 日は3分で3キャリア対応ケータイサイト作れてしまうというPHPスクリプト、「らくらくケータイ3キャリアコンバーター(仮名)」を作成してみましたので、そのご紹介をさせていただきます。 先日のPHP勉強会で発表させていただきました。 ご参加いただいた皆様、当にありがとうございました。 発表資料をアップしてありますので、まずはこちらをご覧ください。 PHPを使って3分で作る3キャリア対応ケータイサイト View more documents from ketaiorg. ということで、「3分で作る」とは謳っているものの、ドコモ用に作られたHTMLを他キャリア用にコンバートするだけの、実に簡素な作りです。

  • [携帯]フォントサイズ(XHTML版) │ これからゆっくり考L +α

    フォントサイズ(HTML版)に引き続き、今回はXHTML版です。 CSSフォントサイズを指定するので、こんな感じになります。 <span style="font-size:x-small;">文字文字</span> 各指定方法で、実際どのぐらいの大きさで表示されるのかをチェックしやすくするため、サンプルページをつくりました。 サンプルページを色々な端末で見てみると、だいたいどのサイズがいいかーというのが見えてくるかと思います。 サンプルページ QRコード →サンプルページを見る 各種フォントサイズと、ついでに太字のサンプルもおいております。 太字の指定方法はbとstrongとfont-weight:bold;です。 各キャリア、端末の表示 docomo 【大】xx-large,x-large 【中】large,medium 【小】small,x-small,xx-small ※全端末共通

  • モバイルサイトマークアップ5つの小技 : LINE Corporation ディレクターブログ

    こんにちは。10月の組織編成でブログビジネス部に異動になりました飯田です。 普段はディレクターしてますが、時にモバイルサイトのマークアップをするときがあります。以前、こちらのエントリーでモバイルサイトを作るうえでのノウハウを紹介していますが、エントリーではもう少し実践的な「モバイルサイトで○○を表現するには」をすごく簡潔に紹介してみたいと思います。 ある程度の端末で正常に表示されることを確認していますが、一部を除いて正常に表示されない場合もありますがご了承ください。なお、エントリーで紹介している記述はわかりやすいように style 属性を全てインラインで記述しています。 見出しに背景色 div タグXHTML 対応の端末であれば下記のタグで簡単に見出しに背景色をつけることができます。 <div style="background-color="#0000ff;">ほげほげ</div>

  • ウノウラボ Unoh Labs: ゼロからはじめる携帯サイト構築。

    こんにちは、日を妙に楽しみにしていたわりには見ようともしなかった ryosuke です。曇りで残念でした。曇りでも日と分かるぐらい暗くなったら嬉しかったのですが、東京ではそんな事は全然ありませんでしたね。 さてさて、そんな私ですが入社後半年が経過したところで、入社当初より携わって来た携帯サイト構築に関して得た知識(失敗談)をまとめてみようと思います。 初ラボブログ記事でも触れた様にそもそも格的な携帯サイト構築は経験に乏しく、バッドノウハウの塊の様な面倒な思いこみが先行しがちだったわけですが(実際バッドノウハウの塊ですが)、端末の機能や表現力が豊かになるのと同時に開発環境的なツールやライブラリの充実、ノウハウの蓄積と情報公開により随分すんなり入って行けた様に思います。 結局はキャリア感の差異を知り吸収する事がすべて いきなりですが、PCサイトと携帯サイトの違いで最も厄介な所はこれにつき

  • 3キャリア共通のモバイルサイトコーディングにおけるポイント

    MT4i3.0.8X1の公開後、テンプレートセット作ったりしてますが、中には自分でコーディングしたい!って人もいると思われます。 そんな人のために、既に情報としてはいろいろなところで出ているんですが、一応3キャリア(i-mode/EZweb/Yahoo!ケータイ)共通のコーディングのポイントを纏めておこうかなと。 別にMT4i3.0.8X1だけじゃなく、普通にどんなモバイルサイトのコーディングでも使えます。 一応、注意点をまず述べておくと、XHTMLに対応しているのは、 docomoのFOMA端末 auのWIN端末 softbankの3GC端末 という、いわゆる上位端末になります。古い下位機種では利用できません。 最近は下位端末を利用している人は少なくなりましたし、仮に利用していてもまずネット閲覧にケータイを使う目的ではないので、このあたりは非対応でも問題ないかなと考えています。 次に全体

    3キャリア共通のモバイルサイトコーディングにおけるポイント
  • FireMobileSimulator :: Add-ons for Firefox

    FireMobileSimulatorは、主要3キャリア(DoCoMo/Au/SoftBank)の携帯端末ブラウザをシミュレートして、モバイルサイト開発を容易にするために作成されたFirefoxのアドオンです。携帯端末のHTTPリクエスト、絵文字表示、位置情報送信機能などの動作をシミュレートすることができます。 モバイルサイトをPCで閲覧するために、従来からある方法として、キャリア公式シミュレータの使用、Proxyの使用、Firefoxのuseragentswitcher+modify headersの組み合わせ等、色々と手段はありましたが、これらの方法はそれぞれに不足している機能があったり、またITに詳しくない人にとっては導入が面倒かつ困難という面があります。 FireMobileSimulatorは、「誰でも簡単に導入できる」かつ「高機能である」ことを目的に作成された新しい携帯シミュレ

    FireMobileSimulator :: Add-ons for Firefox
  • 携帯用webサイトに、携帯で見れる動画を置きたいんですが、どうすればいいのかさっぱり分かりません。…

    携帯用webサイトに、携帯で見れる動画を置きたいんですが、どうすればいいのかさっぱり分かりません。 ・動画ファイルはキャリア別に作成する必要はありますか? ・どのような拡張子がありますか? ・その動画ファイルに直接リンクを貼れば携帯で再生されますか? ・もしくは、動画を再生するために特別なタグが必要でしょうか?

  • コンテンツ配信 | サービス・機能 | NTTドコモ

    <OBJECT declare id="fomacm.declaration" data="fomacm.3gp" type="video/3gpp"> <PARAM name="count" value="3" valuetype="data"> </OBJECT> <A href="#fomacm.declaration">FOMAコマーシャル</A> iモーションコンテンツを配信するWebサーバでは、Mobile MP4ファイルのContent-Typeが“video/3gpp”もしくは“audio/3gpp”に設定されている必要があります。 iモーションコンテンツをCGI経由でダウンロードする場合は必ずContent-Lengthを付与してください。 モーションi非対応端末ではiモーションコンテンツの再生はできません。同様に、MP4iモーションをASF対応FOMA端末で再生すること

    tofu-kun
    tofu-kun 2009/03/19
    DoCoMo向け携帯動画作成マニュアル
  • 3G端末(FOMA・WIN・3GC)のモバイルサイトのコーディング&デザイン - livedoor ディレクター Blog(ブログ)

    こんにちは。『Cure』や『livedoor 歌詞』を担当しているモバイルディレクターの吉沢です。 つい最近、PC サイトのディレクターが初めてモバイルサイトの開発を担当するという機会がありました。 どの情報を伝えれば初めてモバイルサイトを担当する人にもスムーズに進められるのか、PC とモバイルで一番特徴のあるコーディングとデザインについて、これだけ覚えておくと簡単な3G(FOMA・WIN・3GC)端末用モバイルサイトが作れてしまうノウハウをご紹介したいと思います。 【01】対応端末について こちらの記事にもあるとおり、3G 端末(FOMA・WIN・3GC)がアクセスの9割を占めているため、これからオープンさせるサイトの対応端末は、3G 端末で十分そうですね。 サイトの内容にもよりますが、下位端末(PDC・P型・C型など)を対応端末として含めてしまうと、機能や容量制限などに悩まされ、逆に運

    3G端末(FOMA・WIN・3GC)のモバイルサイトのコーディング&デザイン - livedoor ディレクター Blog(ブログ)
    tofu-kun
    tofu-kun 2008/10/21
    これはいいまとめ
  • ウノウラボ Unoh Labs: 携帯とCookieドメイン

    こんばんわ五十川です。 しばらく前になりますが、ソーシャルスクラップブックclippのモバイル版をリリースしました。cippモバイルではドコモ以外は、セッション管理にCookie(のみ)を利用することにしたのですが、そのときCookieドメインではまりました、というお話。 PC向けclippのドメイン名は、トップページなどのユーザ共通ページは「clipp.in」、ユーザ個別のページは「{username}.clipp.in」(例えばclipp-info.clipp.in)となっています。ケータイサイトをマルチなサブドメインにする例はあまり多くないと思いますが、clippモバイルでは、ルーティング直すのめんどくさいという怠け者な理由で、PC版のドメイン名がそのまま使えればいいなと思って取り掛かりました。しかし、その目論見はあっさりと破綻することになるのでした。 以下の内容は手元の数多くない端

    tofu-kun
    tofu-kun 2008/10/21
    参考になる。それにしても携帯のセッションは鬼門だなぁ。
  • モバイルサイトをリッチ化する

    モバイルリッチサイトとは 前回(http://www.thinkit.co.jp/article/145/1/)では、モバイルサイトにもリッチ化やデザインが求められている市場の状況を紹介しました。実際に、最近では次々とデザイン性に優れたモバイルサイトが生み出され、サイトへの集客やサービスへの効果を上げています。 今回は、具体的なモバイルサイトのリッチ表現方法とその導入法・実現方法などについて紹介していきます。 では現状で表現可能なモバイルのリッチサイトとはどんなサイトなのでしょうか。以下にモバイルリッチサイトの制作・表現のポイントを挙げてみました。 ・XHTMLベース(CSS指定、Table、DIVなどのタグに対応) ・VGA(640×480ドット)など高解像度に対応 ・インラインFlash、インタラクティブFlashでの表現 ・動画での表現 図1での制作事例を基に、大まかなポイントを見て

    tofu-kun
    tofu-kun 2008/10/21
    制作への一歩を踏み出すためのチュートリアル的なもの
  • ケータイユーザーの“本音”   大学生に聞いた20歳前後のケータイ事情

    ケータイのヘビーユーザーは、若年層に多い。パケット定額制の契約率は10~20代が非常に高く、デコメや着うた、ケータイSNSなどのブームも、常にこの層が作り出している。最近では、PCを使わない若者をターゲットにした、「au BOX」のような商品も開発されているほどで、キャリアやメーカーも、若年層の取り込みに必死だ。 こうした事実は、統計データや報道発表を見れば、ある程度は把握できる。だが、それだけでは、若者たちのケータイに対する“感覚”までは、なかなか分からない。そこで、ケータイに中高生の頃から親しんでいる、東京都内の学生5人に集まってもらい、座談会を開催した。掲載した声だけで全体像を判断するのは早計だが、“若年層特有のケータイ事情”の一端に触れることはできるはずだ。 ■ キャリアや端末選びのポイント ――まず、皆さんが使っているケータイやキャリアを教えてください。その機種や会社を選んだ理由

    tofu-kun
    tofu-kun 2008/10/21
    これ、きちんと本音の本意を考えた方がいいと思う。これをそのまんま受け入れると偏ったものになる可能性あり。
  • [Think IT] 第2回:携帯サイトの制作から公開まで (1/3)

    サイト規模に合わせて作り方を選ぶ 前回(http://www.thinkit.co.jp/article/143/1/)は、携帯サイトとPCサイトがどのように違うかを紹介しました。今回は、汎用的な携帯サイト作りを行うための制作の基から、実機テストまで含めた公開までの手順を解説します。 携帯サイトでは、キャリアによる仕様の違いがあるため、これをどの程度まで考慮するか、はじめに考えなくてはなりません。携帯サイトの作成法には、下記の5つの方法がありますが、ここでは「3キャリア対応の静的サイト+プログラム」について紹介します。 1.キャリア別に静的なサイト 2.3キャリア対応の静的サイト+プログラム 3.プログラムによる動的生成 4.CMSを使ったジェネレータ型 5.MobaSiF(http://sourceforge.jp/projects/moba)などのフレームワーク型 3キャリア対応の静

  • ケータイキット for Smarty オンラインマニュアル

    アイデアマンズ株式会社<contact(at)ideamans.com> Kunihiko Miyanaga Yoshinobu Terashima Yuichi Oikawa

  • 第11回 PCサイトとこんなに違う!携帯サイトのフォーム設計ポイントとは | ユーザー視点のウェブデザインガイド

    その半面、携帯サイトの設計については、PCサイトとは異なるユーザー特性があるにもかかわらずノウハウは少なく、中規模以上のサイトであっても「とりあえず作っただけ」のサイトや、やみくもに見た目だけを新しく装ったサイトが多いのが現状である。 今回は、携帯サイトの設計、その中でも特にビジネス成果に直結するフォームについてピックアップし、携帯ユーザー特有の行動に対していかに対応すべきかを考えてみたいと思う。 さて、複数のブラウザを立ち上げて、画面を切り替えながら操作が可能なPC環境と違い、モバイル端末では一度サイトから離れると、戻ってくるのが非常に大変である。そのため、携帯サイトのフォーム登録はPC以上に「一発勝負」であることを強く意識する必要があるだろう。 まず、ユーザーの入力負荷を減らし、自動入力が可能な部分は可能な限り実装するなどの配慮を欠かさないようにする必要がある。さらに、「携帯特有の機能

    第11回 PCサイトとこんなに違う!携帯サイトのフォーム設計ポイントとは | ユーザー視点のウェブデザインガイド
  • ke-tai.org > Blog Archive > ドコモ端末でCSSを表示するには

    ドコモ端末でCSSを利用するには Tweet 2008/4/3 木曜日 matsui Posted in DoCoMo | 9 Comments » ドコモ端末でCSSを表示しようとして、悩まれる方が多いようなのでご紹介しようと思います。 ドコモのiモード端末では、FOMA以降の機種でXHTML対応となりCSSが使えます。 ※厳密にいうと、ごく初期のFOMA21xxシリーズでは使えません。詳しくは下記一覧表からご確認ください。 → iモード対応機種 対応コンテンツ・機能一覧 [nttdocomo.co.jp] ※PDFです ですが、PCと同じように普通に書くだけでは、CSSは認識されません。 下記の3点を守る必要があります。 iモード用のXML宣言、DOCTYPEを付ける CSSは外部ファイルにしない、ヘッダ部にも書かない 拡張子を「.xhtml」にする ※別の方法もあり まず1についてで

  • jkondoに憧れて » 超手抜きでウェブサイトをモバイル対応 2008

    ◆追記 評判良かったので大幅に加筆訂正してみました。 ちょっと昨日、一昨日と携帯向けサイトを作っていたのですが、最近の携帯電話事情がわからず、どういうタグを使えばいいのかとか、CSSは対応しているのかとか、文字コードの問題はどうするのかとかいろいろわからないところが多かったので、ちょっと自分なりに調べてまとめてみます。 間違いが含まれている可能性が非常に高いです。 突っ込み大歓迎。 前提 キャリア別とか2G用にテンプレートを複数作って対応というのは個人で出来るレベルじゃないので、モバイル向けは1ページごとに1枚のテンプレート追加で作る。 なるべくPC向けのテンプレートを大幅に修正しなければいけないようなものは避ける。 長くなるので最初にまとめ ・文字コードはUTF-8。 ・マークアップ言語はXHTML Basic。 ・画像はJPEGかGIF。 ・CSSはインラインで書く。

  • 携帯サイト構築簡易化Apacheモジュール『mod_ktai』を開発:携帯サイト構築・株式会社ゆめみ

    平成19年12月27日 株式会社ゆめみ 〜絵文字変換もサーバでらくらく〜 日初!ゆめみ、携帯サイト構築簡易化Apacheモジュール『mod_ktai』を開発 株式会社ゆめみ(社:東京都世田谷区三軒茶屋 代表取締役社長:深田 浩嗣、以下ゆめみ)は、携帯サイト開発に不可欠な絵文字や画像の変換等を自動処理できるApacheモジュール『mod_ktai』を日で初めて開発したことを発表いたします。 今回の開発の背景には、携帯サイト構築にあたり敷居が高かった変換部分を共通化することで、開発過程の迅速化と携帯インターネット市場の活性化につながるという狙いがあります。携帯サイトの構築はこれまで画像変換や絵文字変換、機種判別や会員認証などの機能を開発言語毎に開発して対応していました。そのため何度も同じ機能を別のプログラムで組みなおすなどの工程の重複が相次ぎ開発時間の長期化や、開発者のレベルによっ

    tofu-kun
    tofu-kun 2007/12/28
    うーん。とりあえずライセンス次第。