見出し画像

noteのページ一覧がブラウザの表示幅に追随して表示仕様が途中で変更された

今回のタイトルは、何のこっちゃ?と頭を捻る人がいるかもですが、今日からnoteのクリエイターページの表示仕様が変更されたようですね。

クリエイターページのトップには記事一覧が表示されているのですが、この記事一覧の表示方式が途中で変わるように変更されました。

どういうことかというと、記事一覧をパソコンで表示させるときに、パソコンのモニターに表示されているブラウザーの横幅を狭くしていくと、ある段階から1記事当たりの表示情報が激減するように変更されたようです。

どの段階から表示の仕様が変わったかということがわかるように、記事一覧の表示をスクリーンショットでキャプチャー画像にして貼り付けますね。

まずは一番広い幅でブラウザを表示させているスクショから。

①広い幅で表示させたブラウザでのクリエイターページのトップ


次にこのブラウザの表示幅を少し狭くしたときの表示がこちらです。

②上記のスクショ①を少し狭くしたときの表示がこちら

上記の2つのスクショを見比べると、右カラムの記事一覧表示が、固定記事の一段に続き、二段目が左右に2本の記事が表示されていたのが、固定記事と同じように縦に1つずつの記事表示に変わっています。

固定記事と二段目以降の記事との表示仕様の違いは、記事タイトルと記事の冒頭文が、見出し画像のイラストの右側に表示されている固定記事に対して二段目以降の一般記事は、見出し画像の下部に表示されている点ですね。

さらに、上記の②の表示幅をもう少し狭くしてみると、下記のスクショのように左カラムにあったマガジン一覧が、記事一覧の上部に移り、固定記事の下には3本の記事が横に並ぶのですね。

③ブラウザの表示幅を②よりさらに少しだけ狭くした表示がこちら


上記の③の表示状態はとても際どくて、少しのズレで次の④の表示状態に移行してしまうので、細かい表示幅の調整を必要とします。

なので、もしかしたら、この固定記事下に3本の記事が並ぶ表示状態をご存じない方もおられるだろうと思います。

ちなみにですが、私がバックアップのために記事一覧をEvernoteに保存するときには、この固定記事下に3本の記事を表示させたブラウザの状態で保存するようにしています。(^_^)b

で、次の段階の④がこちらになります。

④前の表示幅である③の横幅をさらに狭くしたときの表示がこちら

③のときの固定記事下の3本の記事表示が、2本に減っているのがおわかりだと思います。

そしてこの状態からさらにブラウザの表示幅を狭くすると、固定記事も固定記事下の一般記事も、見出し画像のサムネイルが右端に変更され、記事タイトルだけで冒頭文が省略された記事一覧に変わっているのですよ。

※ここからの表示が、従来と変わりました。

⑤記事タイトルだけで冒頭文が省かれた表示の状態に


上記の4本の記事に続いて、5本目からの表示はこちら。

⑥ブラウザの表示幅を⑤にしたときの一般記事の表示一覧がこちら

さらにブラウザの表示幅を限界まで狭くしてみると、左右に2列の記事表示だった一覧は、下記のように一列表示に変わります。

⑦もっともブラウザの表示幅を狭くしてみると一列表示に変わります


以上のようにブラウザの表示幅を段階的にスライドさせて縮小すると、⑤のスクショの表示状態から変更になっているのです。

だから何?
って話なんですが、記事一覧が記事タイトルとサムネイル画像だけで見にくくなったというのはあるのですが、表示幅を狭く小さくしたときに盛り込まれている記事の数は、今回の変更により格段に増えたということですね。

そういう点では、何回もスクロールをしなくても一覧で確認できるようになったことで、恩恵を受けるnoterさんも多いのではないかと思います。

今回の話はパソコンでの仕様に限っての話ですので、たぶんタブレットでも同じ仕様だと思いますが、スマホについては検証しておりません。

あぁ・・・・そういうことね、っていう程度で読み流していただければと。


ってことで、今回は
noteのページ一覧がブラウザの表示幅に追随して表示仕様が途中で変更された」というクリエイターページの記事一覧が途中で変わったという話。😄
※見出し画像のイラストは、メイプル楓さんからお借りしました。


では!

カイゼンの  姿勢たたえて  のほほんと


<昨日投稿のメインアカウントの記事がこちら!>


この記事が参加している募集

noteでよかったこと

note感想文

サポート大歓迎です!いただいたサポートは循環させてラッキーサイクルを回そうと計画しています。多くのnoterさんたちと有益な交流が出来るような企画に使わせていただきますので、ぜひ応援をよろしくお願いいたします!(^_^)b