ホームページ制作を始めるにあたり、まず始めに勉強したこと

ホームページ制作をするために最初に学んだことを知りたいというニーズが意外と多かったので、思い出しながら書いていきたいと思います。

キーボード入力に慣れる

誰もが最初は人差し指だけでキーボードを打つというスタイルだと思います。自分ももちろんそんな時期がありました。
本当の意味で最初にやったのは、MIKATYPE（美佳タイプ）というタイピング練習アプリを毎日やるということ。
当時と姿形が少し変わっているようですが、自分はこの美佳タイプでタッチタイピング（ブラインドタッチ）を行えるようになりました。
ホームポジションに指を置き、画面だけを見ながらキーボードをタタタタタン！エンターをターーーーーン！ほんとに気持ちいいし、作業効率一番上がるのはこのタッチタイピング。絶対にマスターしてください。

HTMLとCSSの基礎知識

次に、ホームページ制作の基礎となるHTMLとCSSの知識を学びました。
HTMLは、ウェブページの内容や構造を定義するためのマークアップ言語であり、CSSはそのデザインやレイアウトを制御するためのスタイルシート言語です。これらの基本を理解することで、自分で簡単なウェブページを作成できるようになります。

HTML

最初は、メモ帳を開き<p>こんにちは</p>みたいに簡単なHTMLを書いてindex.htmlというファイル名で保存し、ブラウザで表示されているのを確認する。
これだけでも感動モノです。
ここで感動できなければセンスゼロです！

CSS

HTMLでもある程度の文字装飾やレイアウトぐらいはできます。
私の時代では、テーブルレイアウトという超アナログデザインが主流でした。もちろんスマホも無ければケータイでWEBサイトを見るという時代でもありませんでした。
時代は変わり、WEBデザインをするにあたってCSSの知識は必須です。

font-size: 100px;
そう！みんな最初はこれ。びっくりするほどデカい字に感動できなければセンスゼロです。

Fireworksでデザインを学ぶ

令和6年の今でもまだ当時の友人らと酒を飲む時に出る話題。

「結局Fireworksが一番使いやすかったよな」

です。

Fireworksとは、Macromedia（後にAdobeに買収される）という会社が開発したWEBデザインに特化したソフトで、10年以上前に開発が終了してしまいましたが、それでもまだ根強い人気があり使い続けているユーザーもチラホラと。
今の時代でいうとAdobeXDに似たようなものですが、もっと直感的にデザインを作ることができました。

そのFireworksで、一生懸命にいろんな人のデザインを模写したりしてました。今ならXDやFigmaで勉強する人が多いのかな？
もちろんIllustratorやPhotoshopでもWEBデザインできるので、自分に合ったアプリで制作しましょう。

作った画像を書き出してHTMLに埋め込むことで、ブラウザに表示された時の感動といったらもう。

まとめ

簡単なほんとの初期の初期の話をしてしまいましたが、簡単にWEB制作を行いたいのであれば、STUDIOやペライチみたいなノーコードツールもあるので今の時代であれば誰でもホームページを作ることが可能です。

チラシなんかもCanvaのテンプレートを使えば誰でも作れます。

「本気で集客したい」や「WEBやチラシで人を動かしたい」という思いがあるのであれば、もっと専門的なマーケティングやSEO対策を学ぶ必要があります。
もちろんノーコードツールではシステムやデザインの深い部分までは入り込めないので、しっかりとHTMLを学ぶ必要があります。

需要があればこういったHTMLやCSS、デザインの勉強会を行うのもありですね！