タグ

関連タグで絞り込む (1)

タグの絞り込みを解除

ソフトウェアとcssに関するsakudroのブックマーク (3)

  • 小さな改善を積み重ねる。CSSを短縮化するコンソール向けソフトウェア·clean-css MOONGIFT

    clean-cssはnode.jsを使ったCSS短縮化ソフトウェアです。コンソールで動作します。 一日数十万、数百万とアクセスのあるWebサイトではほんの少しの改善が積み重なって大きな速度改善につながることもあります。CSSも作成したそのままではなくちょっと工夫すれば大きな負荷軽減につながるかも知れません。そのための短縮化ライブラリがclean-cssです。 インストールはnpmを使って一発で完了。コマンドとして使うので-gをつけておきます。 ヘルプです。-oでアウトプットするファイル名、後は入力ファイルを指定するだけです。 catで標準出力としてCSSの記述を渡すことで、複数のファイルをまとめてマージして短縮化もできます。 元ファイルです。 こんな感じで短縮化されます。 またnode.jsのライブラリとしてテキストでCSSを渡して短縮化もできます。 -oをつけないと標準出力に渡るので、さ

  • Webデザイナーにお勧め!LESSファイルを監視してCSSに自動変換·SimpLESS MOONGIFT

    SimpLESSはLESSファイルのあるフォルダを監視して作成や更新のタイミングでCSSファイルに変換してくれるソフトウェアです。 CSSで不満に感じられることの多い、入れ子の構造や変数定義などを可能にするCSSライブラリがLESSです。そんなLESSファイルの作成、更新を監視してCSSファイルを自動生成してくれるソフトウェアがSimpLESSです。 最初に起動したときの画面です。SimpLESSはTitaniumを使って作られています。 メイン画面です。LESSファイルの含まれるフォルダを追加します。後はSimpLESSがファイルの更新を監視してくれます。 監視しています。更新したタイミングで自動的にCSSファイルを生成します。生成時には検証もされるので正しいCSSが生成されるとのことです。 例えばこれがLESSファイルの内容です。 SimpLESSが自動生成したCSSファイルがこれです

  • Webデザイナーにオススメ!SCSS/Sassで記述してリアルタイムに変換、デザインを確認·Compass MOONGIFT

    独自の記法でCSSを記述するフレームワークがいくつか出てきました。しかし実際に利用する際にはCSSに変換する必要があります。記述して変換、では手間に感じて利用したくないでしょう。そこでCompassを使って自動変換してくれる環境を構築しましょう。 実行しているところです。メニューバーに常駐します。 設定です。SCSSまたはSassに対応し、自動で短縮化もしてくれます。 通知機能があります。Mac OSXの場合はGrowlで通知してくれます。 Webサーバ機能とlivereload機能があります。保存したタイミングで任意のポートをたたいて再読み込みさせます。 プロジェクトを追加したときの通知です。 Rubyファイルを含めてまとめてファイルを生成してくれます。 ファイルの配置はこんな感じです。デザインを組む前の準備が簡単になります。 ファイルを修正すれば自動で再コンパイルしてくれます。 いくつ

  • 1