この高専がすごい!

全国の高等専門学校のウェブサイト 緊急調査 ウェブサイトの見やすさを勝手にランク付け!

突然ですが、2015年最も優れていた高専のウェブサイトを勝手に決めたいと思います。

じゅりあん

じゅりあん

津山高専 専攻科2年生。日本語が美しく表示できるBootstrapテーマ Honoka の作者で、最近は PROCON O.S.T. Project でジャケットデザインなどを担当。

らりょす

らりょす

津山高専 本科3年。ウェブフロントエンドエンジニアになりたいと思いつつ、ウェブシステムの開発などをしています。Proconist.net のデザインを担当。

あらすじ

じゅりあん

よく書籍の評価とかで「この○○がすごい!」ってあるじゃん?

らりょす

ありますね

じゅりあん

あんな感じでさ、「この高専がすごい!」ってできないかな

らりょす

全国の高専周らないとできない とんでもないライフワークだ…

じゅりあん

流石に滅茶苦茶お金かかるし学生にはほぼ不可能か… でもなんかせっかく良いタイトルだしもったいないなあ

らりょす

要は高専間で何かを比較できればいいんですよね うーん… ウェブサイトとか…?

じゅりあん

あー それいいかも。じゃあ俺とらりょすで手分けして点数付けすればいいよね、らりょすは東日本側、私は西日本側するわ。というわけでよろしく。

らりょす

えっ あ… はい

全国57高専すべてのウェブサイトを拝見し、採点させていただきました。

全国の高専

評価したポイント

全国55高専のウェブサイトについて2015年11月〜12月時点に閲覧できた状態のものを、以下の評価項目でそれぞれ点数化。各項目は5点満点、0.5点刻み。

デザイン性
レイアウト・配色や文字・写真などが見やすいかどうか
更新頻度
学校の活動などを発信するニュースなどの更新が頻繁に行われているか
情報整理
サイト上にある情報の整理が行き届いており、必要な情報にアクセスできるか
アクセシビリティ
文字サイズの切り替えやスマートフォンなどの対応ができているかどうか
中学生向け
高専のサイトの一番のターゲットとも言える中学生でも見やすい構成になっているか

この高専がすごい!

受賞校一覧

高専名をクリックすると受賞理由の解説に飛びます
© 2007-2015 National Institute of Technology, Ube College. All Rights Reserved.

某W大学の影響を強く受けたレスポンシブ対応サイト

左にあるナビゲーションや半透明・ぼかしを基調としたデザインは某有名私立大学であるW大の影響を強く受けたと思われる。しかしながら決して「パクリ」というわけではなく、しっかりとテーマカラーによる配色が行き届いており、非常によくまとまっているといった印象を受けた。

CMSにはWordPressを使用。教員が更新していると思われるニュースについてはページレイアウトを非常にシンプルにすることにより、ありがちなレイアウトの崩れなどを起きにくくするなど制作会社の気配りが伺える。またトップページの目立つ場所に、中学生向けの特設サイトへのリンクがあり、受験生や興味を持った中学生が来た際の誘導がしっかりできている点も素晴らしく、その中学生向けページも非常に綺麗なレイアウトで、的確な情報掲示が出来ておりまさに非の打ち所がない。

ただひとつ、問題点を挙げるとするならば、2階層目以降のナビゲーションの位置が上・右・左とほぼ全方位にあるため、目移りしてしまうことだろうか。

チェックポイント

レスポンシブ対応
メディアクエリによってレスポンシブに対応しているため、同じページをスマートフォンでも閲覧することができます。
画面いっぱいのコンテンツ
コンテンツは画面サイズに合わせて伸縮し、常に画面横幅いっぱいまで表示されます。
宇部高専のサイトへ
※この高専がすごいサイトを離れます
評価者 じゅりあん じゅりあん
© 2003-2015 National Institute of Technology, Nagaoka College. All Rights Reserved.

ロゴの配色を踏襲した一体感のあるウェブサイト

スカーレットとネイビーを基調としたデザインは、長岡高専創立50週年記念事業のひとつとして決定されたロゴの配色を意識したものである。

トップページのニュースを表示しているカルーセルパネルは、大きな写真とともに伝えているので目につきやすい。新着情報を一覧で表示する部分は、新着以外にも、カテゴリごとにみることもでき、非常にわかりやすくまとまっている。また、中学生向けサイト、更には女子中学生向けウェブサイトも開設されており、中学生への情報提供もしっかりと行われている。全体を通してデザインのみならず情報もしっかりと整理され、作りこまれたウェブサイトである。

しかし残念なことに現段階ではスマートフォンの対応はしていないようで、得点では宇部高専には及ばず。PCサイトのみで比較すればほぼ同率と言っても良かっただろう。

チェックポイント

