Web制作を学ぶなら実践型プログラミングスクール｜厚木市との共同事業レポート
プログラミングスクールで学ぶレスポンシブデザイン
～厚木市生涯学習課と取り組む実践型Web制作教育～
2026年9月16日には、中級編第6回「ナビゲーション＋仕上げ」を実施いたしました。
スマートフォンが生活の中心となった現在、企業のホームページや採用サイト、行政サイトにおいても「どの端末でも見やすく表示されること」は当たり前の時代となりました。
その技術を支えているのがレスポンシブデザインです。
株式会社Voleurでは、神奈川県厚木市生涯学習課との共同事業として、市民を対象とした年間プログラミングスクールを開講しています。本スクールでは、HTML・CSS・JavaScriptなどWeb制作の基礎から実践までを体系的に学び、単に「ホームページを作る」だけではなく、「なぜそのコードを書くのか」「なぜその設計になるのか」を理解できるエンジニア・クリエイターの育成を目的としています。
近年ではAIによるコーディング支援やテンプレート型ホームページ制作サービスが急速に普及しています。しかし、AIを正しく活用するためにも、HTMLやCSSの基礎知識が欠かせません。株式会社VoleurはWeb制作会社として数多くの企業・行政案件に携わる中で培ってきた実務経験を教育へ還元し、「現場で本当に役立つ知識」を地域へ届けることを大切にしています。
今回の授業では、中級編最終回となる**「レスポンシブデザイン」**をテーマに、パソコン・スマートフォン・タブレットなど異なる画面サイズに対応したWebサイト制作について学びました。
この記事では、授業で実際に取り扱った内容をもとに、レスポンシブデザインの考え方やHTML・CSSを活用したスマホ対応の基本を分かりやすく解説するとともに、厚木市生涯学習課との共同事業だからこそ実現できる実践型プログラミング教育についてご紹介します。
レスポンシブデザインとは
レスポンシブデザインとは、閲覧する端末の画面サイズに応じてホームページのレイアウトや文字サイズ、画像サイズなどを自動で最適化するWeb制作技術です。
現在、ホームページへのアクセスの多くはスマートフォンから行われています。
そのため、「パソコンでは見やすいけれどスマートフォンでは文字が小さい」「ボタンが押しづらい」「レイアウトが崩れてしまう」といったホームページでは、多くのユーザーにとって使いづらいサイトとなってしまいます。
レスポンシブデザインは、このような課題を解決するための重要な技術であり、企業のホームページ制作や採用サイト、ECサイト、行政サイトなど、あらゆるWeb制作の現場で採用されています。
株式会社Voleurのプログラミングスクールでは、「レスポンシブとは何か」を覚えるだけではなく、「なぜ現在のWeb制作に必要なのか」「実際の制作現場ではどのように活用されているのか」という実務目線も交えながら授業を進めています。
そのため、受講者の皆様には単なる知識ではなく、将来の仕事や学習にもつながる実践的なスキルとして身につけていただくことを目指しています。
HTML・CSSを活用したスマホ対応の基本
レスポンシブデザインを実現するためには、HTMLとCSSの役割を正しく理解することが重要です。HTMLはホームページの「骨組み」を作る役割を担い、CSSは文字の色や大きさ、余白、レイアウトなどの「見た目」を整える役割を担います。
株式会社Voleurのプログラミングスクールでは、基礎を大切にすることを重視しています。
近年ではAIやテンプレートを利用することで、短時間でホームページを制作することも可能になりました。しかし、HTMLやCSSの仕組みを理解していなければ、デザインの修正や不具合への対応、自分の思い描いたホームページを制作することはできません。
そのため授業では、「コードを写す」のではなく、「なぜこのコードを書くのか」「変更すると何が変わるのか」を一つひとつ確認しながら進めています。今回の授業でも、受講者全員が実際にコードを書きながら、画面サイズに応じて表示が変化するホームページを制作しました。
分からないところは講師だけでなく補助教員も一緒になってサポートし、一人ひとりの理解度に合わせて進行しています。
実際の授業で学んだレスポンシブデザイン
今回の中級編では、これまで制作してきたホームページをスマートフォンでも見やすく表示できるようにする「レスポンシブデザイン」に取り組みました。受講者の皆様は、パソコン画面だけでは気付きにくいレイアウトの違いや文字サイズ、画像サイズの変化を実際に確認しながら、「利用する人の立場で考えるWeb制作」を体験しました。
授業中には、
「スマートフォンでは文字が小さく見える理由」
「画像サイズをどのように調整するのか」
「画面幅によってレイアウトが変わる仕組み」
など、現場でも必要となる考え方についても説明しました。
単にコードを書くだけではなく、「なぜその設定が必要なのか」を理解することで、受講者の皆様も一段と理解を深めている様子が印象的でした。また、事前に配布した教材を読み込んで参加される方も多く、授業中には予定していた内容を超える質問も多数寄せられました。このように、受講者の学ぶ意欲に応えられる環境づくりも、株式会社Voleurと厚木市生涯学習課が共同で取り組んでいる本プログラミングスクールの大きな特徴です。
株式会社Voleurが大切にしている教育
株式会社Voleurは、人材紹介事業・Web制作事業・採用支援事業を展開する企業として、日々多くの企業様や行政機関と関わっています。
その実務経験を教育へ還元することも、私たちの社会的な役割であると考えています。
授業では、「ホームページが作れた」という達成感だけではなく、「考える力」「調べる力」「課題を解決する力」を身につけていただくことを大切にしています。
実際のWeb制作の現場では、答えが一つではない課題に向き合うことが数多くあります。
だからこそ、テンプレートに頼るだけではなく、自分で考え、自分の力でホームページを設計・制作できる力を養うことを目標に授業を行っています。
厚木市生涯学習課との共同事業だからこそ実現できる継続的な学びの場として、地域の皆様に安心して参加していただける環境づくりにも力を入れています。
株式会社Voleurが目指すプログラミング教育
株式会社Voleurは、人材紹介事業・採用支援・Web制作事業を展開する企業として、「社会で本当に役立つ知識を地域へ還元すること」も重要な使命であると考えています。その取り組みの一つが、神奈川県厚木市生涯学習課との共同事業によるプログラミングスクールです。
単発の講習会ではなく、年間カリキュラムとして継続的に学べる環境を整えることで、受講者一人ひとりが着実に知識と技術を身につけられるスクールづくりを行っています。授業では、「コードを覚える」ことを目的にはしていません。なぜそのコードを書くのか。なぜそのレイアウトになるのか。
どのようにすれば利用者にとって見やすいホームページになるのか。実際のWeb制作会社が日々考えている内容を、そのまま授業へ落とし込み、現場で活かせる考え方までお伝えしています。そのため、受講者の皆様からは「学校では学べない内容だった」「実際の仕事をイメージしながら学べた」といった声もいただいています。
SDGs目標4「質の高い教育をみんなに」
株式会社Voleurでは、本プログラミングスクールを単なるIT教育ではなく、**SDGs目標4「質の高い教育をみんなに」**を実現するための地域貢献活動として位置付けています。
近年、デジタル社会の発展に伴い、プログラミングやWeb制作の知識は特定の職業だけではなく、多くの人に必要とされる時代となりました。
だからこそ、行政と民間企業が連携し、年齢や経験を問わず学べる環境を整備することが重要であると考えています。
株式会社Voleurは、人材紹介会社として「人の可能性を広げること」、Web制作会社として「技術を社会へ還元すること」、そして教育事業を通じて「未来を担う人材を育成すること」を大切にしています。
今後も厚木市生涯学習課をはじめ、教育委員会、公立学校との連携を深めながら、地域社会に根差したプログラミング教育を継続してまいります。
まとめ
今回の授業では、レスポンシブデザインを通して、スマートフォン・タブレット・パソコンなど、利用する端末に合わせて最適なホームページを制作するための技術を学びました。
HTMLやCSSの知識だけではなく、「利用者目線でホームページを設計する」というWeb制作の本質にも触れることで、受講者の皆様がさらに理解を深められる授業となりました。
株式会社Voleurは、神奈川県厚木市生涯学習課との共同事業によるプログラミングスクールを通じて、地域の皆様へ継続的な学びの機会を提供しています。
これからも、Web制作の専門企業として培ってきた知識と経験を教育へ還元し、**SDGs目標4「質の高い教育をみんなに」**の実現を目指すとともに、一人でも多くの方が「学ぶ楽しさ」「創る楽しさ」を感じられる環境づくりに取り組んでまいります。
今後も株式会社Voleurは、人材紹介・Web制作・教育事業を通じて、地域社会の発展とデジタル人材の育成に貢献してまいります。
