2019年5月22日水曜日

「工学部学友会」HPのスマホ対応

スマートフォン(スマホ)の保有率は年々増えて、男性は50代までは大よそ8~9割台、60代でも5割近く、女性では20代の92.3%がピークでそれ以降は年とともに漸減していくが50代まででは7割を超え、60代でも6割近い。端的に表現すれば「男女とも15歳から50代までは7割以上がスマホを持つ時代」とでも表現できる。
そういう中で、湖風会「工学部学友会」のホームページもPC画面として公開しているが、スマホの普及に伴い、スマホ画面でも見られるようにすることが必須の課題としてあった。(数年前からスマホ対応をと気になりながら、作成する知識も欠如していたし、作成が時間もかかり大変であることで放っておいた。また、見られる対象者がシニア層であり、一応スマホでも見れるし割り切っていたこともあった。)
そのスマホ画面でみられる方法として、1つのホームページ(URL)で、パソコンとスマホのどちらでも見れるように作成する「レスポンシブ・ウェブデザイン」と、パソコン用サイトとスマホ用のサイトを別々に作成する「スマホ専用サイト」がある。 今回は、「レスポンシブ・ウェブデザイン」で行い、大分時間がかかり、苦労もしたが一応目途もついた。まだ、未解決の問題も若干残している。 写真の左側がスマホ画面、右側がPC画面。
「レスポンシブ・ウェブデザイン」とは、訪問者が使っている端末の「画面サイズ」によって、表示させるホームページの形を切り替えることを言う。ホームページにアクセスがあったときに、その訪問者の画面サイズを判断して、その画面サイズに合わせて自動的に切り替えして表示させるものである。このメリットは、ホームページは1つであるため、今後の更新がラクであること。またホームページのURLも1つで良いので、管理もしやすいこと。デメリットは、1つのホームページでスマホとパソコンの両方で綺麗に表示されるようにホームページを作りこむ必要があるため、作成が大変である。また、パソコンとスマホの両方の表示を気にしながら作るため、レイアウトやデザインの自由度も低くなってしまうこと。あるいはスマホでアクセスをしたときも、ページ全体を読み込むため、表示が遅くなってしまうこともある。

0 件のコメント: