データURI [CSS]スプライト1.1-CSSスプライトのアセンブルプロセスの自動化



多くのプロのWeb開発者は、Webサイトの最適化手法に精通しています。 最適化する1つの方法は、 CSSスプライトを使用することです。 同じ開発者は、標準スプライトの形成、アセンブリ、および再アセンブリにどのような困難があるかを知っています。 インターネットでは、このプロセスを自動化するツールを見つけることができます。 標準のスプライトを使用する場合、CSSのバックグラウンドの仕様により、すべてのケースでアセンブリを完全に自動化することは問題です。 つまずきは、背景画像の繰り返しプロパティである場合があります。



データ:CSS URI



データに基づいて、CSSスプライトを生成する別の方法があります:uriスキーム 。 このアプローチは、サーバーへの呼び出しの数が最小限に抑えられるという点で興味深いものです。最も重要なことは、スプライトの組み立てと再生成のプロセスを完全に自動化できることです。 サイトの操作を最適化し、データに基づいてcssスプライトを組み立てるプロセスを完全に自動化するために、 uriスキーム、特別なライブラリが開発されました。 作成されたライブラリに基づいて、 Duris.ruサイトが展開されます。 この開発について聞いたことがない人は、このトピックに関する以前の記事を読むことができます。



バージョン1.1を更新



今、主なものについて。 スプライト生成ツールが更新され、追加機能に興奮しました:



指定されたデータ:uriスプライト生成ツールは、主要なプロジェクトの1つに統合されています。もちろん、現時点ではどのプロジェクトかを示すことはできませんが、統合の結果は満足のいくものです。 最後に、スプライトの苦痛は終わりました。



未来



IE8データ:uriスキームのサポートの出現により、開発されたアプローチは非常に有望になりました。現在、すべての最新のブラウザーがそのようなスプライトをサポートしています。 完全に幸福にするために、Operaブラウザがサポートされるデータのサイズを増やすことは引き続きあります:uriスキーム(Operaには最大4 KBの制限があります)。



FAQセクションのuri cssスプライト:データの生成と接続の原則について詳しく知ることができます。 サイトまたはアルゴリズム全体に関する質問や提案がある場合は、フィードバックウィジェットでサイトに要望を残すか、コメントを記入してください。



最後に、CSSスプライトを生成するための優れたツールの選択www.smashingmagazine.com/2009/04/27/the-mystery-of-css-sprites-techniques-tools-and-tutorials



健康に使用してください。



UPD :サイトartlebedev.ru。duris.ruがデフォルトで"霧の中"に設定されているため、作業を評価するには、現時点で自分のサイトまたは他の作業サイトを挿入します。



All Articles