webテンプレート(ホームページテンプレート)は、webサイトを効率的に制作する上で欠かせないものですが、ここではWebデザイナー向けにテンプレート作成のコツについて紹介していきます。
webテンプレートとはwebサイトを構成するwebページを作成する際のベースになるページのことを指しますが、このテンプレートページを作成する上で最も重視すべきと言っても過言ではないのが汎用性の高さです。そもそも、webテンプレートはwebサイトを制作する際の作業量を削減して、制作時間の大幅な短縮を実現することを目的としています。特に、大規模なwebサイトを制作する場合、全てのページを一からコーディングするとなると膨大な時間がかかります。そのため、webサイトの制作現場では、必要最低限のパーツで構成したテンプレートページを作成し、そこからパーツをコピーすることで新しいページを制作していくのが一般的です。webサイトを構成する大部分のページのベースになるため、webテンプレートには高い汎用性が求められるのです。なお、テンプレートページを構成するパーツは、完成したワイヤーフレームをチェックしながら、使用する予定があるパーツを組み込んでも問題ないか、複数のページで重複しているパーツがあるか、既存のパーツを使いまわすことは可能かといった観点で選定するのがおすすめです。
また、汎用性が高いテンプレートとは、htmlを別ページにコピーした際にレイアウトが崩れないように設計されているのが条件で、後々のコーディングのことも十分に考えて設計しておくことが大切です。具体的には、クラス名をページ内での役割ではなく見た目で付けたり、将来的に使いやすいスタイルをCSSに書いておくといったことを意識しましょう。例えば、ページ内における役割をクラス名にしてしまった場合、別のページに流用しようとした際に、同じスタイルを再び記述することになったり、流用先での役割とクラス名がマッチしなくなったりする恐れがあります。そのため、CSSを記述する際は、クラス名を付けるたけでwebページの見た目を変えられるようにしておくことが大切です。
テンプレートページは、制作するwebサイトの規模が大きくなればなるほど重要性が高まります。そのため、下層ページをコーディングする際のことも十分に考えた上で、汎用性が高いテンプレートページを作成しましょう。