カテゴリー
雑記

ハンバーガーメニューは古い?

Android の標準的アプリ「マップ(Google Maps)」のβ版で、左からのスライドインメニュー(兼ハンバーガーメニュー)が廃止されたようです。

それぞれの機能は、関連付けられたアイコンに集約され、2~3タップの場所に入りました。機能を羅列しただけのメニューは2020年代には「古めかしい」インターフェイスになるのかもしれません。


私は「メニュー」が全部悪いインターフェイスだとは思いません。ただ、全ての機能や内容を羅列しただけのメニューは淘汰されていくのだと思います。

もちろん、Google のアプリの設計が全てのアプリやサイトに最適だとは限りませんが、今年(2020年)の twitter, Instagram, Facebook のUIの変化を見ても、意外と設計思想の変化は早いものです。

こうしたデザイントレンドの波は5年ぐらいの周期で来ているような気がします。新しすぎてもユーザが迷子になってしまうし、UIデザインは本当に大変ですね。

カテゴリー
雑記

長いタイトルには 半角スペース

ページのタイトルは短いほどいいと言われますが、一方で、タイトルで何が書いてあるか分かるというのも、情報発信サイトとしては良い事だと思います。

どうしても長くなってしまう場合には、意味の切れ目に半角スペースを1つ入れることで、折り返すときもそこで改行してくれるようになります。また、改行の必要のない環境で見ている人にも、意味の切れ目に少し間が開くことは読みやすくさせます。

改行についてはもっと色々な制御の方法がありますし、逆に完全に制御することも難しいですが、これがシンプルかつ色々な環境に対応できる手法だと思います。


「読ませるためのブログ」では、わざと情報不足のタイトルを設定し、本文を読ませる手法もありますが、アフィリエイトサイトならともかく、本業のための情報発信サイトであれば、タイトルは内容を反映している方が、私は良いと思います。

カテゴリー
雑記

パソコンでは 見るだけ?

論より証拠、まずはこれを見て下さい。

デバイスごとの広告成果をみると、PCからは閲覧しても買わない

これは、とあるPC向けサイトの広告出稿についてのレポートです。歴史は古いサイトで主にパソコンから閲覧するように作られました。近年になってスマホ用にレイアウトを見直しているところです。

このサイトでは、比較的高額な商品のお買い得情報を提供しているため、スマホで見ることはあっても、最終的な購入行動はパソコンで行う人も多いのではないかと考えていました。

しかし、実測してみると、スマホの方が決済端末としても優秀なんですね。決済(コンバージョン)は 98% がスマホで、PCは皆無、という時代になっていました。

もう、スマホファーストどころか、パソコンからの閲覧は「スマホと同じ物が、同じように見える」事の方が大切になってきている気がします。今後は、Webサイトの簡易アプリ化も進むと思われますので、えっとワークでは、PWA という仕組みで、Webサイトを簡易アプリ化してホーム画面に設置できるように拡張を進めます。

カテゴリー
雑記

クラシックデザイン

2020年は、twitter・Facebook という2大SNSの「クラシックデザイン(パソコン向けリッチデザイン)」が廃止され、スマホに最適化されたシンプルなデザインに統一されました。

これらのSNSをスマホで使う人は、アプリからアクセスしているように思うので、WebにはPC用のデザインを残しても良さそうに思いますが、やはり「アプリ・Web」「スマホ・PC」との間で、見た目が大きく異なるのは、こんなリピータ率の高いサイトでも良くないという判断なのでしょう。

SNSという複雑なサイトでも、こうしたシンプルデザインを押し進めているのですから、マイナーなサイトは、表示させるメッセージを絞り込んだデザインが効果が高くなります。


もちろん、これらのサイトのデザインには何億円もかかっているので、シンプルでも色々な機能のアイコンが無駄なく配置されていますし、ユーザもほとんどがSNSに慣れているので、記号からでも機能が判断できます。

