QHM講座
QHM講座
当サイトでは、QHMの技術的な説明も行います。QHMでこんなこともできるんだとわかっていただけたら幸いです。
QHMの説明の前に、QHMのベースとなっているPukiWikiとQHMの比較を以下に示します。
QHMとPukiWikiとの比較
QHMはPukiWikiの良いところは全部取り入れ、初心者にも利用できるようにユーザに優しい作りになっています。
編集画面もブログみたいに文字装飾などもかんたんにできるようになっています。
通常のQHMユーザはPukiWikiのことなんか知る必要はないと思いますが、プラグインを新しく組み込んでみたい、作成してみたいと考えているユーザは少しはPukiWikiのことも知っておいた方が良いと思います。
| QHM [製品版(有償版)、無償版) | PukiWiki | |
|---|---|---|
| 価格 | 有償版：19800円、 無償版：タダ | 無料 |
| 利用対象者 | ホームページ作成初心者からベテランまで | 自分で設定ができる人向け。（技術者向け） |
| 利用目的 | 個人または中小企業でのホームページ作成 企業内での情報共有サイト作成 | 企業内の情報共有サイト作成、複数メンバーでのWiki的な使い方(掲示板みたいに誰でもが書き込める) |
| 技術サポート | インストールは北研Clubで無料サポート、それ以外のサポートはプレミアムサポート（有料) | なし。個人(Wiki)で解決 |
| インストール | 有償版：簡単に利用できるインストーラ付き 無償版：インストーラはない。自分でダウンロードして、アクセス権などを設定する。 | インストーラはない。自分でダウンロードし、サーバに設定する必要がある。 |
| バージョンアップ | 有償版：1ヶ月に1回くらいのペースでバージョンアップがある。またバージョンアップを簡単に行うしくみがある。 無償版：有償版より頻度はは低いがバージョンアップがある。自分でダウンロードして入れ替える必要がある。 | 自己責任で行う必要がある。 |
| マニュアル | 有償版：詳細なマニュアルが会員サイトにある。動画マニュアルがとても充実している。 無償版：基本的なマニュアルは公開されている。 | オンライン上に公開されているが、技術者向けなので一般ユーザにはわかり難いマニュアルである。 |
| プラグイン | 有償版：多数のプラグインが組み込み済。QHM専用に拡張したものもある。 無償版：基本的なプラグインのみ PukiWikiのプラグインがそのまま利用できる。2010年3月現在、QHM用の自作プラグインのサイトは見当たらない。 | PukiWikiの基本プラグインから自作プラグインまで多数公開されている。ダウンロードして利用できる。 |
| 画面デザイン | 有償版：65種類のデザインが用意 無償版：1種類のデザインのみ WordPressのデザインも利用可。ただしソースの修正が必要なため敷居が高い。 QHM専用のデザインテンプレートを配布しているサイトがあるのでそれを利用できる。 | 初期設定のデザインは一般のホームページと比較して硬い作り。スキンを入れ替えればオリジナルナデザインが作成可能。 |
| フォーラム | QHMユーザフォーラムが、無償版ユーザにも公開されている。技術的なサポートなどがフォーラム参加者により行われている。 | PukiWikiのサイト |
| 要望受付 | 北研Clubで要望を受け付けている。内容によっては、すぐに実現された機能などもある。 | PukiWikiのサイト |
QHMの画面構成
QHMは以下の２カラムの６パートで画面を構成しています。
| ヘッダー | |
| ナビ | |
メニュー | コンテンツ |
| ナビ２ | |
| フッター | |
現在は、3カラムの７パートも利用できるようになっています。
| ヘッダー | ||
| ナビ | ||
メニュー | コンテンツ | メニュー2 |
| ナビ２ | ||
| フッター | ||
| パート | ページ名 | 全ページ適用 | 説明 | 使えるTips |
|---|---|---|---|---|
| ヘッダー | なし | ○ | 設定画面のみで変更可 | ヘッダー上にテキストや画像を載せる |
| ナビ | SiteNavigator | ○ | リストのおまじないでリンク指定 | jQueryでプルダウンメニュー |
| メニュー | MenuBar | △ | 見出しのおまじないでリンク指定 | #menuプラグインで他のメニューに変更 |
| コンテンツ | FrontPage ...など. | × | いくつでも自由に作成できる | メニュー領域を無くして、コンテンツだけを表示 |
| メニュー２ | MenuBar2 | △ | 見出しのおまじないでリンク指定 | ３カラムのときだけ表示 |
| ナビ２ | SiteNavigator2 | ○ | テキストでリンクを指定 | 画像を入れる、全ページ共通のCSSを指定 |
| フッター | なし | ○ | 設定画面のみで変更可 |
○：全ページに同じものが表示される
△：基本的には全ページに同じものを表示するが、変更も可能。
×：全て違うものを表示する。
QHMのスタイル構造について
QHMは以下のようなスタイル構造となっています。これが理解できれば、スタイルシートを変更してデザインにいろんな工夫が可能です。また、jQueryなどの高度なテクニックを使い、レイアウトを変更できます。
使用するデザインにより少し異なりますので、全てのデザインでこのようになっているわけではありません。
名前の前に #(シャープ)が付いているものが id、.(ドット)が付いているものがclassです。
QHMで作成したページのソースファイルをブラウザで見ると、以下のような記述があります。階層化されていますのでそれを図にしたものです。
<div id="headcopy"> :::::: </div><!-- END: id:headcopy --> <div id="wrapper"><!-- ■BEGIN id:wrapper --> <div id="header"> :::: </div> </div><!-- □END id:wrapper -->
ご意見箱
皆様のご意見をお待ちします。
- ページ全体の構成がよくわかりました。 -- 澤 2011-07-12 (火) 17:50:34
- ページの構成内のおまじないの配置等少し理解できました。 -- 水先案内人 2012-03-16 (金) 08:22:43
