ブラウザ
 Computer >> コンピューター >  >> ソフトウェア >> ブラウザ

構築する:Web開発者向けの11の優れたChrome拡張機能

Chromeは最近インターネットブラウザ市場の25%のシェアを獲得し、Internet Explorer(Project Spartanに進化)に次ぐ世界で2番目に使用されているブラウザになりました。最終的に、これはChromeが事実上のであることを意味します Web開発者のためのホーム。

私はFirefoxに偏っていますが、人々がChromeを愛している理由を理解できます。これはブラウザのベンチマークを支配する傾向があり、一般の人々がChromeのパワーユーザーになるのを容易にします。他の人は実際にはChromeを嫌っていますが、特定の拡張機能が利用できるため、Chromeの使用に固執しています。

これが、ChromeがWeb開発者にとって非常に優れている理由の1つです。つまり、Chromeウェブストアとその拡張機能のプールです。ウェブサイトのデザインやコーディングを計画している場合は、すぐにインストールする必要のある重要なツールをいくつか紹介します。

ColorZilla

構築する:Web開発者向けの11の優れたChrome拡張機能

ColorZilla Firefoxアドオンとして開始されましたが、非常に人気が高くなり、多くの人がChromeバージョンを要求しました。今ここにいます。この便利な拡張機能は、基本的に、ペイントやPhotoshopなどのプログラムにあるスポイトツールの高度なバージョンです。

これを使用すると、ブラウザ内の任意の場所をポイントして、その場所の色情報をすぐに引き出すことができます。プルしたら、クリップボードにコピーする前に、(RGB、HSV、またはストレートヘックスのいずれかで)微調整できます。非常に使いやすいです。

また、CSSグラデーションジェネレーター、Webページカラーアナライザー、および便利なプリインストールされたいくつかのカラーパレットが付属しています。

ウィンドウリサイザー 構築する:Web開発者向けの11の優れたChrome拡張機能

Web開発者の危険の1つは、あらゆる種類のデバイスのユーザーがWebサイトの表示エクスペリエンスを楽しめるようにすることです。モバイルとデスクトップについて話しているだけではありません。 重要ですが、小さなタブレットと大規模なモニターの違いもあります。

ウィンドウリサイザー その場でブラウザウィンドウのサイズを変更する簡単な方法です。ボタンをクリックするだけで、さまざまな解像度でWebサイトをテストして、ユーザーに何が表示されているかを確認できます。その後、それに応じて調整できます。

IEタブ

構築する:Web開発者向けの11の優れたChrome拡張機能

Web開発者のもう1つの大きな危険は、ブラウザー標準(またはその欠如)です。 Internet Explorer、Firefox、Chrome、Opera、およびその他すべてのマイナーブラウザは、わずかに異なる方法でWebサイトをレンダリングします。一方、一部のブラウザは他のブラウザよりも標準の採用に時間がかかります。

または、Internet Explorerの場合、標準は窓の外に投げ出され、Web開発者は、宿泊施設を作ることを余儀なくされるため、髪を引き裂くように駆り立てられます。

IEタブを使用 、このプロセスは少し簡単になります。新しいChromeタブでウェブサイトを表示できますが、IEで表示されるのと同じようにレンダリングされます。 IEの問題に対する革新的な解決策ではありませんが、少なくともそれは何かです。

有効性 構築する:Web開発者向けの11の優れたChrome拡張機能

すべてのHTMLコードが同じというわけではありません。ブラウザは標準への準拠に大きな役割を果たしますが、責任の一部はWeb開発者にもあります。そのため、HTMLをテストおよび検証するためのツールがあります。

有効性 は、サードパーティのサイトにアクセスしなくても、これらすべてを実行できる拡張機能です。 Webサイトを開いてボタンをクリックするだけで、無効なHTMLメッセージがすべてブラウザコンソールに表示されます。検証は、W3C検証サービスを介して行われます。

BuiltWith

構築する:Web開発者向けの11の優れたChrome拡張機能

Web開発について私が嫌うことの1つは、非常に多くあることです。 使用可能なライブラリ、フレームワーク、およびエンジン。選択の自由は素晴らしいですが、テクノロジーの数が非常に多くなり、すべてに追いつくことができなくなると、それは苦痛になります。

Webサイトにアクセスして、基盤となるテクノロジーが何であるか疑問に思ったことはありますか?

BuiltWith 拡張機能は、現在のウェブページを分析してすべてを表示する単一のボタンです。 広告ネットワーク、コンテンツ配信プラットフォーム、さらにはその背後にあるホスティングソフトウェアなど、Webライブラリ、フレームワーク、およびそれを強化するエンジンの一部です。

PostmanRESTクライアント[使用できなくなりました]

REST APIを使用している方は、 Postman 合理化されたワークフローに必要な1つのツールです。これを使用すると、HTTPリクエストを作成し、JSONおよびXMLでフォーマットされたレスポンスを取得できます。応答はHTMLとして別のウィンドウで開かれます。

複数のリクエストをコレクションと呼ばれるものにグループ化することもできます。これは、整理された効率的な状態を維持するための優れた方法です。拡張機能内で環境変数を切り替えることで、複数の環境でテストすることもできます。

