フローティング型のブログパーツを作ろう
フローティング型のブログパーツを作ってみよう!
今回は、画面全体をFlashで覆うようなフローティング型のブログパーツを作ってみましょう。
前回までの記事では、ブログのサイドバーに表示する小さめのブログパーツについて解説してきました。サイドバーに常駐するブログパーツの場合は、いつでも気軽に情報をチェックできるなど、とても手軽に使うことができます。しかし、どうしてもサイドバーの横幅(通常は160px前後)以内のサイズで制作しなければなりません。
そのため画面全体を使った演出を行い、強いインパクトを与えたい場合などは、今回のようにフローティング型のブログパーツを作ることで、より自由な表現を行うことができます。
制作者にとっては、パーツの大きさの制限がなく画面全体を自由に使えますので、フローティングのブログパーツが魅力的に感じられるかもしれません。しかし、フローティングのブログパーツは、ブログの記事を読みにきた読者にとっては、読みたい記事を隠してしまう邪魔な存在ととらえられてしまう可能性もあります。
それぞれのブログパーツの用途や目的に応じて、フローティング型がよいか、サイドバーの常駐型のブログパーツがよいか、どちらがユーザーに喜ばれるかを吟味して企画を考える必要があります。
またフローティング型のブログパーツを採用した場合は、下記のよう
な配慮を行うこともできますので、検討してみてください。
・常に「閉じる」ボタンを表示し、ユーザーがいつでもブログに戻れるようにする
・初回時のみフローティング表示し、二度目以降はフローティング表示をさせない
とはいえフローティング型のブログパーツは、表示領域が限定されない分、ふだん見慣れているブログページを舞台にして、楽しい仕掛けや驚くような演出を加えることができますので、ぜひユーザーに喜んでもらえるようなブログパーツを考えてみてください。
ブログページ全面を使って時計を表示してみよう!
今回は、「世界のWeb広告賞を総なめにしたアノ時計!」風のサンプルを作成してみました。こちらをもとに、フローティング型のブログパーツについて解説していきたいと思います。
まず、作成するサンプルの仕様について解説します。今回もサンプルデータがありますので、ぜひダウンロードしてください(858_1.zip/378 KB)。
まず、サイドバーにあるバナー(画像)をクリックすると、フローティングでブログパーツが表示されます。
フローティングのブログパーツが表示されている間は、以下のシーンを繰り返します。
・1秒ごとに画面の色が切り替わりながらブログの中央に時計が表れるシーン
・時計表示が消えて元のブログが表示されるシーン
なお今回のブログパーツの制作にあたって、弊社とcshoolが共同で開発・運営している「くるくるパーツ(http://parts.kuru2jam.com/)」のサイトで配布しているブログパーツの制作キットを利用・改造しています。