Toshiro Shimura's Library tagged webdesign →  View Popular

SS設定手順





1. Google Docs - Documentsを開く
2. Document（文書）を新規作成
3. メニューの「Edit（編集）」をクリックし、「Edit CSS（CSSを編集）」を選択
   
   
4. CSS編集画面が開くのでCSSを書き込む
   
5. 「OK」ボタンを押すとデザインが反映される

海外ではMovableTypeを凌ぐ人気といわれるWordpress。無料でありながらも、かなり高機能な点が好評なようです。

そのWordpressには「テーマ」なる機能があり（いわゆるテンプレート機能ですね）、ネット上で配布されている素敵なテーマを自由に利用することができます。もちろん自分で作ることも可能です。

ただ、一からテーマを作るのはなかなか骨が折れるもの。そこで登場したのが「Wordpress Theme Generator」です。テーマを自作してみたい！という方には便利ですよ。

　「携帯電話のWebページ開発ってPC用のWebページ開発と何が違うの？」という素朴な疑問に答えるべく、PCとの相違点を下記に挙げてみます。

1. 絵文字の有無と文字コード

　ケータイ特有の絵文字です。絵文字に対応する場合、SoftBank携帯用とiモード／EZwebの切り分けが必要です。また、同じコンテンツをPCで表示する場合、同じようにPC用の対応も必要になってきます。

図1　キャリアによって対応の必要がある文字コード

　そして、iモード、EZwebの場合はShift-JISで内容を返す必要があり、SoftBankの場合は、UTF-8で返さないと、formタグ等で絵文字が抜け落ちる問題があるため、UTF-8で内容を返すことが推奨されています。

2. Cookieが使えない

　iモードではPCサイトでログイン状態を保持する目的などに使われるCookieが使えません。ケータイ向けWebアプリ開発では結構これが厄介です。ログインするサイトなどを作る場合、このために一部作り込みが発生します。

3. 外部スタイルシートが使えない

　スタイルシートは最近の機種であれば結構使えます。ですが、DoCoMoだと外部CSSの取り込み等には未対応なので注意が必要です。

iMT のインストールは2つのフォルダを、インストール先の Movable Type にアップロードするだけです。ダウンロード後、解凍した iMT プラグインのフォルダにある mt-static/plugins/iMT というディレクトリと、plugins/iMT というディレクトリを各々アップロードします。

mt-static/plugins/iMT

mt-static フォルダにある plugins フォルダ内の iMT フォルダは、サーバー上の [MT]/mt-static/plugins/ ディレクトリにアップロードします。

plugins/iMT

plugins フォルダにある iMT フォルダは、サーバー上の [MT]/plugins/ ディレクトリにアップロードします。

先日、iPhoneから電話機能を除いた「iPod touch」が発表されました。

日本でも近日発売される予定で、私も思わず注文してしまいました（笑）。

 

これに合わせて、Movable Type 4をiPhoneやiPod Touchに対応させる「iMT」というプラグインが公開されています。










Movable Typeには、管理画面のテンプレートを丸ごと差し替える「AltTemplate」という機能があります。

iMTは、この機能を利用して、Movable Type 4の管理画面の一部をiPhoneおよびiPod Touchに対応させるプラグインで、SixApart自らが開発して公開しています。




iMTをインストールすると、iPhoneおよびiMTで以下の機能を使うことができます。




• ブログ記事の新規作成
• 過去のブログ記事の編集
• コメントの管理




ファイルをダウンロードして、Movable Typeのインストール先サーバーにアップロードするだけで使うことができます。




ソースを見たところ、UserAgentでブラウザを判断して、iPhoneかiPod touchであればテンプレートを切り替える、という仕組みがとられていました。

その部分を外して、常にiMTのテンプレートを使うようにしてみると、パソコンでiMTの画面を見ることができました。

SixApartは、同社のホスト型人気ブログソリューションTypePadのiPhoneインターフェースを発表。

