【HTML】あなたのhtmlとの出会いは？

BLOG
ブログ

公開日:2024.5.24

良かったらハートを押してね！

HTML

ホームページ制作

CSS

時は200X年。記憶があいまいなのでSFみたいな表現ですが、だいたい2002年くらい。
私は、広告をメインとするグラフィックのデザイン事務所で3年目くらい。クライアントからホームページの更新依頼をいただいたのが、私とHTMLの出会いです。

2002年といえばコピーコントロールCDが出だしたり、日韓ワールドカップでベッカムがあの髪型だったり、エミネムが8mileのあの曲がヒットした頃になります。

それからだいたい四半世紀。（時の流れを否応なしに感じます。）WEB制作会社で、当時のことをブログにしたためる日が来るとは誰が予想したでしょう。自分で言ってるから自分が予想するしないかだけですが。

本記事ではhtmlとの出会いをメインに、その頃をご紹介しつつ現在の視点で振り返って温故知新したいと思います。

それではどうぞ。

出会った頃の私
当時参考にしたもの
最初に制作したサイト
まとめ

1.出会った頃の私

今でこそY2Kと言われる頃ですが当時はリアルタイム。
紙の会社案内やパンフレット、カタログやチラシをデザインしては納品していたグラフィックデザイナーの自分にとって未知なる分野だったWEBだったわけですが、クライアントからいきなり「ホームページは更新できるか？」と連絡があったのが最初でした。

WEBのことはまだわからないけど、クライアントのことはWEB制作会社よりも知っているからという理由で連絡が来たわけですが、当時のスタッフは総勢3人。担当となると実質自分一人。とりあえず情報をもらって調べることから始めました。

今思い返すと新着情報の更新みたいなレベルですが、ゼロから調べるので全くの未知数でした。とりあえずトップページのソースをプリントアウト（！）して分析することから始めました。
このアプローチがグラフィックデザイナーらしかったという点で今となっては微笑ましい。

そのトップページのソースの量はA3で出力してもたかだか4、5枚でおさまるレベルでした。今同じことをやったら用紙が足りないし検索性もなく直接書き換えもできないので何もメリットはないですが、当時はCSSがあまり使われておらず、タグも種類が少なく短期間である程度作業できた記憶があります。

CSSについてはブラウザのバージョンが未対応で追いついてなく、普及途中ということもあり、htmlファイルのみで完結していたことで比較的敷居が低かったことも要因でした。

htmlファイルの中でどこで何をやっているか、表示されている部分とソースの部分の連携がわかるようになると理解が一気に進み、簡単なテキスト修正や画像変更は焦らず作業できるようになりました。

当時は、DreamWeaverなどのWEBに特化したソフトもなければ、VSコードなどのエディターもなくもちろんCMSもないため作業は、テキストが書けるソフトでコードを書いて拡張子を「html」で保存するという極めてシンプルなものでした。

なので後年、DreamWeaver（Adobeになる前ね）をはじめて使った時の感動はすごかったです。画面が分割できて見た目とコードで操作できるなんて！と衝撃を受けた記憶があります。

2.当時参考にしたもの

ここで、私がhtmlに出会った当時参考にした書籍をご紹介します。

HTMLデザイン・ビジュアルガイド
シーズ編著
発売日：2000-12-19
仕様：B5変 232*182／192P
ISBN：978-4-8443-5580-9

なんとあまりに古い書籍の為、画像検索でヒットしませんでした。販売元のサイトではno imageです。
メルカリだと300円くらいです。この手の技術書は、古くなったら使い道がほぼないため当然のことかもしれません。世界にどれだけ現存しているのか、個人的にはWEB世界遺産の一つです。

HTMIとは何？から＜table＞（テーブルタグ）を駆使してレイアウトした簡単なサイトが構築でできるまでのプロセスとFTP関連の内容が書かれています。

もう一冊はこちら

Web Site Design Vol.1
技術評論社 (2001/5/1)
ISBN-10 ‏ : ‎ 4774112151
ISBN-13 ‏ : ‎ 978-4774112152

