令和時代のページネーションを考える - Sweet Escape

2022/10/06 198 users Sweet Escape レスポンス 令和時代 API 実装

今回はバックエンドAPIでページネーションをどうやるかについての話なので、よくある無限スクロールUIのようなフロントエンド側の実装に関する話はしない。あくまでもAPI、もっと言えばRESTfulなAPIのリクエスト・レスポンスにおけるページネーションの話。 本気で深く考えるというよりざっくり検討したときの話です。 ... 続きを読む

iwashi / Yoshimasa Iwase on Twitter: "MS ってREST APIのガイドラインを出していたんだな。全く知らんなかった。ページネーションを表現するのにどうやって返したらいい、みたいは話も書いてあって

2022/07/13 16 users REST ガイドライン REST API https t.co

MS ってREST APIのガイドラインを出していたんだな。全く知らんなかった。ページネーションを表現するのにどうやって返したらいい、みたいは話も書いてあって、REST API設計時の参考になりそう。 https://t.co/wfiZkWxiAW 続きを読む

便利なのが登場！ Tailwind CSSで実装されたOSSのUIコンポーネント集 -FlowBite

2021/11/15 13 users OSS コンポーネ ナビゲーションバー UIコンポーネント集

Webサイトやスマホアプリでよく使用されるUIコンポーネントをTailwind CSSのユーティリティクラスで実装したオープンソースのライブラリを紹介します。 Tailwind CSSには、コンポーネントの基本セットがありません。FlowBiteではナビゲーションバー、カード、ボタン、ページネーション、フォームなど基本的なコンポーネ... 続きを読む

React、Angular、Vue対応、高性能なテーブルを実装できるシンプルで軽量のJavaScriptライブラリ -Grid.js | コリス

2020/07/15 187 users JSON React angular Preact コリス

高性能なテーブルを実装できる、シンプルで軽量のJavaScriptライブラリを紹介します。HTMLテーブル、ページネーション、検索機能、ソート機能、XMLやJSONからインポートなどに対応しています。 React、Angular、Preact、Vueなどの主要なフレームワークのプラグインとして動作するだけでなく、フレームワークなしのバニラ... 続きを読む

らくだ?にもできるRailsチュートリアル｜10.3 | らくだ?のさいと

2020/02/23 6 users Railsチュートリアル inde Pagination

10.3 すべてのユーザーを表示する indexアクションを追加してユーザー一覧を表示させる →データベースにサンプルデータを追加する方法 →ページネーション（pagination=ページ分割）の方法 見本はこちら　→　RoRT本文 10.3.1 ユーザーの一覧ページ ユーザーindexページはログインユーザーしか表示できないようにする inde... 続きを読む

テストの可読性と保守性を改善したいよねって話 - Qiita

2019/12/20 11 users Total Qiita size 関数 題材

この記事は NIJIBOX Advent Calendar2019 の20日目の投稿です。 背景 この記事は「仕様の変更に強いコードを書きたいよねって話」のテストについて掘り下げたお話になります。 題材は「ページネーションにおける関数」です。 ※ 以下currentは現在いるページ、totalは総ページ数、sizeはページネーションの表示するページ... 続きを読む

独創的なページネーションのコードスニペット８選 | UX MILK

2019/03/06 59 users UX MILK コードスニペット Eric 著者 翻訳転載

Ericは20年以上の経験を持つWebデザイナーです。『Your Guide to Becoming a Freelance Web Designer』の著者でもあります。 この記事はSpeckyboy Design Magazineからの翻訳転載です。配信元または著者の許可を得て配信しています。 8 Code Snippets to Make Your Pagination Pop （2018/10/15） ページネーションはデ... 続きを読む

Vue.jsベースのオープンソースUIコンポーネントフレームワーク・「Vuesax」 | かちびと.net

2018/09/07 54 users スライダー グリッド コンポーネント タブ Vue.js

Vuesax VuesaxはVue.jsベースのUIコンポーネントフレームワークです。Vue.jsを使ったアプリケーション開発をサポートしてくれます。カラースキームやグリッド、フォーム、タブなどの基本UIはもちろん、スライダーやカード、ページネーションなども用意されており、それぞれのコンポーネントではさらに細かなスタイルを選... 続きを読む

WordPress：get_the_posts_pagination()をカスタマイズして、現在のページ数と全ページ数を表示させる方法 | NxWorld

2018/04/13 14 users デフォルト プラグイン NxWorld 機能 記事一覧

WordPressで記事一覧などにページネーションを設置したい場合、特別な機能など必要なければプラグインなどを使用しなくても get_the_posts_pagination() （単純に出すだけなら the_posts_pagination() ）を使うことで表示させることができますが、これをもう少し自分好みにカスタマイズして表示させる方法です。 ここではデフォルトだとスクリーンリーダー用テキス... 続きを読む

