Chrome用の11の最高のWeb開発拡張機能

Webサイトを開発するときは、多くの複雑な要件のチェックリストを作成する必要があります。色やフォントのスキーム、CSSレイアウトの問題、さまざまなデバイスでのWebサイトの応答性のいずれを扱う場合でも、新たに発生する問題を常に把握しておくことが重要です。以下は、Google Chrome（およびその他のChromiumベースのブラウザー）に最適なWeb​​開発拡張機能の一部です。

1。カラーピックスポイト

ランダムなウェブページの配色が好きで、それを自分のプロジェクトで利用したいですか？ Color Pick「Eyedropper」と呼ばれるChrome拡張機能を使用すると、ピンポイントの精度と調整可能なズーム機能で色を抽出できます。

このような拡張機能では、色抽出を実行するためにすべてのWebサイトで許可が必要です。もう少し高度な機能が必要な場合は、グラデーションジェネレータ、パレットビューア、カラー履歴が付属するColorZillaと呼ばれる同様のツールがあります。

2。ワンクリックのフルページスクリーンショット

フルページのWebスクリーンショットを撮ることは、日常業務の必需品です。デザインの変更を伝える最良の方法は、Webサイト全体をそのままキャプチャすることです。 「ワンクリックフルページスクリーンショット」と呼ばれる拡張機能を使用すると、正確にそれを実現できます。

スクリーンキャプチャの進行中、完成したスクロール画像は、完了すると新しいウィンドウで開きます。

Webページ画面全体がPNG形式でダウンロードできるようになりました。フィルタ、ウェブページへの描画、テキストの追加など、さまざまな効果を画像画面に適用することもできます。

3。 EditThisCookie

Web開発者は、Cookieを追加、削除、編集、保護、およびブロックするためにCookieマネージャーにアクセスする必要があります。 EditThisCookieは、Cookieを自由に操作し、JSON形式でエクスポートまたはインポートできる便利な拡張機能です。これにより、古いCookieを削除し、Cookieの最大抽出日を制限することで、Webサイトを健全に保つことができます。

4。 ModHeader

ModHeaderは、ウェブページのHTTPヘッダーを変更するための最も人気のあるChrome拡張機能の1つです。 1回または2回クリックするだけで、URLまたはリソースタイプに基づいてヘッダーの変更を有効にできます。最良の部分は、複数のプロファイルを作成し、変更されたヘッダーに異なる値を追加できることです。すべての変更は、1つのタブまたはサイト全体に制限される場合があります。

5。 UXチェック

私たちは皆、実行中のWebサイトのヒューリスティック評価を時々必要としています。これは、UXチェックを使用すると簡単になります。UXチェックは、UX関連のすべてのフィードバックをサイドペインに表示する拡張機能です。評価したヒューリスティックと一致しない要素をクリックした後、メモを追加してスクリーンショットを撮ることができます。最後に、すべての変更を.docx形式でエクスポートできます。

6。ウィンドウリサイザー

Web開発者は、さまざまな画面サイズのWebページをエミュレートする必要があります。 Window Resizerを使用すると、ラップトップ、タブレット、スマートフォン、および任意の画面サイズでこれらの評価を簡単に行うことができます。

このツールには、「回転」や「ライブ測定」などの優れた機能と、多数の視覚的なカスタマイズ機能があります。真にレスポンシブなウェブサイトを構築したい場合は、すべての画面サイズでその外観をクロスチェックしていることを確認してください。

7。 Lorem Ipsum Generator

Webページでジョブをすばやく終了するには、デフォルトのテキストが必要です。 Lorem Ipsum Generatorと呼ばれる拡張機能は、さまざまな段落と段落ごとの文の複数のデフォルトテキストオプションを提供します。 「自動選択」オプションを使用して、テキストの断片またはテキスト全体を選択できます。最終的なテンプレートは、テキストのバリエーションの可能性があるため、エレガントな外観になります。

8。 BuiltWithテクノロジープロファイラー

BuiltWithは、Webサイトをサポートするすべての基盤となるテクノロジーについて学習するための古典的な拡張機能です。ワンクリックで、ウェブサイトをより際立たせる最新のアドオンや機器について学ぶのに役立つプロファイルを作成します。これは、自分で使用するためにその機能を複製するのに役立ちます。

9。ワットフォント

WhatFontは、Webページ上のさまざまなフォントタイプを識別するための最も速くて簡単な方法の1つです。完全な詳細を取得するには、テキストの近くにカーソルを合わせるだけです。 TypeKitやGoogleFontAPIなどの高度なテンプレートをサポートしています。

10。 CheckMyLinks

Webサイトへのすべてのリンクの客観的な要約が必要になる場合があります。 CheckMyLinksは、有効なリンク、無効なリンク、および壊れたリンクを要約するための一般的な拡張機能です。実行中のWebサイトのリンク結果は、すぐにサイドペインに表示されます。このツールは、ウェブサイトや公開された変更が公開される前の直前のスポットチェックに非常に便利です。

11。農薬

あなたのウェブサイトでCSSレイアウトの問題を予想していますか？農薬を使用すると、すべてのページ要素にアウトラインを提供することで、これらの問題をデバッグできます。 Ctrlを押したままにする キーを押すと、要素情報を確認し、ページ上の要素の配置を分析できます。

Webサイトアプリケーションの重要な詳細を管理する他の多くの人気のあるWeb拡張機能があります。たとえば、JSONビューアーは、JSONファイルを操作するユーザーを支援します。 Webサイトのすべての要素のツリーを提供するHTMLツリージェネレータがあります。

上記以外にも、ブラウジング速度を向上させるためのChrome拡張機能がたくさんあります。それらをチェックしてください！