サイト制作: 2008年6月アーカイブ

携帯サイトのDOCTYPE宣言について

Kamitani79 (2008年6月29日 20:24) | | コメント(3) | トラックバック(0)

3キャリア対応の携帯サイトを作るのは、非常に難しい。
少し前のCHTMLで作ると装飾部分にとても制約が多い。


DOCTYPE宣言もそれぞれ違う。XHTMLで作成する場合のDOCTYPE宣言は以下のようになる。

docomo
<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//i-mode group (ja)//DTD XHTML i-XHTML(Locale/Ver.=ja/2.3) 1.0//EN" "i-xhtml_4ja_10.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=Shift_JIS" />


au
<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//OPENWAVE//DTD XHTML 1.0//EN" "http://www.openwave.com/DTD/xhtml-basic.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />


SoftBank
<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//J-PHONE//DTD XHTML Basic 1.0 Plus//EN" "xhtml-basic10-plus.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja" xml:lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />


PCなど
<?xml version="1.0" encoding="Shift_JIS"?>
<!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" xml:lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />


au、SoftBankは、以上のDOCTYPE宣言でXHTMLモードになり、外部スタイルシートも利用出来るようになる。しか〜し、docomoがすごくややこしい。DOCTYPE宣言してもXHTMLモードにならない。


以下の4点が揃ってはじめてXHTMLモードになる。
. DOCTYPE宣言。
<!DOCTYPE html PUBLIC "-//i-mode group (ja)//DTD XHTML i-XHTML(Locale/Ver.=ja/2.3) 1.0//EN" "i-xhtml_4ja_10.dtd">
（Ver部分を変えると使えるタグが変わる。新しければ利用できるタグが増える。但し、対応していない機種はそのタグを無視する。）


. コンテンツ タイプの指定。
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=Shift_JIS" />


. 拡張子が.htmlか.xhtml。
. サーバにおいて正しいHTTPヘッダの出力。

.htaccessにてどちらかを追加
AddType application/xhtml+xml .htm .html
AddType application/xhtml+xml .xhtm .xhtml


以上4点でXHTMLモードになってもスタイルシートは、外部の利用は出来ない。インラインで書く必要がある。


汎用サイトを作る場合、「au / SoftBank / XHTMLモードに対応していないdocomo」と「XHTMLモードに対応しているdocomo」に分けて作る必要がある。


「XHTMLモードに対応しているdocomo」のメリットは、装飾が出来ることのみ。
例えば、文字に背景色を指定したり、背景の画像をいくつか小分けに指定したりとなる。

そこまで求めてないのであれば、docomoのXHTMLモードを考慮しないように作れば問題ない。それにdocomoの機種は、XHTMLとCHTML両方対応しているから問題ない。


もう少し他社と互換を持たして欲しいものです。


追加：
2008年10月26日に携帯サイトのDOCTYPE宣言、切り替え（PHPをSSIにて利用）の記事を追加しました。

  • 携帯サイトのDOCTYPE宣言についてをはてなブックマークに追加 携帯サイトのDOCTYPE宣言についてのはてなブックマーク数
  • 携帯サイトのDOCTYPE宣言についてをdel.icio.usに追加
  • 携帯サイトのDOCTYPE宣言についてをYahoo!ブックマークに追加
  • 携帯サイトのDOCTYPE宣言についてをPOOKMARK Airlinesに追加
  • 携帯サイトのDOCTYPE宣言についてをlivedoorクリップに追加
  • 携帯サイトのDOCTYPE宣言についてを＠niftyクリップに追加
  • 携帯サイトのDOCTYPE宣言についてをnewsingへ投稿
  • 携帯サイトのDOCTYPE宣言についてをBuzzurlに追加
  • 携帯サイトのDOCTYPE宣言についてをChoixへ追加
  • 携帯サイトのDOCTYPE宣言についてをFurlへ追加
  • 携帯サイトのDOCTYPE宣言についてをBlinklistへ追加
  • 携帯サイトのDOCTYPE宣言についてをReddit.comへ追加

Movable Typeでパンくずリスト

Kamitani79 (2008年6月22日 20:10) | | コメント(0) | トラックバック(0)

Movable Typeで、標準では「パンくずリスト」は、ついていない。


パンくずリスト for Movable Type 4 - SCREAMOさんで紹介されている「パンくずリスト」をカスタマイズして使って設置してみました。


「ヘッダー」モジュールの下あたりに入れるとちょうど良いです。


