自分の経験をシェアしたい。Webデザインのテクニック&効率化。
投稿日：
最近はスマホサイトだけでなく、PCサイトにも使われるようになったハンバーガーメニュー。
そんなハンバーガーメニューの動きのサンプルを紹介した「Tasty CSS-animated hamburgers」。
３本の線だけで多彩な動きが紹介されています。
気持ちのいい動きは、時にはリッチなアニメーションよりも、サイトの印象をよくします。
データもダウンロードできるので、CSSアニメーションの勉強にもなりますね。
執筆者：KIYOTA
関連記事
【CSS/JS】もっと目立たせて欲しいと言われた場合のTipsまとめ
キャンペーンサイトなど、動きをつけて、もっと目立たせて欲しいなどの要望を受けることは多いのではないでしょうか。言われて探すのは結構手間がかかったりします。見栄えする動きを中心にまとめました。 Phot …
最近は、SASSを使えば、フォントサイズをpxからem/%に変換するのは簡単です。 しかし、以前作ったサイトを更新する際に、フォントサイズの一覧がない場合は、pxからem、%に計算するのが面倒です。 …
CSSで一番迷うのが、ネーミングです。 初心者はクラス名を、その場その場で考えがちで、後から破綻しがちです。 頭の中でなんとなく決めていても、やはり破綻してしまいます。 更新や改修をかけていくうちに破 …
WordPressに自動でBootstrapのレスポンシブのテーブルのクラスを適用する
WordPressにBootstrapのレスポンシブのtableクラスである、table-responsiveを適用する方法です。 jQueryを使うことで、ソースを扱わずに済みます。 $(funct …
3分で設定完了。コピペでできるgulpでCompassのコンパイル
gulpでCompassのコンパイルを、コピペで済ますようになって、最初の設定が3分で済むようになりましたので、いつもやっている手順を紹介します。 2017/10/16 browser-sync追記 …
2022/08/15
Webデザイナーが残業代をもらっていたら、いくらになったのか？
2022/06/12
2022/02/06
2018/10/11
Webデザイナーで、転職がうまくいかない場合のひとつの方法として
2018/08/18