医療・イベント

Congrès JOD

医学学会では、学術プログラムが製品で、参加登録はそのレジです。

年
2026
制作期間
4週間
技術スタック
React · Vite · Tailwind · Supabase · Vercel
  • デザイン
  • 開発
  • データベース
  • 参加登録
  • SEO
サイトを見る（新しいタブ）同様のプロジェクトを相談する
https://www.congres-jod.org
Congrès JODのWebサイトのトップページ――医療・イベント、Kayzen Web制作
の学術集会
第5回
認定を冒頭に表示
DPC
Lighthouse SEO
100/100
出発点

解決すべき課題。

背景

Congrès JODは、リヨン市民病院機構（Hospices Civils de Lyon、HCL）が主催する消化器腫瘍学の学術集会「Journée d'Oncologie Digestive」です。2026年大会は第5回目で、学術プログラム、大学病院の講演者、DPC（フランスの医療従事者向け継続的職能開発制度）の認定を備えています。

制約

参加者は、診察の合間の2分間で、講演者、テーマ、DPCの認定という3つの基準で判断する臨床医です。それ以外はすべてノイズです。さらに厳格な日程の制約があります。このサイトは、ひとつの日付のために存在しているのです。

解決策

学術プログラムを最前面に置き、講演者の名前と所属を明記しました。DPCの認定は費用負担の可否を左右するため、最初の画面で告知しています。参加登録は短い導線で、確認画面と即時の登録完了通知を備えています。

自己申告ではなく、計測値

納品時に計測したスコア。

本番環境のサイトのLighthouseスコアです。数値はそのまま公開しています。低いスコアがあれば、その原因と改善計画を下に記載しており、伏せることはしません。

PageSpeed
71
パフォーマンス：100点中71点
92
アクセシビリティ：100点中92点
100
ベストプラクティス：100点中100点
100
SEO：100点中100点
デザイン・アートディレクション

すべての判断に、理由がある。

  1. イベントの宣伝より先にプログラムを

    セッション、時間、講演者、所属は、スクロールせずに見られます。臨床医は学術集会を、ビジュアルではなく学術委員会で評価します。

  2. DPCを冒頭に表示

    継続的職能開発制度（DPC）の認定は、費用負担の条件です。フッターで触れるのは、隠すのと同じことです。

  3. 公的機関らしい雰囲気

    HCLのブルー、簡素なタイポグラフィ、遊びは一切なし。大学病院の学術集会は、テック系カンファレンスの手法では売れません。

プロジェクトのカラーパレット

  • ホスピタルブルー

    #1B4B78

    アイデンティティ

  • クリニカルホワイト

    #FBFCFD

    背景

  • インク

    #1A1F26

    テキスト

  • バリデーショングリーン

    #2E7D5B

    DPC、完了表示

タイポグラフィ体系

見出し用書体

Outfit 700

本文用書体

Inter 400

プログラムの時刻は等幅数字にしています。時刻の列がずれていると、プログラムを斜め読みできなくなるからです。

エンジニアリング

その裏側にある技術。

  • React
  • Vite
  • Tailwind
  • Supabase
  • Vercel

  1. 参加登録をデータベースで管理

    参加登録にはSupabaseを使い、行単位のアクセスポリシーと自動の登録完了通知を備えています。医療従事者のデータは、保存期間を定めて取り扱っています。

  2. 型付きのプログラム

    セッション、時間、講演者、会場を単一のデータセットで管理し、画面表示、印刷用プログラム、Eventのマークアップのすべてに使っています。

  3. 特定済みのパフォーマンス課題

    パフォーマンスは71で、原因は規格の揃っていない講演者の顔写真です。修正は簡単で、予定も組んであります。これは、日付を守ることが絶対の優先事項だったイベントサイトです。

SEO対策

検索で見つけてもらうための仕組み。

  1. 専門分野のクエリ

    「消化器腫瘍学 学会 2026」「JOD リヨン」「DPC 腫瘍学」。ボリュームは小さく、意図は最大限に強い。訪問者の一人ひとりが参加登録の見込み客です。

  2. 完全なEventマークアップ

    日付、会場、主催者、参加形式、ステータス。日付があり、マークアップされたイベントは、専用の検索結果枠に表示されます。

アクセシビリティ

誰もが使えるように。

2025年6月から、欧州アクセシビリティ法（European Accessibility Act）により、多くのオンラインサービスにデジタルアクセシビリティが義務づけられています。当社は後から対応するのではなく、設計段階から取り組んでいます。

  1. キーボードで読めるプログラム

    プログラムは、見た目だけのグリッドではなく、見出しが関連付けられたセマンティックな表です。これにより、スクリーンリーダーで操作でき、きれいに印刷することもできます。

サイト構成

納品したもの。

  • トップ — プログラムとDPC
  • 学術プログラム
  • 講演者
  • 参加登録
  • 開催情報
  • 過去の大会
進め方

プロジェクトの流れ。

  1. 要件定義

    講演者、テーマ、DPCという3つの判断基準を特定。

  2. デザイン

    プログラムを冒頭に、公的機関らしい雰囲気。

  3. 開発

    型付きのプログラム、データベースでの参加登録、完了通知。

  4. 公開

    日付は絶対の制約、最適化はイベント後に延期。

Q&A

よくいただくご質問。

イベントサイトには日付があり、その日付に間に合わなければ、スコアがいくつであろうとサイトは役に立たないからです。最適化の作業は特定され、予定も組まれています。公開前には行いませんでしたが、それが正しいトレードオフでした。

その他の制作実績

制作実績の一覧に戻る

同じ水準のこだわりを、あなたのサイトにも。

現在のサイトの無料診断、24時間以内のお見積もり、そして今お読みいただいたような書面での解説をお届けします。3回分割払い（手数料無料）に対応し、利用できる地域の補助金は契約前に確認します。

面談を予約する料金を見る
共有