98.cssでWindows 98ライクなコーディング

OVERVIEW

でんぱ組incの「もしもしインターネット」に合う雰囲気のWEBサイトをGitHub上で公開されていたJordan Scales氏開発の「98.css」を使って表現しました。

YEAR 2020

【対応ブラウザ】Chrome/Firefox/IE/Edge

【開発人数】1人

【担当箇所】企画 / 一部デザイン/ コーディング

【製作期間】約1時間

【リンク】https://mizumii.github.io/denpa98/

制作時の目標

「1時間以内にWEBサイトを公開する」

とにかく素早くサイトをつくれるようになりたかったので時間制限を決めて制作しました。テーマは決めず、とにかくすぐにできそうなものはなにかを考えたときにたまたまWEBニュースでみた98.cssを思い出して、それに合いそうな動画の紹介というテーマで取り掛かりました。

制作過程

1Atomで直接HTML書く

Jordan Scales氏のサイトにすでにサンプルが置いてあったので、そちらを参考にモックアップなどかかず、直接HTMLを書いていきました。今回CSSはカラフルな文字とそのアニメーション、最低限のレスポンシブ対応にとどめて書きました。

シンプルな構成のなかに見出しとしてカラフルな文字を使うことで、メインの動画を邪魔しないデザインになるように気をつけました。


WEBSITE