全カテゴリー(TOP)
web関係
CSS
Vista/IE7
HTML
XHTML
PC全般
たわごと
あなたのポートフォリオ 自信ありますか?
業界のプロがお仕事ご紹介に合わせてポートフォリオの作り方教えます!
最新の記事
| 過去の記事はこちらからどうぞ  
検索:

[PR]「Windows Vista Ultimate + 3.5インチFDD」が【税込】25,980円
[PR]【じゃらん】国内15,000軒の宿をネットで予約OK!5%ポイント還元!

■ このブログについて

このブログのもともとのつくりはHTML4.01のテーブルレイアウトです。しかし、私はXhtml1.0のCSS+DIVでレイアウトしました。

その為、一部の古いブラウザ(IE5.5やNN4以前)では正確に表示がされません。NN4などの場合によっては、まったく表示が去れない恐れがあります。

それは、該当ブラウザのCSS実装(対応)や仕様の問題です。

そういうブラウザでもきちんと表示がされるように、テーブルレイアウトをするのがWEBデザイナー(クリエーター)には求められるのでしょうが、私は以下の理由で、テーブルレイアウトを極力避けています。

  • 音声ブラウザに対応しにくいなどのアクセシビリティが損なわれやすい点
  • 無駄なタグ(trやtdなど)が多くなり、ページのロードが遅くなる。
  • テーブルでレイアウトすること自体が、本来の用途と違う。
  • CSSの存在意義が損なわれる。
  • 構造上、XMLへの移行がしにくい。
  • レガシーなサイトコーディングにとらわれると、新しい技術が習得できない。

我ながら、ずいぶん極端な意見もありますね・・・

■ 「最新の記事」の表示のさせ方(yaplog)

   

このページの上部に記事の見出しのみを10件ずつ表示させています。記事を投稿すると自動で新しい記事の順に表示されます。

ソース

<div>最新の記事</div>
<BlogEntries>
<div>
<div style="font-size:80%;">
<a href="{$BlogEntryPermalinkUrl$}"> <strong>{$BlogEntryTitle$}</strong></a>
<span style="font-size:80%;">
{$BlogEntryDate format="%Y年%m月%d日(%a)" language="jp"$}#123;$BlogEntryDate format="%H:%M"$} 
</span>
</div>
</div>
</BlogEntries>

表示例

最新の記事
ぼろ負け 2009年05月06日(水)18:50
再開 2008年05月10日(土)17:43
試し 2008年04月16日(水)07:29

※テキストリンクの色は、このHPで指定してある色です。お使いになる際は、スタイルシートにてお好きな色を指定してあげてください。


リンクシェア アフィリエイト紹介プログラム

GMO Internet, Inc. ▲ ページトップへ
ブログパーツ