CMS『Webnode』のデザインテンプレートをレビュー
49種類の(デザイン)テンプレート
が用意されています。Google Sitesはイラスト中心でしたが、Webnodeは写真が多く、全体的にデザイン性が高いです。ブログやWikiではなく、Webサイトを作るためのCMSだからでしょうか。
選択画面では、色や写真が異なるバリエーションごとにグルーピングされた縮小画像が表示されます。管理画面のUIもレベルが高いです。
【配色とフォント】
配色とフォントの設定はテンプレートごとに定義されていますが、カスタマイズも可能です。フォント設定では、サイト全体に適用されるフォントを定義します。日本語フォントは選択できず、選択肢を変更することもできないので、日本ではあまり使う機会は無いかもしれません。
配色に関しては、レイアウトは同じで配色と写真のみが異なるテンプレートが最初からいくつか提供されています。さらにカスタマイズしたい場合は、CSSをWeb上で編集することもできますが、ちょっと敷居が高いですね。
【テンプレートの自作・カスタマイズ】
既存テンプレートはカスタマイズや自作もできます。
テンプレート一式をZipでダウンロードし、編集して再圧縮したものをアップロードすればOKです。
ただし、テンプレートの仕様や作り方がドキュメント化されていないので、既存ファイルの内容を解読しながら理解する必要があり、難易度は高いです(Google Webmaster Toolsのサイト認証Metaタグを追加したいので、近いうちに挑戦します)。
【レイアウト】
ヘッダ、サイドバー、フッタのよくある3ペイン構成です。
ヘッダ:
サイト名、サイトロゴ(省略可)、スローガン(タグライン)、6つのサイトリンク(ホーム、サイトマップ、印刷用ページ、RSSフィード)が掲載されます。
サイドバー:
位置と幅はテンプレートによって定義され、変更できません。構成要素としては
- ナビゲーション:必須
- サイト内検索フォーム:独自の検索エンジン
- 連絡先:不要な場合は非表示も可能
この下にさらに、AdSenseや投票、新着リンクなどのサイト内共通要素を追加することができます。
フッタ:
著作権表記をテキスト形式で指定できます。アクセス解析用のHTMLコードを入れることもできます。
ページレベルのレイアウト
【共通と固有の境目】
テンプレートはサイト全体に適用され、ページごとに変更はできません。
そのかわり、テーマでは規定されない中央のコンテンツ部分は、レイアウト(カラム構成)をページごとに変更することができます。左のような4種類のレイアウトパターンが定義されています。
最初は左右等分のカラム構成にしておいたものの、その後の更新で左側のコンテンツが増えたために、右カラムがサイドバーになるレイアウトに変更する、ということも可能です。
【自由度が高いサイドバー】
なんと、サイドバー下部にページ固有のコンテンツを入れることができます。最低限のナビゲーションのみをサイト共通の要素としてサイドバー上部に設置し、各ページではページの内容に合わせてバナー広告、関連リンクなどを配置できるのです。サイドバーがサイト全体で完全に同じになってしまうと、スペースの無駄で、ユーザーにとっても優しくないですよね。SEO的にも不利です。機能としてはシンプルですが、サイトのIAやデザイン、運営を知らないと出てこない発想です。