見出し画像

CSS設計

ある程度HTML/CSSをかけるようになったんですが、見やすく綺麗なコードにはまだまだ程遠く、オンラインサロンでも勉強はしてるのですが、なかなか上達しない。

特にCSSで使うClass名を、なんて名前にしようか毎回悩む。

なんとなくつけていると、似たような名前が増えてどこのことをいってるのかわからなくなったり、名前からどんな機能があるか想像できなかったり、修正が必要になると毎回どこか探さないといけないから無駄に時間がかかってしまう。

何かいい方法はないかなぁ〜と思いながらネットで調べた時にこちらの本を見つけました。

画像1


過去に色々な人(名前覚えてなくてすいません)が考案したCSSのコードの書き方が紹介されている。

これだ!と思って早速Amazonで購入。

一度読んだだけなので詳しく説明はできませんが、何種類かCSSのコードの書き方が紹介されていて、その中でもBEMという手法と、著者の半田惇志さんが考案したPRECSSという手法がメインで紹介されてました。

初心者に毛が生えた今の僕には難しすぎましたが泣。

よいCSSとは何か?よいCSSが目指す4つのゴールがある

①予測できる

②再利用できる

③保守できる

④拡張できる

この4つを考えながらCSSを書いていくのですが、考えが深すぎて何度も読み返さないとちゃんと理解できないなぁ〜。

ただ、自分が知りたかったことはこの本に全て書いてありました。後は理解して使いこなせるかどうか。

自分的には著者の半田さんが考案したPRECSS手法がわかりやすかったのでこの方法でCSSのコードを書いていこうと思いました。

正直まだまだまだ全然理解できていないのでしばらくは本を片手にコードを書く日々になりそうです。



この記事が気に入ったらサポートをしてみませんか?