iPhoneやiPod Touch（からのアクセス）を感知した場合、新インターフェースが表示され、ユーザーはエントリを作成／編集、コメント管理、iPhoneから直接写真を掲載できるようモバイル用に設定、そして公開済みのブログを閲覧したりなど、全てiPhoneフレンドリーなレイアウトで可能になる。

4. Cookieの利用が可能

　Cookieが利用できるのもiPhone/iPod touchでのWeb体験を向上させるひとつの可能性である。ユーザー名だけでなく、履歴や設定など様々な情報をSafariに補完することができるようになる（iPhoneでは電源を切って再び立ち上げた際も、Cookieの情報は残る）。

　セキュリティ面が気になるが、パソコン版と同様、ブラウザ側Cookieを認証するかどうかのダイアログボックスが表示されるだけでなく、設定画面からCookieを消去することもできる。

5. FlashとJavaは利用できない

　今後、状況が変わる可能性は十分にあるが、今のところFlashとJavaを利用したiPhone/iPod touch向けのサイトを制作することはできない。動きのあるサイトはある程度JavaScriptでも作ることができるが、独自で動画配信や複雑なゲームの開発は現状の環境では不可能と考えて良いだろう。

　Flashに関しては発売前から対応を求める声が多く、将来的には実装されるのではないかと言われている。Javaに関しても、Sunの経営陣からサポートするようにとの声が上がっているようだが、Macソフトウェア開発で馴染みのあるObjective-Cが今後、使える可能性があるかもしれない。

1. タブブラウジング

　iPhone、iPod touchでは厳密には「タブ」ではないが、複数のWebサイトを同時に開いてのブラウジングが可能だ。様々なページを見比べたり参照しながらブラウジングすることがストレスなく行える。利用者にとって便利といえるが、特定のページに居座るという可能性は低くなる。モバイルコンテンツには元々そういった部分はあったが、マルチタスクはさらにそれを加速させるだろう。

iPhone/ iPod touchだけでなく他のモバイルデバイスにもいえることだが、ユーザーの利用背景を意識したインタフェースの提供が、よりよいモバイル体験の要になってくる。先述したようにiPhone/ iPod touchでは目的に応じてインタフェースを最適化してユーザーに提供しているが、ステップが進行していくごとに、そのときよく使う機能/メニューを表示しているのも注目だ。

　例えばiPod touchで写真を見る場合、アルバムを表示している際は下にスライドショーを始めるためのボタンが表示されるが、アルバムの中の写真を選択すると、今度はスライドショーのボタンと一緒に前後へ移動するためのボタンも表示される（画像3）。ユーザーがそのとき何をしたいのかを把握して、そのタスクを最も素早く簡単にこなすためのひとつの見せ方といえるだろう。

テキストの有効活用もモバイルサイトでは重要になってくる。回線が早くなってきたとはいえ、PCサイトのように動画や画像が多いサイトが素早く表示されるわけではない。よってテキスト中心になるのはモバイルサイトでは必然的な傾向だが、前回紹介したようにWebKitがサポートしているCSSを駆使することで、画像ボタンのように見えるUI要素もテキストと最小限の画像を組み合わせるだけで作ることが可能だ。画像を使わなくても、テキストに強弱を付けるだけで的確に情報を伝えることができる。

　例えばiPhoneのメールはリストに件名、送信者の名前、日付、本文の数十文字が表示される（画像4）。PC用のメールソフトの場合、表データとして表示する場合があるが、モバイルではそのような形式で表示するだけのスペースはない。そこで、iPhoneでは文字の大きさ、太さ、色でデータの種類を表すことで、表データ式の今までの見せ方から脱している。また、大きさと太さからどの情報が重要かも視覚的に理解することができる。こうしたテキストによる情報の階層化を行うことで、小さなスペースにコンパクトにまとめられるだけでなく、情報そのものが意味をもつようになる。

