京都市立高等学校情報サイト

京都市教育委員会が運営する「京都市立高等学校情報サイト」は、西京、美術工芸、京都堀川音楽、堀川、日吉ケ丘、紫野、京都奏和、開建、京都工学院の9校（2026年時点）の学校情報や入学者選抜情報などを一元的に発信するポータルサイトです。
今回、弊社にてサイト全体のデザイン・構築を担当いたしました。

はじめに

京都市立高等学校情報サイトは、進学先を検討する中学生やその保護者が主なユーザーとなる、公的機関の情報発信サイトです。
京都市立高等学校各校それぞれの学校紹介や、学校からのお知らせ、教育委員会からのお知らせ、入学者選抜情報などを、わかりやすく届けることが求められていました。

課題：公共性と「見たくなるデザイン」の両立、そしてアクセシビリティ準拠

サイトリニューアルにあたり、以下の点が特に重視されていました。

• 中学生や保護者が親しみやすく感じられる、色鮮やかで明るいビジュアル
• 公的機関としての節度を保ちつつ、遊びすぎないデザインのバランス
• 画像点数やリンク数が多く、鮮やかな配色を用いる構成であっても達成すべきアクセシビリティ基準（JIS X 8341-3 レベルA・AA）への準拠
• 学校情報やお知らせなど更新頻度の高いコンテンツを、担当者が専門知識なくCMSで容易に更新できる運用性
• 更新・運用時のセキュリティリスクを抑えたシステム構成

解決策：鮮やかさとアクセシビリティ、運用性を高水準で両立

デザイン：明るく鮮やかに、でも遊びすぎないバランスで

中学生や保護者に「見たくなる」と感じてもらえるよう、色鮮やかで明るいトーンのデザインを採用。
一方で公的機関のサイトにふさわしい真面目さも失わないよう、配色や情報量のバランスを丁寧に調整しました。

アクセシビリティ：画像・リンクの多いサイトでA・AA準拠を実現

鮮やかな配色を持つサイトは、一般的にアクセシビリティの確保が難しくなりがちです。
配色設計・コントラスト比・代替テキスト・キーボード操作対応など、細部にわたる検証と調整を重ね、JIS X 8341-3 レベルA・AA準拠を達成しました。
「鮮やかで明るいデザイン」と「誰もが等しく利用できる設計」という、一見相反する2つの要件を両立させることに、特に注力したポイントです。

運用性：学校情報をCMSで安易に更新できる設計

各校の学校情報やお知らせなど、更新頻度の高いコンテンツを、担当者が専門的なCMSの知識がなくても簡単に更新できるよう設計しました。

セキュリティ：Movable Typeによる管理画面と公開環境の分離

CMSにはMovable Typeを採用。
管理画面の環境と、実際に公開される静的HTMLの環境を分離する構成とすることで、外部からの不正アクセスなど、公的機関サイトとして配慮すべきセキュリティリスクを抑えました。

運用負荷軽減：アップロードしたPDFから表紙イメージを自動生成

学校パンフレットなど、アップロードされたPDFファイルから表紙イメージを自動的に生成する仕組みを実装。
担当者がサムネイル画像を別途作成する手間をなくし、日々の更新作業の負荷軽減につなげました。

さいごに

「京都市立高等学校情報サイト」は、進路を考える中学生やその保護者にとって「見たくなる」明るさと、公的機関として不可欠なアクセシビリティ・信頼性を兼ね備えたサイトとして生まれ変わりました。

公開後も、弊社にて引き続き運用を担当させていただいております。実際に運用いただく中でいただくご要望に合わせて、コンテンツの追加や機能の改良を重ね、サイトをより良いものへと育ててまいります。

弊社としても、教育機関という公共性の高いサイトの新規立ち上げに求められる品質と設計思想を活かし、今後もこうしたプロジェクトへの貢献を続けてまいります。