[グラフ] リストタグで簡単にパイチャートを実装できるPizza Pie Charts

リストタグを入力するだけで、ビジュアル感のあるパイチャート（円グラフ）を貼り付けることができるPizza Pie Charts。マウスで%がポップアップするアクション付き。

画像を貼り付けるのではなく、動きのあるグラフが欲しい場合に最適。
導入も簡単（スクリプトをアップロードしてヘッダーで読み込み、HTMLタグを入力するだけ）なのでおすすめ。

[CSS/JS] ウィンドウサイズでフォントサイズを最適化するJS

ウィンドウの横幅（width）によって、font-size と line-height を変更して表示するという、レスポンシブレイアウトでは有効なJS。

最大フォントサイズと最小フォントサイズを指定できるので、これをキッチリと見やすいサイズで指定しておけば、小さくて文字が読めないといった問題は起きません。

ボタンを押してサイドメニューを表示させるサンプルスクリプト。
メニューがスライドする、メイン画面がスライドする、ドアのようにスライドするなど様々なアニメーションエフェクトが用意されています。

PCからスマートフォンまで、画面サイズにより可変するレスポンシブレイアウトでは、このようなサイドメニューが有効なようで多く見られますね。（PCではメニューを表示して、スマートフォンでは隠してボタンをタップするとメニュー表示するなど）

h2, h3, h4 で見出しを付けて、pで本分を書くという良くやるレイアウトのサンプルCSSです。ただ単に見出しを太字で大きくして、少しマージンをとってその下に本分を書くというものから、サイドにレイアウトするものまで様々あります。

参考にしてみるのもよいかもしれません。

ポップアップダイアログ、ボタン、リスト、キャプションなどのアニメーションエフェクトCSSのデモが一覧できるページ。CSSコードなどはSource元で確認できます。