[Web制作日記#10]CSS設計完全ガイドを6割ぐらい読んだ
日記を書き始めて10日目が経過しました!(個人的な体感は、30日ぐらいなんやが…笑)
そんな今日は
CSS設計完全ガイドを6割ほど読んだので、中間報告
をする記事にしますね。
また、日常ネタとして「時間とツールの見直しをした」って話もするつもりですよー!
興味がある人は、ぜひ最後まで読んでいただけると嬉しいです。
CSS設計完全ガイドを6割ほど読んだ
↑の本を6割ほど読み終えました。
中間発表的な感じで、
- (忖度なしの)正直レビュー
- ちょいアウトプット
の2つを書きます。
結論から言うと、「普通に難しいけど、網羅性や実例があって丁寧」な本ってのが途中までの感想で、割と評価高め?です。
それでは、レビューからいきましょう↓
(忖度なしの)正直レビュー
お堅い、普通に難しい笑
まず、本を開いて、パラパラめくって思ったのが
あ〜こいつは難しいやつやな〜笑
そして、実際に本を読んでみると案の定難しくて、横文字も結構並んでます。(一度置いてかれると、大変です…)
どの辺が難しいかというと
- 一番は横文字が多くて、取り残されること
- 文章量が多い
- 内容が詰まってる
などが挙げれます。
とはいえ、難しいのはデメリットだけじゃなくて、良い面もあると思います。以下では、どっちかと言えば良い点を書きますね↓
網羅性とかは星5
まず、何よりも
網羅性があって、これ一冊仕上げたら良いのが伝わってくる
です。さすが、「完全ガイド」とタイトルにつけるぐらいですね。
また、網羅性があるので辞書的な使い方をしても良いなと…
僕、一応エンジニアとして実務も積んでるのでわかるのですが、網羅系の本は「大事な部分を抜き取る力」が必要と思ってます。
なぜなら、網羅系と言いつつ
- よく使うのは2割ぐらい
- 同じことを繰り返してる
ような本が多く、この本もそんな印象を受けましたね。
この本につられて僕もお堅いことを言ってますが笑、大切なことかな〜と思って共有してみました!
実例付きでわかりやすい
この本、割と実例の部分が多くて
- 最初に理論を解説して
- 実務でどうやって使うか?を丁寧に解説する
ような構成の本でした。
僕、最初の理論が全然わからないまま進んでいたのですが、さすがに実例ばっかり見ていたらなんとなくわかってきました。
そして、ちゃんと理論の部分を読み返したら…
え?スイスイわかるんですけど?
って感じになりました。
また、BEMという技術がこの本のミソだと思ったので、忘れないうちにちょいアウトプットしておきます↓
ちょいアウトプットしてみる
CSS設計の手法の一つにBEM(ベム)というのがありまして、個人的に好きなのとよく使われてるみたいなのでアウトプットします。
BEMを構成する要素の全体像は
- Block
- Element
- Modifier(モディファイア)
- (プラス)Mix
という3+1で構成されています。
なんか、よくわからん英語が並んでるぞ
と思った人、完全に本を読み始めた頃の僕と同じです笑
それぞれを簡単に解説すると
- Block→他でも使いまわせる要素の塊
- Element→Block内でしか使えない要素
- Modifier→BlockやElementの状態を説明する
- Mix→レイアウトを整える
って感じで、文字じゃ難しいのですが割とシンプルですよ。
また、BEMには命名規則があります↓
block-name__element-name_modifier-name
・BlockとElementの間に_が2つ
・ElementとModifierの間に_が1つ
・名前の間には-が1つ
って感じになるよ!
MindBEMbingという命名規則なら、「ElementとModifierの間に–が2つ(+キーを省略)」っていうのがあるみたいです。
プロジェクトに応じて使い分けしながら、BEMを使いこなしていきたいですね!
時間・ツールの見直しをしたよ
日常ネタなのですが「時間・ツールの見直し」を時間をとってやりました。
時間の見直し
僕いっつも
時間がない…時間がない
と言ってる割に、無駄な時間が結構多かったので。
具体的にやったことは
- 現状の時間の使い方を洗い出して
- 無駄な時間を削減する
っていう、シンプルなやり方をしました。
その結果として
- Youtube見るのやめた
- Googleアプリを削除した
- 通知見る時間を少なくした
などを行ったのですが、Youtube見るのをやめるのが8〜9割で効果抜群です。
自分の意思で使ってない時間はお金もそうですが、削除するのがおすすめです。(精神的にも穏やかな日常になりました)
ツールの見直し
使用しているツールをうまく使えてない感じがあったので、時間のついでにツールも見直すことにしました。
主に見直したのが「タスク・スケジュール管理」で、最終的に
- メモ帳→1日のやることを朝に書く
- Chatwork→仕事関連のタスクを入れる
- Googleカレンダー→個人のタスク・複合スケジュール
という感じにしました。
これでうまくタスクを管理できると良いのですが…比較的忙しくない今から頑張ってやっていきます。
ツールの見直しは以上です!皆さんも参考にしてくださいね・
次回:Youtube見るのやめた効果がえぐい!
次回は「Youtube見るのやめたら…良い効果があった」をテーマに記事を書きます。今日の記事で、時間を見直したので。
仕事の生産性が上がるし、脳がすっきりするし…良いことしかないです。
お楽しみに!
P.S
11話書いたよ↓