ページネーションの「最後の」ボタンをどうするか？
多数のリストと検索結果ページで使用 First そして Last リンクのスタイル << そして >>。ほとんどの場合、 Last ボタンも一番右のボタンで、使い勝手は良いと思われます。
通常は次のようになります。
download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム
私は個人的にこの取り決めが嫌いです。どうして？すべてのケースの90％で、必要なのは Next ボタン。フォトギャラリー、検索結果、表など。頻繁に必要になる場所を考えることができる1つのケース Last ボタンはインターネットフォーラムにあり、最後のエントリにすばやくジャンプしたい...
上記の配置により、 Next ボタンは他の要素の間に挟まれているため、識別もクリックも困難です。現れる Next よりも体重が少ない Last。
確かに、論理的に Last 取って代わる Next、それがその後に配置される理由です。しかし、それは（私の意見では）認知負荷の増加を犠牲にしています。
これは本当に「使い勝手が良い」と言えるのでしょうか？
まさに、この特定の種類のページネーションは私に何度も混乱を引き起こしたと思います。しかし、それはすでに住民によって適応されています。
私は以下のようなものを提案します
ここで実際に起こっていることは-
それは明らかに前/次を非常に目立たせ、混乱を引き起こしません。
ページ番号では、3つのドット（...）の後に最後の2つのページ番号が続き、ページネーションが200まではっきりと表示されます。ユーザーが最後のページに移動したい場合は、200をクリックするだけです。
非常に線形で混乱のないUX
お役に立てれば。
選択リストによるページ分割
管理可能なページ数がある場合：
- 現在のページ番号を表示します（
selectedのoption属性） - ワンクリック後に最後のページ番号を表示します（重要な場合は、選択リストの横に追加することもできます）
- 任意のページに直接ジャンプできます（最初と最後を含む）
- ボタンの2つのセットを混同しないでください（最初/最後および前/次）
入力フィールドによるページ分割
多数ページがある場合にもうまく機能します：
- 現在のページ番号を表示します（デフォルトは入力フィールドの
value） - 最後のページ番号を表示します（クリック可能にすることもできます）
- ページ番号を入力することにより、任意のページに直接ジャンプできます
- ボタンの2つのセットを混同しないでください（最初/最後および前/次）
（両方の方法をコンボボックスと組み合わせることができます。）
必要なページに直接移動できるように、URLバーに入力することがよくあります。ユーザーが直接ページを入力できる入力ボックスは、UXと使いやすさを大幅に向上させます。
現在のページ番号（アクティブとして表示されているページ）をクリックするとcontenteditableが回転し（必ず自動ハイライト表示されます）、ユーザーに番号を入力してヒットさせることができます Enter。 Dinesh Golaniの答え のようなこともでき、...は、以下の私の（醜い）クイックモックアップのように、入力ボックスを備えています。
このようにオプションを挟むことにより、ユーザーは自分の位置と動きの方向を精神的に感じることができます。 [次へ]ボタンと[最後]ボタンの位置を逆にすると、直感に反します。
各シナリオは、ユーザーの考えられるアクションと表示している情報に応じて異なります。検索結果が多くのページにまたがる場合、おそらくより優れたフィルタリングシステムを使用して結果を制限し、ユーザーによる追加の作業を防ぐことができます。複数の列が表示されている場合、（並べ替え）結果の均等な並べ替えを実装できます。
シナリオのように、次のページに移動したいだけの場合は、無限スクロールの方がよいオプションです（tumblr.comなど）。しかし、多くの場合、小さくなく使いにくいアイコンがページに明確に定義されている場合は、一般的なページングオプションが適切に機能します。
箱から出して考える：
まず、ページネーションで何をするかを検討する必要があります。
これらはほとんどのケースをカバーすると思います：
- 「ファイン」ナビゲーション：次/前のページに移動
- 「粗い」ナビゲーション：最初/最後のページに移動し、多数のページを前後に移動します
- 現在のページと合計ページを示します
では、ページ編集にスライダーを使用するのはどうでしょうか。
[ < prev ] [=================================[~~~]-------------------] [ next > ]
^
{ page 10 / 14 }
- nextおよびprevは、細かいナビゲーションを可能にします
- スライダーを左端または右端までスライドさせると、最初または最後のページに移動できます。スライダーをドラッグするか、バーに沿ってクリックすると、大まかなナビゲーションが可能になります。
- マウスボタンまたはタッチスクリーンで押したままにすると、正確なページ番号のポップアップが表示され、スライダーの位置がおおよそどのページにあるかを示します。
長所：
- 視覚的に魅力的です。
- 画面上の数字は多くありません。
- 次/前のページのための簡単な（比較的大きい）ボタン。
- 単一矢印と二重矢印との混同はありません。
短所：
- 一般的には使用されていません
- タッチスクリーンデバイスでは使いにくい場合があります。
- タッチスクリーンデバイスのツールチップを配置するのが難しい場合があります。
編集
前後関係によっては、前へ/次への矢印のみの使用は避けたいですが、簡単にクリックすることはできません。また、次の/前のボタンを一貫した場所に配置して、すばやく次のクリックができるようにしてください。次/前より説明的な単語を使用することも検討してください：（例：ページのソート方法に応じて、新しい/古い;安い/高い;など）
私はhildredの答えが好きで、2つの行の間にセパレーターと使いやすさのために入力ボックスを配置します。また、下部で10％の丸めのステップが好きです。ちょうど別のアイデア。以下のように表示するには、適切なロジックが必要です。
[編集]
Androidキーボードのように、ページ番号の上にカーソルを置いたときにのみ下の行を表示し、その後は下に表示しないのがクールです。
ページ1/100
1 2 3 >
[ or enter page ]
10 20 30 >>
ページ66/100
< 65 66 67 >
[ or enter page ]
<< 70 80 90 >>
99/100ページ
< 98 99 100 >
[ or enter page ]
<< 80 90 100 >
別のアイデア：
Prev 1 2 3 Next
First 99 100 Last
多少の作業が必要ですが、<a rel=next>または<rel = next>を忘れないでください
私はまた、このように表示されるページネーションを見ました：
前へ1 2 3 4 5 ... 10 11 12 ... 18 19 20次へ
〜各番号は、前および次とともにクリック可能です。
〜中央に記載されている数字は、ユーザーが合計ページ数の中央に到達するのに役立ちます。この例では20です。
〜ユーザーは実際に結果の最初、中間、最後に非常に簡単に移動できます。
〜認知負荷も適切な量です。
ここで最初のセットには5つの数字が含まれていることに注意してください。これにより、ユーザーはこれらのページの関連性が高いと想定して、5番目のページまで簡単に進むことができます。
下のバーのアプローチにより、数値を特定するのが難しくなっていると思いますか？私はそうは思いません。
完全な開示：PDF-XChange Viewerを作成している会社では働いていません。
私は http://www.kuantokusta.pt/ サイトのアプローチが好きです：最初または最後のボタンはまったくありません。検索すると表示されます。または、検索例のリンクを提供します。 http://www.kuantokusta.pt/search?q=ténis&pag=11 。
下にスクロールすると、すべてのページ番号が丸みを帯びた四角形として表示され、より一貫性のあるエンティティとして表示され、ページの横で誤ってクリックするのを防ぐことができます。そのため、これらのアイテムの1つにカーソルを合わせると、背景が異なります。
この「ページナビゲーションバー」は画像で確認できます。
リストが現在ソートされているのでリストの最後にあるアイテムを表示したい場合、LASTを使用すると、Zの位置に来るまですべてのページをクリックするのではなく、すばやくアクセスできます。一部のUIでは、並べ替えと逆並べ替えができますが、すべてのUIでできるわけではありません。
それは私の頭の上にある唯一の「使いやすさ」です。