まして、マイナーなサイトでは、何のメリットがあるのか分からないメニューより、記事を画面一杯表示させましょう。


「一目で分かる写真」と「一言で伝わるタイトル」を心がけて記事を発信していきましょう。

カテゴリー
雑記

文字サイズ

このテーマ、環境によっては文字が大きすぎると感じるかもしれません。

この文字サイズは

敢えて大きくしています。


Webサイトは、色々な環境で閲覧されます。文字が大きく映る環境もあれば、小さく映る環境もあります。

2014年に調査したとき、文字が小さくて読むのが嫌になる人はいても、文字が大きくて読むのが嫌になる人は少ない、ということがわかりました。

文字が大きいせいでスクロール量が多くなる場合は、おおよそ、文章が長すぎます。テーマごとに分割するか、もう少しまとめていきましょう。


もうひとつ。これは、ひょっとしたらデジタルネイティブ世代には当てはまらないのかもしれませんが、手書きの手紙や作文では、自信がない時ほど文字が小さくなる傾向があります。

もちろん、小さな文字でスタイリッシュにまとめたページもありますが、小さな文字は、本当に読んでもらいたいのか、疑問に思う事があります。新聞紙面やお菓子のパッケージなど、なんでも、読んでほしい文章ほど大きく書いてあります。

情報発信の頻度を上げて行くには、簡潔に、力強く、こまめに発信していく方がオススメです。

カテゴリー
雑記

立ち止まらない 安定

高いコストをかけて作ったWebサイトは長く運営したいと思います。

私たちも、手がけたWebサイトには少しでも長く生きていて欲しいと思っていますし、少しでも多くの効果を期待しています。

この「少しでも長く」の捉え方がかみ合ってないと、お互い不幸になります。

お客様の中には「一度作ったサイトをそのまま永遠に提供し続けたい」とお考えの方も居ます。

そのお気持ちはわかるのですが、残念ながらインターネットの世界はそうなっていないのです。

インターネットを支える通信技術も、Webサーバーも、フレームワークも、閲覧者の端末も、ライフスタイルも、5年10年と経過すると驚くほど変わります。

全く想定していなかったデバイスが、登場から5年もしないうちに閲覧者の8割を占めるようになったりします。

えっとワークは、その流れに立ち向かわず、立ち止まらないことで長く生きる戦略をとっています。

えっとワークでは、常にその時代に多く支持されている技術を組み合わせることで、環境の変化に自然に追従し、変化し続けます。


これまでに、変化を拒んだサービスは沢山ありました。そのサービスを使ったことのある方もいらっしゃると思います。そうした「変化しない」サービスは、いずれ更新されなくなり、陳腐化し、ひっそりとサービスを終了していきます。

ほんの数年前まで動いていたのに、突然終了したサービスもあったと思います。ですが、実は「突然」終了したのではありません。変化を拒んだときから、終了が決まっていたのです。

新幹線の車両ですら、皆さんの記憶に残っているだけでもどれだけ変化したでしょうか。一見変化する必要を感じない変化かもしれませんが、ニーズやコストなどの問題、ライフスタイルの変化などでどうしても変化していきます。

新幹線が速くなると、食堂車が消えて、その分座席が増えました。

食堂車が消えると、新幹線で飲食すること自体が減り、車内販売もなくなっていきました。

この時代の流れに逆らおうとしても、食堂車を前提としたシステムはもう動きません。


食堂車全盛の時代には食堂車に乗り、食堂車が消えた今では Free Wi-Fi に乗る。そんなフレキシブルなシステムであれば、どんな時代でも、その時のテクノロジーを最大限使って、お客様にアプローチできます。

今までのコンテンツの蓄積を活かしたまま、シームレスに次の時代に繋いで、息の長い情報発信をサポートしていきます。


