ユーザビリティを意識しながら訪問者を魅了するフッターデザイン論
» つま先まで気を抜かない、フッターデザイン論 :: gerenuk.crazyphoto.org/
Smashing Magazine では、具体的な例を挙げてフッターをどうデザインするべきかという記事が掲載されています。良い記事なのですが例のごとく少し冗長なので、要点をまとめてご紹介します。
フッターに何を配置するべきか
- サイトマップ
- 簡単な「プロフィール（About）」と「連絡先（Contact）」の情報
- 簡易のコンタクトフォーム
- 「このページのトップへ戻る」のリンク
- 詳細なサイトマップページへのリンク
フッターのデザイン性
- デザイン上の主従関係を明確に見せる
- 空白を上手く使う
- 他のコンテンツからデザイン的に分離させる
ブログにおけるフッター
- 最近の記事
- タグクラウド
- 最新のコメント
- 他のサイトへのリンク
フッターのレイアウト
- 余白によるカラム分け
- 境界線によるカラム分け
フッターデザインの参考にしたいサイト
参考
いいですね。非常に参考になります。
このブログ「きにきじ」はフッターが何にもないので、今度気が向いたら手を入れてみようかと思います。
ただ、１つ気になるのが、フッターがそもそも見られないという可能性ですね。
はてなブックマークに以下のコメントがありましたが、まさにそのとおりだと思います。特に無料ブログサービスを利用している場合はフッターに辿り着くことのほうがまれなので、せっかく凝ったフッターがあっても見てくれる人はごくごくわずかかも……？
yamuyam auto pagerize系のユーザスクリプトを考慮すると、フッタにどれくらいコストをかけるべきかどうか悩む 2009/06/23
よろしければ以下の関連（してそうな）記事もどうぞ！
- 最初や最後の行だけ違うスタイルを可能にするJavaScript「yuga.js」
- Gmail画面のGoogle Taskリンクを消すスタイル
- Googleで「AA」を検索すると……Googleロゴの遊び心：Doodle
- 美しいスライドデザインのためにガイドを利用する：複数ガイドの描き方も
- WordPress旧バージョンユーザは脆弱性を突いた攻撃に要注意！
- « 前の記事：「瞬簡PDF ZERO」他クセロ製フリーソフトが公開終了へ
- » 次の記事：自宅で洗えるスーツに注目が集まっているらしい
One Response to “ユーザビリティを意識しながら訪問者を魅了するフッターデザイン論”
Leave a Reply
Bookmarks
Recent Posts
- 組織として成果を挙げるための50＋の問い / 読書『プロフェッショナルの条件：いかに成果をあげ、成長するか』
- 2010年にお世話になった、10個のお薦めGreasemonkeyスクリプト
- 2010年にお世話になった、10個のお薦めStylish用CSS
- 2010年にお世話になった、10個のお薦めFirefoxアドオン（おまけ10個）
- MySQLで3つのテーブルをOUTER JOINする3つの方法を比較してみた
- Amazonへのリンクの横にブクログへのリンクを追加するGreasemonkeyスクリプト「Add To-Booklog Links」を書いた
- RでSEM（共分散構造分析/構造方程式モデリング）
- FirefoxのEvernoteアドオンの設定画面が真っ白になって動かない不具合を解決する方法
- Railsのfindで複数のテーブルから検索する：includeでeager loading
- WordPressでシンタックスハイライト：WP-Syntaxを使ってみた
Popular Posts
- 使い勝手のいい白地図サービス「白地図、世界地図、日本地図が無料」
- 36,917 views
- 指パッチンのやり方・コツ：薬指と小指を握り込まない
- 34,876 views
- PDF 作成ソフト比較：doPDF、PrimoPDF、クセロ 瞬簡PDF ZERO
- 28,440 views
- 「力不足」と「役不足」、「情けは人の為ならず」、「確信犯」など、誤用の多い言葉
- 22,629 views
- Firefoxアドオン「Stylish」の使えるスタイル8選
- 20,816 views
- 便利なFirefoxアドオン10選
- 19,636 views
- ジョジョの奇妙な壁紙画像（＋うろ覚えジョジョ動画）
- 15,808 views
- マイクロソフトオフィスでタブ表示機能が使えるアドイン「OfficeTab」
- 10,446 views
- 気になるフリーソフト19選 – セキュリティ、USB関連、その他便利ソフト
- 9,491 views
- Office 2007 Wordで「標準の文字数を使う」が勝手に「行数だけを指定する」に変更される件
- 8,821 views
Recent Comments
- 指パッチンのやり方・コツ：薬指と小指を握り込まない に Tack @きにきじ管理人 より
- SEO企業のGMOが有料リンクサービスの提供を始めたが…… に Tack @きにきじ管理人 より
- 指パッチンのやり方・コツ：薬指と小指を握り込まない に Tack @きにきじ管理人 より
- 指パッチンのやり方・コツ：薬指と小指を握り込まない に ちぇんちぇん より
- SEO企業のGMOが有料リンクサービスの提供を始めたが…… に 利用しました より
QR Code
- 携帯端末からも同じ URL でご覧いただけます。
![[画像] 今日の気になる記事「きにきじ」QR Code](http://www.kagitaku.com/diary/images/qrcode.png)
Notes
News
Author
Blog Feed
![[画像] きにきじ Feed](http://www.kagitaku.com/diary/images/Newspaper_Feed_128x128_ie6.png)
Categories
Tag Cloud
お金
イタい
ゲーム
シュール
セキュリティ
ツール
デザイン
トヨタ
ネタ
パソコン
ファッション
ブラウザ
ブランド
マナー
マーケティング
メディア
モバイル
ライフハック
事件
仕事
任天堂
似非科学
勉強
動画
報道
2ch
Amazon
Apple
au
Benchmarks
Chrome
DB
docomo
EMOBILE
Firefox
Google
IE
JavaScript
jQuery
LPO
Microsoft
R
Rails
Ruby
SEO
SoftBank
Web
WordPress
WPアップデート
Yahoo!
PR Links
Similar Blogs
Blog Information
(Since June 2009)
![[画像] kagitaku.com ロゴ](http://www.kagitaku.com/common/images/logo.png){kind=logo}
![[画像] 最上部へ](http://www.kagitaku.com/common/images/pageNavi-toTop.png)
![[画像] 最下部へ](http://www.kagitaku.com/common/images/pageNavi-toBottom.png)
![[画像] 履歴を戻る](http://www.kagitaku.com/common/images/pageNavi-back.png)
![[画像] 履歴を進む](http://www.kagitaku.com/common/images/pageNavi-forward.png)
![[画像] Contact](http://www.kagitaku.com/common/images/pageNavi-contact.png)
![[画像] Sitemap](http://www.kagitaku.com/common/images/pageNavi-sitemap.png)
ユーザビリティを意識しながら訪問者を魅了するフッターデザイン論 | きにきじ – http://www.kagitaku.com/diary…
ブックマーク
» このコメントを引用してコメントする