JADE ファウンダー & CSO の長山 (@KazushiNagayama) です。
この度 ja.dev のコーポレートサイトをリニューアルしました。もともとのサイトは JADE 創業時に長山がパパッと作ったものだったので、そろそろ潮時かなということもあり、全面リニューアルです。
その際に、
- アクセシビリティに配慮した
- コンテンツをメンテしやすい
- デザインもちゃんとしている
サイトを作りたい、ということで、いろいろと考えた結果、 Notion + Wraptas で行うことになりました。
意識したこと
アクセシビリティへの配慮
特にコーポレートサイト部分は、伊原さん (@magi1125) に手伝っていただき、できるだけアクセシビリティに配慮した設計を心がけました。Wraptas に複数の要望を出しつつ、サイトデザインは株式会社まぼろしさんに実装してもらいました。まだ完全には WCAG2.1 AA準拠はできていないのですが、Wraptas さん側で要望が全て解決されれば、あとはサイトマップを置くだけで WCAG2.1 AA準拠になる予定です。
検索エンジン対応への配慮
これも個別ページの canonical 設定、リダイレクト設定など、Wraptas に要望を出して実装してもらい、通常基礎的な SEO で気になるポイントは一通り押さえてもらいました。
コンテンツの追加、編集のしやすさ
JADE では１年ほど前に社内ドキュメント管理ツールとして Notion を導入し、社内におけるほぼ全てのドキュメント管理を Notion で行っているので、その延長線上でコンテンツを管理しやすくなりました。
おしゃれになった社内を見てもらう
青山から秋葉原と渋谷の2拠点に引っ越しをしたタイミングで、社内が格段におしゃれになりました。それをあまり表に出せていなかったので、内装や雰囲気が随所に映り込むように撮影をお願いしました。「JADE の社内ってこんな感じなのか！」と思ってもらえるとうれしいです。
働く人を知ってもらう
どんな人が働いているのか、顔が見えるチームの第1歩として「チーム」コンテンツの充実を行いました。フラットなコミュニケーションが取れる経営陣であることがより伝わりやすくなることを願い、実態とギャップのないイメージを伝えるために newR パーソナル分析さんのお力を借りました。
働き方や制度を知ってもらう
「有給休暇とは別に取得できる病気休暇がある」、「人間ドックが10万まで補助」など、働く社員にとってうれしい制度を表に出しました。相談できる仕組みである「SEM Review」、継続的に学べる仕組みである「JADE大学」などJADE で働くイメージを持ちやすい内容を公開しました。
大変だったこと
プロジェクトマネジメント
当初はそこまで大きくコンテンツを作り替える予定はなかったのですが、実際に考え出すと、いろいろな側面で「こういうコンテンツや写真があった方がいいのではないか」というアイデアが溢れてきました。その中で、何を優先的に実現し、何をリリース後の改善とするかについては、結構難しい判断でした。
アクセシビリティの担保
実は JADE では Hubspot をフォームツールとして利用していたのですが、現在の Hubspot が実現するフォームがアクセシビリティ的によろしくなく、一部の方がフォームをサブミットできないということに…泣く泣く一旦 Hubspot から別のフォームツールに切り替えました。
ブログ部分とのシームレスな結合
ブログ部分ははてなブログを利用し続けるので、その部分は少し複雑になるのですが、一旦簡単に実装できる方法として blog サブドメインに切り出し、ブログ記事の URL 部分は ja.dev -> blog.ja.dev へのリダイレクトを設定しました。
やらなかったこと
総じて、めっちゃがんばらないと実現できないことは、今回のリニューアルではやりませんでした。
アクセシビリティを排除してでもデザインをがんばる
いろいろ動いたり、最先端技術を使ったり、そういうことはやりませんでした。
コンテンツをめっちゃがんばる
会社紹介コンテンツの大量投入や、「JADE人インタビュー」みたいな企画もアイデアは出ていて、できればやりたかったのですが、リニューアル後にがんばることにしました。
SEOをめっちゃがんばる
各ブログ記事の title や description をクエリに合わせて最適化したり、URL構造を細かく最適化したりと、細かいことを始めるとキリがないのですが、一旦「とりあえずここまでは最低限」というところで検索エンジン対応はおしまいにし、あとは他の要件を優先しました。
謝辞
アクセシビリティを監修してくださった伊原さん、デザイン・実装をおこなってくださった株式会社まぼろしさんの佐野さんと小林さん、写真を撮ってくださった井上さん、newRの中川さんと小田桐さん、機能をものすごいスピードでたくさん実装してくださった Wraptas の nabettuさん ありがとうございました！
まだ深く語りたいことがあるので、他にもサイトリニューアルに関する記事は出していこうと思います！
