和風サイトのデザイン方法【ポートフォリオ作品例】

和風サイトのデザイン制作について、ポイントを解説します。

テンプレートのPSDはこちらからダウンロードできます。
和風サイトのデザインテンプレート（PSD）
画像やテキストなどを変えて、オリジナルの和風テイストのサイトを作ってみてください♪

和風サイトのデザイン制作　５つのポイント

１. 縦書き

縦書きのテキストを使うと和風になります。コーディングで縦書きはCSS3で実現できます。

２. 筆文字

筆文字を使うと、かなり和風になります。今回はこのサイトの筆文字を使用しています。

３. メインビジュアルに和風の写真を使う

メインビジュアルに寺や神社、富士山、浮世絵など日本の写真を使用すると和風になります。

４. 日本の伝統色

日本の伝統色を用いると和風になります。伝統色はこちらのページを参考にしてください。濃いめの緑や藍色が定番です。

５. 文様のテクスチャ

日本の伝統的な文様を背景のテクスチャとして用いると和風になります。今回はSubtlePattensで見つけた麻の葉文様を使用しています。

本テンプレートで使用しているフォントや素材について

使用フォント

メニュー：貂明朝（Adobe Fonts）
日本語フォント：游明朝（Mac/Windwos標準）
欧文フォント：Adobe Garamond（Adobe Fonts）

Adobe FontsはCCのプランに入っていれば無料で使えます。

使用素材

ロゴ：筆文字素材集 水扇
メインビジュアル：PAKUTASO
写真：PAKUTSO
背景テクスチャ：Subtle Patterns
スピーカーアイコン：Font Awesome