今回某スマホ案件でSublimeText2(以下ST2)とSCSSでサイトを構築しようと思っております。チャレンジする内容は下記の通り。上記にチャレンジしてみて、いわゆるフロントエンド周りの高速化にチャレンジ、というわけです。2をWindowsに導入してみているご無沙汰しております。寒中お見舞い申し上げます。最近は変数が使えるCSS管理コードと呼べば良いんでしょうか、そんな感じの言語が結構前からあります。SassとかSCSSとかLESSってなんだSassSCSSLESS「LESS」や「Sass」のようなCSS拡張メタ言語は、960.gsなどのフレームワークとは異なり、CSSの言語自体を拡張し、CSSには存在しない機能を追加するものです。動的な処理をCSSに追加でき、CSSが苦手とする大規模サイトやWebアプリケーションの構築に欠かせない再利用性を高められます。一部改変:viaつまり、ある程度規模のあるウェブサイトならCSS全体で共通する値とかルールとかがあり、それらをCSSを拡張することにより使えるようにしたメタ言語、ということになりますね。紙のデザインで言うところの指定紙になるような設計書を書くイメージでしょうか。導入検討の意図こういったツールは前から気になってはいたものの、Dreamweaverの保存即アップロードや、サイトを管理するGUI、差分を撮ってファイルをアップロードする機能、DIFFツールと連携できるところなどにかなり便利さを感じてしまっており、オーサリングツールを変える気にはなれませんでした。最近はスマートフォン対応、複数のDPIへの対応、MediaQueriesの対応などが必須となり、ページ単価は上げられないのに作業量は倍々で増えていくという地獄状態になっているので、作業量緩和のためのツールとして、覚えてみようかな、と言う次第です。目標Windows7-64bitで、オーサリングツール(Dreamweaverの代わり)を入れ、そこでSCSSをビルドすると自動的にFTPサーバーへアップロードされる様なもの。今回障壁になったのは下記のようなこと。Text(オーサリングツール)を使ったことがないなのでショートカットキーとかパッケージとかわからない何ができるのかもわからない当然SassもLESSもSCSSも使ったことがないどう書いて良いのかわからないオーサリングツールと拡張CSSのコンパイラの連携とかCompassとかよくわからない概念についてSassとSCSSって?Sassには二つの構文があります。CSS)として知られ、このドキュメントを通じて使われている、CSS3の構文を拡張したものです。全ての有効なCSS3スタイルシートは、SCSSファイルとしても有効です。加えて、SCSSは多くのCSSハックと、IEの古いフィルタ構文などのブラウザ固有の構文が使えます。この構文は、以下で説明するSassの機能で拡張されています。SCSSの構文で書かれたファイルは、.scssの拡張子を持ちます。二つ目は古い構文で、インデント構文(単に“Sass”とも言われます)として知られているもので、CSSを書くのに、より簡潔な方法を提供します。この構文では、セレクタのネストを表すのに、カッコよりもインデントを、プロパティを区切るのに、セミコロンよりも改行を使います。一部の人は、SCSSよりも、この構文が読みやすく、また、速く書けることに気づきました。インデント構文は、SCSSと同じ機能を持っていましたが、やや構文が異なっていました。この違いは、インデント構文のリファレンスで説明しています。インデント構文で書かれたファイルは、.sassの拡張子を持ちます。SCSSはSassとは互換のない上位バージョンのSass、と思っておけばよいようです。やって動かすの?SCSSはrubyで動く。OSにrubyをインストールする必要がある。コマンドラインでコンパイルすることが前提。vimとか使ってる人向けだった。Textをオーサリングツールとして、必要なパッケージをインストールすることでオーサリングツール上で使えるようになる。基本的には、SCSSを書く、コンパイル(ビルド)する、CSSをアップロードする、と言う流れ。Textにパッケージを入れることで解決する。SnippetsCompassそのほかHTML5やCSSを入れておくと吉。詳細はこちら保存時にビルドするパッケージをインストールSublimeOnSaveBuild躓いたポイント基本的にProjectのディレクトリもProjectファイルを保存する場所も、マルチバイトを含むパスに置かないこと。Projectファイルを保存しないとCompassが使えない。Buildはなくても動く。最低限は上記3つのパッケージ。(6)人気の投稿Windows7でUltraVNCのセットアップメインPCを入れ替えまして、会社から家のマシンにアクセスするために、リモートデスクトップ接続を試みたところ、うまくいきました。そのため以下駄文です。ルーターを買ってはみたものの...Windows7を導入し、ついでにルータも購入しました。WZR-HP-G301NHシリーズというバッファローのルーターで、アマゾンで6400円で購入できました。最近凄い寒くなってますが、普通のエアコンだけだとなかなか加湿しながら暖房するのは難しいですよね。ハロゲンヒーターは乾燥を防いで暖房できますが、やはり空気は乾燥しがちです。今日は市役所に行き、住基カードを新規発行した。納期の承認に関する申請書確定申告などで利用できる、e-taxサービスを利用するためだ。これには印鑑カードが必要となる。2をWindowsに導入してみているご無沙汰しております。寒中お見舞い申し上げます。最近は変数が使えるCSS管理コードと呼べば良いんでしょうか、そんな感じの言語が結構前からあります。64bitインストールメモPCを新調したので、WindowsXPからWindows7にメインマシンを移行したときのメモを書きます。マシン構成は、旧マシンについていたHDD3台(C:プログラム系、D:データ系、E:キャッシュ系)のうち、DとEを新マシンにつなげました。iT...iPhoneを縦にして読むときに最適な文字数について今年1月にiPhone3GSを購入し、iPhoneを使ってテキストを読む機会が増えてきました。スマートフォン向けのサイトを作る機会もありますが、その際に気をつける必要があるのが、スクリーン上の文字のサイズです。今回某スマホ案件でSublimeText2(以下ST2)とSCSSでサイトを構築しようと思っております。チャレンジする内容は下記の通り。