質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
87.20%
Sass

Sassは、プログラミング風のコードでCSSを生成できるスタイルシート言語です。 scss ファイルを、変換(コンパイル)してCSSファイルを作成します。

コーディング規約

コーディング規約とは、コードの書き方についての決め事のことです。 文法のことではなく、そのチームなどの中の約束事としてどのような書き方で行うかを定めるもの。 項目の例として、関数や変数の命名規則、コーディングのスタイル、括弧やインデントの書き方などが挙げられます。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

解決済

破綻しないCSS設計を練習、体得するにはどうしたらいいでしょう?

Ebrick
Ebrick

総合スコア12

Sass

Sassは、プログラミング風のコードでCSSを生成できるスタイルシート言語です。 scss ファイルを、変換(コンパイル)してCSSファイルを作成します。

コーディング規約

コーディング規約とは、コードの書き方についての決め事のことです。 文法のことではなく、そのチームなどの中の約束事としてどのような書き方で行うかを定めるもの。 項目の例として、関数や変数の命名規則、コーディングのスタイル、括弧やインデントの書き方などが挙げられます。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

1回答

1リアクション

0クリップ

2380閲覧

投稿2019/02/07 06:29

編集2019/02/07 06:44

HTML,CSSコーディングの初心者です。
非コーダーのデザイナーでしたが、勉強を始めています。

見られればいい、という程度のコーディングはできるのですが、
運用視点をもった「CSS設計」をした経験が全くないため、ステップアップしたいと思っています。

「CSS設計の教科書」という本を読み、BEMやFLOCSSなど様々な設計手法を知りましたが、
ぼんやり概念は理解できても、「で?どうすりゃいいんだ?」という感じ。

具体的な練習パートがないため、個人で試して見ても合ってるのかもわからなくて
実用イメージや練習方法が浮かびません(白目)

「あなたのPJに合わせて最適な方法を選ぼう」となってますが、
どんな状況において、何が最適なのかもさっぱりで、立ち往生しています・・・(絶望)

そこで、CSS設計の思想をつける上で皆さまが実践された
①練習方法
②参考文献や、URL

など、ありましたらぜひ教えていただきたいです。

当社古い会社で、先輩もあまり最新の知識に明るくなく、
事業会社なので頻繁に試せる機会がないので個人で勉強しようと思っています。
ひとまず、FLOCSSに則って何か作ってみようかと思っています。。。

bochan2👍を押しています

以下のような質問にはリアクションをつけましょう

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

リアクションが多い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

気になる質問をクリップする

クリップした質問は、後からいつでもマイページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

下記のような質問は推奨されていません。

  • 間違っている
  • 質問になっていない投稿
  • スパムや攻撃的な表現を用いた投稿

適切な質問に修正を依頼しましょう。

maisumakun

2019/02/07 06:38

CSSが「波状」になるという状況は、意図的にやらないと想像できないのですが…どのようなシチュエーションでしょうか。
Ebrick

2019/02/07 06:47

すみません 波状→破綻 の間違いです いわゆる、スタイルの上書き合戦、コード重複、使い回しできない、など 無駄に運用コストがかかる状態になってしまうことを言っています
m.ts10806

2019/02/07 06:47

過去質問に似たようなものがあったような。CSSの設計の話だったはず。
m.ts10806

2019/02/07 06:48

上書き合戦、コード重複はまた本件とは違う話になりそうに思いますが。

まだ回答がついていません

会員登録して回答してみよう

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
87.20%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

同じタグがついた質問を見る

Sass

Sassは、プログラミング風のコードでCSSを生成できるスタイルシート言語です。 scss ファイルを、変換(コンパイル)してCSSファイルを作成します。

コーディング規約

コーディング規約とは、コードの書き方についての決め事のことです。 文法のことではなく、そのチームなどの中の約束事としてどのような書き方で行うかを定めるもの。 項目の例として、関数や変数の命名規則、コーディングのスタイル、括弧やインデントの書き方などが挙げられます。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。