しらぎくモバイルシステムで処理するサイトをお作りの際は、以下の点にご留意下さい。
その他の記述上の注意点 (平成19年 3月17日)
しらぎくモバイルシステムで取扱うiモードサイトをお作りになる場合は、以下のいずれかを推奨致します。
この場合、WAP 1.0以外のCSS非対応環境では、論理インライン要素に関しては予め設定ファイルで指定している表示色が、見出しについては予め設定ファイルで指定している表示色及びテキスト配置が適用されます。
要素、属性の扱いについてはHTMLの各要素に関する制約をご覧下さい。
しらぎくモバイルシステムで取扱うウェブを作成する場合は、以下の点にも注意して下さい。
HTMLでもインラインCSSでも、カラーコードは必ず「#
XXXXXX」(「#
」に続けて十六進数六桁)のフォーマットまたはW3C標準カラーコード(16色・「fucusia
」など)を用いて下さい。
rgb(
…)
」の形のカラーコード,独自仕様のカラーコード(「pink
」など)及び「#
XXX」のフォーマットはサポートしておりません。字下げなどの目的で<blockquote>要素を使わないで下さい。<blockquote>要素に対して、当システムは引用である事を分かり易くするテキストを追加します。title属性に引用元の題名などを記述すると、その内容を引用元として明示します。
>
」を付ける事で引用と分かるようにします。<a>要素でのリンク先に内部の画像を指定した場合、当該画像と元のページへのリンクからなるページを生成するようにしております。
また、このリンクを開いた際に表示させたいタイトルを当該<a>要素のtitle属性で明示する事も出来ます。
例えば、以下の画像へのリンクを開くと「マーガレット」と言うタイトルが表示されます。
<a href="Marguerite.GIF" title="マーガレット">画像</a>
ソフトバンク在来機, WAP 1.0及びH"リンクには<form>要素の扱いにより処理が変わる場合があります。
ファイルサイズの制限として、以下を厳守して下さい。
これは、端末制限に対応するためのものです。
但し、実際に配信されるコンテンツに画像が加わった場合や制限ぎりぎりのファイルサイズのコンテンツの場合に、一部旧型端末で閲覧不能に陥る場合がありますのでご注意下さい。
サイト設置の際には、以下の点に注意して下さい。
HTML文書を収めるディレクトリは必ずCGI設置サーヴァに設置して下さい。
HTMLファイル名について、以下の制限がありますのでご注意下さい。
画像ファイルはGIF画像, JPEG画像及びPNG画像が利用出来ますが、GIF画像をご利用になる事を強く推奨します。詳しくは取扱える画像をご一読下さい。
実際にHTMLファイル内で画像をリンクする場合は、GIF画像はカラー標準サイズのGIF画像ディレクトリ内の画像を、JPEG画像は標準サイズのJPEG画像ディレクトリ内の画像を指すように記述します。要するにiモードやWAP 2.0及びPCでならシステムを通さなくても閲覧出来るようにすれば良い訳です。
iモード向けサイトの場合、リンクした外部サイトが端末に依っては正しく表示出来ない場合もあります。このようなリンクは端末制限で表示を回避する事が出来ます。
GIF画像を用いているなど、ソフトバンク在来機やH"リンクでの表示できないサイトは、そのリンクの前後にそれぞれ「<-- ionly -->
」と「<-- /ionly -->
」で挟む事でこれらの端末での表示を避ける事が出来ます。
<-- ionly -->
」と「<-- /ionly -->
」で挟んだ箇所はiモード。WAP 1.0/2.0・エアーエッジフォン・Lモード・PDA・PCで表示されます。<-- noh -->
」と「<-- /noh -->
」で挟む事でこれらの端末での表示を避ける事が出来ます。この場合、他の端末ではすべて表示されます。また、ページのヘッダに「content="description"
」属性を持つ<meta>要素を記述して、その要素のcontent属性値に解説文を記述した場合も、非携帯電話向けに出力されます。
さらに、<body>要素内にある要素にtitle属性で情報を附与した場合、検索エンジンのクローラにもその情報が伝達されます。
元のHTMLのヘッダに<link>を埋め込むと、PCで閲覧した場合及び検索エンジンがクロールする場合に、関連ページ一覧に編集されて文書に付与されます。
この場合、関連ページ一覧の排列は、以下の条件に従います。
基本的には以下の前後関係となります。
尚、各カテゴリ内の順序は、HTML文書内に現れる順序に従います。
但し、以下に該当する<link>要素で一番初めに現れたものは、「本コンテンツPC版」として元の順番に関係無く一番初めに表示されます。
また、これに該当した<link>要素は、関連ページ一覧以外にも文書の先頭に表示される情報となります。
尚、上記の条件を満たす<link>要素でも、二番目以降に現れたものは正規の順序に従って排列されます。
以下に該当する<link>要素は排列の対象外となります。
media属性があって、且つ「screen」「handheld」「tty」のいずれも含まれないもの。
関連ページ集のアンカーは、以下の通りになります。
リンク先のアドレスは絶対アドレスで(モバイルシステム内で取扱われるリンク先は相対アドレスでも可)、href属性で指定します。
以下、記述例です。
<link rel="alternate" media="screen, projection " href="http://www.fiction.ne.jp/uso800/pc/index.html">
案内するページの内容は、特に問いません。通常は対応するPC版のページですが、PC版サイトの表紙を案内することも出来るでしょう。
しらぎくモバイルシステムで設定されたアドレス外へのリンクは、サイト内の画像を除いて、原則的に外部リソースと見なし、しらぎくモバイルシステムで変換されないページとなります。
これとは別に、外部のHTML文書扱いとする事も出来ます。
それには、<a>要素に「rel="external"
」属性を付けます。
,external
」を追加して下さい(例:rel="next"
⇒ rel="next,external"
)。rel="external"
」属性を付けられた<a>要素にはアンカーが生成されません。「rel="external"
」属性のあるHTML文書へのリンクでは、例え内部文書であっても、直接当該HTML文書へリンクし、しらぎくモバイルシステムでの処理が行われなくなります。
例を以下に挙げておきます。
<a href="PC/index.html">PC版</a>
<a href="PC/index.html" rel="external">PC版</a>
外部サイトの多くは、H"リンクには対応しておりません。
このため、第3.509版(平成17年10月 8日)以降では外部サイトへのアンカーについて、H"リンクではリンクしないで回線切断とする事が出来ます。
これには、<a>要素に「rel="disconnect"
」属性を追加して下さい。
「rel="disconnect"
」属性は他キャリアでは無視されます。
例えば、以下のアンカーはH"リンクでは回線切断のアンカーとなり、その他のサイトではhref属性で指定されたアドレスへのアンカーとなります。
<a href="http://www.uso800.ne.jp/" rel="disconnect">アンカー</a>
rel="disconnect"
」属性がある<a>要素について、H"リンクではhref属性値を無視します。アンカー文字列をH"リンクとその他の端末で区別する事は出来ません。このような場合は機種別コンテンツ宣言を活用してH"リンクと他端末で振り分けて下さい。
例えば以下の場合、H"リンクでは回線切断、その他の端末では別サイトへのリンクを生成します。
<!-- honly <a href="" rel="disconnect">ご覧にならない方(回線切断)</a> -->
<!-- noh -->
<a href="http://www.uso800.ne.jp/">ご覧にならない方(退出)</a>
<!-- /noh -->