# WebデザイナーがやっておきたいGoogle Chromeの設定方法あれこれ

URL: https://webrandum.net/chrome-setting/
公開日: 2018-01-24
更新日: 2019-01-01
カテゴリー: 作業効率化
タグ: Google Chrome
出典: Webrandum（著者: サイトウ マサカズ）

最近新しいメールアドレスに変えたのでそれに伴ってGoogle Chromeの設定も行う必要が出てきました。そのついでに今回は自分なりにこれが使いやすいというGoogle Chromeの設定を備忘録がてらまとめておきます。

## ブックマークのインポート

まずはじめに、既にChromeを使った事がある人や他のブラウザを使っていた人はブックマークのインポートを行いましょう。

既に他のGoogleアカウント等でChromeを使った事がある人はChrome右上のメニューアイコンから[ブックマーク]→[ブックマークマネージャを表示]をクリックしてブックマークマネージャを開きます。

 開いたブックマークマネージャの更に右上にあるメニューバーをクリックすると「ブックマークをインポート」と「ブックマークをエクスポート」というボタンがあるので、以前使っていたGoogleアカウントでログインしたChromeでエクスポートして、新しい方のChromeでインポートすれば移行完了です。

![ブックマークのインポート](https://webrandum.net/wp/wp-content/uploads/2018/01/Bookmark_import.png)

Safariなどの他のブラウザのブックマークをインポートしたい場合は、Chromeの右上のメニューアイコンから[設定]をクリックして設定画面を開き、「ユーザー」の「ブックマークと設定のインポート」という項目をクリックするとインポートする事ができます。インポートする場所が違うので注意が必要です。

![他ブラウザからブックマークをインポート](https://webrandum.net/wp/wp-content/uploads/2018/01/safari_Bookmark_import.png)

ちなみに、ブックマークの整理方法やちょっとした工夫だったりは[以前記事にした](https://webrandum.net/chrome-bookmark/)事があるので、そちらも合わせて参考にしてみてください。

## テーマの設定

デフォルトでも全く問題無いですし、気分の問題なんでしょうけど、ずっと使っているテーマがあるとやはりそれに慣れてしまってそれ以外のテーマやデフォルトのテーマのChromeを見ると何だか自分のブラウザじゃない感じがして何とも言えない気分になります。

僕はずっと「[Dark Theme v3](https://chrome.google.com/webstore/detail/dark-theme-v3/djlgdeklopcjagknhlchbdjekgpgenad?hl=ja)」というテーマを愛用しています。あとでホーム画面も拡張機能で別の表示にするので、テーマで変わる部分といえばメニュー部分のみなのですが、シンプル且つ少し暗めだけど黒すぎない丁度良い灰色なのが気に入っています。

![Dark Theme v3](https://webrandum.net/wp/wp-content/uploads/2018/01/Chrome_Theme.png)

## 新しいタブの設定

新規でタブを開いた時にChromeのデフォルトだと以下の画像のような画面が表示されます。

- Googleのロゴと検索バー

- 最近見たWebページ

- 右上にGoogle Appsのリンク等

![新規タブで開く（デフォルト）](https://webrandum.net/wp/wp-content/uploads/2018/01/new_tab_default.png)

これでもいいかもしれませんが、せっかくならもっと便利なものや綺麗な表示に変更したい。という事でChromeの拡張機能を入れてしまいます。

### momentum

今使っているのは[Momentum(モーメンタム)](https://chrome.google.com/webstore/detail/momentum/laookkfknpbbblfpciffpaejjkokdgca)という拡張機能です。写真が綺麗で真ん中には現在時刻がデカデカと表示されています。他にも画面端には今日の天気やTodoの表示が出来たりもするのですが、僕は綺麗な写真を見て癒やされたいという思いで使っています。

![momentum](https://webrandum.net/wp/wp-content/uploads/2018/01/momentum.png)

この背景写真は毎日切り替わるので飽きる事がありません。あと真ん中下にある「What is your main focus for today?」の下は入力フィールドになっていて、何か今日やらなくてはならない事がある場合はそこに文字を入力しておく事で、ブラウザを開くたびに今日のタスクを意識できます。

僕の場合は、タスクというと細々としたものばかりなので、たまに今日一日のちょっとした目標を立てて書いています。そうする事でブラウザを開くたびに再認識できるのでおすすめです。

### Pinterestタブ

[こちら](https://chrome.google.com/webstore/detail/pinterest-tab/clemcknnbdahjkkfgcbigljhgfajdcag)は以前使っていた拡張機能なのですが、Pinterestの写真を新しいタブに表示させる拡張機能です。

 あらかじめ選択した自分の好みのジャンルを元に、新しいタブを開くたびに画面いっぱいにPinterestの画像が表示されるようになります。

気に入った画像はその場でピンできるのでこちらもおすすめです。

## 検索エンジンの管理

お次は検索エンジンの管理です。Chromeのアドレスバーで文字列を入力するとGoogleでの検索結果が表示されますが、時にはAmazonなどのサイト内の検索をしたい場合や、TwitterなどのSNS内の検索機能を使いたい時がありますよね。そんな時に普通にアドレスバーで「Amazon」や「Twitter」と検索してGoogleの検索結果からサイトに移動してサイト内の検索バーにキーワードを入れるのは手間です。

検索エンジンの管理から設定しておく事で「このキーワードを打ってTabかSpaceを押したら、このサイトの検索を使う！」といった設定が可能になります。

設定方法ですが、Chromeのメニューアイコンから[設定]をクリックして設定画面を開き、「検索エンジン」の「検索エンジンの管理」をクリックします。

![検索エンジンの管理](https://webrandum.net/wp/wp-content/uploads/2018/01/SearchEngine.png)

規定の検索エンジンにはおなじみのGoogleが設定してあって、他にはYahoo! JAPANとBingも登録されています。「その他の検索エンジン」の右側にある「追加」をクリックすると検索エンジンの追加ができます。

![検索エンジン設定](https://webrandum.net/wp/wp-content/uploads/2018/01/SearchEngine_Setting.png)

追加する項目は以下の3つです。

| 検索エンジン | 自分が認識しやすいように検索エンジンの名前を入力する |
| --- | --- |

| キーワード | ここで登録したキーワードの後にTabかSpaceを押すと、次のURLで設定した検索結果が表示されるようになります。出来るだけ短く識別しやすい名前をつけます。僕の場合は基本2文字で付けています。 |
| --- | --- |

| URL | 検索結果のURLを設定します。アドレスバーに入力するキーワードの部分は「%s」にすればOKです。 |
| --- | --- |

必ず設定するのは下記4つです。あまり多く設定しても使いませんし、本当に必要なものを設定してあります。

あとAlfredでも同じ設定ができるので、Alfredでも同じように設定して、Chromeを使っている最中であればアドレスバーで検索。それ以外のアプリ等を操作している場合はAlfred。という風に両方使っています。

### Google翻訳

とにかくこれだけは設定しておきたいというのが[Google翻訳](https://translate.google.co.jp/?hl=ja)です。翻訳する度に「〇〇 翻訳」とか「〇〇 英語」と打つのは面倒なので「tr 〇〇」とアドレスバーに打てば翻訳結果画面が表示されるようにしています。地味に便利です。

| 検索エンジン | Google翻訳 |
| --- | --- |

| キーワード | tr |
| --- | --- |

| URL | https://translate.google.co.jp/?hl=ja#en/ja/%s |
| --- | --- |

![Google翻訳](https://webrandum.net/wp/wp-content/uploads/2018/01/Chrome_translate.png)

### Twitter

お次は[Twitter](https://twitter.com/?lang=ja)です。普段Twitterはスマートフォンから閲覧しているのですが、たまに情報収集目的でPCからTwitterを利用する事があるので、出来る限り面倒な遷移をしなくて済むようにTwitterも登録しています。

| 検索エンジン | Twitter |
| --- | --- |

| キーワード | tw |
| --- | --- |

| URL | https://twitter.com/search?q=%s |
| --- | --- |

![Twitter](https://webrandum.net/wp/wp-content/uploads/2018/01/Twitter_setting.png)

### はてなブックマーク

[はてなブックマーク](http://b.hatena.ne.jp/)も情報収集目的です。特に技術的な事ははてなブックマークを使って調べる事が多いので設定してあります。ちなみにブックマーク数はデフォルトだと3人になっているのですが、3人だと出て来る記事が多すぎるため、6人に設定しています（URL最後の「users=6」の数字を変えると変更できます）。

| 検索エンジン | はてなブックマーク |
| --- | --- |

| キーワード | hb |
| --- | --- |

| URL | http://b.hatena.ne.jp/search/text?safe=on&q=%s&users=6 |
| --- | --- |

![はてなブックマーク](https://webrandum.net/wp/wp-content/uploads/2018/01/HatenaBookmark_setting.png)

### Can I use

[Can I use](https://caniuse.com/)はWebのコーディングをしている人にはお馴染みのサイト。HTMLやCSS等のブラウザ対応状況が確認できるサイトで、ふとした時に調べたりするのですが、わざわざサイトを開くのは面倒なのでこちらも設定しています。

| 検索エンジン | Can I use |
| --- | --- |

| キーワード | ci |
| --- | --- |

| URL | https://caniuse.com/#search=%s |
| --- | --- |

僕の場合はキーワードを2文字で統一させたいという事で、キーワードを「ci」と設定していますが、頭文字を全て取って「ciu」の方が覚えやすい人もいるかもしれません。

![caniuse](https://webrandum.net/wp/wp-content/uploads/2018/01/caniuse.png)

他にもショッピングサイトを設定したり、お気に入りのブログ内検索の結果をすぐ表示できるようにしたりできますが、とりあえず僕が最低限設定しておきたいのは以上の4つです。

## ホームボタンの設定

Chromeだとホームボタンがデフォルトではオフになっているのですが、これをオンにします。Chromeのメニューアイコンから[設定]をクリックして設定画面を開き、「デザイン」の「ホームボタンを表示する」項目のチェックをオンにします。

![Chrome ホームボタンの設定](https://webrandum.net/wp/wp-content/uploads/2018/01/Chrome_home_button.png)

するとホームボタンが左上のメニューバーに追加されます。このボタンをクリックすると今開いているページが「新しいタブページ」へ移動します。つまり僕の場合はmomentumが表示されるわけですね。

![Chrome ホームボタン オンオフ](https://webrandum.net/wp/wp-content/uploads/2018/01/Chrome_home_on_off.png)

ただ、このままだと使い物にならなそうなので、少し工夫します。先程の「ホームボタンを表示する」の設定画面を見てもらうと分かるのですが、「新しいタブ ページ」か「カスタムのウェブアドレスを入力」か選択する事ができます。

ここでURLを設定しておくと、ホームボタンを押すとそのページへ移動する事ができるようになります。そしてカスタムアドレスには[OneTab(ワンタブ)](https://chrome.google.com/webstore/detail/onetab/chphlpgkkbolifaimnlloiipkdnihall?hl=ja)という拡張機能のアドレスを設定しておくと便利です。

OneTabは大量に開きガチなChromeのタブを綺麗にまとめてくれる拡張機能です。インストールして、タブが増えてきたなと感じたらOneTabのアイコンをクリックすると全てまとめて1つのページにリスト状にならべて保存してくれます。まとめずに単純にリストを表示させたい場合はアイコンを右クリックして「OneTabを表示する」を選択すれば表示されるのですが少し手間です。

そこでホームボタンに、このOneTabのページを設定してすぐに開けるようにしてしまいます。

設定はOneTabをインストールした後にホームボタンの設定で「カスタムのウェブアドレスを入力」と書かれたテキストフィールドに「chrome-extension://chphlpgkkbolifaimnlloiipkdnihall/onetab.html」と入力すればOKです。ホームボタンをクリックして確認してみてください。

![OneTab](https://webrandum.net/wp/wp-content/uploads/2018/01/OneTab.png)

ちゃんとOneTabのページが表示されましたね。

 使い方としては、ChromeでWebページの閲覧等していてタブが増えてきたと感じたら右側のOneTabのアイコンをクリックすれば、1つのページにリスト上にまとめてくれます。

今開いているタブは閉じたくないけど、OneTabのページを開きたい場合はホームボタンをクリックすると表示される。といった使い分けになります。

タブっていつの間にか大量に開いてたりするので、この拡張機能とホームボタンの設定は凄く役立っています。

## まとめ

今回はGoogle Chromeのちょっとした設定をまとめてみました。拡張機能について、もっと書こうかと思ったのですが長くなってしまいそうなので、それはまた別の記事に書こうかと思います。

 Webで何かしらやってる方は毎日のように使う事になるものですから、少しでも自分が使いやすく快適 な環境作りのヒントになれば幸いです。