Qiita アップデートのお知らせ - 2024年9月

![Qiita アップデートのお知らせ - 2024年9月](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/88/5295f77c-88e9-959b-9766-c0c0ab401d65.png)

## はじめに

Qiitaでは、エンジニアのみなさんからの声をもとに、日々開発を続けています。
この記事では、2024年9月にリリースした内容を紹介します。

Qiitaでアップデートやバグ修正をリリースしたら、[リリースノート](https://qiita.com/release-notes)、[Qiita 公式X（Twitter）](https://twitter.com/Qiita)、[Qiita Blog](https://blog.qiita.com/)でお知らせしています。

また、Qiitaへの質問や機能の要望などがありましたら、[Qiita Discussions](https://github.com/increments/qiita-discussions) へご投稿ください。

## 通知をカテゴリーごとに確認できるようにしました

![通知一覧ページのスクリーンショット。変更後は「すべて、コメント・メンション、編集リクエスト、アドベントカレンダー」のタブが追加されている](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/88/354759a0-9a5c-ce07-61e8-4e0374b1bca4.png)


2024年9月11日 リリース

[通知一覧ページ](https://qiita.com/notifications?utm_source=qiita&utm_medium=release_notes&utm_campaign=notifications_20240911)で通知をカテゴリーごとに確認できるようにしました。

- 「すべて」、「コメント・メンション」、「編集リクエスト」、「アドベントカレンダー」のカテゴリーごとに通知を確認できるようにしました
- 1ページあたりの通知の表示件数を10件から20件に変更しました
- 通知の種類ごとにアイコンを追加しました

## アドベントカレンダーページのアクセシビリティを改善しました

11月1日のページオープンに向けて、[アドベントカレンダーページ](https://qiita.com/advent-calendar)のアクセシビリティ改善を行っております🎅🎄

### ヘッダーのドロップダウンメニューの改善

![アドベントカレンダーページのヘッダーのスクリーンショット。ドロップダウンメニューが開いている。](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/88/633df9b6-41a2-45cd-0f01-5ad2bccdbbb5.png)

2024年9月17日 リリース

[アドベントカレンダーページ](https://qiita.com/advent-calendar)のヘッダーのドロップダウンメニューで以下の改善をしました。

- ドロップダウンの開閉の操作を見直しました
  - ボタンをクリックか `スペースキー` でドロップダウンを開くことができます
  - ボタンをクリックか `スペースキー`、またはドロップダウンを開いているときに `Escapeキー` かドロップダウン外をクリックでドロップダウンを閉じることができます
- ドロップダウンを開いた時に、ドロップダウン内にフォーカスが移動するようにしました
- 上下キーでドロップダウン内を移動できるようにしました
- ドロップダウン内でフォーカスがループするようにしました

### ランキング・カレンダー一覧ページの改善

![カレンダーランキングページのスクリーンショット。サイドバーにランキングカテゴリーのナビゲーション、メイン部分にカレンダーのリストが表示されている。](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/88/7c5572cb-bee1-f43f-12cb-61ef990f8e7d.png)

2024年9月17日 リリース

アドベントカレンダーのカレンダーランキング・カレンダー一覧ページで以下の改善をしました。

- ナビゲーションに`nav`タグを使用するように変更しました
- 見出しレベルが適切でなかったため、見直しました
- 「いいね」のアイコンに読み上げがなかったため、「いいね数」と読み上げるようにしました
- カレンダーの登録数が「5 スラッシュ 25」のように読み上げられてしまうため、「25日中5日登録済み」のように読み上げるようにしました
- カレンダー詳細ページへ遷移するリンクに読み上げなかったため、追加しました

### カレンダー詳細ページの改善

![カレンダー詳細ページのスクリーンショット。変更後は一部テキスト・アイコンの色が濃くなっており、参加者募集フォームに「ユーザーを招待する」というラベルが追加されている](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/88/c277726c-fe8d-003c-5bb6-f1b665ba7b95.png)

2024年9月13日 リリース

アドベントカレンダー詳細ページで以下の改善をしました。

- 一部テキストのコントラスト比が低かった箇所をAA基準を達成できるように変更しました
- 参加者募集フォームにラベルがなかったため、ラベルを追加しました
- 見出しレベルが適切でなかったため、見直しました
- 一部アイコンやボタンに適切な読み上げがなかったため、追加しました
  - 「いいね」のアイコンに読み上げがなかったため、「いいね数」と読み上げるようにしました
  - はてなブックマークの`iframe`に`title`がなかったため追加しました

## エディタページのアクセシビリティ改善をしました

![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/88/4142eca5-718f-428d-5c85-8f75c77c5619.png)

2024年9月12日 リリース

エディタページで以下の改善をしました。

- 記事・質問編集時の「本文」「差分」のタブで以下を改善しました
    - タブに関する`role`を追加し、タブであることや紐づいているボタンとパネルが分かるようにしました
    - `aria-selected`を追加し、タブの選択状態が支援技術に伝わるようにしました
    - 左右の矢印キーでタブを移動できるようにしました
- 「スライドモード」「同時スクロール」の切り替えボタンの選択状態が支援技術に伝わるようにしました
- エディタとプレビューを切り替えた際に支援技術に変更を通知するようにしました

本文・差分タブの切り替え | エディタとプレビューの切り替え
:-: | :-:
![「本文」と「差分」のタブ。矢印キーの←キーと→キーで移動できる](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/88/0d0237aa-ace9-8e40-6ddd-c154ed0f4a1b.gif)|![エディタのみ、エディタとプレビュー、プレビューのみの表示が変更された際に変更された事を読み上げられている](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/88/ceead64b-980e-7769-4987-1c23065b58a7.gif)

## ランキングのアイコン表示のアクセシビリティを改善しました

![ユーザーランキングのスクリーンショット。変更後は上位3位までに数字が追加され、アイコンとテキストの色が濃くなっている](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/88/e1c731a8-f1c6-0c38-8be1-8ba12ed37b7d.png)

2024年9月25日 リリース

[ホーム](https://qiita.com/)や[トレンド](https://qiita.com/trend)のタグランキング・ユーザーランキングや、[Organization](https://qiita.com/organizations)のランキングなどで利用している、ランキングアイコンで以下の改善をしました。

- 上位3位までアイコンのみの表示でしたが、数字を追加しました
- 一部テキストのコントラスト比が低かった箇所をAA基準を達成できるように変更しました

## 質問の公開設定のUIを記事の公開設定に合わせました

![質問の公開設定のスクリーンショット。変更後はボタンの位置やテキストが一部変わっている](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/88/20b895c5-f023-9d2b-68ae-ac527abddc8b.png)


2024年9月3日 リリース

記事の公開設定に合わせて、質問の公開設定のUIを変更しました。

- ボタンの配置を変更しました
- フル画面のモーダルウィンドウに変更しました