Wixホームページにアートを彩り豊かに追加する方法！ベクター機能の徹底解説していきます

こんにちは！ラジャのけんいちです。

今回は「 ベクターアート」について徹底解説していきます。

この記事を読んでいただければ、「ベクターアートって？」という方がしっかりと Wixでベクターアートを使いこなせるようになりますので、

是非最後までご覧いただき Wixの1つの機能であるベクターアートを使いこなしてください。

Wixとは？

Wixのご紹介

Wix（ウィックス）とは、2006年にイスラエルで生まれ、2010年に日本語版がリリースされ、現在全世界で 2.3億人以上の登録ユーザーを有する人気ホームページ作成ツールです。

CMでこのキャッチフレーズを見たことがある方も多いのではないでしょうか。「1.2秒に1人が Wixを使ってHPを作っています」

直感的にHPを作成・ドラッグ&ドロップにて変更が簡単にできる為、幅広いユーザーから支持を受けています。

ベクターアートとは何？ Wixへの追加方法について

ベクターアートは、サイトに面白みを追加するあしらいとなる小さなアイコンやイラストです。色のカスタマイズオプションやリンクを追加するオプションを使用することで、装飾目的だけでなく、機能性も持ち合わせています。

「ベクターアートとは？」

ベクター化された画像のことを指します。

「ベクタ化」とはJPG」やPNGなどのラスタ画像を「ベクタ画像」に変換することを表した言葉です。ラスタ画像→ベクタ化することで、拡大縮小によるデータの劣化を防ぐことができます。またラスタ画像のロゴマークを印刷する際にも、ベクタ化する必要があります。

JPEG・PING：ラスタ画像
数式で作られている画像：ベクターアート（ベクタ化されたもの）

ベクターアートの追加方法についてご紹介

ベクターアートはサイトのデザインに彩りを加えて、ユーザーをサイト内に没入、ブランド独自の色をつけることができます。
サイトには好きなだけ追加でき、Wix が提供する「数百もの無料オプション」から選択するか、「独自のファイルをアップロード」することができます。

■ Wixのベクターアートをサイト内に配置する方法

1.左のツールバーのプラスボタンをクリック
2.「装飾」をクリック
3.ベクターアートより、該当・好みのものを配置する

上記工程にて簡単にベクターアートを追加することが可能です。

ベクターアートでできる機能・変更方法

・ベクターアート自体の色味の変更
・透明度の変更・影の追加
・リンクの設定
・代替テキストの設定
・アニメーションの設定

主にこの5つがベクターアートをカスタマイズできる機能となります。

ベクターアートはベクター化されている為、画像自体の色味の変更、画像の透明度の変更が可能です。

また、通常の画像同様、クリックすることにより遷移させる「リンク設定」・Googleに認知させる・読み込み時にアシストしてくれる代替テキストの設定が可能となっております。

代替テキストとは、内部SEO作業の事ですので、気になる方はこちらをクリック＞＞＞

ベクターアートの特徴とおすすめの使い方

なぜ、馴染みのあるJPEGやPINGを使うのではなく、ベクターアートを使うのか？
という所をご紹介していきますので、是非参考にしてみてください。

ポイント1｜画像サイズを気にする必要はない

ベクター画像は色の点（ピクセル）で作成されるのではなく、数式を使用して作成されます。

圧縮する大きさを調整する際にコンピュータでその都度情報を数値化して表現するため、画像を拡大・縮小しても画質が変化しないというメリットがあります。 

ピクセル画像だとそのピクセル数が決まっているため拡大する時に画像が必要なピクセル数を保持できなくなるため劣化してしまうのに対して、ベクター画像はそれを柔軟に対応することが可能です。

ポイント2｜ベクター画像の使用は無限大

たくさんあるイラスト素材から好きなイラストを自由に選び、組み合わせることで、ユニークなデザインを作って、Webサイトに使用することが可能です。
サイト訪れたユーザーの興味をそそるようにデザインせを高く視覚に訴えかけるストーリー性を持たせる事ができます。
ベクターアートを使うことにより配色や不透明度を自由にカスタマイズでき、編集がよりクリエイティブに楽しくなり、Webサイトに命が吹き込まれること間違いなしです。

まとめ

今回は、Wixの「ベクターアート」についてご紹介しました。

ベクターアートと通常の画像の違いはご理解いただけましたでしょうか？

JPEGなどの画像はピクセル数が決まっており、大きくすればそれが引き延ばされピクセル数を引き伸ばす事となります。

その点ベクターアートは数式で動く為、画像の大きさの縮小は簡単に出来、配色なども自由自在に変更できます。

ベクターアートの代表例は「Adobe AI」などです。

プロに依頼する＞＞＞

弊社では制作面でのお困りごと・貴社のHPをプロの目線で現行サイトを分析して、アドバイスさせて頂く「無料相談会」を実施しております。

ご興味がある方は下記のボタンより、弊社「株式会社ラジャ」までお問い合わせください。

Wixの機能面のお困りごとは

株式会社ラジャ