セキュリティーの面からも、基盤技術で問題が見つかればすぐに対処しています。この副作用として、ある瞬間に、システムが一時的に思ったように動かなくなることもあり得ます。これはある程度ご了承ください。常に変化していくシステムの宿命として、変化の途中で一時的な「組み合わせの不具合」はどうしても発生します。

この「システムの陳腐化と更新」への対策は3つしかありません。

  • 変化せずに死んでしまったら、もう一度作り直す
  • 変化を受け入れて生き続ける
  • お金で延命し続ける

もちろん、どれが正解という事はありません。

えっとワークは、私も、皆さんも変化を受け入れていくことで、結果として現実的なコストで長くサービスとコンテンツを活かし続ける事を目標としています。

現在採用しているフレームワークは「WordPress」です。2018年段階で、Webサイトフレームワークシェアの4割以上を占めていると言われています。

WordPressも変化の早いフレームワークです。そのため、変化を拒む人達からは良い評価を得られていません。数年に一度大きな変化が起こり、そのたびに「使い方がわからなくなった」という声が上がります。

私たちも、常に情報を追いかけ、時には開発者グループの中で予習をし続けなければ、大きな変化に追従するのが難しい事もあります。細かい変化は、気付かないうちに進んでいることもあります。

しかし、だからこそ、WordPressは多くのサイトで採用し続けられています。

この10年で、閲覧者の環境は、ブラウン管のディスプレイから、大画面の液晶モニターに、そして小さなスマホの画面にと、めまぐるしく変化してきました。

WordPressは(そしてえっとワークも)その変化を受け入れ、時には身を切る改革を行って、時代に追従しています。そのおかげで、10年前のコンテンツが、10年後のデバイスでも快適に閲覧できるのです。


インフラや基幹技術の見えない変化は、私たちが吸収して表に見えないようにメンテナンスします。

サービス開始時にはオンプレミスの社内サーバでしたが、時代の変化に合わせてクラウドサービスを使うようになりましたし、電電も太陽光発電を組み合わせています。

こういった見えない変化は私たちが吸収します。

一方で、見える部分の変化は、皆さんが吸収して、次の10年の情報発信に繋げていってください。私たちは全力でそのお手伝いを致します。

カテゴリー
雑記

Hタグは 見出し

Hタグは、「見出し」です。

うっかり「文字を大きくするため」に使ってしまっているサイトも見かけますが、ヘッダをうまく使うと、検索(SEO)に対しても非常に有利に働きます。

最近、条件を満たすと、Google 検索で、見出し(Hタグ)が検索結果に列ぶことがあります。

広島県の歴史を検索すると、Wikipediaの「広島県」のページの「歴史」の見出しがヒットする。

検索結果は常に改良が続いているので、今同じ結果が得られるかどうかはわかりませんが、「広島県 歴史」を検索すると、Wikipediaの「広島県」のページの「歴史」の見出しの箇所が抜粋され、「歴史 に移動」をクリックすると、その見出しの場所に直接飛ぶことができます。

一般論では、見出しを使いこなさないといけないほど詰め込みすぎたページでは、「広島県の歴史」という別のページを作った方が良いのですが、ともあれ、見出しをうまく使うことで、たくさん詰め込んだページでも、閲覧者を適切な場所に誘導できます。

Wikipedia 以外ではあまり見ない気がするので、見出しが検索結果に採用される条件はわりと厳しいのかもしれませんが、素直な構造にしておくと、将来的なデザインの変更にも強いし、検索エンジンからも高評価されます。

カテゴリー
雑記

カテゴリーと タグの使い分け

私も、WordPressを覚えるときに、入門書を何冊も読みましたし、Webサイトも沢山見ました。

公式ページが充実しているのもWordPressの良い所ですが、入門用として読むには少し根気が必要かもしれません。

それよりも「習うより慣れろ」で使えてしまうのが、WordPressの良い所です。


そんなWordPressですが、投稿の属性として「カテゴリー」と「タグ」を設定することができます。この2つは、幾つかの違いはありますが、記事を分類するという用途では同じ側面を多く持っています。

