そもそもホームページの仕組み
ホームページは、HTMLファイル(場合によってはCSS・JavaScript・画像)を「サーバー」と呼ばれるインターネット上のコンピュータに置いた状態のことです。誰かがブラウザでURLを入力すると、サーバーがそのファイルを送り返し、相手の画面に表示されます。つまり「作る」と「公開する」は別の作業で、自分のPCでHTMLを作っただけでは他の人には見えません。
作って公開するまでの全体像
① ファイルを作る
テキストエディタ(VS Code、サクラエディタ、メモ帳でもOK)でindex.htmlというファイルを作り、見出し・段落・画像のタグを書きます。最初は20行くらいの小さなページで十分です。文化祭の紹介、自分の趣味、簡単な作品紹介など、個人情報を出しすぎないテーマから始めましょう。
② 自分のPCで確認
index.htmlをダブルクリックすると、ブラウザでそのまま開きます。これは自分のPCの中だけで見えている状態。レイアウトや誤字を直しながら、納得できるところまで磨きます。
③ 公開先を選ぶ
ホームページの公開先(ホスティングサービス)にはいくつか種類があります。おすすめの無料サービスを紹介します。
HTMLを自分で書きたい人はGitHub Pages、ドラッグ&ドロップで楽したい人はNetlify、コードを書かずに作りたい人はNotionかCanvaが入り口に向いています。
公開前に確認すること
ホームページは公開すると、家族や友達だけでなく、検索エンジンや知らない人からも見られる可能性があります。公開前に、本名、住所、学校名、制服が分かる写真、よく行く場所、連絡先を載せていないか確認しましょう。作品を見せたい場合は、ニックネームや専用メールを使う方が安全です。
また、画像のファイル名にも注意します。写真そのものに個人情報がなくても、school-festival-class2.jpg のような名前から学校やクラスが推測されることがあります。公開用のファイル名は、内容が分かる程度にシンプルにしておきましょう。
気をつけたい落とし穴
- 本名・住所・通学先・電話番号を載せない。後から検索される可能性を考える
- 他人の写真・イラスト・音楽を無断で使わない(著作権違反)。フリー素材サイトを使う
- SNSのIDやメアドを載せると迷惑メールが届きやすくなる。連絡先はフォームか専用メールにする
将来どう役立つ?
「自分のホームページを持っている」は、進学や就職で自分の活動を見せる材料になります。デザイナー・エンジニア・写真家・ライターなどクリエイティブ系の進路では、自分のサイトが作品集の入口になります。早く始めるほど、作ったもの、学んだこと、改善した履歴が積み上がっていきます。
今日からできること
- index.html という名前で自己紹介を保存する
- 画像がなくてもよい。文章とリンクだけでよい
- 次の記事で、無料の置き場所に上げる準備をする
まとめ
確認 サイト公開に最低限必要なものは?