Google検索の結果表示(デザイン)を元に戻す方法

Google検索の結果表示(以前)

Google検索の結果表示(デザイン)を以前の状態に戻す方法を紹介します。

2014年3月中旬頃から行われている変更(テスト?)によって、タイトルの下線が無くなり、フォントサイズも変更されました。

これにどうにか下線を追加し、フォントサイズを戻すことで、見慣れた表示にするのが目標となります。

現在の検索結果表示
現在のGoogle検索結果表示

以前の検索結果表示
以前のGoogle検索結果表示

Google側で設定したことを変えることは出来ないので、ブラウザ側で対処します。
対策方法は、手動とアドオン使用の2種類。

FireFoxは、どちらでも行えますが、アドオンの方が分かりやすいと思います。

Chromeは、アドオン使用のみ。
※ChromeでCustom.cssが効かなくなった様なので。

スポンサーリンク

対策方法1(手動)

FireFoxプロファイルフォルダ内のuserContent.cssを編集、追加する方法です。

注)使用OSによってパスが変わる場合があります。
当記事では、Windows 7を使用。

手順

キーボードのWindowsキーとRキーを同時押しします。

ファイル名を指定して実行が立ち上がります。
下記をコピペしてOKをクリック。

%APPDATA%\Mozilla\Firefox\Profiles\
FireFoxのプロファイルフォルダ表示方法

(英数字の羅列).(プロファイル名) フォルダが表示されるので開きます。

開いた中にchromeフォルダがある場合は、続いて開いて下さい。
無い場合は、chromeというフォルダを自分で作成して開きます。

notepad++などのテキストエディタで以下をコピペして、userContent.cssという名前で保存します。

文字エンコードは、UTF-8です。

@-moz-document url-prefix("https://www.google.co.jp/"),url-prefix("https://www.google.com/"){
h3.r a{
text-decoration:underline !important;
font-size:16px !important;
}
}

保存したファイルを以下のパスに配置して、FireFoxを再起動します。

C:\Users\ユーザー名\AppData\Roaming\Mozilla\Firefox\Profiles\プロファイルフォルダ\chrome\userContent.css

これで対策方法1は完了です。
試しに検索してみてください。

対策方法2(アドオン)

ユーザー側で任意にスタイル変更出来るアドオン、Stylishを使用します。

アドオンのインストール手順

FireFox編
ADD-ONS>StylishでFireFoxへ追加をクリック。
FireFoxにStylishを追加する手順01

許可表示が出たら、今すぐインストールをクリック。
FireFoxにStylishを追加する手順02

インストールが終わったら、FireFoxを再起動して下さい。
FireFoxにStylishを追加する手順03

Chrome編
Chromeは、Chromeウェブストア>Stylishで右上の無料をクリック。
ChromeにStylishを追加する手順01

ダイアログが出るので追加をクリック。
ChromeにStylishを追加する手順02

これでStylishのインストールは完了。
Chromeは再起動が必要ないみたいです。

※右上の無料を押した時にGoogleのログイン画面が出る場合は、Chromeウェブストア内でStylishを再検索して下さい。

スタイルの追加

FireFoxの場合
メニューバー>ツール>アドオン>ユーザースタイル>新しいスタイルを書く
or
検索バーの右側のSマーク>スタイルの管理>新しいスタイルを書く
Stylishにスタイルを追加する手順01(FireFox編)

新しいスタイルというダイアログが表示されます。
名前を適当に入力します。(今回はGoogle Searchとしました)
日付を入れておくと、あとで管理しやすいかも。

下記をコピペして、保存をクリック。

@-moz-document url-prefix("https://www.google.co.jp/"),url-prefix("https://www.google.com/"){
h3.r a{
text-decoration:underline !important;
font-size:16px !important;
}
}
Stylishにスタイルを追加する手順02(FireFox編)

これで設定は完了です。
再起動は必要ありません。

Chromeの場合
ブラウザ右上のStylishボタン右クリック>オプション>新しいスタイルを作成
Stylishにスタイルを追加する手順01(Chrome編)

適当に名前を付けて、個別指定をクリック。
Stylishにスタイルを追加する手順02(Chrome編)

次で始まるURLを選択して、下記をコピペ。追加をクリック。

https://www.google.co.jp/

同様に次で始まるURLを選択し、下記をコピペ。

https://www.google.com/
Stylishにスタイルを追加する手順03(Chrome編)

コードに下記をコピペして、保存をクリック。

h3.r a{
text-decoration:underline !important;
font-size:16px !important;
}
Stylishにスタイルを追加する手順04(Chrome編)

これで設定は完了です。
再起動は必要ありません。

まとめ

通常はgoogle.co.jpだけで十分だと思いますが、一応google.comも指定しておきました。
そちらを使っている方もいるかもしれないので。

下線が無くなることに関しては、慣れる可能性もあるので別にありかもと思います。
現時点では、違和感バリバリですが。

大事なのは、フォントサイズが変わったことにより、タイトルが途切れてしまっていること。
ブログ運営側としても、ユーザ側としても、これは正直勘弁して欲しいです。

表示文字数が減ればタイトル付けに悩みますし、情報を探す場合の手掛かりも減ってしまうので。

ABOUTこの記事をかいた人

九荻 新

1983年生まれのおっさんブロガー。 自作PC、ハードウェア、ソフトウェアの役立つメモ、レビュー、ニュースをお届けします。