ゼロからWebデザインを作り、それを元にしてhtml・CSS・JavaScriptを書いてみた。
サーチマン佐藤です。
こんにちは。
Webデザインから
html,CSS,JavaScriptをコーディングする。
このへん、一体の知識があればいいと思いますが、
先日、こんなお便りを頂きました。
【フロントエンジニア読者Aさんから】
===========================
(前略)
Webデザインですが、●●系の企業の方は、
ほぼエクセルで渡してこられます。
（ホンネを言うと、迷惑だったりします）
でも、コードを書いた事がない上流の方は、
それしか手段が無いようです。
お願いだから、
Excelで職人技使わないで、
Figmaみたいなツールを
覚えてくださいって言いたいです。
===========================
耳が痛い方もいるでしょう。
でもね、覚えてくれと言われても、
覚える講座がないのです。
そりゃ、Webデザインの講座はありますよ。
html,CSS,JavaScriptの講座もある。
でも、その両者の要点を絞って、
一気通貫で俯瞰する講座がない。
手前味噌で恐縮ですが、
私は、少し器用なところがあって、
そういう要点を絞ることが大得意なのです。
結果、全部、自分でやってしまう。
余談ですが、先日、
お金持ちと雑談する機会があり、
「他人に任せないと金持ちになれない」と、
厳しい指摘を受けた次第です(苦笑)。
閑話休題。
その両者の要点を絞ることは、
私なら出来ると思いましたので、
論より証拠で、ひとまず成果物を作りました。
ゼロから↓のWebデザインを作りました。
https://www.figma.com/proto/UjLXP2mp5voXengUEybj0M/figma3?node-id=1%3A2&scaling=scale-down&page-id=0%3A1&starting-point-node-id=2%3A36
そのデザインを元に、↓Webサイトを作りました。
https://searchman.info/tmp/figma/home.html
(↑を検証モードのiPhone12で見てください)
(iPhone12などのスマホで見れば)
デザインとWebサイトが全く同じになりますね。
この一気通貫の講座を作る。
メッチャ忙しいですけど、メッチャ有効だと思います。
是非、お楽しみに。
ではでは、またお会いましょう。
ありがとうございました。
●追伸
上記の講座情報は、以下のメルマガで配信中です。
http://searchman.info/p_touroku.html