以下コードになります。


<MTUnless name="main_index">
<ul id="navigator">
<li><a href="<$MTBlogURL$>" title="<$MTBlogName$>">HOME</a></li>

<MTIf name="archive_index">
<li> > <$MTGetVar name="page_title"$></li>
</MTIf>

<MTIf name="system_template">
<li> > <$MTGetVar name="page_title"$></li>
</MTIf>

<MTIf name="datebased_archive">
<li> > <a href="<$MTLink template="archive_index"$>" title="アーカイブ">アーカイブ</a></li>
<li> > <$MTGetVar name="page_title"$></li>
</MTIf>

<MTIfArchiveType archive_type="Author">
<li> > <a href="<$MTLink template="archive_index"$>" title="アーカイブ">アーカイブ</a></li>
<li> > <$MTGetVar name="page_title"$></li>
</MTIfArchiveType>

<MTIfArchiveType archive_type="Category">
<li> > <$MTCategoryLabel$>アーカイブ</li>
</MTIfArchiveType>

<MTIfArchiveType archive_type="Individual">
<li> > </li>
<MTEntryCategories glue=" > ">
<li><a href="<$MTCategoryArchiveLink$>" title="<$MTCategoryLabel$>アーカイブ"><$MTCategoryLabel$>アーカイブ</a></li>
</MTEntryCategories>
<li> > <$MTGetVar name="page_title"$></li>
</MTIfArchiveType>

<MTIfArchiveType archive_type="Page">
<li> > <$MTGetVar name="page_title"$></li>
</MTIfArchiveType>

</ul>
<div class="asset-footer"></div>
</MTUnless>


スタイルシートに以下追加も必要です。


ul#navigator li {
display: inline;
}


段々と普通のブログになってきました。

  • Movable Typeでパンくずリストをはてなブックマークに追加 Movable Typeでパンくずリストのはてなブックマーク数
  • Movable Typeでパンくずリストをdel.icio.usに追加
  • Movable TypeでパンくずリストをYahoo!ブックマークに追加
  • Movable TypeでパンくずリストをPOOKMARK Airlinesに追加
  • Movable Typeでパンくずリストをlivedoorクリップに追加
  • Movable Typeでパンくずリストを＠niftyクリップに追加
  • Movable Typeでパンくずリストをnewsingへ投稿
  • Movable TypeでパンくずリストをBuzzurlに追加
  • Movable TypeでパンくずリストをChoixへ追加
  • Movable TypeでパンくずリストをFurlへ追加
  • Movable TypeでパンくずリストをBlinklistへ追加
  • Movable TypeでパンくずリストをReddit.comへ追加

Movable Type 4 セキュリティアップデート

Kamitani79 (2008年6月21日 21:03) | | コメント(0) | トラックバック(0)

6月末には、Movable Type 4.2が発売する予定になっている中、Movable Type 4.1のアップデートの提供が行われた。


Movable Typeは、サーバーにインストールするタイプなので、ファイルをダウンロードして、FTPでアップロードしないといけない。


これがツライところね。


アプリケーションの脆弱性があるということなので、早速ダウンロードして、FTPでアップロード。


アップデートは、すぐ終わった。


Movable Type 4.12になりました。


来週には、Movable Type 4.2が発売されれば、即効入れようと思ってます。


テンプレートのキャッシュを残すことによって、再構築の時間を短縮できるということが非常にメリットがある。


参照記事
重要 : Movable Type 4 セキュリティアップデートの提供を開始

  • Movable Type 4 セキュリティアップデートをはてなブックマークに追加 Movable Type 4 セキュリティアップデートのはてなブックマーク数
  • Movable Type 4 セキュリティアップデートをdel.icio.usに追加
  • Movable Type 4 セキュリティアップデートをYahoo!ブックマークに追加
  • Movable Type 4 セキュリティアップデートをPOOKMARK Airlinesに追加
  • Movable Type 4 セキュリティアップデートをlivedoorクリップに追加
  • Movable Type 4 セキュリティアップデートを＠niftyクリップに追加
  • Movable Type 4 セキュリティアップデートをnewsingへ投稿
  • Movable Type 4 セキュリティアップデートをBuzzurlに追加
  • Movable Type 4 セキュリティアップデートをChoixへ追加
  • Movable Type 4 セキュリティアップデートをFurlへ追加
  • Movable Type 4 セキュリティアップデートをBlinklistへ追加
  • Movable Type 4 セキュリティアップデートをReddit.comへ追加

