タグ Compass
人気順 5 users 10 users 100 users 500 users 1000 users「リーダー不在のエンジニアチームは守りに入る」ーー及川卓也氏が語るエンジニアマネジメントの要諦 | COMPASS
経済産業省は2016年、「IT需要が拡大する一方で、国内の人材供給力が低下し、IT人材不足は今後より一層深刻化する可能性があります」とホームページ上で発表している。発表から2年以上が経過した現在も、採用担当者から「エンジニアの採用が喫緊の課題です」と聞くことが増えた。 また、エンジニアには“エンジニア独自の... 続きを読む
Compass の送別会 - ペパボテックブログ
2018 年 3 月 15 日、渋谷のはずれにある中華料理店『東亜飯店』では、 Sass の拡張フレームワークの Compass の送別会がしめやかにとりおこなわれていた。 「えー、それではですね、きょうは長年われわれのチームでいっしょに働いてきた Compass くんがついに卒業ということで、 minne のデザイナーの @shikakun から挨拶があるそうなので、よろしくお願いします」 はい... 続きを読む
やる夫がデザイナーの作ったPSDにお怒りのようです | WebTecNote
カテゴリー CSS (53) Compass (2) Sass (1) Custom (8) Dojo (1) GoogleMap (23) HTML&XHTML (12) HTML5 (1) Information (19) Javascript (42) jQuery (9) Material (9) Memo (71) やる夫がデザイナーの作ったPSDにお怒りのようです (5) MooToo... 続きを読む
やる夫がデザイナーの作ったPSDにお怒りのようです | WebTecNote
カテゴリー CSS (53) Compass (2) Sass (1) Custom (8) Dojo (1) GoogleMap (23) HTML&XHTML (12) HTML5 (1) Information (19) Javascript (42) jQuery (9) Material (9) Memo (71) やる夫がデザイナーの作ったPSDにお怒りのようです (5) MooToo... 続きを読む
Gulp + browserify + watchify + gulp-sass で自動高速コンパイル環境 | モンキーレンチ
Gulp とは Gulp は Web 制作に関するいろいろな作業を自動化するためのツールです。Sass のコンパイルや Gulp の使用には node.js や Sass などのインストールが必要なので、ちょっと古い記事ですが下記を参考に適当にインストールしてみてください。 Grunt + Sass + Compassでつくるナウいフロントエンド開発環境 browserify とは そんなに詳しく... 続きを読む
爆捗! WordPressテーマ作成ショートカット(5):知って得するSass/Compassのインストールと使い方 (1/2) - @IT
爆捗! WordPressテーマ作成ショートカット(5):知って得するSass/Compassのインストールと使い方 (1/2) 本連載では、CMSのスタンダードでもある「WordPress」のテーマ作成を、Dreamweaverをメインに用いてさまざまなモダンな技術を組み合わせながら爆発的に捗(はかど)らせる方法を解説していく。今回は、SassベースのCSSフレームワーク「Compass」につい... 続きを読む
爆捗! WordPressテーマ作成ショートカット(1):Dreamweaverで始めるWordPressサイト構築の基礎知識 (1/3) - @IT
本連載では、CMSのスタンダードでもある「WordPress」のテーマ作成を、「Adobe Dreamweaver CC」(以下、Dreamweaver)をメインに用いてさまざまなモダンな技術を組み合わせながら爆発的に捗(はかど)らせる方法を解説していく。さまざまなモダンな技術としては、「Sass」「Compass」「Emmet」(旧、Zen-Coding)を想定している。 今回は、Dreamwe... 続きを読む
CSS拡張メタ言語「Sass」の概要と導入手順 (1/3):CodeZine
本連載では、CSSの拡張言語であるSassの導入と、Sassを利用したメジャーなCSSフレームワークの1つであるCompassの導入をサンプルを交えて紹介し、最終的には実際にオイシックスで利用しているCSSをSassで書き直した際の実例をご紹介します はじめに CompassはSassを拡張したツール集で、CSSのフレームワークといわれています。大手企業でも導入されていて、オイシックスでもデザイナ... 続きを読む
【Susy】Sass,Compassでグリッドレイアウトしまそ - Milk+ea
2013-08-13 【Susy】Sass,Compassでグリッドレイアウトしまそ SASS 何 SusyはCompassのプラグインです。 グリッドなサイトを制作するためのMixinを提供してくれます。 モバイル・ファーストも可能よ。 インストール Susy: Getting Startedを眺めたら多分わかります。 使い方 初期設定 Susyを使うときは次の変数に何かしら値を代入してから使い... 続きを読む
今日から使える! Sass/compass ゆるめ勉強会
今日から使える! Sass/compass ゆるめ勉強会 Presentation Transcript 今日から使える! Sass/Compass ゆるめ勉強会 2013.11.17 自己紹介 ‣ ノジマユウジ ‣ 株式会社フォーエンキー 代表 絶賛 お仕事 募集中 ● ● ● ● ● ● Android/iOSアプリ Webアプリ/WordPress Winデスクトップアプリ Web制作全般 ... 続きを読む
WebデザイナーのためのSass/Compass入門 先生:石本 光司
WebデザイナーのためのSass/Compass入門 先生:石本 光司 Presentation Transcript Introduction to Sass/Compass for Web Designer Webデザイナーのための Sass/Compass 入門 Ameba Headquarters Game Division Web Developer Koji Ishimoto 2013... 続きを読む
CSS - 君は知っているか、あのCompassのstatsコマンドを! - Qiita
CSSをリファクタリングしようと思うと、どっから手をつけたら良いかわからなくないですかね?僕はわかりません。 特にSassのような@importでいろいろファイル分割していると、あれこれなんのファイルだったお(^ω^;)ってことがよくありませんかね?僕はないです! ということで、あなたがCompassプロジェクトを使用しているのならば、config.rbのある場所で下記のコマンドを打ってみましょう... 続きを読む
Compassで書きだすCSSファイルを軽量化する - to-R
Compassは便利な半面、書きだされるCSSのサイズが非常に大きくなってしまうことがあります。設定を変更することで書きだされるCSSファイルの容量を削減することが可能です。 Step1.圧縮する コンパイル時に圧縮オプションを指定することで改行や空白を取り除いた形で書きだしてくれます。config.rbに以下のコードを追加するだけで圧縮できます。 output_style = :compress... 続きを読む
Gruntで始めるWeb制作の自動化 - to-R
Grunt.jsとはWeb制作の様々なタスクを自動化してくれるツールです。 node.jsで開発されており、Sass/CompassやLessなどのCSSプリプロセッサーのコンパイルやCSS/JSの結合圧縮、JSHintによるバリデーションなど様々なタスクを自動で行ってくれます。 インストール まずはnode.jsをインストールします。公式サイトでインストーラーが配布されていますので簡単にインスト... 続きを読む
TEST CORDING » 基礎からのSass – Sassによる効率的CSSコーディングまとめ
今まで作成してきたエントリーをまとめてみました。ライブラリ化についても言及しています。Sass の機能的に書いてないものもあるので、今後追加するかも。よく一緒に紹介されるCompassについては言及していませんのでご注意を。 Sassって何? Sass とは、よりプログラミングに近い書き方ができる言語です。今まで書いていた CSS の書き方を見てみましょう。 div.container h1 { ... 続きを読む
より素早くCSSコーディングするための、Sass(SCSS)のmixinスニペット集 | Webクリエイターボックス
以前「効率良くCSSコーディングできるSassを使ってみよう!Mac+Codaなら設定も簡単!」という記事で紹介したSass/SCSS。皆さん使ってますか?今回はそのSassの @mixin という機能に注目してみようと思います。中には後述する「Compass」というフレームワークを使えば同様のコードが記述できるものもありますが、お勉強も兼ねてあえて使わず自分で書いてみました。カスタマイズしやすそ... 続きを読む
[CSS]さまざまなデザインのボタンを簡単に実装できるSass/Compassのボタンライブラリ -Buttons | コリス
フラットをはじめ、定番の角丸、サークル、アイコン添えなど、さまざまなデザインのボタンを簡単に実装できるSass/Compassで作られたボタンライブラリを紹介します。 Buttons Buttons- GitHub Buttonsのデモ Buttonsの使い方 Buttonsのデモ デモでは、リンクのテキストやbutton要素、input要素にclassを付与するだけで、さまざまなデザインのボタン... 続きを読む
AngularJS's tutorial - あなたとともにAngularJS
AngularJS's tutorial あなたとともにAngularJS AngularJSの入門用のチュートリアルを作ってみました なかなかまだ日本語の記事がなかったので、少しだけですが使ってみたことをメモしておきます TwitterBootstrap、google-code-prettify、CoffeeScript、Sass、Compass、Grunt.js by hisasann Git... 続きを読む
SassのデバッグにSource Mapsを使うべきたくさんの理由 | Dress Cording
SassやCompassをChrome Developer ToolsでデバッグしたいのにCSSしか参照できなくて困ったり、編集したコードをコピペするのが面倒、エディタに即時反映できたらいいのにって思ったことはありませんか? この悩みを、Source MapsとChrome拡張「Tincr」を使って解決する方法をご紹介をします。 一連の流れを動画に撮ってみました。 1. Source MapsでS... 続きを読む
パフォーマンスから考えるSass/Compassの導入・運用
パフォーマンスから考えるSass/Compassの導入・運用 Presentation Transcript 事例:パフォーマンスから考えるSass/Compass 導入・運用アメーバ事業本部 コミュニティ部門 第3コミュニティ事業部Webディベロッパー 石本 光司2013.01.12 @CSS Nite LP, Disk 26「CSS Preprocessor Shootout」 @t32k デ... 続きを読む
ズルいデザイン(2):SassやCompassを使って、ズルいデザインテクニック (1/2) - @IT
SassやCompassを使って、少ない手間でちょっといい感じに見せる小ズルいTipsを紹介。グラデーション、角丸のお手軽かつ効果的な使い方とは? シリーズ第2回、前回に続き、今回もSassやCompassを使って、少ない手間でちょっといい感じに見せる小ズルいTipsを紹介します。 今回は、グラデーション、角丸のお手軽かつ効果的な使い方について解説します。 (注)このページでは、個々のデザイン要素... 続きを読む
StartUp Sass + Compass [基本と活用]
Statistics Favorites 1 Downloads 0 Comments 0 Embed Views 0 Views on SlideShare 0 Total Views 0 StartUp Sass + Compass [基本と活用] Presentation Transcript 第1回 Creators Meetup : StartUp Sass+Compass ∼基本と活用... 続きを読む
昔のCSSをLessとかSassにしたいの | WP-D
昔のCSSをLessとかSassにしたいの ども、白です。ホワイトデーは来月です(はい)。 さて、いろんなデバイスを対象にしたり、ちょっと規模の大きいサイトを作っていくとなるとCSSを書くのも大変です。そんな時は「素のCSSなんて書いてられっか、バカヤロー!(ガラガラガッシャーン)」ってなるので、最近話題の「Less」や「Sass(+Compass)」「Stylus」といったCSSプリプロセッサを... 続きを読む
初めてSassとCompassを使った際に参考にした記事まとめ|WEB Drawer
しばらく前から気になっていたCSSを書く時に便利だという「Sass」と「Compass」を自分のサイトを作る時に使ってみました。 順番に導入の手順を追ってもいいのですが、検索すると多くのサイトが紹介していますので、私が見て参考にしたページをまとめておきたいと思います。 Sassとは まずSassとは何かと言うと、CSSを生成するためのメタ言語で、これを利用することでCSSを早く書けたり、記述が楽に... 続きを読む
CSSの常識が変わる!「Compass」、基礎から応用まで! | 株式会社LIG
こんにちは、デザインナーの王です。CompassのおかげでCSSを書くのが楽しくなってきている今日この頃です~~ この記事を読んでいるあなたは多分以下二つのタイプに分けることが出来るでしょう。 なんとなく「Compass」という言葉を小耳に挟んだことがあって、いずれは導入しようとは思っているがなかなか行動に移せないでいる。 「Compass」?初耳だがCSSの代替品って言うからちょっと興味が湧いた... 続きを読む