企業Ipsum 構築する:Web開発者向けの11の優れたChrome拡張機能

フィラーテキストを生成する1つの方法は、「asdf」を100回コピーして貼り付けることです。より良い方法は、 Corporate Ipsumをインストールすることです。 瞬く間にフィラーテキストを生成します。

これまでにいくつかのLoremIpsumジェネレーターについて説明しましたが、Corporate Ipsumの魅力は、ブラウザーに正しく配置されることです。ボタンを1回クリックするだけで引き上げることができます。私に言わせれば、それを使わない理由はありません。これで、実際にWebサイトのコーディングに戻ることができます!

TabCloud

Web開発は、複数のマシンで発生することがあります。開発者向けのソース管理は同期と最新の状態を維持するための主な方法ですが、コンピューター間で複数のタブを転送したい場合はどうでしょうか。そこでTabCloud 入ってくる。

TabCloudはタブをクラウドに同期し、他の場所でタブを再度開くことができるようにします。また、セッションセーバーとしてローカルで使用することもでき、後で再訪するために一連のタブを保存できます。タブはGoogleアカウントに保存されます。

WhatFont

構築する:Web開発者向けの11の優れたChrome拡張機能

フォントデザインはWeb開発の大きな要素であるため、GoogleWebFontsなどのサービスが非常に人気があります。幸いなことに、これらの無料フォントは現在利用可能な最も美しいWebフォントの一部になっています。

しかし、それを認めてください。Webを閲覧しているときに、これまでに見たことのない素晴らしいフォントに出くわすことがあります。それを識別する方法はたくさんありますが、最も速い方法は WhatFontを使用することです 。これを使用すると、フォントにカーソルを合わせるだけでフォントを検査できます。 。どうすればもっと簡単にできますか?

素晴らしいスクリーンショット[もう利用できません]

構築する:Web開発者向けの11の優れたChrome拡張機能

スクリーンショットが通常のWeb開発ルーチンの一部ではない場合は、素晴らしいスクリーンショット それを変えるのに役立ちます。画面キャプチャは、設計の変更を文書化し、進行中の作業をクライアントまたはチームメンバーと共有するのに最適です。

この拡張機能には、全ページ、選択した領域、表示領域など、いくつかのキャプチャ機能があります。また、注釈を追加したり、画像の機密部分をぼかしたり、ワンクリックで共有したりすることもできます。または、代わりにGoogleドライブにアップロードしてください。

コンセプトに興味をそそられても、より強力なデスクトッププログラムを使用したい場合は、このスクリーンショットツールの比較を確認して、最適なものを使用してください。

リンクを確認 構築する:Web開発者向けの11の優れたChrome拡張機能

たくさんのウェブ開発エラーはあなたの訪問者を苛立たせます、そして壊れたリンクは最悪の犯罪者の1つです。 1つの壊れたリンクは問題ないかもしれませんが、それ以上になると、Webサイトの信頼性と評判が失われ始めます。幸い、これは簡単に回避できる間違いです。

リンクを確認 それが約束したことを正確に実行します:それはあなたのリンクをチェックします。有効なリンクは緑色でマークされ、壊れたリンクは赤色でマークされ、最後にパーセンテージスコアが表示されます。後で行う必要があるのは、それらのリンクを修復することだけです!

どの拡張機能を使用しますか?

私がお勧めするもう1つの生産性の拡張は、StayFocusdです。これは、Web開発拡張というよりは汎用の拡張ですが、それでも確かに便利です。作業中にウェブに気を取られるのを防ぎます!

これらについてどう思いますか?あなたがお勧めしたい他の重要なウェブ開発拡張機能はありますか?以下のコメントで私たちと共有してください!


  1. ライター向けの上位 7 つの Google Chrome 拡張機能

    完璧なコピーを書くのは簡単なことではありません。ライターは、完璧な記事を作成するために非常に多くのことを処理する必要があります。タスクは、スタイルに注目すること、文法に注意を払うこと、読みやすさを最大化することなど多岐にわたります。より短い時間で同じことを達成するのに役立つ、ライター向けの多くの chrome 拡張機能があります。 以下は、ライター向けの chrome 拡張機能をダウンロードできる場所のリストです。 1.ツイークパス ライター向けの非常に多くの chrome 拡張機能をリストアップしてきたため、ライターが日々覚えて入力しなければならないパスワードが非常に多くあります。し

  2. パスワード管理のための 6 つの Chrome 拡張機能

    デジタル化はスマートフォンや PC を敬遠していた人々が、オンラインで食料品を注文したり、医師の診察を受けたりするほどの驚くべき効果を私たちの生活にもたらしました。ほとんどすべての個人情報、医療レポート、ビデオや画像を含む思い出は、ロックとキーでキャビネットに保管されていました。デジタル化に伴い、ロックとキーはユーザー名とパスワードに置き換えられました。それらの 1 つ 1 つを思い出せないのは正常なことです。 それらを紙や個人の日記に書くことは、誰かがこれらの個人的な文書を手に入れることができる場合、解決策にはなりません。盗難。複数の資格情報の問題が発生したため、世界中のソフトウェア開発会社