COLUMN

コラム

CATEGORY
  • WEBサイトにあるボタンについての考察

2020.05.29Web制作

WEBサイトにあるボタンについての考察

てつやくん
てつやくん
ビールが美味しい季節です。
今回は、私たちのWEBサイトにあるボタンについて考えていきたいと思います。

そもそもWEBサイト上でのボタンの役割とは

ちまたに溢れるたくさんのWEBサイトには、企業サイトや商業施設のホームページ、キャンペーンサイトなど様々なジャンルがあります。そのほとんどに当たり前のようにボタンが配置されていて、デザインや個数の差はあれど、ボタンが1つもないというWEBサイトはおそらく存在しないと言っても過言ではないほど必要不可欠なもので「次に読みたいページに移動する時」「もっと詳しい情報を見たい」「カートに商品を入れる」など、様々なアクションの起点になる役割を持っています。
WEBサイトは、以上の通り色々な場所にボタン(リンク)が配置されていて、それらを辿って目的の情報にたどり着くというのが一連の流れなので、ボタンはユーザーが押しやすく、気づきやくて、読みやすい、より直感的に理解できる、そんな条件を満たしたボタンは『 優秀 』なボタンと言えるのではないでしょうか。

生活の中に存在するボタン

button

あらためて考えてみると、私たちは毎日様々なボタンに囲まれた生活を送っています。朝起きて、テレビのリモコンから始まり、電子レンジのボタン、自動お湯はり器のボタン、扇風機、エアコン、玄関のドアホン、車のキー、パソコンのキーボード、スマホなど。もはや、ボタンのない暮らしなど想像できないほどあらゆる場所に存在します。
だからこそ「もっと人が触れようと思う形」「触れて気持ちのいい手触り」がボタンには求められるのではないでしょうか。身の回りにあるボタンは「角ばった形」より「楕円」や「角が丸い四角形」のボタンの方が圧倒的に多い印象でした。
WEBサイト上と異なり、現実世界のボタンは物理的に触れるものや、人をケガさせるようなボタンは無く、より人に優しい形が必要なため角の丸いボタンが重宝されてるのだと感じました。
その事から考えると、WEBサイトでも角張ったボタンより、角の丸いボタンの方が比較的多いはずです。
世の中に存在する全てのWEBサイトを調べるのは、非常に厳しいのであくまで感覚的なものですが、あながち間違いではない気がします。

押しやすいのは「四角」「丸」どちらのボタンか

69d30c692f5cff87e6942eafc9b49e32_s

押しやすいボタンを形成する要素として、「色」「形」「サイズ」「立体感」など、いろんな要素が挙げられるとは思います。今回は、その中でもボタンの「形」については、モノの形について意識的に向き合うことは少ないかも知れませんが、多少なりとも形によって影響を受けている瞬間があると思います。そこで「カドのあるもの」と「丸いもの」がもたらすイメージを考えてみました。
■角ばっているものが与えるイメージ・・・角が尖った形は「硬さ」「鋭さ」「刺激」を連想させ「注意」「警戒」を表す標識などにも多用されています。
●丸みのあるものが与えるイメージ・・・丸みのある(角のない)形は「柔らかさ」「親しみ」「軽さ」を連想させ「やさしさ」「かわいさ」の表現したいときに使用します。
以上を踏まえた上で、考えてみるとWebサイトのボタンはどちらの形状が望ましいか理解しやすいと思います。
(※ もちろんサイトの目的やデザインによって変わりますが・・・)

まとめ

WEBサイトに配置されるボタンはWEBサイトの進化やデザインのトレンドなどの影響もあり、近年では直線的なデザインのボタンもちらほら見るようになってきましたが、それでも全体で見ると完全に鋭角なボタンは少なく感じます。
デザインというと、ついセンスだとか、感覚的なイメージを持たれることが多いですが、論理的に導き出されたデザインには、感覚的なデザインにはない説得力があるのかもしれないですね。

採用サイトデザインに特化したまとめサイト | DEZDEZ デザデザ