社長ブログ

話題のマテリアルデザインって何!?

お世話になっております。ダブルループの福田です。

目を惹くwebサイトの条件の1つにデザインがあります。
デザインは時代によって流行が変わっていきます。

そんな中、今のトレンドは「マテリアルデザイン」です。

ということで今回はマテリアルデザインについて紹介します。

話題のマテリアルデザインって何!?

マテリアルデザインは2014年にGoogleが発表した新たなデザインの概念のこと
です。

マテリアル=物質的ということからデザインする対象のwebパーツを物質として考えて、我々の現実世界の物理的構造ルールに基づいてそのwebパーツをデザインすれば、より直感的にユーザーが操作できる

という概念です。

この説明では「?」の方が多いことかと思います。かくいう私も自分で書いてお
いて「?」です^^;

わかりやすく、身近で具体的な例を挙げるなら

・GoogleディスカバーなどGoogleの各種アプリ内の表示方法
・Android端末のUI

これらをご覧いただくことが最も早いかと思います。

ではなぜマテリアルデザインが人気なのか、を解説する前にマテリアルデザイン
に至るまでのデザインの歴史について解説してみます。

現在までのデザインの大まかな流れは

スキューモーフィズム

フラットデザイン

マテリアルデザイン

となります。

まずスキューモーフィズムについて。
これは2000~2010年頃に流行ったデザインです。

マテリアルデザイン同様、デザインなので説明しづらいのですが、スキューモー
フィズムは我々の現実世界に存在するリアルさを表現したデザインのことです。

少し昔にリアルなON/OFFのスイッチなどがwebやアプリで流行りました。
これはまさにスキューモーフィズムデザインと言えるでしょう。

具体的な例を挙げるならばiOS6(2012年迄)までのiPhoneのUIがスキューモー
フィズムを採用しています。

続いてフラットデザイン。
iPhoneの例を挙げるならばiOS7がこれにあたり、さらにはAppleの公式サイトはフラットデザインで作られています。

また最近のWindowsのメニュー画面もフラットデザインです。

フラットという名の通り2次元的なデザインです。一言でいうならばシンプルに
最小限でこちらの意図を伝えるデザイン、それがフラットデザインです。

そして今日においてはフラットデザインからマテリアルデザインへと進みました。

パッと見る限りフラットデザインとマテリアルデザインでは大差がありません。
では何が異なるのか、というよりもマテリアルデザインの特徴を述べて参ります。

・影

2次元なデザインのフラットデザインに比べて3次元表現になるマテリアルデザインには影があることが特徴と言えます。
たとえば写真をいくつか並べたwebサイトにて、その中の1つをクリックすると
背景が暗くなり、選んだ写真がくっきりと見やすくなる、というのはまさにマテ リアルデザインです。この細かな動きにより、ユーザーは数ある写真からその1つを選択したということが理解できるはずです。

・モーション(アニメーション)

ボタンなどタップした際に動きを多く持たせているのがマテリアルデザインの特徴の1つです。これにはユーザーが操作を感覚的に行えるようサポートする意味合いが含まれています。

・画面構成(レイアウト)

上に挙げた影と内容が被りますが、影を使って奥行きを持たせwebサイトを構成
するパーツの動作状態を表現することはマテリアルデザインと言えます。
これによりユーザーの視覚的理解を促します。

さて、今回はデザインに関して解説しましたが、いかがでしたでしょうか。
デザインもコンテンツも結局はユーザー(検索者)のためです。
検索して自社のサイトにたどり着いてくれた方にとって、見やすいサイトの方が
当然良いはずです。

今回ご紹介したマテリアルデザインはそんな見やすいサイトにするためのヒント
です。皆さんのサイトを見直す際にどうぞお役立てください。

弊社サービス紹介

いつでも自分でページを作成できる「WordPress付き!ホームページ制作」

SNS活用で集客倍増!?「facebookページ制作」

ターゲットを絞って効率的に集客「facebook広告運用代行」

被リンクに頼らず検索上位へ!「ホワイトハットSEOサービス」

