コンテンツメニュー メニュー終わり
イラスト
ここから本文

このサイトができるまで(後編)

いよいよ制作開始

さて、ここから先は内容がちょっぴり専門的になっていきます。
Webデザインとかホームページ制作についてあまり興味のない方は、適当に読み飛ばしてください。

1からHTMLを勉強してエディタでソースを書くことにした私は、仕事の合間にインターネットでいろいろ調べながら作業を進めていきました。
とりあえず文章や画像など各コンテンツの素材だけ揃えたら、あとは誰かに仕上げてもらうことも考えたのですが、後々の更新や管理を考えると自分で行えた方が良いだろうということで、試行錯誤しながら少しずつ作り込んでいきました。
障害のある方もない方も使いやすく、また幅広い年齢層の方に見ていただけるサイトとなるよう、制作にあたっては次の4つのことを心がけました。

  1. 各ページのレイアウトやナビゲーションには統一性を持たせる。
  2. 視覚に障害のある方が使いやすいようレイアウトはシンプルにして、キーボードと音声ガイドのみで操作できるようにする。
  3. HTMLの構造を分析してページ内の移動をナビゲートする音声ブラウザの使用を考慮し、見出しや箇条書き部分には、できるだけ適切なタグを用いて記述する。
  4. より多くの方に内容を理解していただけるよう、必要以上に専門用語など難しい言葉を使わないで、やさしい言葉を用いる。

私が打ち込んだソースを実際にブラウザで表示し、介助者に表示結果を確認してもらいながら修正を加えていく…という作業を何度も繰り返しました。
そして、その道の仕事をしている知人などから、いくつかの貴重な助言も得て、約半年後の2010年夏にベータ版が完成し、9月に公開開始となりました。
良く言えばシンプル、悪く言えばまるでビジネス文書のような地味なサイトでしたが、ご覧になった方から問い合わせの電話をいただくこともあり、口コミや紙媒体に加えネットでの情報発信ができるようになって本当に良かったと思います。

スクリーンショット
2010年9月のサイト開設当時のトップページ。コンテンツが少なく、イラストも入っていませんでした。

レイアウトをテーブルからCSSへ

Webサイトを制作する場合、様々な理由でレイアウトにはスタイルシートを用いるのが望ましいとされています。
そこでこのサイトも、レイアウトにはスタイルシートの1つであるCSSを使用しています。
しかしながら、CSSを用いた方法は初心者の私には少々ハードルが高かったので、公開当初はテーブルタグを使ってレイアウトを整えていました。
より美しいソースを書くことよりも、まずは完成を急ぐことを優先させたのでした。

ところがコンテンツが増えてページ数が多くなっていくと、このテーブルタグを使った方法は管理が面倒なことが分かってきました。
またタグ本来の意味から見ても正しい使い方とは言えないので、できるものならなんとかしたいと思うようになっていきました。

そこで、各ページにイラストを入れるのを期に、思い切ってソースを書き直してCSSを使ったレイアウトに改めてみました。
こうして修正作業を終えてみると、CSSを用いたサイト作りは、視覚に障害のある私にとってもページ全体のデザインをイメージしやすく、管理もしやすいので大きなメリットがあることが分かりました。
もっとも、実際に思った通りのレイアウトになっているか確認するために、晴眼者(目の見える人)の方のサポートが必要でしたが。

より多くの方々にご覧いただけるサイトをめざし、引き続き内容やデザインに手を加えていきたいと考えています。
今後ともこのサイトをどうぞかわいがってやってください。
最後に、当サイトの制作にあたり貴重なご助言とソースのチェックをしていただいたSさん、素敵なイラストを描いてくださったNちゃん、そして写真の加工やブラウザでの確認作業に根気よく付き合ってくれた介助者の皆さんに、この場をお借りして心より感謝申し上げます。

2011年1月25日記

「管理人の雑記帳」へ
「語りあう」へ

トップページへ

本文終わり