Google、モバイル検索のページネーションを廃止。「もっと見る」による無限スクロールへ変更 | 海外SEO情報ブログ

2018/04/11 73 users 無限スクロール 廃止 Google モバイル検索 変更

[レベル: 中級] 無限スクロールのモバイル検索結果を Google は導入しました。 「次へ」でページネーションして2ページ目、3ページ目に移動するのではなく、「もっと見る」で続きの結果が出現します。 正式導入 「もっと見る」による無限スクロールのモバイル検索結果は 昨年12月にテスト していたことが確認されています。 しかし今回はテストではなく、正式導入になります。 Google 検索の Tw... 続きを読む

ページネーション構成ではnoindexを使える。ただしクロールバジェットの節約には役立たない | 海外SEO情報ブログ

2017/08/18 13 users noindex オフィスアワー クロールバジェット 一連 上級

[レベル: 中〜上級] ページネーションしている一連のページの集まりで、2ページ目以降を noindex にすることに問題はない。 ただし、noindex にしてもクロールバジェットの節約には役立たない。 Google の John Mueller（ジョン・ミューラー）氏は、 英語版のオフィスアワー でこのように説明しました。 ページネーションで noindex を利用可能 ページを分割している、... 続きを読む

モバイルファーストインデックスについてGoogleに何でも聞いてみた #inhouseseo ―― 内部リンクの評価は? 導入時期は? 分割数が異なるページネーションは? など | 海外SEO情報ブログ

2017/02/12 248 users inhouseseo モバイルファーストインデックス 評価

In-house SEO Meetup が主催した Google MFI Night で、Google社員にさまざまな疑問を質問するAMA with Google セッションを 先週金曜日の記事でレポート しました。 日本語検索独自の品質評価アップデートがテーマでしたが、このイベントのメインテーマは モバイル ファースト インデックス (MFI) です。 当然AMAもMFI関連の質問が大部分を占め... 続きを読む

scrollMonitor - 大量のデータもスムーズにスクロール MOONGIFT

2017/01/06 21 users DOM スクロール 自殺行為 業務要件 Webブラウザ

Web上で大量のDOMを表示するのは自殺行為です。Webブラウザの動きがガクガクになったり、フリーズしてしまったりします。そのためページネーションが使われるのですが、業務要件として全データの表示を求められることは多々あります。 そんな時にはscrollMonitorを使ってみましょう。大量のデータであってもスムーズなスクロールが可能になります。 scrollMonitorの使い方 利用例です。実際... 続きを読む

ページネーションのベストプラクティス | デザイン | POSTD

2016/06/21 584 users POSTD ベストプラクティス アプリケーション 現状 要素

Webサイトやアプリケーションで軽視されがちな要素の1つに、ページネーション・コントロールがあります。最適なページネーションを作成するのは実は非常に簡単ですが、それを実現できているサイトやアプリケーションはあまり多くないのが現状です。優れたページネーションについて分析し、ベストプラクティスを考えていきます。画像著作権：codyhouse Webサイトやアプリケーションで軽視されがちな要素の1つに、... 続きを読む

jQuery-KingTable - 業務システムに使えそうなテーブルライブラリ MOONGIFT

2015/11/26 56 users MOONGIFT フィルタリング ソート Webベース 要望

Webベースで業務システムを構築した場合、必ず必要になるのが一覧表です。そして、そこにExcel並の機能が求められます。ソートであったり、フィルタリング、ページネーションが欲しいと要望が出るはずです。 それらを一から自作するのは大変です。そこで今回はjQuery-KingTableを紹介します。 jQuery-KingTableの使い方 jQuery-KingTableのデモです。ページネーション... 続きを読む

[JS]ありそうでなかった！スクロールエフェクトのベースになるさまざまな値を取得するシンプルな超軽量スクリプト -roll.js | コリス

2015/11/19 163 users エフェクト スクロール スクリプト しん ポジション

縦長ページのスクロールを利用したエフェクトに必要なさまざまな値、スクロール量、ポジション、ページネーションなどを正確に取得することに特化された超軽量（3kb gzip）のスクリプトを紹介します。 作者様曰く、これ系のシン...記事の続きを読む 続きを読む

ページネーションしたページはnoindexにすべき？ rel=“prev/next”とnoindexは併用可能？ | 海外SEO情報ブログ

2015/09/16 51 users noindex オフィスアワー Prev rel NEXT

[レベル: 上級]ページネーション（ページ送り）したページには noindex robots metaタグを記述したほうがいいのでしょうか？ また、rel=”prev”とrel=”next”を設定しているページにnoindexを記述しても問題ないのでしょうか？9月11日のオフィスアワーで、GoogleのJohn Mueller（ジョン・ミューラー）氏がこの質問に回答しています。 質問者: ページネ... 続きを読む