ECサイトプラットフォームの利便性とは

お世話になっております。ダブルループの福田です。

新型コロナが登場してから、ECサイトの構築についてご相談やご依頼いただく
ケースが増えてきました。

BtoCはもちろんのことながらBtoBの企業からも結構な数のご相談をいただいて
おります。

ということで今回はECサイト構築プラットフォーム「STORES」の便利機能を
紹介します。

ECサイトプラットフォームの利便性とは

STORES(https://stores.jp/)とは、ECサイト・ネットショップを作るための
WEBサービスです。

ECサイトプラットフォームはいくつもありますが、STORESはデザインが洗練
されていて、また気の利く機能が多く、ECサイト初心者にとってはオススメの
サービスです。

そもそもECを始める場合、無理にSTORESなどECサイトプラットフォームを利用する必要はありません。

ではなぜオススメするのかというと・・・

「管理・運営が圧倒的に楽だから」

です。

ECサイトを始めるとなると

・商品登録や在庫管理
・受発注管理
・顧客情報(個人情報)の徹底管理
・安全な請求~支払いシステムの構築
・集客のためのデジタルマーケティング
などなど顧客を増やし、取引を維持・拡大していくための業務が山ほど出てきま
す。

これらを自社開発でシステム化しようとすると数百~数千万円かかってしまうの
ですが、ECサイトプラットフォームであれば月々数千円からスタートすることができます。
STORESなら無料からスタートすることすら可能です。
(情報漏洩などの多大な責任を負うリスクも避けられることも特長の1つでしょう)

ECサイトを楽々開設できるサービス「STORES」ですが、数あるメリットの中か
ら今日は3点紹介します。

1:秒速でおしゃれなサイトを構築

STORESにはお洒落なWEBショップのデザインテンプレートが豊富に用意されて
います。
テンプレートをもとにカスタマイズしていけば、あっという間に自分好みのWEBショップを開設できること間違いなしです。

2:無料プランでお試し可能

上にも書きましたが、自社開発でECサイトを構築しようとなると数百万の開発費用を要したりします。一方、STORESならば無料プランでまずはお試しスタートすることが出来ます。コスト面でのリスクを負うことなくECショップを始められるという点は、STORESの利点の1つと言えます。

3:豊富な集客支援機能

個人的に最大のメリットはこの機能群です。
いくつも機能があるのですべてを紹介することはできませんが、一部を紹介する
と・・・

・Instagram投稿連携
これは特定のアカウントでInstagramに投稿した画像をそのままSTPORESに連携できるという機能です。
SNSの画像をそのままショップにアップして販促活動に転用することができます。

・クーポン発行
当たり前の機能とも言えますが、割引や送料無料のクーポンを発行する機能です。
クーポンは細かく条件設定できるのでリピート率を高めたい客層を絞ってクーポ
ンを発行することが可能です。

・メールマガジン配信
購入者に対してメルマガを配信する機能です。
最新情報や新着商品などをメルマガで定期的に配信することで、潜在的ニーズを
抱える顧客の興味を喚起させることが出来ます。

如何でしょうか。ECサイトプラットフォームは単なる商品管理、決済代行サービスではありません。

集客を伸ばし、スムーズな決済を可能にして、更にリピート率(顧客満足度)を
高めることがECサイトプラットフォームによって実現可能なのです。

ダブルループではWEBサイト制作を行っておりますが、お客様にとって有益だと判断した場合は今回ご紹介したようなプラットフォームを利用して制作します。

ECサイト構築でお悩みの場合はどうぞお気軽にご相談くださいませ。

弊社サービス紹介

■いつでも自分でページを作成できる「WordPress付き!ホームページ制作」
https://www.doubleloop.co.jp/business/solution/hp/wp/

■SNS活用で集客倍増!?「facebookページ制作」
https://www.doubleloop.co.jp/business/solution/facebook/

■ターゲットを絞って効率的に集客「facebook広告運用代行」
https://www.doubleloop.co.jp/business/solution/facebook/adsupport/

■被リンクに頼らず検索上位へ!「ホワイトハットSEOサービス」
https://www.doubleloop.co.jp/business/solution/seo/

タグマネージャで楽々管理

お世話になっております。ダブルループの福田です。

今日はwebサイトの運営・管理テクニックについて書いてみます。
結構コアな内容に聞こえるかもしれませんが、Googleアナリティクスや各種リスティング広告を社内運用されている場合は是非、ご覧ください。

タグマネージャで楽々管理

webサイトを管理・運営していると、アクセス解析やコンバージョン計測などの
ツールを活用するために「タグ」をサイトに埋め込む必要があります。

これが意外と大変でして、たとえば計測のためのタグをいくつものページに埋め
込むとなると結構な作業時間がかかります。

このようなタグ埋め込みの悩みを解決してくれるのが

Googleタグマネージャ(以下、タグマネージャ)
https://marketingplatform.google.com/intl/ja/about/tag-manager/
Yahoo!タグマネージャー
https://marketing.yahoo.co.jp/service/tagmanager/

です。
※いずれも無料ツールです。

タグマネージャを活用することによるメリットはいくつかありますが、その最大
の利点は「HTMLファイルにタグを追記する編集作業が不要となる」点ではない
でしょうか。

通常はGoogleアナリティクスやGoogle AdWords、Yahoo!プロモーション広告などアクセス解析やコンバージョン計測ツールなどから発行されたタグを、webページごとのHTMLファイルに対してタグを記述し、アップロードすることでそれぞれのツールを利用することができるようになります。

サイトの規模が大きくなっていくとこの作業量が増えていきますし、管理する手
間や設置ミスなどのヒューマンエラーも増えるはずです。
(マーケティング部門からwebデザイナーへタグ設置依頼があったものの、忘れ
 ていた・・・という話はよくありますよね)

ところがタグマネージャであれば、ページごとにタグを記述する必要はありませ
ん。代わりにタグマネージャのタグを設置するだけでOKです。

一度、タグを設置した以後にタグを追加する場合は、ファイルを編集する必要は
なく、タグマネージャの管理画面から追加する事が可能となります。
SNSのアカウント設定画面レベルの管理画面なので非エンジニアの方でも簡単に
追加できます。

要するに

・タグの設定(設置)が簡単になる
・タグの更新、管理が容易になる

というのがタグマネージャの最大の利点と言えるでしょう。

始め方としては上述のGoogle、もしくはYahoo!のタグマネージャURLにアクセ
スしていただき、アカウントを作成し、あとはサイトの指示に従えば(アナリ
ティクスのタグを設置できる方であれば)設定完了できるはずです。

もう1点、タグマネージャの便利な点を紹介するならば、設置したタグが正しく
実装されているかどうかを「プレビューモード」を使って即座に確認できるとい
う点です。

アクセス解析のタグ管理にお悩みの場合、タグマネージャがオススメです。
ご利用されてみてはいかがでしょうか。

お知らせ情報

■弊社クライアントのサービス紹介
株式会社エフピー・ワン・コンサルティング様

財務内容改善のご提案
https://www.fp-one.co.jp/financial/

帳簿上、社長や役員の貸付金、あるいは仮払金が計上されている法人が多く見受
けられます。

しかしそのような会社が金融機関へ融資を申し込む際、金融機関より社長や役員
への貸付金を清算して欲しいという要望がある反面、社長や役員の方からすぐに
法人に戻す資金がなく滞留してしまうケースがあります。

しかも、貸付金や仮払金に対しては税務上、認定利息を計算して法人は受取利息
として収益に計上し、それに対する法人税等を負担しなくてはなりません。

また、社長や役員はその利息を支払う必要が生じますが、支払うことができず、
決算書上では未収入金として計上されており、社長や役員の法人に対する債務が
増えることになります。

このままの状態では社長や役員は法人に対する債務を支払うことができず、社長
や役員の退職金で相殺する方法しかなく、社長や役員が万一の場合に、遺族の方
に退職金(弔慰金)をお渡しする事が出来なくなります。

このようなリスクを解消する方法をエフピー・ワン・コンサルティング様では
ホームページ上にて公開されています。

▼貸付金を一括返済し財務強化を図る手法
https://www.fp-one.co.jp/financial/

ご興味ある方は是非、上のwebページをご覧ください!

弊社サービス紹介

■いつでも自分でページを作成できる「WordPress付き!ホームページ制作」
https://www.doubleloop.co.jp/business/solution/hp/wp/

■SNS活用で集客倍増!?「facebookページ制作」
https://www.doubleloop.co.jp/business/solution/facebook/

■ターゲットを絞って効率的に集客「facebook広告運用代行」
https://www.doubleloop.co.jp/business/solution/facebook/adsupport/

■被リンクに頼らず検索上位へ!「ホワイトハットSEOサービス」
https://www.doubleloop.co.jp/business/solution/seo/

meta descriptionでSEO対策

お世話になっております。ダブルループの福田です。

本メルマガでは繰り返し伝えていますが、SEO対策における王道は質の高い記事
やサイトを制作することです。

それに加えて

Googleに正しくサイトや記事の内容を認識させる努力

これもまた重要です。
今日はそのテクニック的な部分に関して解説していきます。

meta descriptionでSEO対策

meta descriptionを皆さんはご存知でしょうか?

WEB業界やWEBに携わっている方でないと耳覚えのない言葉でしょう。

meta description(メタディスクリプションと言います)とは、webページの
説明文のことを指します。

Googleで検索した際、検索結果には大きな文字(見出し)で記事のタイトルが
表示され、また小さな文字でその記事の説明文が表示されます。

この説明文こそがmeta descriptionです。

検索結果の中からmeta descriptionを見て記事を読むかどうかを判断された経験
をお持ちの方も多いのではないでしょうか。

そうなんです。
meta descriptionの内容次第でその記事を読むかどうかを判断する人がいるのです。
さらにmeta descriptionによって検索順位が高くなることもありえます。

ではどのようなmeta descriptionが効果的なのかを
・meta descriptionに書くべき内容
・文字数

という点から解説を進めます。

まず

書くべき内容について

meta descriptionで書くときに検討すべきは・・・

・ページとmeta descriptionの内容の整合性をとること
・検索者の検索キーワードを配置すること

まず当然のことながら作成したページとmeta descriptionの整合性が取れていな
ければなりません。

整合性が取れていない場合、meta descriptionを見てページに入ってきた検索者
のニーズを満たすことが出来ず、その結果としてページ滞在時間が短いことなど
からSEO効果を望めなくなります。

次に「検索者がどのようなキーワードを検索して、自分のページにたどり着くか
という点を考慮してmeta descriptionを作ることも重要です。

PCで検索した場合、meta description上では検索キーワードが太文字で強調さ
ます。

検索者としては検索キーワードに興味があるわけなので、キーワード(太文字)
の前後文を読み込むはずです。

このように検索者の行動導線を想像しながらmeta descriptionを作成しなければ
いけないのです。

さて続いては

meta descriptionの文字数について。

検索エンジンのアップデートに伴いSEOに有効な推奨文字数は変わりますが、今
時点では「約90文字」と言われています。

PCでの検索時には140文字前後が、スマホでの検索時には90文字程度がmeta
descriptionに表示されます。

PCとスマホ両方での見やすさを考慮するとなると、(表示文字数が少ない)ス
ホの文字数に合わせるべきと言えるので
「約90文字」
という推奨文字数になるのです。

meta descriptionも結局は検索者の利便性を高めるための設定です。
検索者のニーズを満たすという本質的な価値にそってこそ、SEO対策と言えます。

記事制作も設定面も検索者(ユーザー)目線で作っていきましょう。

弊社サービス紹介

■いつでも自分でページを作成できる「WordPress付き!ホームページ制作」
https://www.doubleloop.co.jp/business/solution/hp/wp/

■SNS活用で集客倍増!?「facebookページ制作」
https://www.doubleloop.co.jp/business/solution/facebook/

■ターゲットを絞って効率的に集客「facebook広告運用代行」
https://www.doubleloop.co.jp/business/solution/facebook/adsupport/

■被リンクに頼らず検索上位へ!「ホワイトハットSEOサービス」
https://www.doubleloop.co.jp/business/solution/seo/

SNSにおける「ハッシュタグ」の活用方法

お世話になっております。ダブルループの福田です。

最近はInstagramやTwitterの運用に関するご相談を頂くケースが増えてきました。
ということで、今日はSNS運用におけるポイントの1つであるハッシュタグの使
い方を説明してみます。

SNSにおける 「ハッシュタグ」の活用方法

ハッシュタグをご存じない方もいらっしゃるかと思いますので、まずハッシュタ
グとは何かから説明します。

#●●●

ハッシュタグとはSNSの投稿の中の「#」から始まる文字列のことです。
なぜハッシュタグをつけるのかというと・・・

投稿を検索者や閲覧者に見つけてもらいやすくするため

これが主な目的です。

たとえば最近の私自身の実例でいうと、コロナが落ち着いてた7月上旬の話です。
子供と一緒に潮干狩りに行こうと思って、Instagramで「#潮干狩り」で検索しま した。

すると約12万件の投稿がヒットし、その中から
・最近の投稿
・近いエリアの情報
をピックアップして予定を立てる際の材料にしたわけです。
※実際には雨で行くことは叶いませんでした。

このようにハッシュタグを活用することでフォロワーではない新規ユーザーの流
入経路を作ることができるようになります。

よってTwitter、Instagramで新規ユーザーの獲得を考えている場合、

・投稿の中の特定のキーワードをハッシュタグにより強調
・この投稿は特定ジャンルの内容であることを示す分類

大きくはこの2つの観点から投稿の際にハッシュタグをつけるべきでしょう。

また「ハッシュタグはいくつくらいが最適なのか?」という質問をよくいただき
ますが、これについてはSNSによって異なります。

Twitterであればそもそも140文字という制限があるため、ハッシュタグをたくさ
ん入れることが出来ません。またTwitter公式からは2つまでの使用が推奨されて います。

一方、Instagramでは最大30個までハッシュタグをつけることができます。
けれども30個もハッシュタグをつけて投稿することはあまり良い手とは言えない のでご注意ください。

というのも30個ハッシュタグをつけて投稿するとリーチ(ハッシュタグから検索
者に見つけてもらうこと)数が上がらないというデータが何件かあがってきています。
※Instagramの検索アルゴリズムがオープンになっていないので具体的なことは
言えませんが・・。

今のところ、ハッシュタグとリーチ数の相関から鑑みるとどうやら
10~12個程度 が適正と言えそうです。

ただしアルゴリズムの変更によって適正値は変わっていくことが予想されます。

アルゴリズムの変更に毎回右往左往しないためにも
・どんな投稿で
・どのようなハッシュタグをつけた際に
エンゲージメント(投稿に対するいいねなどの反応)が高かったのか低かったの かを検証する体制を敷いておくことがSNS運用における何よりのポイントです。

WEBサイトもSNSも仮説と検証によって効果を高めるしかありません。
今日ご紹介したハッシュタグは検証対象の1つです。

是非、皆さんのSNSにおいてもどのようなハッシュタグが効果的であるかを検証
されてみてはいかがでしょうか。

弊社サービス紹介

■いつでも自分でページを作成できる「WordPress付き!ホームページ制作」
 https://www.doubleloop.co.jp/business/solution/hp/wp/

■SNS活用で集客倍増!?「facebookページ制作」
 https://www.doubleloop.co.jp/business/solution/facebook/

■ターゲットを絞って効率的に集客「facebook広告運用代行」
 https://www.doubleloop.co.jp/business/solution/facebook/adsupport/

■被リンクに頼らず検索上位へ!「ホワイトハットSEOサービス」
https://www.doubleloop.co.jp/business/solution/seo/

パートナー

ご相談や質問・ご不明な点はお気軽にコチラから