Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
ヌーラボ‧ウェブサイト課の ⼀年間の取り組みをふり返る
Search
株式会社ヌーラボ
PRO
December 01, 2024
1
690
ヌーラボ‧ウェブサイト課の ⼀年間の取り組みをふり返る
株式会社ヌーラボ
PRO
December 01, 2024
Tweet
Share
More Decks by 株式会社ヌーラボ
See All by 株式会社ヌーラボ
今からでも入れる re:Inventがあるんですか!?
nulabinc
PRO
0
280
ライティングチームだからこそできた、「どことでも繋がれるチーム」づくりの結果 / Technical Writing Meetup vol.38
nulabinc
PRO
0
44
4つの基本的な組織形態を知る ~ミンツバーグの組織論 7つの類型と力学、そしてその先へ~ より GWD in Nagoya
nulabinc
PRO
2
130
必要なのは客観性。組織変革をもたらす、より良い「対話」を生み出すための活動 #scrummikawa
nulabinc
PRO
3
1.1k
悪い実装例から学ぶ ウェブアクセシビリティ改善のヒント
nulabinc
PRO
1
590
ヌーラボカスタマーサクセスチームのBacklog活用
nulabinc
PRO
0
310
言葉で「ヌーラボらしさ」をどう届ける? グローバルチームでコラボレーションする大切さ
nulabinc
PRO
1
110
タスクの可視化は争いをなくす!? 夏休みを乗り切る 宿題プロジェクトマネジメント
nulabinc
PRO
2
280
情シスの申請業務におけるBacklog活用術
nulabinc
PRO
0
330
Featured
See All Featured
Done Done
chrislema
181
16k
Product Roadmaps are Hard
iamctodd
PRO
49
11k
No one is an island. Learnings from fostering a developers community.
thoeni
19
3k
YesSQL, Process and Tooling at Scale
rocio
169
14k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
229
52k
Unsuck your backbone
ammeep
669
57k
Measuring & Analyzing Core Web Vitals
bluesmoon
4
170
Fashionably flexible responsive web design (full day workshop)
malarkey
405
65k
Agile that works and the tools we love
rasmusluckow
328
21k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
247
1.3M
Code Review Best Practice
trishagee
65
17k
Building Flexible Design Systems
yeseniaperezcruz
327
38k
Transcript
Copyright Nulab Inc. All Rights Reserved. Copyright Nulab Inc. All
Rights Reserved. ヌーラボ‧ウェブサイト課の ⼀年間の取り組みをふり返る Yoshito Kusunoki
⾃⼰紹介 • ウェブサイト課 • マークアップ&フロントエンドエンジニア • 最近京都から滋賀に引っ越しました 楠 欣士 (Yoshito
Kusunoki)
ヌーラボについて • 「“このチームで⼀緒に仕事できてよかった”を世界中に⽣み出していく。」 • チームで利⽤する業務コラボレーションツールを開発、提供 • Backlog、Cacoo、Nulab Passという3つのサービス
今⽇の発表テーマ ヌーラボ‧ウェブサイト課の ⼀年間の取り組みをふり返る
背景 • アクセシビリティカンファレンス福岡2023でウェブサイト課の松永が登壇 ◦ 「ヌーラボのウェブサイト課におけるアクセシビリティ関連の取り組み」 • この登壇からちょうど⼀年経ったので、この⼀年間をふり返ってみたい
余談 • 私のヌーラボ⼊社の⼤きなきっかけがこの昨年の発表 • アクセシビリティは採⽤に効きます(N=1)
ウェブサイト課って? • ウェブサイトの開発、運⽤、保守(約20サイト) • ミッションステートメントの1つ⽬に 「すべての⼈に等しい情報を」を掲げてアクセシビリティに注⼒
ウェブサイト課って? • 昨年と⽐べ、新メンバーが3名増えて6名体制に • 6名全員「アクセシビリティやっていき」
⼀年間の取り組みを⾒ていきましょう!
①ウェブサイトの改善
ウェブサイトの改善 動き続けるロゴスライダーを廃⽌
ウェブサイトの改善 フォームの必須を表す「*」を「必須」に変更
ウェブサイトの改善 リンク⽂⾔を「こちら」から具体的な内容に変更 〇〇についての概要はこちらを ご覧ください 詳しくは〇〇の概要をご覧ください
ウェブサイトの改善 他にも... • pxでのサイズ指定をremに変更 • フォーカスインジケータの可視化 • モーダルの実装をdialog要素にアップデート • axe
DevToolsやHTMLバリデータの警告をひたすら解消
ウェブサイトの改善 などなど...⼀年間で60件以上の改善 すぐに着⼿できなくてもとりあえず課題を起票することを⼼がけています
②アクセシビリティレポート
アクセシビリティレポート • ウェブサイトの改善内容を3ヶ⽉に⼀度ブログで公開 • これまでに4回リリース
アクセシビリティレポート • ヌーラボ アクセシビリティレポート #1 • ヌーラボ アクセシビリティレポート #2 •
ヌーラボ アクセシビリティレポート #3 • ヌーラボ アクセシビリティレポート #4
アクセシビリティレポート 昨年のカンファレンスで「⼩さい単位でも改善に取り組んで発信してみよう」 という話を聞いたことがきっかけ ささいなことでも、勇気を持って発信し続けます
③WCAGの読み合わせ会
WCAGの読み合わせ会 • 昨年から続けてきた各社ガイドラインの読み合わせを無事完⾛ ◦ freeeアクセシビリティー‧ガイドライン ◦ Ameba Accessibility Guidelines •
今年9⽉からいよいよWCAG2.1の読み合わせを開始
WCAGの読み合わせ会 • ハードルを低く設定 ◦ Aの基準のみに絞る ◦ まずは⼀周することを⽬標に
WCAGの読み合わせ会 • WCAGの「読み⽅」を勉強する会も事前に開催 ◦ とっつきにくさを解消
WCAGの読み合わせ会 とにかくハードルを下げて、多くの⼈が参加‧継続しやすいように 参加者が増えてきている(開発エンジニアやUXライティングチーム)
④資格勉強
④アクセシビリティ関連の資格勉強 • 毎週もくもく会を開催 • DAA(Digital Accessibility Advisor) Basic 合格者2名 •
⾊彩検定UC級 結果待ち2名(保持者1名)
④アクセシビリティ関連の資格勉強 体系的に学ぶ機会は意外と少ないので良いきっかけに 勉強仲間が集まるとモチベーションアップに繋がります
⑤外部への発信活動
⑤外部への発信活動 • イベント登壇 • 会社ブログで記事を執筆
⑤外部への発信活動 • LT「悪い実装例から学ぶ ウェブアクセシビリティ改善のヒント」 • ブログ「私の、あなたの、全ての⼈のためのアクセシビリティ」
⑤外部への発信活動 社外‧社内へ向けた「アクセシビリティやってるぞ」アピール 外部からフィードバックをいただくことでより深い理解に
⑥社内での推進活動
⑥社内での推進活動 • アクセシビリティについて話す会を⽉⼀で開催 • WCAG読み合わせ会の主導 • ライティングチームと代替テキストについてディスカッション
⑥社内での推進活動 少しずつ着実に仲間を増やすことを⽬指しています
ふり返り
ふり返り • 従来からの取り組みをコツコツ継続 • 新たな取り組みも増やせている • 仲間が少しずつ増えてきている
つぎはどうする
つぎはどうする • 来年もこの場で⼀年間の報告をすることが第⼀⽬標 • 明⽇の学びを糧に、次の打ち⼿を考える ◦ もっと社内に広めていきたい ◦ WCAG試験を実施したい ◦
アクセシビリティ⽅針を公開したい
Copyright Nulab Inc. All Rights Reserved. Copyright Nulab Inc. All
Rights Reserved. ご清聴ありがとうございました! Yoshito Kusunoki