Movable Typeのカテゴリ一覧と一致したときの処理

Kamitani79 (2008年6月19日 00:11) | | コメント(0) | トラックバック(0)
Movable Typeは、ブログソフトですから、カテゴリの一覧を表示することが出来る。

カテゴリの一覧を表示をする場合は、MTのタグを4つ使います。

1. カテゴリ一覧のタグ
<MTCategories>〜</MTCategories>

2. 最上位のカテゴリから現在のカテゴリまでを繰り返して表示するタグ
<MTParentCategories>〜</MTParentCategories>
(glue="/"でリストを繋ぎます)

3. カテゴリのファイル名を表示するタグ
<$MTCategoryBasename$>

4. カテゴリ名を表示するタグ
<$MTCategoryLabel$>

<ul>
<MTCategories>
<li><a href="<$MTBlogURL$><MTParentCategories glue="/"><$MTCategoryBasename$></MTParentCategories>/"><$MTCategoryLabel$></a></li> </MTCategories>
</ul>

実際の処理の結果


さらにカテゴリの所属しているこの記事とカテゴリ一覧のカテゴリが一致した場合の処理をやってみます。これは、ユーザビリティを意識したサイト作りをする時にナビゲーションとして使う場面が多くそれを考慮したものです。

一致したカテゴリのみ、カテゴリ名の左右に★★を入れます。

Movable Typeの条件文(if)の記事で書いたときと同じように変数を格納するために、 <MTSetVarBlock name="変数名">値</MTSetVarBlock>を使用します。

現在の記事のカテゴリを値にセットし、変数「category_label」に代入します。
次にカテゴリ一覧を行い、一覧を行っている中で、比較をするための変数「category_label2」にカテゴリを代入します。

最後に、変数「category_label」と変数「category_label2」を比較し、一致した場合の処理と一致しなかった場合の処理を行います。

コードは、以下になります。
<MTSetVarBlock name="category_label"><$MTCategoryLabel$></MTSetVarBlock>
<ul>
<MTCategories>
<MTSetVarBlock name="category_label2"><$MTCategoryLabel$></MTSetVarBlock> <MTIf name="category_label2" eq="$category_label">
<li>★★<a href="<$MTBlogURL$><MTParentCategories glue="/"><$MTCategoryBasename$></MTParentCategories>/"><$MTCategoryLabel$></a>★★</li>
<MTElse>
<li><a href="<$MTBlogURL$><MTParentCategories glue="/"><$MTCategoryBasename$></MTParentCategories>/"><$MTCategoryLabel$></a></li>
</MTElse>
</MTIf>
</MTCategories>
</ul>

実際の処理の結果

サブフォルダを入れて行うこともで出来ますし、一致したときの処理に背景の色やテキスト、リンクの色を変更することも出来ます。
  • Movable Typeのカテゴリ一覧と一致したときの処理をはてなブックマークに追加 Movable Typeのカテゴリ一覧と一致したときの処理のはてなブックマーク数
  • Movable Typeのカテゴリ一覧と一致したときの処理をdel.icio.usに追加
  • Movable Typeのカテゴリ一覧と一致したときの処理をYahoo!ブックマークに追加
  • Movable Typeのカテゴリ一覧と一致したときの処理をPOOKMARK Airlinesに追加
  • Movable Typeのカテゴリ一覧と一致したときの処理をlivedoorクリップに追加
  • Movable Typeのカテゴリ一覧と一致したときの処理を＠niftyクリップに追加
  • Movable Typeのカテゴリ一覧と一致したときの処理をnewsingへ投稿
  • Movable Typeのカテゴリ一覧と一致したときの処理をBuzzurlに追加
  • Movable Typeのカテゴリ一覧と一致したときの処理をChoixへ追加
  • Movable Typeのカテゴリ一覧と一致したときの処理をFurlへ追加
  • Movable Typeのカテゴリ一覧と一致したときの処理をBlinklistへ追加
  • Movable Typeのカテゴリ一覧と一致したときの処理をReddit.comへ追加

SoftBankから「iPhone」、年内発売へ

Kamitani79 (2008年6月 4日 23:20) | | コメント(0) | トラックバック(0)

ソフトバンクモバイルは、年内（2008年）にて「iPhone」を発売することで、アップルと契約を締結したと発表した。