その書籍名で今出版すると埋もれてしまうでしょうが、当時はその名前が有効だったことが、そもそもWEB黎明期であることが伺い知れます。そしてなんと創刊号。今回のブログ記事を書くために当時買ったのかと言わんばかりの原点を紹介するにふさわしい書籍です。

これを機に読み返しましたたところ、言葉こそ存在しませんが創刊号の特集記事としてUI、UXのことが既に書かれている点に驚きを隠せません。2001年出版ですから特集を組む企画段階だと25年前の2000年に、雑誌の命運がかかった創刊号の特集がそれだったことに先見の明を感じます。

これらの2冊が世に出て約25年。これがなかったら私はWWGで勤務していなかったとか、そうでもないとか。今読み返すとそれぐらい時の試練を越えて今でも通用する内容がしっかり描かれていたのかと感慨深いです。

3.最初に制作したサイト

その後、地域に数カ所開講している学習塾のサイトを受注しデザインから構築まですべて製作しました。このサイトが私が最初に制作したサイトにあります。（当然ですが現存しません。）

クライアントが特定のソフトで編集できるよう指定がありました。そのソフトはホームページビルダーというもので、windows環境を一から整えて製作した記憶があります。

当時はMacで製作していたのですが、現在ほど互換性がなく、OSの違いによる勝手に戸惑いながらなんとか公開までやりきりました。ここで階層やファイル名など基礎中の基礎を習得したように思います。

今でこそ検索すれば、行き詰ったときのヒントが見つけられますが、SNSは元よりブログサービスが黎明期であり圧倒的に情報が少なく手探りの制作でした。思い返すと我ながらよくやったものです。

その後CSSが浸透し技術が発展することで、グラフィックデザイナーが片手間で請け負うことが難しくなり、ページ数の多いパンフレット制作に携わるようになると徐々にホームページ制作から遠ざかり、時を経てWWGへ入社しホームページ制作の現場へと至ります。

4.まとめ

いかがでしたでしょうか。

今回は私とHTMLについての実体験をご紹介しました。

記事を書いてみて気づいたのはWEB制作の黎明期に触れることができたため、現在のようなサイトを装飾するCSSや、動きが付けられるスクリプト、さらにCMSなど多くのことを理解する必要もなく比較的スタートしやすい時期だったのかもしれないと思いました。

私がグラフィックデザインを始めたときDTPが主流になりデジタルになることで、必要とされなくなったものが多くあります。WEBデザインの世界でも技術の発達にともなって必要とされなくなったものがあったように、遠い未来では「htmlってあったよね。」と言われる日が来るかもしれませんね。

デザイナーが選ぶ ”アイデア”がすごいサイト5選

デザイナーが選ぶ世界観がすごいサイト5選

【写る人向け】ホームページ制作用の写真撮影に必要な準備

愛知県内から名古屋市を中心にホームページ制作を行っている会社
株式会社 WWG（ダブルダブルジー）
愛知県名古屋市中村区名駅5-16-17　花車ビル南館5F

TEL： 052-890-7007
※ ホームページ制作や活用サポートのお問い合わせはコチラから

コジコジ

デザイナー

2020年入社。20年以上に渡りデザイナーとしてWEBはもちろん、パンフレットや、ロゴ、各種広告など幅広いデザインに従事。デザインの記事をメインに楽して役立つブログを心がけております。一年で一番好きな日は元日。

良かったらハートを押してね！

CONTACT

お問い合わせ

ご不明な点やご質問等、
まずはお気軽にお問い合わせください。

CONTACT

オンラインでのお打ち合わせも可能

ホームページを作りたい	ホームページを作った後	こんなことも
新しく作りたい	更新代行してほしい	写真撮影をしてほしい	多言語対応したい
スマホ対応したい	保守管理してほしい	動画をつくりたい	ライティングをしてほしい
リニューアルしたい	SEO対策をしたい	印刷物をつくりたい	イラストを描いてほしい
プチリニューアルしたい	WEB広告を出したい	ロゴをつくりたい	自社で簡単に更新したい
採用に特化したい			HP制作・運営サポートサービス
全部任せたい			採用特設HP「ウェブサイ」