タグ

webdevとsmacssに関するnibushibuのブックマーク (6)

  • Ja - Scalable and Modular Architecture for CSS

    大規模なプロジェクトにおいて最適な構造を見つけ出すために自分自身(そして自分の周りの人たち)のプロセスを分析してきたが、その結果、私が見つけ出したのはプロセスは規模の大小に関わらず大規模なサイトであっても小規模なサイトであっても同じように有効なプロセスだった。 プロジェクトやチームが大きくなるのに併せてCSSをより柔軟に、よりメンテナンスしやすいCSSを書くための構造について学んでいこう。 What is it? SMACSS (スマックスと発音する) は厳格なフレームワークというよりはスタイルガイドである。インストール、またはダウンロードするライブラリは書にはない。SMACSSはデザインプロセスを分析するための手法であり、厳格なフレームワークを柔軟な思考過程とする手法だ。そしてCSSを使ったウェブサイトの開発に対する一貫したアプローチをドキュメント化する試みでもある。いったい誰が現在に

  • SMACSS - Scalable and Modular Architecture for CSS (日本語)

    SMACSS (スマックスと発音する) は厳格なフレームワークというよりはスタイルガイドである。インストール、またはダウンロードするライブラリは書にはない。SMACSSはデザインプロセスを分析するための手法であり、厳格なフレームワークを柔軟な思考過程とする手法だ。そしてCSSを使ったウェブサイトの開発に対する一貫したアプローチをドキュメント化する試みでもある。いったい誰が現在においてCSSを使わずにサイトを制作するだろうか!? このアプローチのすべてを活用するのも、部分的に活用するのも、どちらでも最適な方を選んでほしい。もちろん使わなくてもかまわない。このアプローチがすべての人の好みに合わないのは理解できる。ウェブ開発においてほぼすべての質問に対する回答は『時と場合による』だからだ。 Options $ 15.00 CAD - E-book

  • SMACSS 読んだ - CHROMA

    Scalable and Modular Architecture for CSS (日語) を読んだのでそのメモです。 CSSルールのカテゴライズ カテゴライズを行い、それに準じた命名をセレクタに付ける。 ベース レイアウト モジュール 状態(ステート) テーマ レイアウトには1つ以上のモジュールを保持する必要がある。 モジュールは最利用可能なパーツとする。 命名規則 レイアウト、状態(ステート)、モジュールにはプリフィックスを使用する。 レイアウトのスタイルにはlayout-を付ける。または、ドキュメントなどでコーディング規約をまとめてあるなら省略してl-と付けても良い。 状態(ステート)にはis-を付ける。 モジュールは作成される数が多いので、モジュールごとにプリフィックスを付ける。 /* Example */ .comment { } .comment-user { } ベースル

    SMACSS 読んだ - CHROMA
  • Kadoppe’s Blog

    2017/02/24に開催された「日発サービスのグローバルでの戦い方UX & Service Sketch #25」というイベントに参加した。

    Kadoppe’s Blog
  • SMACSSによるCSS設計 - Qiita

    前案件でBEMチックな書き方をして、あまりのクラス名の長さに キィェエエエ!!ってなった後で、 CodeGridさんでSMACSSについてのステキ記事を見つけたのでメモ。 ※以下、CodeGridさんの記事に書いてることを、自分が後で見るようにプチ要約したものです。 記事をまだ読んだことが無い人はここよりも、記事の方をじっくり読むのをお勧めします。 SMACSSによるCSSの設計 - ベースとレイアウト | CodeGrid CSSカテゴライズ 5つにカテゴライズして、それに準じた名前を付ける 1.ベース 2.レイアウト 3.モジュール 4.状態(ステート) 5.テーマ 1.ベースルール サイト全体で要素そのもののデフォルトスタイル

    SMACSSによるCSS設計 - Qiita
  • 4 ways to create CSS that's modular and scalable

    Modular code is reusable code. It can be combined in a variety of ways, making it flexible and scalable, allowing you to iterate code blocks independently and leading to better performance and more maintainable sites. Object Oriented CSS (OOCSS), Scalable and Modular Architecture for CSS (SMACSS), Don’t Repeat Yourself CSS (DRY CSS), and Block, Element, Modifier (BEM) are four popular methods for

    4 ways to create CSS that's modular and scalable
  • 1