タグ

コンポーネントとFLOCSSに関するkaraumaのブックマーク (2)

  • より良いCSSを書くための様々なCSS設計まとめ

    CSSは誰でも簡単に自由に書けるのですが、好きなように書いていると「ここを変更したら、違うところが崩れた」といったようにすぐに破綻してしまいます。 さらに、複数人で書いている場合は、各々が好きなように書いて読むだけでも苦痛なCSSが出来上がってしまいます。 そこで、これらの問題を解決するために考えられたのが「CSS設計」です。 今回は記事が長くなり過ぎるので、CSS設計の概要のみを説明し、参考となる公式ドキュメントへのリンクを記載しました。 CSS設計とは CSS設計は、CSSを記述する時のルールとなるものです。プロジェクト毎に適したCSS設計を採用することで、「良いCSS」にすることができます。 最近では、命名規則はBEMで、構成はSMACCSのように各CSS設計の概念を取り込んだオリジナルの規約をつくるといったことも多いようです。 「良いCSS」とは 「良いCSS」の定義として、おそら

    より良いCSSを書くための様々なCSS設計まとめ
    karauma
    karauma 2020/02/07
    “1つの要素に対して複数のクラスを指定するのをマルチクラス、1つないし2つ程度のクラスを指定するのをシングルクラスと呼びます。”
  • CSS設計の選定に学ぶ仕事術 - Developer’s Blog

    選定作業には責任がつきまとう。 おはようございます おやすみなさい 皆さま、初めまして。今回のプロジェクト開発者の一人コースケと申します。 日は連載中の尾形(以降リーダーと呼びます)に代わり特別編といたしましてイチ開発者である僕からフロントエンド挑戦における失敗談を皆さまにお伝えさせてください。 不安の中始まったフロントエンドの挑戦 今回のプロダクトで僕が任されたのは、フロントエンド周り全般。 特に、デザイン周りでは自分一人で結構な量の調査や選定、実践を行ないました。 HTML/HTML5の調査 CSS/CSS3の調査 Sassの調査 CSSデザイン/設計の参考書の選定 設計方針の選定 参考となる規約の選定 プロトタイプの作成 などなど。 フロントエンドの調査に僕一人で突っ込まれて孤立しながら、右も左もわからぬまま「初心者」と「入門」を&検索にググり続けました。。 ※画像はイメージです。

    CSS設計の選定に学ぶ仕事術 - Developer’s Blog
  • 1