まさかまさかのトランプ氏で決着した米大統領選ですが、各氏の勝敗因の分析がメディアを賑わせています。「それって後付け講釈でしょ？」と言えばそれまでなのですが、本稿では視点を変えて両候補の「Webデザイン」に注目してみたいと思います。
ヒラリー・クリントン氏とドナルド・トランプ氏は意見の相違が激しかったですね。しかし、彼らが共に理解できるかもしれないアイデアが一つあります。それは「Webデザインの重要性」です。

 

選挙シーズンの終わりに敬意を表し、政治のことは脇に置いておいて、この二人のサイト( hillaryclinton.com, donaldjtrump.com )のデザインを比較してみました。

 

 

■両陣営のランディングページ

 

ヒラリー・クリントン

 

ドナルド・トランプ

 

最終選挙の前日、両方の候補者がメインサイトへの入り口として、スプラッシュページを使用しました。両氏のページのデザインは、ある程度似ています。例えば、寄付の呼び掛けを目立つようにページ左側に配置したり、メディアを右側に、そして免責事項を一番下に配置したりしているところなどです。

 

勝者：ヒラリー・クリントン

 

■両陣営のホームページ

 

ヒラリー・クリントン

ドナルド・トランプ

 

双方のサイトがフラットなWebデザイン、シンプルな色づかい、そしてスッキリとした、グリッドベースのレイアウトになっています。

 

今年話題になったこの動画はヒラリー氏のサイトのホームページの主軸になっていますし、上部のカウンドダウンはこのホームページに動きを加えています。一方トランプ氏のページ上部は動きがありません。しかし、画面いっぱいに広がる画像はより際立っており、控えめな色づかいはよりプロフェッショナルな印象を受けます。

 

勝者：ドナルド・トランプ

 

■両陣営のブログとニュースフィード

 

ヒラリー・クリントン

ドナルド・トランプ

 

現在Webデザインのトレンドはカードベースのブログデザインに注目が当たっており、両大統領候補者のページもその例外ではなかったということでしょう。

 

勝者：ヒラリー・クリントン

 

■両陣営のメディア

 

ヒラリー・クリントン

ドナルド・トランプ

 

ヒラリー氏のサイトでは明るい黄色と青が使われていて、選挙運動のサイトというよりはのニュースサイトで見かけそうなデザインです。対照的に、トランプ氏は主に外部ソースからの引用や伝統的な新聞からの借用から構成されているように感じます。

 

勝者：ヒラリー・クリントン

 

 

■両陣営のCTA（行動喚起）

 

ヒラリー・クリントン

ドナルド・トランプ

 

このヒラリー氏のサイトのメインナビゲーション部は、「あなたがヒラリーのためにできることはたくさんあります。あなたに一番合ったやり方を見つけましょう」というシンプルな登録フォームに誘導します。

 

トランプ氏のサイトナビゲーションは新しいページの代わりに追加の入力項目があるポップアップ画面を開き、「ドナルド・トランプの最新情報を受けとる」ことを促します。

 

勝者：ドナルド・トランプ

 

 

■両陣営のオンラインストア

 

特徴：ヒラリー・クリントン

特徴：ドナルド・トランプ

 

もしかすると両氏は同じデザイナーを起用したのでしょうか？フォントから画像まで似たレイアウトが使われています。ヒラリー氏のサイトは統一感のある商品の並べ方で、ナビゲーションもページ上部に残っています。それと比べるとトランプ氏の方は少し閲覧しづらいでしょう。

 

勝者：ヒラリー・クリントン

 

 

■各州ごとのページ

 

バージニア州：ヒラリー・クリントン

バージニア州：ドナルド・トランプ

 

ヒラリー氏はボランティアや組織、現地のオフィスなどの情報が中心になっているのに対して、トランプ氏は寄付のための情報や直近のイベントの紹介をしています。さらにヒラリー氏のページでは、各州の象徴的な景色の写真を取り上げています。

 

勝者：ヒラリー・クリントン

 

 

■寄付のページ

 

ヒラリー・クリントン

ドナルド・トランプ

 

それぞれのページは画面いっぱいの写真背景の左側に、シンプルな支払い方式のカードが重なっていて、似通ったデザインの傾向にあると言っていいでしょう。

 

勝者：引き分け

 

 

■おまけ：両陣営のFacebookページ

 

ヒラリー・クリントン

ドナルド・トランプ

 

またしても両者のデザインは似ています。カバー写真の中央に本人が立ち、メッセージボードや旗がひしめいていますね。

 

勝者：引き分け

 

 

◉どちらの勝ち？

 

さて、結果発表です。

 

多くの項目で拮抗していて、デザインに類似点がありましたが、今回の５項目で勝ち、ドナルド・トランプ氏に２点差をつけた、ヒラリー・クリントン氏が総合優勝です！

 

 

ヒラリ氏ーのサイトはスペイン語話者の利便性を考えられていて、トランプ氏のサイトには支援者がトランプ氏に電話ができる、などの特色がありました。

 

そして両氏のWebサイトは多様な人に適合するように作られていますが、各候補者の個性を表してもいます。トランプ氏の新聞モチーフやクラシックなフォントは伝統的な美学を、それに対してヒラリー氏の明るい色づかいやフラットデザインはより近代的、あるいは今どきの感覚を持った人たちにアピールしていると言えるでしょう。

 

選挙の主張自体とは違い、両氏とも「すぐれたWebデザイン」という共通点が垣間見えましたね！

 

 

（※本稿は「Life, liberty, and the pursuit of good web design」を翻訳・再編集したものです）