私はWindowsでもMacでもAndroidでもiPhoneでもGoogle Chromeをメインブラウザとして利用しています。
Chromeに自分のGoogleアカウントでログインしておけば、アカウントに紐付いた設定を場所やデバイスを選ばずに使えるのでいつでもどこでも普段使いの環境でブラウジングすることができます。
そしてChromeの何がいいかといえば、やはり充実した拡張機能です。
Chromeの拡張機能だけで完結してしまう作業もたくさんあるので（特にWindowsでは）Chromeを活用するようになってからはあまりPC自体にアプリケーションをインストールすることがなくなってきました。
そんなChrome大好きっ子の私が、日々ブログを更新している中で活用しているChrome拡張機能を今回のエントリーでは簡単に紹介したいと思います。
文字数カウンタ
先日も以下のエントリーで個別に解説した拡張機能ですが、入力した文字数が何文字なのかをChromeブラウザの右上で簡単にカウントしてくれる優れものです。
ColorPick Eyedropper
Webサイト上で使用されている色のコードをスポイトツールのように簡単に調べて、その色のコードを取得することができます。参考にしたいサイトに使われている素材の色など調べる時に大変便利な拡張機能です。
ScribeFire
ScribeFire
Chromeの拡張機能として使えるブログエディターです。このブログはBloggerを使って運営していますが、Bloggerの投稿エディターはビジュアルとHTMLモードを切り替える際に変なタグが入ったりとかちょっとしたクセがあるので、ちょっとしたコードの成形とかではこれを使っています。マークダウン記法にも対応しています。
webページショット - Webpage Screenshot
この拡張機能をインストール
Powerd by chromeExBl4blog
Chromeの拡張機能として使えるブログエディターです。このブログはBloggerを使って運営していますが、Bloggerの投稿エディターはビジュアルとHTMLモードを切り替える際に変なタグが入ったりとかちょっとしたクセがあるので、ちょっとしたコードの成形とかではこれを使っています。マークダウン記法にも対応しています。
webページショット - Webpage Screenshot
Powerd by chromeExBl4blog
Chromeの拡張機能として使えるブログエディターです。このブログはBloggerを使って運営していますが、Bloggerの投稿エディターはビジュアルとHTMLモードを切り替える際に変なタグが入ったりとかちょっとしたクセがあるので、ちょっとしたコードの成形とかではこれを使っています。マークダウン記法にも対応しています。
webページショット - Webpage Screenshot
chromeExBl4blog
Chromeの拡張機能として使えるブログエディターです。このブログはBloggerを使って運営していますが、Bloggerの投稿エディターはビジュアルとHTMLモードを切り替える際に変なタグが入ったりとかちょっとしたクセがあるので、ちょっとしたコードの成形とかではこれを使っています。マークダウン記法にも対応しています。
webページショット - Webpage Screenshot
webページショット - Webpage Screenshot
いま見ている状態でWebページをスクリーンショットしてくれたり、ページ最下部までスクロールしたスクリーンショットを一枚の画像で出力することができます。撮影後は図形やテキストを挿入するなど簡単な画像編集をしてローカルやWeb上に画像を保存することができます。
AutoPagerize
この拡張機能をインストール
Powerd by chromeExBl4blog
いま見ている状態でWebページをスクリーンショットしてくれたり、ページ最下部までスクロールしたスクリーンショットを一枚の画像で出力することができます。撮影後は図形やテキストを挿入するなど簡単な画像編集をしてローカルやWeb上に画像を保存することができます。
AutoPagerize
Powerd by chromeExBl4blog
いま見ている状態でWebページをスクリーンショットしてくれたり、ページ最下部までスクロールしたスクリーンショットを一枚の画像で出力することができます。撮影後は図形やテキストを挿入するなど簡単な画像編集をしてローカルやWeb上に画像を保存することができます。
AutoPagerize
chromeExBl4blog
いま見ている状態でWebページをスクリーンショットしてくれたり、ページ最下部までスクロールしたスクリーンショットを一枚の画像で出力することができます。撮影後は図形やテキストを挿入するなど簡単な画像編集をしてローカルやWeb上に画像を保存することができます。
AutoPagerize
AutoPagerize
たとえば、Google検索をする際に1ページに表示される検索結果の数は決まっているのでもっと見たければ「次へ」などを押してページを遷移する必要がありますが、この拡張機能を入れておけばページの下部に達すると自動で次のページを現在表示されているページの下に読み込んでくれます。ページリンクを押す手間が省けて情報収集の効率がよくなります。
（無限スクロールをしてくれる拡張機能）
Scroll To Top
Chromeの開発者ツールでもできることですが、この拡張機能をインストールしておけばより簡単な操作でマウスオーバーした部分のCSSの検証や変更の確認をすることができます。スライダーを使ったりとても視覚的な操作ができるのがこのエクステンション最大の特徴です。
PageRank
開いているページのページランクをChromeの右上に表示させることができます。SEO的な話になりますが、このページランクというものが高いページから有効なリンクをしてもらえると自分のサイトのランクもアップすると言われています。
ページランクが上がれば検索順位などにも多少は影響があるようです。（評価項目は200以上あるので一概にこれだけとは言えない）ザックリ言ってしまえばドラゴンボールのスカウターみたいな拡張機能です。SEOに関心がある方・取り組みをしている方にオススメの拡張機能です。
NoFollow
これもSEO的な話になりますが、nofollowというリンクの属性があります。サイトにリンクを貼る際にリンクのコードの中に「rel=”nofollow”」という記述を挿入すると、リンク自体はかかるのですが検索エンジン的には関連リンクとみなさないのでリンク先に対する評価をしません。
先ほどPageRankの項でページランクが高いページからリンクをもらえば自分のページのランクも上がると言われていると書きましたが、この「nofollow」という属性がリンクについている場合には検索エンジンにはリンクとして認められないリンクになるので、ページランクが高いページからもらった被リンクとして評価はされません。
つまり、たとえばツイッターやフェイスブックはページランクが高いですしタイムラインでリンクを拡散することができますが、この「nofollow」という属性がリンクについているため、タイムラインにリンクを拡散しても、それが被リンクとしてページランクを向上させてくれるわけではないということです。
この拡張機能は開いているページで表示されているリンクに「nofollow」という属性がついているかをひと目で確認することができます。（nofollow属性がついている場合は赤い点線でリンクが囲まれる）
User-Agent Switcher for Chrome
この拡張機能を使うとユーザーエージェントを切り替えることができます。Webサイトの多くはPCで閲覧する場合にはPC用のレイアウト、スマホで閲覧する場合にはスマホ用のレイアウトという感じでアクセスしてくる端末ごとに表示を最適化することができますが、これはユーザーエージェントというアクセスしてきたユーザーからの名乗りを受けて認識しています。
この名乗り方を切り替えて、たとえばWindows+Chromeの環境から閲覧してもAndroidから閲覧していると思わせる設定のことをユーザーエージェントの切り替えといいます。
サイトを作っているといろいろなOS、ブラウザ、端末での表示・動作検証が必要になってきます。（クロス環境での検証）特にAndroidのスマホなんかはメーカー毎に解像度や標準ブラウザも違いますので、やはり正確な検証には実機検証が欠かせませんが、ある程度の検証ならばユーザーエージェントを切り替え仮想環境を作れば済みます。
つまり、すごく簡単に言ってしまえばPCからでもスマホのビューを確認することができる拡張機能です。
最後におまけ
今回はChromeの拡張機能について紹介をしていきました。私はアカウントを分けて使っているものもあるので、よくシークレットウィンドウでChromeを使うことがあるのですが、シークレットウィンドウでも拡張機能が使えるようにする設定手順を書いておきます。Cherome右上のメニューボタン→設定→拡張機能→シークレットウィンドウでも使用したい拡張機能の「シークレットモードでの実行を許可する」にチェック
以上です。
0 件のコメント:
コメントを投稿