いろいろな本やサイトで、この「カテゴリー」と「タグ」をどのように使い分けるか、色々な解説がされていますが、どうにもしっくりくる説明がありませんでした。

ですから、私は「とりあえず、タグを設定して」とお願いしています。

タグは自由度が高く、また、幾つでも設定できるので、とりあえず設定しておけば、後から分類することも可能です。

タグをつける際は、適度に細かく分けてやると良いと思います。例えば「4K OLEDテレビ」というタグをつけるよりも「4K」「OLED」「テレビ」と3つのタグをつけた方が、後で便利だと思います。

ある程度記事が溜まってくると、よく使っているタグからトップページを自動生成できます。記事が増えるとトップページも変わってきます。逆に、自分がどこに力を入れて記事を書いているかが客観的にわかるので、力を入れたい記事を増やす目安にも使って下さい。

トップページの自動生成は、記事が5つ以上できてから、担当者にご相談下さい。

person holding turkish style tea bag tie

一方で「カテゴリー」のほうは、なかなか難しいです。

技術的に色々な解説があるのですが、技術的な理由はコンテンツを縛る理由にはなりません。

今、なんとなくこれかな、と思っている使い分けは、

  • タグは、何が書いてあるか
  • カテゴリーは、誰に書いているか

ではないか、と思っています。

飲食店であれば「メニュー」や「お知らせ(店休日や割引きなど)」は、カテゴリーで分類して良いように思います。これは「加盟店の皆様へ」といった記事とは根本的に読者が違うからです。

ただ、お知らせの中でも「店休日のお知らせ」と「割引キャンペーンのお知らせ」は、カテゴリーを分けなくても良い気がします。どちらもお客様へのお知らせだからです。もちろん、タグには「店休日」や「割引き」「キャンペーン」のような分類をしっかり入れてください。


「カテゴリー」と「タグ」の使い分けは、考えれば考えるほど難しいです。ですから、まずはカテゴリーは忘れて「タグ」をきちんと設定することを心がけてください。

そして、もっと良い使い分けを知っている人は教えてください!

カテゴリー
雑記

目的から 装飾を考えよう

文章の中で大きな文字を使ったり、文字の色を変えたりしたくなることもあります。「メタデザイン」では、特に気をつけて頂きたいのが「文字を大きくしたい」のは目的ではなく結果である事です。文字を大きくしたいと思うとき、その目的は「文章を目立たせたい」事じゃないでしょうか。

特にワードプレスでやってしまいがちな間違いが、文字を大きくするために「見出し」を使ってしまうことです。

文字を大きくするためだけに H2 を指定するのは間違った使い方です。

この「H」は「Header」のHで、メニューにも書いてありますが「見出し」の意味です。目次を作る時の「見出し」に使う文字です。もちろん見出しのつもりで書いている場合は適切なのですが、ただ「文字を目立たせたい」だけであれば…

テキストの設定から文字を大きくして下さい。

ブロックのテキスト設定から「特大」を選んで下さい。

この時「カスタム」はあまりお薦めできません。将来、スマホのトレンドが変わったり、新しいデバイスが出てきたときに、標準の文字サイズが変わるかもしれません。ここで「小」や「特大」を選んでおけば、将来の環境でも「特大」が維持されます。


しかしながら、この「目的」を意識した文章作りを邪魔しているのが、他でもないWordPressのメニューなんです(2020年7月現在)。

テキスト修飾メニューでも「太字」「斜体」といった「結果」で選択するメニューが出ます。

WordPressのメニューでも、目的ではなく結果で選ぶようになっている。

メタデザインを突き詰めるなら、ここでは「強調」という目的を指定するようになっていて、結果として太字になるようになると良いのですが、まだWordPressもそこまで来ていませんが、HTML5 という技術的な標準規格では、数年前からこのような「目的と手段(構造と見た目)の切り離し」が行われているので、そのうちWordPressも追従してくるのではないかと考えています。


