極意(35)セクションの使用例と基本仕様

haikには、セクションと呼ばれる独特な領域表現の方法があります。
以下の4タイプのセクションがありますが、今回、それらの使用例を示してセクションの使い方を明らかにしてみました。

  • デフォルト1:背景はグレー
  • デフォルト2:背景は白
  • 背景色型:背景に濃い目の色を設定。
  • 背景画像型:背景に画像を使用する。
  • 背景画像型の応用例:背景画像を固定するケースです。


セクション/デフォルト1の例

1.デザイン有りきのホームページ

QHMはデザイン有りきのホームページ作成システムです。
約300種と豊富なデザイン・テンプレートを有しています。
ユーザーは先ず豊富なデザインテンプレートからお好きなデザイン一つを選択することから始まります。勿論、デザインの選択は何時でも何回でも納得いくまで選択し直すことができます。このことは、ユーザー自身がホームページ作成作業に従事しようが、私共制作代行業者に作業を依頼しようが、デザイン・テンプレートを選択すること自体は何ら変わりありません。



[check]上記のおまじない(デフォルト1)

#section(bgcolor=#6C7A89,color=#ffffff,left){{
// bgcolor に背景の色、color に文字の色を指定します。
* 1.デザイン有りきのホームページ
QHMはデザイン有りきのホームページ作成システムです。
約300種と豊富なデザイン・テンプレートを有しています。
ユーザーは先ず豊富なデザインテンプレートからお好きなデザイン一つを選択することから始まります。勿論、デザインの選択は何時でも何回でも納得いくまで選択し直すことができます。このことは、ユーザー自身がホームページ作成作業に従事しようが、私共制作代行業者に作業を依頼しようが、デザイン・テンプレートを選択すること自体は何ら変わりありません。
}}


セクション/デフォルト2の例

2.低価格・短納期・高品質なホームページ

QHMによるホームページ作りでは、デザイン料は発生しません。デザイン作業もありませんので工期も短くて、所謂、低価格・短納期・それでいて高品質なホームページが実現できます。
ユーザーはデザインのことに神経を使うことなくコンテンツアップに集中できるのです。ホームページはあくまでも情報発信の手段であって、時間とお金をかける対象ではないと考えております。
それ故、早く安くそれでいて高品質なホームページの存在が望まれるのです。



[check]上記のおまじない(デフォルト2)

#section(bgcolor=#F7F6F6,color=#363636,left){{
// bgcolor:背景色にうすい色、color:文字色に濃い色を指定します。
* 2.低価格・短納期・高品質なホームページ
QHMによるホームページ作りでは、デザイン料は発生しません。デザイン作業もありませんので工期も短くて、所謂、低価格・短納期・それでいて高品質なホームページが実現できます。
ユーザーはデザインのことに神経を使うことなくコンテンツアップに集中できるのです。ホームページはあくまでも情報発信の手段であって、時間とお金をかける対象ではないと考えております。
それ故、早く安くそれでいて高品質なホームページの存在が望まれるのです。
}}


セクション/背景色型の例

3.レスポンシブ・レイアウトを踏襲します

レスポンシブ・レイアウトとは、左図の如く一つのデザインでPC、タブレット、スマフォの各端末に自動的に対応するWebデザインを指して言います。
QHMの約300種のデザイン・テンプレートの中で、今注目なのがhaikテーマと呼ばれる新デザイン・テーマです。haikテーマはレスポンシブ・レイアウトを踏襲したスマフォ及びタブレット対応の新しいデザインです。Web閲覧者の60%がスマフォ及びタブレット端末で閲覧している現代、この機能は外せない機能です。
QHMでは、レスポンシブ・レイアウトだろうと特別料金は発生しません。



[check]上記のおまじない(背景色型)

#section(bgcolor=#1F3A93,color=#ffffff,left){{
// bgcolor に背景の色、color に文字の色を指定します。
* 3.レスポンシブ・レイアウトを踏襲します
レスポンシブ・レイアウトとは、左図の如く一つのデザインでPC、タブレット、スマフォの各端末に自動的に対応するWebデザインを指して言います。
QHMの約300種のデザイン・テンプレートの中で、今注目なのがhaikテーマと呼ばれる新デザイン・テーマです。haikテーマはレスポンシブ・レイアウトを踏襲したスマフォ及びタブレット対応の新しいデザインです。Web閲覧者の60%がスマフォ及びタブレット端末で閲覧している現代、この機能は外せない機能です。
QHMでは、レスポンシブ・レイアウトだろうと特別料金は発生しません。
}}


セクション/背景画像型の例

4.自分で更新できれば一番いいですよね



お客さまの中には、自社のホームページの更新ができずに困っている方が沢山おります。ホームページ担当者が退社してしまったり、あるいは過去にお付き合いしていた制作業者との縁が切れてしまって、更新作業を依頼できる業者がいない等々と理由はまちまちです。
そこで「この機会に既存のページをリニューアルして自分たちでページ更新ができる易しいツールを検討したい」と志向されるお客様に最適なシステムがQHMなのです。





[check]上記のおまじない(背景画像型)

#section(a0015_000003_m.jpg,left,color=white){{
* 4.自分で更新できれば一番いいですよね
&br;
お客さまの中には、自社のホームページの更新ができずに困っている方が沢山おります。ホームページ担当者が退社してしまったり、あるいは過去にお付き合いしていた制作業者との縁が切れてしまって、更新作業を依頼できる業者がいない等々と理由はまちまちです。
そこで「この機会に既存のページをリニューアルして自分たちでページ更新ができる易しいツールを検討したい」と志向されるお客様に最適なシステムがQHMなのです。
&br;
&br;
}} 


セクション/背景画像型の応用例

5.キーワードはリニューアルです。



リニューアルとは、既存のページのコンテンツを再利用して、全く新しいWebサイトを再構築することを意味します。


既存ページの画像や文言等を再利用することで、低価格・短納期で高品質なページにリニューアルできるのです。


リニューアルだから打合せ時間も最小限に抑えることもでき、正にネット業務に最適な作業形態になります。


このホームページのリニューアル作業に最適なシステムがQHMなのです。







[check]上記のおまじない(背景画像型)

#section(a0015_000003_m.jpg,left,color=white,fix){{
* 5.キーワードはリニューアルです。
&br;
リニューアルとは、既存のページのコンテンツを再利用して、全く新しいWebサイトを再構築することを意味します。
&br;
既存ページの画像や文言等を再利用することで、低価格・短納期で高品質なページにリニューアルできるのです。
&br;
リニューアルだから打合せ時間も最小限に抑えることもでき、正にネット業務に最適な作業形態になります。
&br;
このホームページのリニューアル作業に最適なシステムがQHMなのです。
&br;
&br;
&br;
}} 


セクションの基本仕様

  1. 見出しの背景色は、haikのテーマカラーが使われる。
  2. セクションの縦方向の大きさは、テキスト文字の行数で決まる。
  3. 改行記号「&br;」を適宜挿入してセクションの大きさ(縦の)を制御する。
  4. セクションの横幅制御は、段組(#cols)との併用で設定する。
  5. セクション内の文字位置は、中央揃えがデフォルトとなっています。
  6. 従って、文字位置を左寄りにするための「left」指定が必須となる。



戻る


上記の関連記事はお役に立ちましたか?

  • 下記に投票して戴けると嬉しく思います。
    選択肢 投票
    役に立った 8  
    役に立たなかった 0  


ご意見箱