ウェブデザイン制作/ウェブ・ポジショニングのウェブZYCO'S [ リスト二階層タイプ ]

リスト二階層のメリハリタイプ

▼ paragraph-3

  • ボディはSEO構造。
    全てはこの SEO 構造を軸に展開される。参照ページとして 本サイトのSEOランキング推移 と、実際の クライアントの実例 を掲載。この概念と対策が出来ていないとサーチエンジンに一目置かれない。
  • ブラウザ互換はIE6とFirefox1.5
    html4.01strict「標準モード」 で記述。ブラウザのバグ対策を行っているので両者において殆どを同一表示する。Firefoxが訪れて動作しないようだと15パーセント取りこぼす。(本ウェブ調べ)
  • CSS
    全てのデザインとレイアウトはCSSで制御され、htmlの論理構造とデザインは完全に分離される。→例えば本ウェブの Switch Menuのページ CSSを外すとこうなる 。つまり、後者の表示されているテキストを修正するのがこのテンプレートだ。
  • フォントサイズ・フリー
    ストレスを感じない使いやすさは フォント・サイズ・フリー のデザインに尽きる。このポイントを外すと一瞥を食らうことも多いので重要性が高まっている。
  • 利用者はコンテンツで勝負する
    ウェブ制作の作業はテキストと画像を差し替えるだけで済む。だから、画像ファイルやリンクの指定の変更ができる程度の知識があればこのテンプレートは使いこなせる。
  • フォトショップのファイル付き
    PSDファイルが添付されるので、新規に作成する画像や差し替えの画像加工においてもテンプレート機能が利用できるので便利だ。
    • ヘッダーイメージ(ブルーグラデーションとテキスト)
    • バナーデザイン
    • リストアップ用イメージ
    • 掲載用各サイズのフォト
  • テーマ別のデザインと演出
    実践で使えるレイアウトを収録。視認性に有効なロールオーバー、アイコン、JavaScriptはやさしいナビゲートを実現する。
    • バナーレイアウト
    • ショッピングリスト
    • タブ切り替え式ショッピングリスト
    • 写真(左配置と右配置)付きレイアウト
    • 写真拡大モジュール
    • 写真と説明文と本文のレイアウト
    • 折り畳み式FAQ
    • リストスタイル
    • 表組み(ロールオーバー効果付き)
    • 大見出しと小見出し
    • リンクパターン
    • ロールオーバー・リスト・メニュー(サイドバー)
    • パンくずリンク、フッター(二層式)

▼ html source

Select All

 マーク(イメージ)付きリストの二階層タイプです。

  • 段落を追加するとき
    一階層と二階層のタイプがありますので注意してください。追加したいタイプのブロックを丸ごとコピーしてください。ブロックは改行で区切られていますので、改行マークの行でペーストを実行し編集してください。二階層目のリストは<li>〜</li>をコピーして同一階層内へペーストして編集します。