NounProject -SVG画像の最高かつ最大のコレクション
SVGのクロスブラウザサポートは理想的ではないため、次のように行います。必要なSVGサイトで画像を見つけ、メモ帳で開き、色とサイズ（画像自体もある）を手動で調整してから、画像を含むファイルを開きますブラウザで画像のスクリーンショットを撮り、Photoshopに切り取り、最小のパラメータでgifで保存します。 結論は最高の画質です。SVGの品質は縮小または増加しても変化せず、スペースを最小限に抑えられるため、塗りつぶしによって色が変化した場合のエッジのぼやけ、不完全な着色などの欠陥はありません。
Codebeautifier -CSSファイル自体の重量を減らした、CSSファイルのクロスブラウザ準備。
異なるブラウザー、特にIEでは一部のCSSパラメーターを異なる方法で認識するため、これはブラウザー間の互換性の問題を引き起こします。 このリソースを使用して、すべてのブラウザーで同様に機能するCSSファイルを作成できます。
Iterm2は、Mac OSに最適なコンソールであり、標準端末に代わるものです。
特徴は、1つのウィンドウを垂直と水平の両方に分割できることです。つまり、フルスクリーンにし、さまざまな目的で使用するために異なるサイズのいくつかの部分に分割できます。
Spritebaker-画像とフォントをbase64でエンコードし、後でCSSに挿入できるようにします。これにより、ダウンロード速度が向上します
Web開発者 -多くの機能を備えたFirefox用のプラグイン。
たとえば、Cookieの表示/入力/編集、対称性の地形の表示、写真に関する情報などがあります。
ColorZilla-画面上の任意のポイントをクリックしてカラーコードを取得できる、Firefox用のプラグイン。
スクリーンショットを撮ってPhotoshopにドロップし、色をクリックする必要はありません。 プラグインをインストールするだけです。 とても快適です。
DataUrl-画像からコードを生成します。
写真をドラッグアンドドロップして、文字列コードを取得するだけです。 たとえば、スクリプト間の行として画像を転送したり、文字列としてデータベースに保存したり、ファイルをまったく保存しないなど、非常に便利です。
Pjax-どのプラグインを使用すると、リロードせずにページのコンテンツを変更できます。
たとえば、Twitterのように、ページがリロードされるときのようにジャンプせず、リロードされないため、非常に便利で使いやすいです。 さらに、一度変更されないすべてのCSS、フレームワーク、およびその他のコンテンツをアンロードし、ページの実際に変更された部分のみを変更できるため、生産性が向上します。 唯一の問題は、サードパーティのサービス（ソーシャルボタンなど）と統合する必要がある場合、このテクノロジーがあまり使用されないことが多いことです。ソーシャルボタンは機能しなくなります（VKontakteのみがこれを考慮しましたが、FacebookやTwitterは考慮しません）。
CopyPasteCharacterは、特殊文字の大きなセットです。
たとえば、TMアイコンをテキストまたはAppleロゴに挿入する必要がありますが、これはキーボードにはありません。 このサイトにアクセスして、シンボルをコピーし、必要に応じて貼り付けます。
名前の確認 -入力した名前が多くのインターネットリソースに登録されているかどうかを確認します。
たとえば、Facebookや他のリソースに登録する必要があり、全員に同じ名前を付けたいとします。 このサービスを使用すると、どこでも利用できることをすぐに確認できます。
Scrim-メールをリンクに変換します。
メインの電子メールをスパム対策および非表示にするために使用されます。 たとえば、連絡先のネットワークでメールを指定する必要があるが、それを他人に知られたくない場合やスパムを望まない場合。
フォント比較 -文字列を入力して、異なるフォントでどのように表示されるかを確認できます。
最適なオプションが明確に表示されるため、フォントを選択するのに非常に便利です。
アイコン検索 -画像、ロゴ、アイコンを検索します。
探しているものを探して、適切なアイコンを選択するだけです。
Smush.it-不要なバイトを削除することにより、画像の重みを減らします。
つまり、画像を変更せずに重量を減らします。
WebSitePulse-サイトのページの読み込み速度、重量、その他の有用な情報を表示します。
読み込み速度を最適化し、その後の改良のために「重い」ページを識別するための優れたリソース。
Php Stormは、特にMac OS向けのコーディングに最適なIDEエディターです。
私は多くのことを試しましたが、Php Stormは私が見た中で最高です。多くの機能、特に自動、デバッグ、色の適切な使用などがあります。これにより、コードを書くのが便利になり、エラーの数が減ります。
Codebeautifier-あいまいで読みやすいCSSファイルから、あいまいで読みやすいCSSファイルを作成します。
優れたコード記述の観点から見た場合、スムーズさのために便利です。
ボーナス1
非常に多くの場合、ひどいエラーメッセージやボタン名が表示されることがありますが、それに基づいて、何をすべきかが明確ではありません。 このスキームを使用することをお勧めします。
1.すべてのボタンは動詞と呼ばれるべきです。 つまり、ボタンの名前は常に「キャンセル」、「保存」、「削除」のようにし、「完了」、「完了」などのようにしないようにします（準備ができているので、どうするのですか？）。 ボタンの名前は何らかのアクションを意味するため、動詞にする必要があります。
2.エラー出力は、必ず2つのパンクチャを示す必要があります。
a）何が起こったのですか？
b）何をすべきか？
エラーは、「致命的なエラー」、「不明なエラー」、「サーバーエラー」、「エラー126581」のようには見えません。 エラーが画面に表示される場合、それはユーザーを対象としているため、何が起こったのか、何をすべきかを簡単な言語で述べる必要があります。 たとえば、「間違ったユーザー名を入力しました。正しいユーザー名を入力してください。」 つまり、すべてがすぐに明らかになります。 たとえば、何が起こったのかなど、1つのポイントのみを入力すると、次に何をすべきかが明確にならない場合があります。 または逆に、次に何をすべきかを示した場合、何が起こったかは不明です。
ボーナス2
ページの読み込みを高速化するには、ファイルから不要なスペース、文字、タブなどを削除したり、コメントや書式を削除したりして、潜在的な攻撃者または誰かにすべてがどのように機能するかを説明しないことが役立ちます。 つまり、大まかに言えば、スクリプトを余計なものなしで1行にすることです。 これを行うために、「minifier」と呼ばれるサービスがあります。 それらはすべて、同じタイプのCSSまたはJSまたはHTMLファイルを対象としています。 しかし、1つのファイルで複数の言語が使用され、それらのすべてが混同されることがよくあります。 この場合、コードを正しく解釈できないため、ミニファイアを使用できません。
注意！ 優れたコードの観点からは、1つのファイルに異なる言語を記述するのではなく、異なるファイルを作成してインクルードする方が適切です。
しかし、何らかの理由でそれをすべて同じように行った場合、コードが1つのファイルに異なる言語を含んでいるかどうかに関係なく、オプションの文字を削除するために一度書いた簡単なコードを次に示します。 これらの文字を削除し、コードを1行に印刷します。 唯一の要件は、JSのコメントは/ ** /の形式であり、それ以外の形式ではないことです。
オプションの文字を削除し、1行でコードを作成するスクリプト
<? function listdir($start_dir='.') { $files = array(); if (is_dir($start_dir)) { $fh = opendir($start_dir); while (($file = readdir($fh)) !== false) { if (strcmp($file, '.')==0 || strcmp($file, '..')==0) continue; $filepath = $start_dir . '/' . $file; if ( is_dir($filepath) ) $files = array_merge($files, listdir($filepath)); else array_push($files, $filepath); } closedir($fh); } else { $files = false; } return $files; } $files = listdir('.'); for($i=0;$i<count($files);$i++) { $file=$files[$i]; if(substr($file, -3) == "php" && $file != "./__.php") { $file_cleared = php_strip_whitespace($file); $file_cleared = preg_replace('#\s*/\*.*?\*/\s*#i', "", $file_cleared); $patterns[] = '/: /'; $patterns[] = '/\n/'; $patterns[] = '/ == /'; $patterns[] = '/ = /'; $patterns[] = "/\+ /"; $patterns[] = "/ \+/"; $patterns[] = '/ === /'; $patterns[] = '/ /'; $patterns[] = '/ /'; $patterns[] = '/ /'; $patterns[] = '/ /'; $patterns[] = '/ /'; $patterns[] = "/\t/"; $patterns[] = "/\<\?php/"; $patterns[] = "/\} /"; $patterns[] = "/ \}/"; $patterns[] = "/ \{/"; $patterns[] = "/\{ /"; $patterns[] = "/\) /"; $patterns[] = "/ \)/"; $patterns[] = "/ \(/"; $patterns[] = "/\( /"; $patterns[] = "/\> /"; $patterns[] = "/\; /"; $patterns[] = "/\%\(/"; $replacements[] = ':'; $replacements[] = ''; $replacements[] = '=='; $replacements[] = '='; $replacements[] = '+'; $replacements[] = '+'; $replacements[] = '==='; $replacements[] = ' '; $replacements[] = ' '; $replacements[] = ' '; $replacements[] = ' '; $replacements[] = ' '; $replacements[] = ''; $replacements[] = '<?'; $replacements[] = '}'; $replacements[] = '}'; $replacements[] = '{'; $replacements[] = '{'; $replacements[] = ')'; $replacements[] = ')'; $replacements[] = '('; $replacements[] = '('; $replacements[] = '>'; $replacements[] = ';'; $replacements[] = '% ('; $finish = preg_replace($patterns, $replacements, $file_cleared); file_put_contents($file,$finish); echo $file,"<br>"; } } ?>
それを使用するには、phpファイルを作成し、そこにこのコードを貼り付ける必要があります。その後、コードで「YOUR_FILENAME_NAME」をファイル名に置き換えます。 スクリプトは、このスクリプトが置かれている場所から始まるすべてのフォルダーを再帰的にスキャンします。
UPD
1. base64とCSSに関するリンクが修正されました（以前の意味が間違って説明されていました）
2.いくつかの批判の後、この記事はドラフト形式になりましたが、それを取り戻すためにいくつかのメッセージを受け取ったので、それを修正し、公開し直しました。 他に問題がある場合は、修正または削除する内容を記入してください。