このディレクトリ集としてのYahoo!はとても魅力的なサイトでどきどきしながらMosaicで繋いで楽しんだものだった。そして、時が経ちディレクトリでは案内しきれないほどサイトが増えて、Yahoo!はデザインを変えるときが来たということだろう。実のところ日本以外のほとんどの国ではすでにデザイン変更を済ませており、他の国より高いシェアを持つ日本が後から追随することになった。

ディレクトリはほとんど視線も行かずクリックもされていなかったという調査データもあり、多くの人はすぐになじんだようだ。

あまり気づく人は多くないだろうが、Yahoo! Japanトップページは文字コードがEUC-JからUTF-8に変わっている。多言語環境で無難で、Javaなどとの親和性が高い文字コードとして今後UTF-8が標準になるのだという時代の変わり目の宣言でもあるだろう。ウェーブダッシュ／チルダ"～"の字形問題とかいろいろ課題が残り、「さま～ず」とかの波が逆になったりすることが、ベータ版のYahoo!ニュースであったので、今後もこういう問題は起きてくるだろうが、何かうまい解決方法が見つかり不自由なく、拡張文字が使われ、「?小平」が「登におおざと」とかいう注釈無しに書ける時代へと進むことを期待している。

2008年はもう、1983年から25年経ち、JIS83問題など過去の歴史になって欲しいのだ。

答えはシンプルだ。増えたサイドバーの内容がユーザー個人とは無関係だからだ。

サイドバーの内容は上から「広告バナー」「ニュース」「天気」「ミクリィ情報」が並んでいる。どれもユーザーとは無関係な情報だ。ニュースのカテゴリをを興味のあるものに設定したとしても、ユーザー個人との関連性は皆無だ。天気も同様に、便利だけど個人との関連性は無い。さらにユーザーと無関係なだけでなく、もともとあった内容との関連性も無い。もともとあった内容は「自分の顔写真」「マイミクシィ一覧」「所属コミュニティ一覧」「マイミク最新日記」「日記コメント」「所属コミュ最新書き込み」「マイミク最新アルバム」「最近の自分の日記」「自分の紹介文」といったユーザーとの強い関連性があり相互に関連性を持つ情報が全てだった。

ユーザーは今まで自分と関連性のある情報を求めてmixiのホーム画面を開いていた。だからこそ関連性のないサイドバーの情報に対して「うざい」といった強い感情が沸いた。ニュースや天気が見られるのは便利かもしれないが今は求めてないんだ。わざわざ見にくるといった能動的な行動に対するレスポンスなだけに、がっかり感もひとしおだ。

この件に関する詳しい議論はリンク先を読んでいただくとして、どのブラウザでもobjectタグのみで表示するのに最低限必要なコードは以下の通り。

<object data="fma.swf" width="720" height="200" type="application/x-shockwave-flash">
	<param name="movie" value="fma.swf" />
</object>

codebase属性などを取り除く必要があるようなので、Win IEでのFlash
Playerの自動インストールや自動バージョンアップなどができなくなってしまいますが

これら3つのサービスは、今後出てくるものの始まりに過ぎない。他の企業も大急ぎでブラウザサイドバーのアドオンを出してくるだろう。しかし皮肉なことが1つある。ユーザーはサイドバーを1つしか持てないのだ。1人のユーザーはサイドバーにIMクライアントを入れるかソーシャルネットワークを入れるかのどちらかで、両方を使うことはできない。それがブラウザのスタートページになるからだ。これが、サイドバーの利用をユーザーや注目を集めるための戦術として使う際の限界となるだろう。

　それでもサイドバーがオンラインサービスから見て最も魅力的なスペースである以上、この場所は戦場になるだろう。大手プレーヤーはブラウザベンダーと提携して、現在ツールバーで行っているようにサイドバーをブラウザそのものと一緒に出荷するだろう。このため、複数のGoogleサービスの機能を持ち、今後Firefoxと一緒に出荷されるであろう「Googleサイドバー」には注目するべきだ。