case:MobileDesign! モバイルサイトのデザイン紹介ブログ 引っ越ししました。 http://case-mobile-design.com/ case:MobileDesign! モバイルサイトのデザイン紹介ブログ > 2010-02-15 >
case:MobileDesign! モバイルサイトのデザイン紹介ブログ 引っ越ししました。 http://case-mobile-design.com/ case:MobileDesign! モバイルサイトのデザイン紹介ブログ > 2010-02-15 >
携帯、モバイルサイトの デザインってどうなってるのか 少し興味が沸いたのでモバイル サイトのキャプチャを取って アーカイブとしてまとめている モバイルデザインアーカイブさん から15のモバイルサイトで好きな デザインを15個厳選しました。 個人的なギャラリーとなっていますが、共感して頂ければ幸いです。キャンペーンサイトのデザインなどもあるので現在は確認出来ない事もあります。 FAT ONLINE SHOPPING 余計な情報を入れず、一番伝えたい事は画像にしてTOP絵にしています。 FAT ONLINE SHOPPING AEON Lake Town シンプルですが、画面の小さいモバイルサイトで情報を絞り込むのはかなりいいのでは。Flashで操作も軽快でした。 AEON Lake Town MOS BURGER モスバーガーのモバイルサイト、凄くいいですね。メニューも見やすいし、色使いもか
携帯電話内部のメールクライアントソフトを呼び出すものです。 現在、すべての携帯端末で、mailto:〜によるメールクライアント起動・メール送信先初期設定がサポートされています。 subject(メール題名)・body(メール本文)の初期設定に関してはサポートしていない機種がありますが、最近の機種はいずれもサポートしていると考えて良いと思います。 cc(同報)やbcc(匿名同報)をサポートしている端末もあります(下記表参照)。 ただし、これらの指定はあくまでデフォルト指定であり、ユーザー側で編集することができます。 題名等、固定化したいのであれば、フォームメール等のCGIスクリプトを使用する必要があります。 【参考サイト】 EZfactory mailto:の指定方法 http://www.au.kddi.com/ezfactory/tec/spec/wap_tag9.html
たいていのWEBアプリはユーザ名とパスワードを聞かれて認証を行います。これはちょうど家に鍵をかけるようなもの。それほど重要でない情報のみのサイトならこれで十分ですが、貴重な情報があるとなるとそうはいきません。 この物騒な世の中、鍵ひとつじゃ安心できないわという声も聞こえてきます。最近セキュリティの高いところでは、やれ指紋やら静脈やら虹彩やらで個人を識別して鍵が開くようになってきていますね。WEBアプリにもユーザ名とパスワードの鍵以外に、端末の識別番号を使って認証する方法があります。 さて今日は携帯電話に焦点を当てて、ユーザ名とパスワード+自分の携帯からしかアクセスできないというように変える方法をご紹介。 携帯端末には一台一台に電話番号とは別の個体識別番号があります。この番号を、ユーザがサイトにアクセスしてきたときにプログラムで取得することができます。個体識別番号をサーバ側に保存しておき、認
こんにちは、『プチペット』を担当している吉沢です。 最近のモバイルサイトはキャリア間や機種に依存する問題が少なくなり、表現の制約も少なくなってグラフィカルに魅せることできるようになってきましたね。 グラフィカルに魅せることができるようになった分、HTMLソースも複雑になり、デザイナーやマックアッパーにコーディングを依頼する機会が増えてきていると思います。 状況は会社によって様々だと思いますが、今回は、効率よくデバックを行って完成度を高めたい、ちょっとした作業はディレクター側で行いたいというときに、PCサイトの作成でもおなじみのツールを含めた、モバイルならではのツールの使い方をご紹介したいと思います。 【1】FireMobileSimulator PCでモバイルの画面を表示することができるので、電波状況や通信速度を気にしなくてもよく、レイアウトのチェックから、機能面のデバックをスピーディに行
どうも mobileで大成したいさぶろうです。 最近FlashLite1.1の案件をやらせてもらっていて、 研究のためいろいろmobileサイトを見ているのですが どんどんリッチなサービスが出てきていますので参考に紹介したいと思います。 ■世界視力選手権 ミニゲームがものすごいクオリティで作ってある。 特に車と野球がわざーと初期ファミコンのような無慈悲な難易度で作ってありほんとはまる。 その上にわざーと基本小さめのドット絵で作ってあり広告商品につながっている。 そしておもしろいから人に言いたくなるし紹介したら自分のキャラの体力が回復する という全体的にとても完成度が高いキャンペーンです。 どこが作ったんだろうか。とてもおもしろいです! ■しゃべリングス http://www.shaberingles.jp/ flashLiteでしっかりデザインしたものを出来る限りいい感じに動かしたサイトで
平成19年 2月に二ヶ月続けて債務不履行と言う状況に陥りましたが、その後の進展に依り破産及びサイト閉鎖と言う最悪の事態は免れる事が出来ました。しかしながら、今後安定してコンテンツをご提供出来るかは分かりません。 このような状況ですので、引続き皆様のご支援をお願いしております。 また、大した技術ではございませんが、制作者の技術をご活用下さる法人の方も改めてお待ちしております。 本コンテンツについて。 『しらぎくさいと』で用いた、あるいは用いようとした携帯電話向けのPHPについて解説します。 PHPはヴァージョン 4以降を想定します。 尚、PHPもPrelと同様、EUC日本語コードを用いるのが望ましいですが、ここではシフトJISで記述するものとします。「表」など「\」の文字コードを含む文字にはご注意下さい。 尚、ここに書いてあるPHPはご自身の自己責任でコピーして、適宜改変してお使い下さい。
その半面、携帯サイトの設計については、PCサイトとは異なるユーザー特性があるにもかかわらずノウハウは少なく、中規模以上のサイトであっても「とりあえず作っただけ」のサイトや、やみくもに見た目だけを新しく装ったサイトが多いのが現状である。 今回は、携帯サイトの設計、その中でも特にビジネス成果に直結するフォームについてピックアップし、携帯ユーザー特有の行動に対していかに対応すべきかを考えてみたいと思う。 さて、複数のブラウザを立ち上げて、画面を切り替えながら操作が可能なPC環境と違い、モバイル端末では一度サイトから離れると、戻ってくるのが非常に大変である。そのため、携帯サイトのフォーム登録はPC以上に「一発勝負」であることを強く意識する必要があるだろう。 まず、ユーザーの入力負荷を減らし、自動入力が可能な部分は可能な限り実装するなどの配慮を欠かさないようにする必要がある。さらに、「携帯特有の機能
当ブログが携帯サイト作成法に関する記事をかいていることから、読者の方から、 『モバゲーのような携帯サイトを作るためにはどうしたらいいんですか?』 っていう質問を最近良く受けます。 おそらく、モバゲーがとても有名で、ある種モバゲーが携帯サイト界のデファクトスタンダードのような 位置づけになってきているのでしょうか。 確かに、携帯サイトを作ってきている身としても、 モバゲーのサイトデザインにするには、結構難しいことも多いし、学ぶことも多い。しかし、最近の携帯サイトは、実機からしかアクセスできないようになっていて、PCからコードを覗くことができないことも多く、学ぶことも難しいようです。 ということで、今回は実際にモバゲータウンに携帯でアクセスして、携帯の画面を見ながら、デザインを真似て新しく自分なりに作ってみましたので、そこから得た経験をTipsとして公開したいと思います。 ちなみに、左のスクリ
XHTML Mobile Profileに対応したHTML 本連載では、「PCサイトを制作してきたけど、携帯サイトは初めて」といった企業や個人クリエイター向けにPCとモバイルの違いなどをふまえ、携帯サイトを公開するまでの入門的なノウハウを紹介していきます。 まず、今回はHTMLの種類やタグ、CSSなど携帯ブラウザによる違いと、画面サイズやキャッシュ容量などの端末による違いについて紹介していきます。 では、早速携帯サイトを作る上でマークアップの基本となるHTMLについて説明します(図1-1)。携帯電話はPCと比べても非常に早い進化を遂げてきたため、どれも基本はHTMLを基準に作られていますが、携帯ブラウザ(iモード、EZweb、Yahoo!ケータイ)で表示可能なHTMLの仕様には実に多くの種類が存在します。 現在市場に出回っている機種ということに限定すれば、XHTML Mobile Prof
mailto で題名や本文に日本語などを含める時に URLエンコードをしないといけないが、URLエンコードすると逆に文字化けしたりして、よくわからなかったのでメモしておきます。 ファイルの文字コードは UTF-8 で記述しています。 URLエンコードをかけると DoCoMo、au だと日本語が文字化け。SoftBank は正常に表示される。 URLエンコードをかけないと日本語が正常に表示される(機種によっては文字化けする)。 mailto に半角英数字以外を含める時はURLエンコードしないといけないはずなのにかけると逆に文字化けしたりで混乱。 調べてみると DoCoMo、au は shift_JIS に変換してから URLエンコード。 SoftBank は UTF-8 にしてから URLエンコード。 ということでなぜ文字化けしていたのかやっと理解。 取り合えず、php で文字コ
携帯サイト作成のポイントがまとめられた「3キャリア対応ケータイXHTMLのTIPS 8つ」 Tweet 2008/4/16 水曜日 matsui Posted in 記事紹介・リンク | No Comments » アシアルブログに「3キャリア対応ケータイXHTMLのTIPS 8つ」という記事が掲載されおり、とても参考になる内容なので、ご紹介させていただきます。 → アシアルブログ 3キャリア対応ケータイXHTMLのTIPS 8つ [asial.co.jp] 文字コード CSS 画像形式 ブラウザの解像度 フォントのサイズ 入力文字制御 回り込み mailto の8つについてのTIPSが紹介されています。 基礎的なことから、ちょっとした工夫まで一通り触れられていますので、このページに書かれていることをおさえておけば、もう十分ケータイ用サイトが作成できると思います。 アシアルブログは最近良い
こんにちは。Windowsの最大の発明はゴミ箱の標準装備だと思っている亀本です。 追記:Mac信者の某氏にゴミ箱はWindowsの発明じゃないと突っ込まれてしまいました。すみません<(。_。)> 昨日はグリーさんのオープンソース勉強会に参加してきました。 今回の講師はDeNAの川崎さんで、わりとモバイル屋さんな自分としてはぜひともチェックしておきたいなと思って参加してきました。 勉強会・懇親会ともなかなか面白い話が聞けたり、変な人がいっぱいしたりしてとても面白かったです。 モバイルをやっているといつも面倒なのは、テンプレートの扱いです。 そのあたりのまとめは以前このブログでうちの高橋さんが超まとめてくれた記事があるので、そちらをご参照ください。 とくにDoCoMoのCSS(i-CSS)は開発者泣かせですね。インラインのみに対応とか、開発しにくくて涙ちょちょぎれそうです。 さてさてそんなDo
ここ最近、携帯サイト構築に関する記事をはてなブックマークでよく見かけるようになりました。 モバゲーのような携帯サイトを作るための12のTips: 携帯ホームページを作ろう!-ちょっと詳しいモバイルサイトの作り方- この記事へのブクマは2008/07/10時点で1000を超えており、はてな界隈でも多くの人が携帯サイト開発に関心を持っていることが伺えます。ちょうど私自身も少し前からPHPでの携帯サイト構築に携わっており、この辺りの話題には注目しています。 携帯用サイトはPC用サイトよりも制約が多いため、開発にあたって何かと苦労することが多いのですが、携帯サイトの場合、必要知識やハマリやすい点がどんなサイトを作る場合でも大体似たようなものな気がします。このため、携帯用サイトにおける典型的な重要項目についてまとめたサイト等を確認しておくだけで、かなり開発効率が上がるんじゃないでしょうか。 というこ
ドコモ(docomo)、AU、ソフトバンク(SoftBank)の3キャリアに対応した3G携帯サイト専用のXHTMLテンプレートをまとめてみました。 <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja"> <head> <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" /> <meta name="keywor
このドメインは お名前.com から取得されました。 お名前.com は GMOインターネットグループ(株) が運営する国内シェアNo.1のドメイン登録サービスです。 ※表示価格は、全て税込です。 ※サービス品質維持のため、一時的に対象となる料金へ一定割合の「サービス維持調整費」を加算させていただきます。 ※1 「国内シェア」は、ICANN(インターネットのドメイン名などの資源を管理する非営利団体)の公表数値をもとに集計。gTLDが集計の対象。 日本のドメイン登録業者(レジストラ)(「ICANNがレジストラとして認定した企業」一覧(InterNIC提供)内に「Japan」の記載があるもの)を対象。 レジストラ「GMO Internet Group, Inc. d/b/a Onamae.com」のシェア値を集計。 2023年10月時点の調査。
こんにちは。『Cure』や『livedoor 歌詞』を担当しているモバイルディレクターの吉沢です。 つい最近、PC サイトのディレクターが初めてモバイルサイトの開発を担当するという機会がありました。 どの情報を伝えれば初めてモバイルサイトを担当する人にもスムーズに進められるのか、PC とモバイルで一番特徴のあるコーディングとデザインについて、これだけ覚えておくと簡単な3G(FOMA・WIN・3GC)端末用モバイルサイトが作れてしまうノウハウをご紹介したいと思います。 【01】対応端末について こちらの記事にもあるとおり、3G 端末(FOMA・WIN・3GC)がアクセスの9割を占めているため、これからオープンさせるサイトの対応端末は、3G 端末で十分そうですね。 サイトの内容にもよりますが、下位端末(PDC・P型・C型など)を対応端末として含めてしまうと、機能や容量制限などに悩まされ、逆に運
サイト規模に合わせて作り方を選ぶ 前回(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キャリア対応の静
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く