div、table、ulリスト等にソート、ページネーション、フィルタ機能を追加できる「jPList」:phpspot開発日誌

2014/06/17 61 users table div overview インタフェース ソート

div、table、ulリスト等にソート、ページネーション、フィルタ機能を追加できる「jPList」 2014年06月17日- Overview | jPList - jQuery Data Grid Controls div、table、ulリスト等にソート、ページネーション、フィルタ機能を追加できる「jPList」。 div、table、ulなどで列挙されたデータに、次のようなインタフェースを... 続きを読む

WordPress：覚えておいて損はない、開発者向けプラグイン 25＋ | NxWorld

2014/03/18 354 users WordPre NxWorld 表向き 見栄え ご存じ

WordPressには便利なプラグインが沢山あり、それらを使うことであまり知識がない方でも様々な機能を実装して自分好みのブログやサイトを作ることができます。ソーシャルボタンやページネーションを簡単に設置できたり、関連記事や人気記事を手軽に表示できるといったような見栄えを変えたりするユーザー向け（表向き）の機能を実装するタイプのプラグインはよく見かけるのでご存じの方も多いと思いますが、WordPre... 続きを読む

クールなページネーションを実装できるjQueryプラグイン「simplePagination」:phpspot開発日誌

2013/10/23 33 users JSベース jQueryプラグイン phpspot開発日誌

クールなページネーションを実装できるjQueryプラグイン「simplePagination」 2013年10月23日- simplePagination.js - A simple jQuery pagination plugin and 3 CSS themes. クールなページネーションを実装できるjQueryプラグイン「simplePagination」 次のようなクールなJSベースのPa... 続きを読む

PCサイトとモバイルサイトのページ分割が一致しないケースのアノテーションの付け方 | 海外SEO情報ブログ

2013/07/04 23 users アノテーション alternate モバイルサイト rel

[対象: 上級]この記事では、PC向けサイトとモバイル向けサイトのページネーション（ページ分割）が一致していないときの、rel=”canonical”とrel=”alternate”のアノテーションの付け方を説明します。先月参加した SMX Advanced 2013で Google の Maile Ohye（マイリー・オイェ）氏のセッションで聞いた内容です。PCとモバイルでページネーションが一致... 続きを読む

これは超使いやすいページネーションの次世代UI:phpspot開発日誌

2012/12/24 347 users phpspot開発日誌 要件 前後 基本 リストページ

Slider Pagination Concept - with jQuery UI Slider これは超使いやすいページネーションの次世代UI。 普通、リストページのページネーションといえば、「 1 , 2, 3, 4 ,5 次へ> 」みたいなUIが基本ですが、そもそもこのUI疑ってかかってもいい時期なのかも。 要は現在のページ番号と、ページを前後と、ページ指定で送れればいい、という要件を満た... 続きを読む

タブやページネーションを簡単に実装できる！超軽量のJqueryプラグイン「vanity」 | 株式会社LIG

2012/12/14 87 users vanity イージング スライダー jQueryプラグイン

お疲れ様です、ももこです。 今回はタブやツールチップ等、ちょっとした動きをつけるのに便利で超軽量なJqueryプラグイン「vanity」をご紹介します。 jSlider – スライダー デモページ ナビとページ遷移のついた基本的なスライダー、速度やイージングも調整がききます。 jTabs – タブ デモページ コンテンツの切り替えによく使われるタブ。簡単にアニメーションがつけられるのが個人的に気に... 続きを読む

電子書籍でページめくりが最も高速な訳 | HMDT Blog

2012/12/11 33 users HMDT Blog 電子書籍 槍玉 廃刊 daily

電子書籍でページめくりが最も高速な訳電子書籍、特に現状の電子書籍に対して批判的な文脈では、ページめくりアニメーションが何かと槍玉に上げられる。いわく、意味なく紙の模倣をしている、無駄に遅い、スクロールの方が電子的だ、など。最近だと、Dailyの廃刊にあわせて取り上げられたりとかね。 ページめくりvsスクロールは、2つの対立軸がある。1つめは、ページネーションを行うか否かだ。紙の本は、その昔にあった... 続きを読む

WPのプラグイン、WP-PageNaviのちょっと役にたつ情報。 | プログラマブログ | 株式会社LIG

2012/10/24 28 users バルログ 株式会社LIG プログラマブログ プラグイン 実装

こんにちは、小林です。 私はストリートファイター4ではバルログというキャラを使っているわけですが 今回はwordpressのプラグイン、WP-PageNaviについて書きます。 WP-PageNavi とは？ WordPressでページネーションの実装を強力にサポートしてくれる素晴らしいプラグインで、下記のURLからダウンロードできます。 WP-PageNavi その影響たるや、大正義。 これがあ... 続きを読む