Webサイトのデザインにおいて、フォントとカラーはブランドの個性を表現する重要な要素です。
Wixではこれらの要素を一括で設定し、サイト全体で統一感を出すことができますが、意外と変更方法が分かりません。
この記事では、Wixでサイトを作成する最初の段階で設定しておきたいフォントとカラーを一括で設定する方法をご紹介します!
カラーの設定
- Wixエディターを開き、「サイトデザイン」をクリックします。
- 「カラーテーマ」を選択し、「サイトカラーを編集」をクリックします。
- 「カラーを追加」を選択し、ブランドに合わせたカラーを選択またはカスタムカラーを追加します。
- 設定したカラーは、「テーマカラー」として保存され、サイト全体で使用できるようになります。
実際にテキストのカラーを変更してみると、「テーマカラー」に登録したカラーが反映出来ているのが確認できます。
※Wixのアップデートによって画面の見え方などは少し違います。
Wixでは、サイト全体にわたって使用するカラーを事前に定義しておくことができます。これにより、各ページやセクションでカラーを一括で設定し、ブランドのカラーパレットに忠実なデザインを維持できます。
メインカラー、サブカラー、ボタンカラーなどよく使うカラーはこちらに設定しましょう。
フォントの設定
テキストテーマの編集
- 「サイトデザイン」に戻り、「テキストテーマ」を選択します。
- 「見出しh1」〜「段落3」までをクリックして編集します。
- 「フォント」「サイズ」「カラー」といった項目ごとに設定ができます。
- 設定したフォントは、テキストを追加する際に自動的に適用されますが、必要に応じて個別に変更することも可能です。
実演
実際に「見出し h2」に以下を登録してみます。
・フォントは「Noto Sans JP」で設定
・フォントサイズは30pxの太字
・カラーは水色
Wixエディターに戻り、サイトに「見出し h2」を追加してみます。
先ほど「見出し h2」に設定した内容が反映されているのが分かるかと思います。
この作業を「見出しh1」〜「段落3」まで繰り返して作業が完了です!
カラーと同様に、Wixではフォントも一括で設定することが可能です。統一されたフォントはサイトの読みやすさを向上させ、プロフェッショナルな印象を与えます。
セクションの見出し(h2)、セクションのサブ見出し(h3)、テキストなどはこちらに設定して使い回せるようにしておきましょう。
サイトの背景カラーの設定
- 「サイトデザイン」に戻り、「ページ背景」を選択します。
- 「カラー」を選択し、希望の背景カラーを選択します。
- また、「マイカラー」から事前に設定したカラーを選択することもできます。
- 背景カラーはページごとに異なるカラーを設定することも可能ですが、ブランドの一貫性を保つためには、全ページで同じカラーを使用することをお勧めします。
Wixでは、サイトの背景カラーも簡単に設定できます。背景カラーはサイトの雰囲気を大きく左右するため、選択には慎重を期す必要があります。
まとめ
今回はWixでサイトのカラーとフォントを一括で設定する方法を解説しました。
フォントとカラーを一括で設定することで、サイト全体に統一感を持たせることができます。これにより、訪問者にとって覚えやすく、信頼感のあるサイトを作成することが可能になります。効率的にサイトのデザインを整えて良いサイトを作成しましょう!