Webサイト・スマートフォンアプリ開発に役立つ
デザインパート別記事一覧
Webサイトやスマートフォンアプリの、具体的な設計ルールやベストプラクティスを解説した記事をピックアップしました。各種UI、情報アーキテクチャ、コンテンツ、ビジュアルなど、デザインするパート別にまとめています。
ナビゲーション設計
情報アーキテクチャ
[post_card slug=”20060925_ia”]
[post_card slug=”20101004_alpha-sorting”]
[post_card slug=”flat-vs-deep-hierarchy”]
[post_card slug=”ia-vs-navigation”]
[post_card slug=”ia-questions-navigation-menus”]
[post_card slug=”audience-based-navigation”]
ナビゲーションメニュー
[post_card slug=”mega-menus-work-well”]
[post_card slug=”20101116_mega-menus-wrong”]
[post_card slug=”minimize-global-navigation”]
[post_card slug=”menu-design”]
[post_card slug=”hamburger-menus”]
リンクテキスト
[post_card slug=”980111″]
[post_card slug=”writing-links”]
[post_card slug=”related-content-pageviews”]
[post_card slug=”link-promise”]
[post_card slug=”learn-more-links”]
モバイルナビゲーション
[post_card slug=”support-mobile-navigation”]
[post_card slug=”mobile-navigation-patterns”]
ページ内リンク
[post_card slug=”20060221_within_page_links”]
インタラクション設計
一覧
[post_card slug=”item-list-view-all”]
[post_card slug=”list-entries”]
[post_card slug=”cards-component”]
[post_card slug=”comparison-tables”]
[post_card slug=”20050711″]
検索
[post_card slug=”20010513″]
[post_card slug=”search-navigation”]
[post_card slug=”applying-filters”]
カルーセル
[post_card slug=”auto-forwarding”]
[post_card slug=”designing-effective-carousels”]
[post_card slug=”horizontal-scrolling”]
アコーディオン
[post_card slug=”accordions-complex-content”]
[post_card slug=”mobile-accordions”]
タブ
[post_card slug=”tabs-used-right”]
モーダルダイアログ
[post_card slug=”needy-design-patterns”]
[post_card slug=”modal-nonmodal-dialog”]
エラーメッセージ
[post_card slug=”20010624″]
入力フォーム設計
入力フォーム全般
[post_card slug=”mobile-input-checklist”]
[post_card slug=”slips”]
[post_card slug=”web-form-design”]
選択肢・ボタン
[post_card slug=”20000416″]
[post_card slug=”drop-down-menus”]
[post_card slug=”20040927″]
テキスト入力欄
[post_card slug=”20090623_passwords”]
[post_card slug=”form-design-placeholders”]
日付指定
[post_card slug=”date-input”]
ユーザー登録・ログインフォーム
[post_card slug=”checklist-registration-login”]
ウィザード
[post_card slug=”wizards”]
コンテンツ設計
テキスト
[post_card slug=”9710a”]
[post_card slug=”20050314″]
[post_card slug=”20060828_search-keywords”]
[post_card slug=”20060417_reading_pattern”]
[post_card slug=”20090302_writing-reuse”]
[post_card slug=”mobile-content”]
[post_card slug=”product-descriptions”]
画像
[post_card slug=”20101101_photo-content”]
[post_card slug=”image-focused-design”]
広告・バナー
[post_card slug=”20041206″]
[post_card slug=”20070820_banner-blindness”]
ビジュアルデザイン
レイアウト
[post_card slug=”20080428_navigation-menu-alignment”]
[post_card slug=”20080527_ok-cancel”]
[post_card slug=”fight-right-rail-blindness”]
[post_card slug=”page-fold-manifesto”]
[post_card slug=”layout-vs-content”]
フラットデザイン
[post_card slug=”flat-design”]
[post_card slug=”flat-design-long-exposure”]
[post_card slug=”young-adults-flat-design”]
[post_card slug=”flat-design-best-practices”]
アイコン
[post_card slug=”icon-usability”]
[post_card slug=”icon-testing”]
リンク・ボタン
[post_card slug=”20080513_link-list-color”]
[post_card slug=”clickable-elements”]
配色
[post_card slug=”low-contrast”]