これだけ知っていればcssデザインを最低限いい感じにできる知識

グリッドレイアウト


上記の記事が非常にわかりやすいのですが、cssのグリッドレイアウトを利用する事によって配置での迷いがかなり少なくなるのではないかと思います。

例えば、LPのようにバラバラなパーツを様々な箇所に配置するようなレイアウトを作るのはかなり面倒くさいのですが、グリッドレイアウトを利用すればかろうじて作成する事ができました。

ただ、最近はスマホとデスクトップ両方のレイアウトを両立しないといけないのですが、基本的に何を利用しても単純なページ以外では、双方分のコードを用意しなくてはならないのではないかと思います。

両方のレイアウトを実現するために便利なのは、メディアクエリというものです。

メディアクエリ


メディアクエリは、画面サイズによって、適用するcssを変更できる設定です。
これを知っていないと基本的にレスポンシブレイアウトを作成する事はできないと思います。

逆に知っていればかなり便利な技術であり、
極端な話「display:none」をメディアクエリで利用する事によって、
デスクトップでしか表示しないものと、スマホでしか表示しないものを作ることができます。

cssテンプレホームページ

ボタンのテンプレ


最近では、cssテンプレートを紹介するサイトも増えてきましたが、一番良く利用しているのは上記のサイトです。

非常にシンプルなCSSパーツが整っており、加工がしやすいのが特徴です。

ホームページを作成していて、なんとなくデザインが寂しいなと感じたら、上記のようなサイトを利用すると良いでしょう。

テーブルのテンプレ


テーブルのテンプレもあります。

基本的に、「要素名 css」で検索すると上位にテンプレがでてくるはずなので、それを検索してコピペすると良いでしょう。

おすすめのソフト


ざっと見てみてください。

正直、どんなcssがあるのか覚えてられない…とか、
定型文毎回入力するの面倒くさい…

コーディングを行っていたり、ライティングを行っている場合には、上記のような願いはつきものなのではないでしょうか?

そんな方に非常におすすめのwindowsソフトがあります。

これがあるから、macからwindowsに変えても良いと思う人もいるぐらい便利なソフトです。

筆者が良く利用するブログカードもこのソフトを利用しています。
このソフトを利用すると、「card ;」と入力するだけで、コピーしていたリンクから、ブログカードを作成するコードが入力されていきます。

時間短縮には非常におすすめですし、いちいちめんどくさいコードを覚えなくて済むので便利です。