WEB制作
ECサイトのちょっとした装飾に!すぐに使えるCSSジェネレーター5選!
#ECサイト×CSSジェネレーター5選!
ECサイトは商品情報が最も大切ですが、売上を伸ばすためには文字や画像などの要素を装飾することが不可欠です。そういった用途に使われるのが、要素にスタイルが追加できるCSSです。CSSは見た目だけでなく、ユーザビリティの向上にも役に立ってくれます。要素を適切に配置することで、視認性や使いやすさを改善することもできるのです。
本稿では、ブラウザから利用できるCSSジェネレーターについてまとめています。使い方も簡単で、手軽に使うことのできるサイトばかりです。ECサイトの運用に、ぜひ活用していただければと思います。
ECサイトに使えるCSSジェネレーター5選
CSS Button Generator
CSS Button Generator
ECショップのページには、テキストや画像などの要素が表示してあります。なかでもボタンは重要。購入手続きや会員登録など、あらゆる場面で使われます。ユーザーにスムーズにアクションをとってもらうためにも、デザインが良く、わかりやすいボタンを設置しておきたいものです。
「CSS Button Generator」はボタン用のCSSを書き出してくれるCSSジェネレーターです。ブラウザからスタイルを選択・入力するだけでCSSが手に入るので、CSSのコーディングがわからないサイトの運用管理者にもおすすめです。
スタイルを変更するとリアルタイムにプレビューが表示され、即座にCSSコードの表示も変わります。フォントやボーダー、ホバー、バックグラウンドなどの指定ができ、自由度のあるボタンCSSをつくることができます。
Ultimate CSS Gradient Generator
Ultimate CSS Gradient Generator
グラデーションが作成できるCSSジェネレーターです。デザイン業界では標準的なツール「Photoshop」と似た画面をしているので、抵抗なく使える方も多いことでしょう。
グラデーションの方向は水平、垂直、斜めの3通り。クロスブラウザ対応で、対応しているカラーフォーマットも幅広いです。グラデーションのプリセットも135と数が多いですね。
「Ultimate CSS Gradient Generator」の優れているところは、インポート機能でしょう。すでにあるCSSをインポートしてカスタマイズしたり、画像ファイルを変換してCSSグラデーションを作成することも可能です。
3D Ribbon...
WEB制作
ECスマホサイトに使いたい!オシャレなアイコン7選!
ECサイト運営者には欠かせないおすすめのアイコンセットを以前、ご紹介させて頂きました。
絶対に使いたい!ECサイト向け!高品質アイコンセット7選!
PCサイトからスマホサイトまでフレキシブルに使えるアイコンばかりで、様々なシーンで活用してもらえるともいます。
しかし、スマホはPCにはないようなスワイプやピンチ、タップなどといった動作があります。その動作のためのアイコンや、スマホサイトのサイズ感に合ったアイコンが欲しいなと感じる人も少なくないはず!
実際、スマホ用に作られたアイコンセットも多く配布されています。
という訳で今回は、ECスマホサイトに使いたい!オシャレなアイコンを7選ご紹介していきたいと思います。
Icon Set (144)
Icon Set (144)
ピンチインやピンチアウト、スワイプ動作を指すアイコンや、スマホならではのアイコンが144個も詰まったアイコンセットです!デザインはアウトライン調で、とってもシンプルで更に繊細さもあります。なんかよーくみたらアップルマークまでありますね!Bluetoothはまぁわかりますがアップルマークはどこで使うんでしょう・・・
そういういるのかもわからないものまで作ってしまう作者の心意気が個人的に好きです。
150 outlined icons
150 outlined icons
このタイプ、個人的に好きです。
他と同じような感じがしつつも全体的にコンパクトでかわいらしい印象のする、シンプルなアウトライン調アイコンセットです。なんと150個入りです!ふきだしとかしずくにスマイルマークが描かれていてほっこりかわいいですね・・・!
スマホ独特のアイコンもしっかり入っていて追加で似たアイコンを探しに行く必要もなさそうです!
Uniicons
Uniicons
太めでも細目でも綺麗でスタイリッシュな印象を与えるアウトライン調アイコンセットです!
サクッとシンプルでありながらもちゃんと何を意味したアイコンなのかが全部わかるのですごいですよね・・・
あえて外国風のポストをアイコンにするあたり、作者の好みなんかが伺えますね。
100 Ink Style Icons
100 Ink Style Icons
アウトライン調ではあるのですが、インクで描かれたような独特なセンスを感じさせるアイコンセットです。
かわいいですが、使いどころにちょっと迷っちゃうかもしれません!
みずみずしい感じがするので、傘とか雨具関連のECサイトなんかに使ったら味が出そうですねー!
私もチャンスがあればどこかで使ってみたいです・・・
Eldorado 1262...
WEB制作
『ファッションECサイトに役立つ!』女子ウケ抜群のフォント10選!
最近抱き枕を買って、抱き枕の良さをひしひしと痛感しております。みっしぇるです、こんにちは!外出するのも億劫になっちゃいます。いけないですね!
さて、ファッション系のECサイトを運営されている方で、主にレディースを取り扱っている方、デザインで困ったことはありませんか?女性向けのサイトならばデザインも女性向けにしなければ、第一印象から興味を持ってもらうことは難しいですよね。
そのためには全体的な雰囲気きあら細かい部分まで「女性向け」というのを意識して作りこんでいかなければなりません。ということで今回は、ファッションECサイトに役立つ!女子ウケのするフォントを10選ご紹介します!
まずはフォントから女性が好きそうなデザインを固めていきましょう!
では1つ1つ見ていきましょうー!
日本語フォント
JKゴシックフォント
JKゴシックフォント
名前の通り、まるで女子高生が描いたようなゴシック調のフォントです。
かわいらしいクセが女子ウケしそうですね!
クセは強いけどしっかり読みやすく、丸っこいので女性にとっては親近感が沸くかもしれないフォントです。
ほのか丸ゴシック
ほのか丸ゴシック
角がすべて丸くなっていて、滑らかな雰囲気の漂うやさしいフォントです。
ほのかシリーズは漢字とひらがなのサイズが違うのでボコボコしそうな印象ですが、そこも流れるように滑らかになって見えるので違和感なく読めると思います。
オシャレな感じもするので女性は好きなんじゃないでしょうか!
ふわもこフォント
ふわもこフォント
保育園のような印象を与えるこちらのフォントは、ほんわかしたかわいらしいタイプのサイトにいいのではないでしょうか!
お母さんや妊婦さん向けのサイトにもいいかもしれないですね。
見ての通りふわふわでもこもこなので、可読性は低いかもしれませんが、打ち出したいタイトルや見出しなどに使うとインパクトは強くて目を惹きつけることができそうです。
はれのそら明朝
はれのそら明朝
ここで一つ綺麗めのフォントを。
明朝体の綺麗で女性らしいフォントはたくさんあるのですが、このフォントはレトロな感じも残しつつ涼しげな綺麗さもありますね。
筆っぽい漢字だけどさっぱりもしているので、結構幅広く使えるんじゃないかなーと思います!
コーポレート・ロゴ
コーポレート・ロゴ
企業っぽい感じもする一方で、シンプルでモダンな感じもしますね。
使う場面で印象ががらっと変わってしまうこのフォントは、どこかかわいらしさもあるので、女性向けサイトでも十分使えちゃうと思います。
POPな感じでビビットカラーでまとめたデザインに合いそうです!
英字フォント
Sofia
Sofia
メルヘンでくるくるした文字がかわいい英字フォントですね!
これは誰から見ても一目で女性ウケすると思うでしょう。
くるくるしていると、英字の場合筆記体っぽくなってどちらかとエレガント系に近くなるのですが、このフォントはしっかりかわいくなるように作られていますね!かわいいです!私ダウンロードします。
Purbacara
Purbacara
縦長で手書き風なのがおしゃれでかわいいこちらのフォント。個人的な意見ですが、よくオーガニックな商品のパッケージなんかに使われているイメージです。
無料で使えるのは残念ながらインラインのもののみです・・・!レギュラータイプやBOLDタイプのものは有料パックでのみの提供となるので、やっばいすっごい欲しいという方はぜひ!
Matlide
Matlide
こちらも縦長な英字フォントですね。先っちょがまるまってたりしてとっても女性的なかわいらしさがあります。
あまり派手なデザインのものには向かないと思うのですが、シンプル綺麗めでナチュラルなカフェっぽい印象のサイトに合うんじゃないかなと思います!
Vintage & Eroded Font
Vintage & Eroded Font
すごく綺麗な花がモチーフに彩られた英字フォントです。
これ無料で商用可にしちゃうのか!と衝撃を受けたのは私だけでしょうか・・・。
頻繁に使うようなものではないと思うので、ベースはシンプルにしてタイトルや見出しなんかに使うと丁度いいのではないかと思います。
Sophia
Sophia
万年筆だか筆ペンだかで書かれたっぽいこちらのフォントは、サササッと書いたラフ感がまたかわいらしいですね。
ところどころくるくるしていると、やはり女性らしさを感じてしまいます。
手書き風なので可読性は落ちるかもしれませんが、いろんな場面に使えそうなフォントです。
最後に
以上!女性ウケしそうなフォントを10選ご紹介しました。
日本語フォントと英字フォントで共通して見られたのは、やっぱり「丸っぽさ」でしょうか。
あと「クセ」が強そうなものも多かったように思います。
女性の字って、女子中高生がまさにそうですが、結構クセがあるものが多いですもんね。
もしデザイナーが男性でそこらへんはよくわからんよ・・・という場合は、この記事を参考にしてもらったり、身近な女性に聞いてみたりするのもいいかもしれませんね!
では今回はこのへんで・・・みっしぇるでした!
SEO対策
モバイルフレンドリーとは!?~SEO対策とコンバージョンに必須な2つのtips~
モバイルファーストとSEO対策が今の時代には必須だとだれもが理解し認識するぐらいスマホユーザーが増え。スマホでのインターネット利用に抵抗を感じないインフラも整備されております。また同時にユーザーが利用する、コンテンツやサービスも充実しどこかしこでもスマホをいじっている人を見かけるぐらいユーザーの可処分時間にスマホは欠かせないものになりました。
参照:『可処分時間』ウルトラマンの戦闘時間が3分の理由と時は金なり
これに伴ってgoogleも昨年2015年と今年2016年のプレスリリースにて、モバイルフレンドリーのアップデートを発表されました。このアップデートにより、アルゴリズムの要素としてモバイルフレンドリーを以前よりも更に重要視するとしたようです。
これで更にGoogleでのSEO対策においてはスマホサイト対応は必須のものとなりました。
参照:2015年4月21日 モバイル フレンドリー アップデートを開始します参照:2016年3月17日 ウェブをさらにモバイル フレンドリーにするための取り組み
サービス提供やEC事業者を展開される方も嫌でも耳にされてるかと思いますが。いまいちど、モバイルフレンドリーについて
エンドユーザーであるお客様にとって必要なことなのか?
SEO対策への影響はどうなっているか?
モバイルフレンドリー対応の方法やツールの使い方などを交え ウェブビジネスにおけるモバイルフレンドリーとはという観点から考えてみたいと思います。
モバイルフレンドリーとは
モバイルフレンドリーとは、googleが推奨し推進しているスマホサイト対応の事を言います。具体的にはWEBサイトやホームページをスマホや携帯電話で見やすく使いやすい表示に最適化することを意味します。
googleのSEO対策や検索対策への影響も大きいアルゴリズム( Googleが検索結果のランキング要素)においてこれからますます重要になるとプレスリリースにて2度に渡り発表され。
SEO対策にモバイルフレンドリーは必須??
今年2016年のプレスリリースにて明確に更に重要視すると公表されています。一時は、検索結果にモバイルフレンドリー対応のサイトには 「スマホ対応」のラベルが表示されましたが。現在では表示はなくなりました。
しかし、SEO対策やgoogleの検索結果ランキングのアルゴリズムへの影響度合いは確実に日々増しています。
参照:2016年3月17日 ウェブをさらにモバイル フレンドリーにするための取り組み
スマホファーストとモバイルフレンドリーの違いって??
スマホファーストは、事業者である皆さんの認識としてスマホサイトに力を入れ。時代やユーザーのトレンドとしてPCサイトよりも前にスマホサイトを使うし見るよってことです。モバイルフレンドリーは、スマホや携帯電話でいかに使いやすいか見やすいサイト・サービスに出来ているかを表現するさいに使います。厳密にはどっちもユーザーにも事業者にとってもスマホ、携帯電話に対応したサイト・ホームページが大事だってことです。
グーグルモバイルフレンドリーについて紹介
googleがアルゴリズムとしてモバイルフレンドリーを重要視してる事はご紹介しましたが。具体的に現在(2016年9月)の状況と対策方法をgoogleの公式情報やモバイルフレンドリーツールの使い方などを交えご紹介します。
Googleモバイルフレンドリーの現状
2016年の2度目のアップデート発表によりSEO対策において非常に重要であると公式発表がされました。これにより対策していないサイトは大幅にランクダウンし逆に対策しているサイトは順位を大きく上げれる可能性があります。
色々なキーワードで検索してみると分かるんですが。ビックキーワードと呼ばれるgoogleで月間検索数が多いキーワードではほぼ全ての検索結果でスマホサイトが占めています。
ミドルキーワードではちらほらPCサイトも混じっているというキーワードもあります。これはある意味で、自社やお店のサービス・商品をスマホユーザーに知ってもらえる大きなビジネスチャンスだと言えます。
SEO対策にモバイルフレンドリーは必要??
店舗や地域に根ざした事業をされる方にとっては、地域名+サービス名などがターゲットキーワードになるケースがあるかと思いますが。地域によってはまだまだスマホサイト最適化がされていません。
これをまだまだ他社がやってないから、必要ないよと見られる方もいますが。まだこれからな状況の今だからこそ大きく順位を上げれるチャンスなんですね。
SEO対策の観点だけでなくモバイルフレンドリーやユーザビリティの観点からは逆にどこもやっているという状況でも必須ではあります(^ ^)
では具体的にやるべきことを紹介します!!
1、Googleモバイルフレンドリーテストでチェック
URLをいれて分析でGoogleモバイルフレンドリーチェックをすることが出来ます。
参照:Googleモバイルフレンドリーテスト
大丈夫な場合は・・・
このように問題ないと表示されればOKです。
修正が必要な場合には・・・
このように表示された場合には、指示に従って修正が必要です。ウェブサイトの状況により異なりますが。PCサイトのままの場合には、スマホサイトを制作する必要があります。スマホサイトに対応しているけどという場合には、指示に従って改善や修正を行ってください。
『郷に入っては郷に従え』ではありませんが、GoogleでのSEO対策・上位表示を目指すのであればGoogleに高評価を得れると分かるところは最善を尽くしましょう!
2、GoogleのPage Speed Insightでチェック
1のモバイルフレンドリーツールでも大まかなチェックが出来ますが。当然、チェックできる項目は限られますので出来る範囲でユーザーにもgoogleなど検索エンジンにも高評価を得れるようにしたいところですが。
このPage Speed Insightでは、スマホサイト・モバイルフレンドリー対応において非常に重要な要素である表示速度をメインとしてウェブサイトの構造やコードについて100点満点で評価加点してくれます。
1をクリアした方は、このGoogleのPage Speed Insightでチェックしてみましょう!実際の改善のフローなどの検証はまた別の記事にてご紹介したいと思いますが。
GoogleからSEO対策も含め評価される。
ユーザーにとってより利用しやすいサイトにできる。
チェックして改善をすることによりこれらを得ることが出来ます。ぜひ試してみてください。
参照:GoogleのPage Speed...
WEB制作
スマホサイトの必要性 ~スマートフォンサイト作成入門~
スマホファーストが当たり前になってきましたが。皆さん、スマホ対応・最適化はすでに実施されていますでしょうか?スマホファーストはあと数年で無くなるとか、スマホ対応のサイトはPCで見づらいとかってご意見も耳にしますが。それらはすべて本当でしょうか?
ここ数年のインターネット利用デバイスの動向を世界・国内レベルで見てましてもまだまだ伸びしろも成長スピードも圧倒的にスマホに分があります。
そして、適切なスマホサイト対応が出来ていれば上述のようにPCで見た際に見づらいなどということも決して起こりません。これらのことを踏まえてスマホサイト制作と対応がなぜ必要なのかを今一度整理してみたいと思います。
『スマホ専用サイトは必須!?』爆発的な普及と当たり前になったインターネット利用
すご~く大事なことなんですが。使っている人・ユーザー数が多いと良いかと言うとそういう訳でもないんですね。
なぜならば、皆さんのビジネスの目標・結果に繋げることが一番のゴールというか目的であります。
集客が目的であれば、集客につながるお客さんに情報を届けなければいけません。
商品の販売が目的であれば、その商品を買ってくれそうなお客さんに情報を届けなければいけません。
その点、ユーザー視点で考えて頂くと分かるのですが。
どこかに旅行や出かけた際に、お店を探すときにはスマホでググったり。アプリを使って情報収集したりする方が結構多いと思います。
総務省発表の情報収集の手段について
https://www.soumu.go.jp/johotsusintokei/whitepaper/ja/h27/html/nc122310.html
総務省|平成27年版 情報通信白書|インターネットの普及状況
https://www.soumu.go.jp/johotsusintokei/whitepaper/ja/h27/html/nc372110.html
見て頂くと分かるのですが、インターネットで調べるという方が圧倒的に増えているんですね。しかも、利用者でいうと8割1億人を超えています。まだまだテレビの方が割合多いですが。個人的には仕事柄、ネット漬けですのでほぼインターネットで調べてる気がする気がしますが^^
スマホからのインターネット利用がPCを超える!?
スマートフォンからのインターネット利用者、2015年冬にはPCを超える可能性 ~ ニールセン、最新のインターネット利用状況を発表 ~
https://www.netratings.co.jp/news_release/2015/05/Newsrelease20150526.html
こちら2015年の記事と少しばかり古い記事ではあるんですが。ニールセンさんの調査によれば2016年現在、スマホからのインターネット利用がPCからの利用を超えると予測されています。インターネット利用のユーザー数も利用時間も多いと考えられるスマホサイトがビジネスにおいて欠かせないものだというのは何となくご理解頂けたかと思います。
ECサイトはまだまだそんなこと無いと思われた方もいるかもしれません。そんな方は是非こちらの記事をご覧ください!
スマートフォンからのEコマース関連サービス利用者は5,000万人に迫る規模に成長 ~ニールセン、スマホユーザーの最新Eコマース利用動向を発表~
https://www.netratings.co.jp/news_release/2016/06/Newsrelease20160628.html
驚異的な数字ですが。スマホでインターネット利用のユーザーの87%がEコマースサイトを利用するそうです。87%なんでほぼ9割ですね。
今や、スマホで物を買うことに対しての抵抗はほぼなくなったと断言できると言えます。これらのことから今やジャンルやサービスの種別を問わず、ECサイト、会社のホームページ、サービスの専用サイトなどどれも全てスマホサイト対応することでWeb集客の第一歩が始まると言っても過言ではありません。
【公式情報】Googleのスマホサイトの検索数がついにPCを超える!!
2015年の記事にはなりますが。ユーザー数だけではなく、情報収集の際の検索数もがスマホサイトの方が多いと言うんですね。
該当の記事の内容ですが。
アメリカ、日本を含む10か国においては、モバイルデバイス(スマホ)からのGoogle検索が、コンピュータ・パソコンからの検索より多く行われています。
In fact, more Google searches take place on mobile devices than on...
WEB制作
上品な雰囲気が出せる!品のあるECサイトで使いたいフォント10選!
ECサイトを運営しているとデザインする機会がとても多いですよね!
サイト自体のデザインはもちろん、バナーや商品紹介画像など、幅広くデザインしていかなければなりません。
今回は、品のある綺麗めのECサイトを運営されている方向けの、上品な雰囲気が出せるフォントを10選!選んでみました!
これらのフォントをあらかじめ使用しているパソコンに入れておけば、いつでもパッと出して使えます。
その都度良いフォントを探すより、いくつかストックしておくといざという時便利ですよ!
そして更に、今回は日本語と英語のカテゴリに分けでご紹介していきますので、気に入ったのがあればぜひDLしてみてくださいね!
※無料で商用利用OKのものを厳選してご紹介していますが、DLして使用する前にまずはご自身でもライセンス関連の方のチェックして把握しておくようにしておきましょう。
日本語フォント
はんなり明朝
はんなり明朝DL
世間はどうか知りませんが、綺麗な和風フォントの定番はやはりはんなりさんだと思っています!
シュッとしたいけど少しやわらかさも欲しいといった時など、幅広い場面で使えちゃいます。
まさに「はんなり」って感じの書体ですよね!
明朝體フォント むつき
明朝體フォント むつきDL
こちらはレトロで昭和チックな上品な趣がある日本語フォントです。
表示できる感じが少なめなのが痛いですが、筆でつらつらと書かれている感が雰囲気出てていいですよね!
やさしさアンチック
やさしさアンチックDL
明朝っぽけどゴシック感もあるしっかりとした太めフォントですね。
漢字との統一感があるので漫画にも使うと読みやすいんだそうですよ。
上品なところに使ってもコミック感が出ることもなくしっかり馴染んでくれそうなフォントだと思います!
ロゴたいぷゴシック
ロゴたいぷゴシックDL
丸みがあるのでちょっとかわいい感じもしますが、ロゴにも使えそうなかっこよさやエレガントさも兼ね備えた日本語フォントです。
くせがあるようにもみえてくどくないので、どこかさっぱりした感じにも見えますね!
これも様々な場面で活躍してくれると思います!
しねきゃぷしょん
しねきゃぷしょんDL
このサンプル画像を見て、わかってくれるかとは思いますが・・・
昔の洋画の字幕のようなおしゃれ感のある日本語フォントです!
上品な感じも欲しいけどちょっと遊びたいなぁなんて時にはもってこいですね!
英語フォント
Anders
Anders DL
上品なものはもちろん、エッジーなデザインにもマッチしそうな英字フォントです。
ところどころ2本線だったりしておしゃれですねー!
数字が登録されていないようなので、その点はちょっと不便かもしれませんがかっこいいデザインにも合いそうですね!
Glamor
Glamor DL
エレガントで大人ファッション系にしたいのならこのフォントがおすすめです!
先に丸いのがついてたりしてエレガントですね!
ファッション雑誌のロゴに使われていそう。
COCO
COCO DL
ロゴなんかに使うとかっこいいこの英字フォントは、クセが強めなのであまり自由度はないですが使い方によってはとてもクールな感じのデザインができそうです。
高級感があるように感じるので、サンプル画像のようにベースを黒でフォント色を白にするとうまくいきやすそうですね!
Forum
Forum DL
オーソドックスで一見普通そうですが、読みやすい字体なのでどんなシーンにも使えるフォントです。
こちらもファッション雑誌なんか見たことありそうですよね!
Champignon
Champignon DL
綺麗な筆記体で、エレガントといえばこれ!な英字フォントです。
数字も統一感のある形なので使い勝手がよさそうです。
最後に
以上、日本語も英語も含め全部で10つの上品なおすすめフォントをご紹介しました。
いかがでしたでしょうか?
日本風の上品と外国風の上品だとイメージが変わってくるので、うまく使い分けできるといいですね!
では今回はこのへんで。みっしぇるでした!
WEB制作
オウンドメディア運用を成功に導く5つのコツ!
ガリガリ君が値上げするそうですね。棒の部分の素材が値上がったのが原因だそうですよ。
そんなの関係なく買い続けますがね・・・!みっしぇるです!
さて皆さんは、「オウンドメディア」という言葉を聞いたことがありますか?
知ってるよーって人も今一度おさらいしておきましょう。
オウンドメディアを広く定義すれば、自社所有の媒体になります。Webサイトやブログだけに留まらず、広報誌、冊子のようにリアル媒体も含むもの。
参照元:オウンドメディアとは何か、明快に分かる!
オウンドメディアを利用することで、広告やSNSだけでは伝えきれなかったことの真意などをしっかり説明することができ、正確な情報を発信することによって信頼度を上げる効果が期待できます。SNSまで親近感はでないかもしれませんが、メルマガや問い合わせ・コメントなどでユーザーとの接点を作ることができるのもメリットだと思います。
ではこのオウンドメディアをうまく運用するためには何に注意すべきなのか?
人が目で見て読んで情報を得るものなので、何より大切なのは運営者側がユーザーの視点に立って物事を考えることなのですが、具体的にどういう点を注視すべきなのか・・・
今回は、オウンドメディア運用を成功に導く5つのコツをご紹介したいと思います!
オウンドメディアを成功に導く方法① サイトの目的・ターゲットを明確にし理解する
「オウンドメディアを運用する」などの新しいことを始めようとする際、必ずそこには目的がありますよね。まずはチーム全体がその目的とは何かをしっかり知っておかないといけません。
目的達成のために皆でまっすぐそこに目指すことができて初めて、良いものができるのではないかと思います。その目的意識をしっかり皆でシェアすることが出来たら、それを基にサイト構成やコンテンツ内容を決めていきましょう!
あとターゲット層を絞り込むのも忘れずに!
絞り込んで決定したターゲットをペルソナなどを活用しながらしっかり分析し、どういったメッセージを伝えたいのか・・・これもしっかり全員で理解しておくようにしましょう。
わざわざオウンドメディアを使用する理由はなにか?
それによって何が得られるか?
そのために何をすべきなのか?
大切な部分だけど忘れてしまいがちな部分でもあります。しっかり頭に入れておくなり見えるところに書いておくのが良いと思います!
オウンドメディアを成功に導く方法② ユーザーとのコミュニケーションの場を設ける
オウンドメディアを「情報発信の場」と言ってしまうと一方通行の感じがしてしまって本当の意図と違ってきてしまいます。そもそもなぜ情報発信を行うのか?
ユーザーに正しい情報を提供して、ブランドイメージや商品の詳細を知ってもらうのはもちろんですが、今後顧客ともなりえるユーザーとの接点を作るためというのも重要な部分だと考えます。
なので情報発信した上でのユーザーからの反応というのは、今後の運営にとっても大切な部分だと思います。
やり方としては、コメントやお問い合わせフォーム、Q&Aなどのユーザーが意見・質問を投稿できる場を設け、企業の自己満足で終わってしまわないようにしましょう。
また、SNSアカウントをお持ちならSNSとつなげてうまく連携させておくことで、より信頼度が高く親近感の沸く関係性が築けるかと思います!
その時得られたユーザーからの声は、読んだから終わりではなく、何かしらのアクションを必ず起こしてあげましょう!
例えば、いいね!や返信コメント、Q&Aなら質問に素早く明確に答えるなど。
対応が早ければ早いほど、ユーザーはポジティブな印象を抱くと思います。
オウンドメディアを成功に導く方法③ 全体的に一貫性を持たせる
例えばあなたは高級感のある綺麗めな化粧品サイトを持っていて、サイト内も文章も少し固めだけど信用性を重視した形にしているとしましょう。サイトだけでは限界なのでオウンドメディアとしてブログを立ち上げ、そこで商品関連の情報発信をしていこうと試みます。デザインも化粧品サイトを似たようなものしたけれど、文面はチャラい感じの口調でテンション高めの投稿ばかりをしています。
どう感じるでしょうか?
せっかくユーザーと接点が持てるのなら面白いものを提供したい、と感じる方はきっと少なくないと思います。気持ちはわかりますが、サイトのイメージと文面が異なるとそれはもう違和感でしかないのです。
いくら内容は正確でためになる情報が詰まった良いコンテンツだったとしても、不快感を感じてしまったら最後まで読んでもらえる可能性は低くなってしまいます。
なので全体的な一貫性というのは大切なことなのです。
高級感のあるイメージを持たれているのならば、お堅く・・・とまでする必要はないと思いますが、はじけすぎたりするのだけはやめましょう。
オウンドメディアを成功に導く方法④ 関連既存メディアはしっかりつなげる
オウンドメディア以外にも自社サイトなど、関連性のあるものがあるのならしっかりリンクを貼ってつなげておくようにしましょう。
SNSアカウントを持っているならもちろんそれらをしっかりつなげておくように!
ユーザーはどのタイミングで自社製品に興味を持ったり、SNSアカウントを見たいと思うかはわかりません。
ただその時のために、できるだけわかりやすく目立つデザインのバナーなどで、一目でこれはあそこに行ける!と感じさせるようにし、更にわかりやすい場所に設置するようにしましょう。
場所に関しては、第三者の立場に立って、SNSや自社サイトなどのリンクはどこにあると思うかなどを考えて設置するといいと思います。
オウンドメディアを成功に導く方法⑤ 更新は継続的に
運営を続けていると、コンテンツ量がどんどん多くなりページ数が100を超えたりして、今までコツコツがんばってきたなぁ・・・と達成感を感じられます。しかし、そこで手を止めてはいけません!
例え、100ページを超えるほどの情報量がそこにあったとしても、最新記事が一向に変わらないような更新が停滞しているサイトは、いずれユーザーは離れていくことになるでしょう。
実は私自身ブログなどを見る際、そこを結構気にしてしまいます。
最近記事の日付がかなり前だったりすると、このブログ大丈夫なの・・・?と正直不安というか、ガッカリしてしまいます。
これ以上新しい情報を得ることはできないし、そこにある情報はすでに古いものなのでいくら遡って説得力のある記事を見つけたとしても意味ないのかも・・・と感じてしまいます。
そのブログが何か商品を取り扱っていたりする場合、こういったネガティブな印象がついてしまうのは致命的ですよね。
ブログ停滞=商品も売れてない・・・?と不安要素が少しでも浮上してしまうとそれは悪影響になりかねません。
オウンドメディアを始めるなら、少しでもいいから定期的な更新を心がけ、しっかり続けていけるようにしておきましょう。
最後に
はい、ここまでで5つのオウンドメディアを成功させるコツをご紹介してきました。
いかがでしたでしょうか?
基礎じゃん!と思うかもしれませんが、何度だっていいます。基礎だからこそ大切なのです!
特に目的を見失っては一貫性も失い、チームの連携も取れないですから、そこから良いものを作ろうとしてもうまくいきません。
あと、最終的にメディアに対して評価をするのは企業でもチームでもなく、ユーザーです。
ユーザーの声はめんどくさがらずにしっかり聞きましょう!そして反応することを忘れずに。
ではこの記事が誰かのお役に立てますように!みっしぇるでした!
WEB制作
【色で見る!】美しいデザインが魅力的なECサイト5選!【イエロー編】
こんにちは、引き続き花見が楽しみな相馬です。
花見の「花」ってイコール桜ですが、他の花でも良い気がします。菜の花とか。
ということで、色別に魅力的なECサイトのデザインを紹介するシリーズの第四弾。
今回は菜の花の「黄色」に絞ってみました。
黄色は若々しさだったり、活発、あとはひょうきんなど、基本的にポジティブな色。
子供向けを連想させるカラーでもあります。
デザイナーとしても使いやすい色で、ボク自身よく使う色のひとつです。
春らしい、パパっと明るいサイトが並びました。
それではどうぞ。
黄色が映える、美しいデザインのECサイト5選
函館カール・レイモン
函館カール・レイモン
本場ドイツのソーセージを中心とした加工肉のECサイト。
木目をベースに黄色をポイントカラーにして、食材を扱う上で大切な信頼感を感じるサイトです。
メインイメージを中心に散りばめられた写真が美味しそう。
黄色を沢山使っているわけではありませんが、質感を加えていることと重要なポイントで使用しているおかげで印象が強いですね。
オレンジともマッチしています。
越後妻有オンラインショップ
越後妻有オンラインショップ
越後妻有の特産物などが通販で購入できるECサイト。
ちょっと質感がある白ベースに、黄色と黒がマッチしてパキッとしたPOPなイメージに。
地方の通販のどこか"田舎っぽい"イメージを覆す意外性のあるデザインです。
商品に対するマイナスとなりそうなイメージを、デザインで払拭することも出来ます。
こちらも黄色の使用量のバランスが良いですね。
旅する丸干し 株式会社下園薩男商店
旅する丸干し 株式会社下園薩男商店
メインのスライドショーがインパクトのあるサイト。ウルメイワシのオイルというちょっと新しい食べ方の商品。
「各国の味をイメージしたオイルとウルメイワシ」というコンセプトを軸にしており、キャッチーなイラストや洋食の写真が目に飛び込んできますが、使用する黄色や青も明るめではなくちょっとくすんだ色にすることで、どこか和風を感じさせます。一見イラストとミスマッチと思える明朝のフォントもミソですね。
各商品のおすすめの食べ方も、購入を迷っているユーザーの背中を後押しするコンテンツとして参考にするべきポイントです。
シュークリーム専門店 ビアードパパ
シュークリーム専門店 ビアードパパ
シュークリームがところどころに散りばめられた、お腹の空いている今のボクにはたまらないECサイト。
黄色をガッツリ使ってシュークリームのイメージをますます具現化しています。
ボタンのマウスオーバーのふわっとしたエフェクトも、シュークリームの生地感を連想させますね。
ファーストビュー左部にあるシュークリームの小さなスライドがちょっと新しい使い方に感じました。
新潮文庫の100冊 2015
新潮文庫の100冊 2015
新潮文庫おすすめの100冊、2015年のECサイト。
様々な無駄に楽しいコンテンツがいっぱいあります。きっと制作者も楽しく作ったんじゃないでしょうか。
色とは関係ありませんが、"無駄だけど面白い"要素はデザインだからこそできる要素ですね。
濃い黄色をベースに、手作り感のあるイラストが温かく親しみやすさを感じさせます。
サウンドもとっても良いので、ぜひ音ありで閲覧してみてください。
まとめ:身近さを感じる「黄色」
以上、黄色が効いているデザインのECサイトを5つ挙げてみました。
黄色をポイントで使用することによって、高級感よりは親しみやすさ、お求めやすさをアピールすることに一役買っています。
どのサイトも使い方が上手ですよね。
親しみやすさは信頼感や安心に繋がります。
子供向けの商品や、口にするものを取り扱うECサイトであれば、メインカラーには黄色を候補に入れておくことをオススメします。
黒やグレーなどにもとても相性の良い黄色は、サイト全体を和やかに明るくさせるには持って来いの色だと思います。
ではでは。
Want to stay up to date with the latest news?
We would love to hear from you! Please fill in your details and we will stay in touch. It's that simple!