タグ

2012年5月17日のブックマーク (9件)

  • CSS拡張メタ言語「SCSS(Sass)」と「LESS」の比較 - (DxD)∞

    CSSを拡張するためのメタ言語として、代表的なものに「SCSS(Sass)」と「LESS」があります。今回、導入を検討するにあたり、両者を比較しました。 結果的には、「SCSS(Sass)」を導入することにしましたが、特に「SCSS(Sass)」を選択する決め手となった点に重点を置きつつ、両者の違いをまとめまてみました。 はじめに Webサイト、Webアプリケーションが大規模になるにつれて、CSSの設計・管理にもリソースを割かれるようになります。CSSのモジュール化、コンポーネント化による再利用性を考えたとき、現状のCSSを取り巻く状況は十分とは言えません。 一つの選択肢としてあがるのが「Blueprint」や「960 Glid System」等のCSSフレームワークの利用ですが、その再利用性と構造・表現の分離度はトレードオフです。 そこで、CSSの利点を活かしつつ、再利用性を高めるために

  • サービス終了のお知らせ - NAVER まとめ

    サービス終了のお知らせ NAVERまとめは2020年9月30日をもちましてサービス終了いたしました。 約11年間、NAVERまとめをご利用・ご愛顧いただき誠にありがとうございました。

    サービス終了のお知らせ - NAVER まとめ
    nao14115
    nao14115 2012/05/17
    【2012年度版】ネットで買えるおすすめインテリアショップ BEST20 - NAVER まとめ
  • 絶対に覚えておきたいwebデザインの配色・カラー3つの基本と基礎

    webデザインを考える時にカラーは切っても切りはなせません。しかし、配色は苦手だけど、まぁカラーの勉強は後でいいや…センス無いしその前にやることあるし…となんとなく後回しにされがちなんじゃないかなーと思います。基を知っておくと、デザインに役立つのはもちろん、クライアントさんに提案出来たり、私生活や料理etc…様々な場面でとっても強い味方になってくれるます。ちょっとしたスキルアップをしたいと考えてるなら、まずは配色から初めてみるのが良いかもしれませんXD 色って? カラーモードRGBとCMYKとは? 色の三属性について 「色相」 「明度」 「彩度」 具体的な例と配色方法 面積比率 可読性 最後に 1.色って? まず一口に色といっても色々(シャレじゃないですw)あるのですが大きく分けて果物や印刷物など物についてる色とテレビやパソコンのモニターなど光を放っている色の2種類があります。 物体色

    nao14115
    nao14115 2012/05/17
    絶対に覚えておきたいwebデザインの配色・カラー3つの基本と基礎
  • レスポンシブwebデザインで制作する時のポイント

    先日、CSS Nite in Ginza, Vol.59「DreamweaverによるレスポンシブWebデザインの実装」に出席してきました。 とても勉強になったので復習も兼ねてレスポンシブwebデザインに関して、セミナーで学んだ内容に自分の調べた点を加えてまとめます。 (一部の図はセミナーの資料を元に作成してます。) 始めに:スマートフォンサイト制作の選択肢 スマートフォンサイトを制作するには幾つかの方法があります。 アプリ 独自系 スクラッチ(0からスマートフォンサイト用に構築) jQuely mobileを使用 流用系 現在のデザインをほぼ流用、調整のみ レスポンシブ・デザイン どの方法にもメリットデメリットはあり、どれが最適かは サイトのコンセプトや規模、予算など複合的に考えて選択する必要があります。 今回のエントリーではレスポンシブ・デザインのみにふれます。 レスポンシブwebデザ

    レスポンシブwebデザインで制作する時のポイント
  • 商用利用も無料、美しいページレイアウトと細部まで作り込まれたUIエレメントが揃ったウェブデザイン用のPSD素材 -Blaz.

    Blaz.」はメルボルンのデザイナーBlaz Robarが長年学んだデザインの技を共有することを目的としたサイトで、ウェブデザイナー・開発者に無料で利用できるウェブデザイン用のPSD素材を配布しています。 Blaz Robar [ad#ad-2] 素材の利用にあたっては個人でも商用でも無料で、再配布は禁止です。 詳しくは「ライセンス」のページをご覧ください。 PSD素材はページレイアウトやエレメントなどが多数あり、いくつかピックアップします。

    nao14115
    nao14115 2012/05/17
    商用利用も無料、美しいページレイアウトと細部まで作り込まれたUIエレメントが揃ったウェブデザイン用のPSD素材 -Blaz. | コリス
  • Domain Suspension

    nao14115
    nao14115 2012/05/17
    Free Vector Map Location Pins
  • 旧・Macの手書き説明書 - FC2 BLOG パスワード認証

    ブログ パスワード認証 閲覧するには管理人が設定した パスワードの入力が必要です。 管理人からのメッセージ https://mac-tegaki.comへ移転中 閲覧パスワード Copyright © since 1999 FC2 inc. All Rights Reserved.

    nao14115
    nao14115 2012/05/17
    真の自動化を手にいれよう。Macのすべての動作を記録させてホットキーで実行『QuicKeys』 | Macの手書き説明書
  • http://cssdeck.com/item/395/diagonal-graph-gradient?amp=&amp=

    nao14115
    nao14115 2012/05/17
    Diagonal Graph Gradient
  • サンプルで学ぶDreamweaver CS6!「レスポンシブWebデザイン」に挑戦してみよう

    Dreamweaverとは Adobe Dreamweaver(以下、Dreamweaver)は、Webページを作成・更新・管理するためのソフトウェアです。Dreamweaverにはいくつかの編集モードがあり、コードビュー(HTMLコードやCSSJavaScriptファイルなどコードを直接編集できる画面)、デザインビュー(Webページをブラウザで表示した形に近い状態で編集できる画面)の両方で編集できます。 さらに、Dreamweaver CS4で登場したライブビュー(レンダリングエンジンに利用しブラウザに非常に近い状態での表示確認ができる画面)では、SafariやGoogle Chromeと同じWebkitというレンダリングエンジンを採用しており、実際の画面を確認しつつ作業を進めることができます。 デザイナーにとっては、HTMLCSSのコードをオートコンプリート(自動補完)してくれる機

    サンプルで学ぶDreamweaver CS6!「レスポンシブWebデザイン」に挑戦してみよう
    nao14115
    nao14115 2012/05/17
    サンプルで学ぶDreamweaver CS6!「レスポンシブWebデザイン」に挑戦してみよう(1/6):CodeZine