ちょっと角度の違う文字強調として「ハイライト」や「文字色」があります。

ハイライトや文字色の変化も使えます。

文字色も、できるだけカスタムカラーを使わず「キーカラー」などから選んで下さい。

この色は「外観」メニューの「カラー」から選択でき、以前書いたページも含めて、一度に色を調整できます。

「外観」の「カラー」から、背景色やメインカラーを調整できる。

色だけデザイナーに相談することも可能です。
(5,000円ぐらいから相談できますが、5万円ほどで、キーカラーとロゴを一緒に考えて貰うと割安かもしれません。)

カテゴリー
雑記

サイドメニューの 呪縛

シンプルなデザインが良い事は分かったけど、最小限のメニューはあった方が良いんじゃないか。

私もそう思っていた頃がありましたし、今も、メニューが全て悪いとは思っておりません。ページの上部と下部に、メニューを設置しています。

特にパソコンで閲覧されている方の中は、この左右の余白にもメニューやカレンダーが欲しい、とおっしゃる方もいらっしゃいます。その気持ちはとてもわかります。

サイドメニューの一番の欠点は、「記事の途中で離脱してしまう」事です。

記事途中のメニュー操作は、ページビューも押し上げるため、一見良い傾向にあるように見えますが、結局、一番読んでもらいたい記事が、途中で離脱されてしまうとも言えます。戻ってきて続きを読んで貰えれば良いですが、70%の閲覧者は、リンク先から二度と返って来ません。Wikipediaでどんどんリンクを辿ってしまったとき、最初のページに戻ってきますか? おそらくそのまま閉じてしまっていると思います。

まずは、「一番用事があるはず」の、この記事を読んでもらいましょう。


もう一つ、とても単純な理由があります。

このリンク先から、自分の地域の天気予報を調べてください。

さすがに、さっき「リンク先からは戻ってこない」話をしたばかりなので、多くの方が戻ってきてくださったと信じます。

さて、皆さん、難なく自分の地域の天気予報にたどり着けたと思います。その時、メニューを使いましたか? 使った方もいらっしゃるかもしれませんが、検索窓に「地域名 天気予報」と入力するのが一番早いのです。

一般のページであれば、Google などの検索サイトから来ると思います。メニューを充実させるより、検索サイトから一発で適切なページに誘導できるよう、良い意味での検索エンジン最適化(SEO)を行う方がずっと大事です。


最後に、これはモバイル特有の理由ですが、やはりモバイルは画面が小さいし、時にネットワークは不安定です。どんなときも、メインコンテンツを一瞬で表示させたいのです。45%のユーザは、読込に2秒以上かかると「戻る」を押してしまうという統計もあります。たまたまネットワークが遅かったぐらいで、皆様の貴重な商機を逃し無くないのです。


いつも遊ぶアプリのメニューを毎日開きますか? どのアプリも、ユーザが使う機能は、ボタンとしてメニューの外に表示しているはずです。Webサイトも同じで、そんなに重要なメニューなら、むしろそのリンクはメニューの中なんかに入れてはいけません。

パソコンの画面が WXGA(1366×768) になった頃のWebサイトが、余ったサイドにメニューをねじ込み始めたのが2002年頃ですが、あれから20年、閲覧者の85%はスマホで、スマホユーザはサイドメニューを必要としません。


「パソコンで見るならサイドメニューがあった方が良い」

これも何百回と訊きました。2008年に100人規模の調査を行いましたが、8割近いユーザが「パソコンとスマホで見た目が大きく異なると混乱する」と回答しています。今は「スマホファースト」でデザインし「パソコンでも出来るだけ同じ見た目にする」方が素直なのです。

サイドメニューの呪縛から皆さんを解放すべく、私はこのテーマを推しています。

えっとワークからのお知らせを受け取りますか? 受け取る 要らない