2008年の携帯市場において目玉のひとつとされていましたが
ついにキャリアが決まりましたか。やはりSoftBankからでしたか。


目玉は、以下の3つ。
. 2008年春からdocomoの検索エンジンにGoogleモバイルを採用
2008年4月1日よりGoogleモバイルを搭載開始

. iPhoneの発売（docomo or SoftBank）
2008年6月4日、SoftBankにて販売を発表、年内にて発売開始が決定

. Googeの携帯端末のためのオープンな総合プラットフォーム「Android（アンドロイド）」搭載の携帯端末の販売
年内（2008年）には「Android（アンドロイド）」搭載した端末を発売の予定、まずは欧米にて発売をされるとされているが、まだ不明


だけが残る感じ。


のdocomoにGoogleモバイルを採用したことは大きい。元々auはGoogleモバイルを、SoftBankはYahoo!モバイルを採用しており、知っていた人が使っていたような感じもするが、Yahoo!モバイルから検索を行う人が多かった。


docomoにGoogleモバイル採用した2008年4月1日からアクセスは、Googleモバイルからのユーザーが急増している。いくつかのサイトで実証済み。
しかし、Googleモバイルの検索結果は、現在不完全で、非常によろしくない。数年前にパソコンの現象と似ており「Amazon」が上位表示されたり、情報もまったくないアフィリエイトサイトが上位に表示されたりとユーザに不快を与える検索結果になっている。

まあ、改良をしている段階のようだ。


そして、の本日発表されたSoftBankからの「iPhone」年内発売の発表。
これは、Yahoo!モバイルが検索シェアを盛り返すのかと思い、楽しくなってきたー。


と思っていたらYahoo!検索スタッフブログにYahoo!のPCサイトの検索の仕方の記事があがっていました。まだなんともいえないけど、「iPhone」がYahoo!のPCサイトのみ検索を採用した場合、日本での携帯の検索市場はGoogleモバイルに持っていかれてしまうかもしれません。Yahoo!モバイルも利用可能とした場合は変わってくるでしょう。


一方docomoは「iPhone」販売の交渉は続けて行くということ言ってはいるものの、あんまり交渉に力を入れているようには見えない。


色んな情報からdocomoは、音楽や映像ビジネスではなく、金融ビジネスに力を入れていること。

年内にインドが第3世代（3G）携帯を導入予定で、通信方式の選択においてdocomoの名前があがっている。こちらの方に力を注いでいるのようではないかと自分は推測している。


成熟した日本市場よりも今まで培ったノウハウで、明らかにこれから数十年後には日本を越す経済成長をするインドに投資をしないわけがない。もし自分が経営者ならば、迷わず、インドに投資をするでしょう。


今年は、携帯市場が大きく変わる年と言われはいるが、静かにゆっくりと動いてます。


自分としては一人で盛り上がっている状況でありあり


参照記事
「iPhone」について | ソフトバンクモバイル株式会社

  • SoftBankから「iPhone」、年内発売へをはてなブックマークに追加 SoftBankから「iPhone」、年内発売へのはてなブックマーク数
  • SoftBankから「iPhone」、年内発売へをdel.icio.usに追加
  • SoftBankから「iPhone」、年内発売へをYahoo!ブックマークに追加
  • SoftBankから「iPhone」、年内発売へをPOOKMARK Airlinesに追加
  • SoftBankから「iPhone」、年内発売へをlivedoorクリップに追加
  • SoftBankから「iPhone」、年内発売へを＠niftyクリップに追加
  • SoftBankから「iPhone」、年内発売へをnewsingへ投稿
  • SoftBankから「iPhone」、年内発売へをBuzzurlに追加
  • SoftBankから「iPhone」、年内発売へをChoixへ追加
  • SoftBankから「iPhone」、年内発売へをFurlへ追加
  • SoftBankから「iPhone」、年内発売へをBlinklistへ追加
  • SoftBankから「iPhone」、年内発売へをReddit.comへ追加
« サイト制作: 2008年5月 | メインページ | アーカイブ | サイト制作: 2008年7月 »

犬の日めくりカレンダー&時計

言語選択

検索

このアーカイブについて

このページには、2008年6月以降に書かれたブログ記事のうちサイト制作カテゴリに属しているものが含まれています。

前のアーカイブはサイト制作: 2008年5月です。

次のアーカイブはサイト制作: 2008年7月です。

最近のコンテンツはインデックスページで見られます。過去に書かれたものはアーカイブのページで見られます。