中学生向け特設サイト
学校自体のウェブサイトとは違ったレイアウトで作りこまれています。
新着情報のカテゴリ分け
カテゴリ分けされた記事はタブUIで確認することができ、確認もしやすい。
長岡高専のサイトへ
※この高専がすごいサイトを離れます
評価者 らりょす らりょす
© Kanazawa Technical College. All Rights Reserved.

カルーセルパネルでアグレッシブなトップページ

12月にトップページを変更し、カルーセルパネルを多用することによって1ページの長さを抑えつつも情報量を多くとった形となっている。おそらく高専のウェブサイトの中では一番動きがあるサイトではないだろうか。そのため今回は「アグレッシブ賞」を贈りたい。

レイアウトはWindows 8を彷彿とさせるグリッドレイアウトで、配色は非常に多様な色を用いてはいるもののそこまで「うるささ」は感じない。

金沢高専は校長に外国人を起用するほど海外研修・英語学習に力を入れているようで、それはウェブサイト上でも溢れている。例えば新着ニュースで、英語訳が入力してあれば、一覧には英語を優先的に表示する仕様のようし、多くの高専では英語版ページは2世代〜3世代前のレイアウトを使う中、金沢高専は12月の更新で1世代前にはなったものの、新しいレイアウトで対応している。

新トップページはスマートフォンに対応しているようだが、所々対応できていない部分があり、画面からはみ出したりリサイズによりレイアウトが崩れる場合もある。

チェックポイント

カラフルながらもうるさくない配色
白色の余白を適切に取ることによりカラフルながらもうるさくないデザイン。
カルーセルパネルの多用
ページの長さは抑えながらも、情報量を多くすることができる。
金沢高専のサイトへ
※この高専がすごいサイトを離れます
評価者 じゅりあん じゅりあん
© 2015 National Institute of Technology, Kisarazu College All rights reserved.

シンプルながらもしっかりまとまったイマドキなウェブサイト

一見すると青を基調としたごく普通の高専のウェブサイトであるが、実は非常によくまとまっているウェブサイトである。高専、ひいては学校のウェブサイトの基準となってほしいことから、「スタンダード賞」を授与したい。

随所にアクセシビリティを高める工夫がされており、サイトの訪問者を目的とする情報にたどり着かせる配慮が感じられる。またページの遷移をすることなくニュースをカテゴリごとに閲覧できるニュース一覧も秀逸である。

ウェブサイト全体でデザインや構成がきちんと踏襲されており、第2階層は各カテゴリの内容紹介を、そして第3階層で情報を提供。第4階層以降のページはほとんど存在していないのも特徴のひとつである。さらに、多くの学校では優先度の低い英語版ウェブサイトもしっかりと作られているのも評価が高い。

スマートフォン・タブレットでの閲覧も可能ではあるが、ナビゲーションバーが最適化されるのみで、完全に対応しているというわけではない。

チェックポイント

わかりやすいメニューアイコン
ナビバーのアイコンがシンプルながらもわかりやすく、ひと目で情報にアクセスしやすくなっています。
充実の英語版ウェブサイト
日本語版ウェブサイトの情報の大半を網羅した英語版サイトが存在しています。
木更津高専のサイトへ
※この高専がすごいサイトを離れます
評価者 らりょす らりょす
© 2015 National Institute of Technology, Kochi College

改組(新学科設立)に向けてしっかりとしたプロモーション

平成28年度から現在4つある学科を一本化した「ソーシャルデザイン工学科」が設立されるのに向けて、手のひらの形をしたロゴと「Miraibito」というキャッチコピーを掲げて、サイト全体でしっかりとしたプロモーションが行われている。現在多数の高専が行っている「改組」のプロモーション活動において一番力を入れているため、今回「プロモーション賞」を贈る。

トップページにあるコンテンツは、ほぼ全て中学生向けのページへのリンクとなっており、非常に中学生を意識したデザインとなっていることが伺える。一方でメニューに行けばそれ以外のコンテンツへの動線もしっかりと確保されているので、中学生以外が見ても特段迷うということはない。

ただしスマートフォンには対応していない他、細かいレイアウトが崩れている部分があるのが非常に惜しいポイントである。

チェックポイント

改組に向けたプロモーション
手のひらの形をした共通のロゴ、「Miraibito」というキャッチコピーのもと改組に向けたプロモーション活動が行われています。
HTTPS対応
全ページで暗号化通信のHTTPSに対応。認証局は高専の認証局。
高知高専のサイトへ
※この高専がすごいサイトを離れます
評価者 じゅりあん じゅりあん

おわりに

じゅりあん

「おわりに」の部分なんですが

じゅりあん

全国の高専のウェブサイト見てどうでした?

らりょす

どの学校も情報は大体同じですが,その魅せ方が高専ごとに違ってとても楽しかったです。(すごく適当な感想になってしまった)

じゅりあん

こなみ

らりょす

すごくこなみって感じになった…