2025年03月05日

オリジナルWEBページはラフ案から作成


こんにちは!RCLab代表の中農です。
本日は生徒がオリジナルWEBページの作成をどのようにスタートするかをご紹介させていただきます!
 

生徒のオリジナルWEBページ作成とは

WEBサイト(ホームページ)やWEBページはHTMLとCSSという言語を使って作成します。
まずは、基本的な言語学習やいくつもの課題サイトを作成しながら徐々に理解を深めていきます。
 
そして、ある程度理解が深まってきたところで、オリジナルのWEBページを作成してもらいます。
WEBページとなるので、ホームページと違って1ページのみのWEBサイトとなります。
 
テーマは、生徒自身が興味があるもの、趣味やスポーツとみんな色々なテーマで作成してくれています。
講師も一緒になって考えます。
※サーバー上に公開などしないので、権利関係なども考えずに本当に自分の好きなテーマで作成してもらっています。
 

 

まずはラフ案から作成します

ラフ案とは、WEBページの設計図みたいなものです。どんなレイアウトで作成するか、写真をどこに何枚使うか、、など色々と自分なりに考えて手書きで書き出します。
 
小学5年生のラフ案↓↓↓
 

 
プレステーション4から5にどのような変化があったかをまとめたWEBページをつくります。
 
こちらも小学5年生のラフ案です。↓↓↓
 

 
大好きなミュージシャンを紹介するWEBページとなります。
 

 
その他にもNBAや鉄道、マンホールなどみんな色々なテーマで取り組んでくれています。
 

ラフ案の次は素材選定

ラフ案ができたら、次は素材選定です。
WEBページに利用する写真を集めてもらいます。
情報収集しながら、自分のつくるWEBページのイメージをどんどん膨らませてもらいます。
大人もそうですが、自分の興味があるテーマに沿った素材集め、めちゃくちゃ楽しい時間です。
どのように情報整理をするかを考えることもとても勉強になります。
 

集めた素材をPhotoshopでトリミング

事前にPhotoshop(フォトショップ)の基本的な使い方もマスターしていますので、集めた素材写真の大きさや明るさを整えてもらいます。
 

 
フォトショップを使って画像の上にテキストを入れたりと、、イメージするWEBページの形を思い浮かべながら作成してもらいます。
 

ラフ案と素材をもとにコードを作成していきます

 
ラフ案をもとにWEBページの構成をHTMLとCSSを使って作っています。
やや難しい部分もありますので、講師がアドバイスやサポートをしながら作っていきます。
 


 
イメージしたものを形にしていく作業、完成した時の達成感は本当に素晴らしいです。
 
生徒の作品はまた別の機会に紹介させていただきます。
 

無料体験授業を実施しています

RCLabでは、無料の体験授業を行なっております。
実際に体験していただいてから入会できるので安心です。
体験授業はコースによって時間が異なりますが、約30分となります。
 
お子様の未来、そして自分の可能性を広げるためにも、ぜひ一度お越しください!