独学・フリーランス・在宅・SNS疲れのWebデザイナーさんへ、
ビジネス思考を磨いて「わたしの売りはコレ!」を作っていこう。

Webサイト制作 初級編・根本的なデザイン(設計)のプロセス、HTML5マークアップの考え方(2019.04)

Webサイト設計からコーディングまで

こんにちは。フクモト学長(@WebcreatorsTips)です。未経験からフリーランス歴17年のWebデザイナーです。スクール運営 10年目になります。
詳しいプロフィールはこちら


今回の勉強会でお伝えしたかったことは、Webサイト設計・ユーザーのリアルな要望を知ることの重要性です。

第二部のHTMLの歴史でお伝えしていますが、コーディングの技術は、めまぐるしく変化し、どんどん新しくなります。

私たちは、このWebの技術の進化に振り回されることなく、どんなに時代が変化しても変わらない「Webサイト設計」のプロセスの部分に重点を置いていきましょう。

そうすれば、どんなサービスやツールが出てきても、Webデザイナーとしてぶれない軸を持ち、 素早く重要な決断ができるようになります。

【第一部】根本的なデザイン(設計)のプロセス・HTML5マークアップの考え方

「自分の力で一からWebサイトが作れるようになりたい」という初心者の方向けの内容です。

Webデザインの勉強が「見た目のデザイン」と「中身のデザイン」に分けられるとするならば今回は中身のデザイン「設計」のお話です。

Webページをデザインするにあたり、まずは何から始めるのか?

という最初の第一歩から始めます。

メンバーと一緒に意見出しをしながら、仮案件【HTML5コーディング入門セミナーの告知ページ】の設計を行い、ワイヤーフレーム作成、HTML5マークアップのdiv section articleの使い分けを確認しました。

動画サンプル(準備中)

【第二部】フリーランスのHTML5の新要素との向き合い方

HTML5とSEOの注意点、フリーランスのHTML5コーディングとの向き合い方について勉強しました。

HTMLの歴史では「正しいコーディングができないとフリーランスとしてお金をいただくレベルの仕事はできない」と思っていたフクモト学長のコーディング修業時代と共にHTMLの歴史を振り返りました。

HTMLの歴史を知ると「どこを重点に」Web制作に取り組めばよいのかが見えてくる。コーディングが楽しくなります。

HTML4はどんな時代?XHTMLとは何か?Web2.0lって何?HTML5はなぜ草案されたのか?

XHTMLの使いづらさに立ち上がったのがブラウザベンダーたち!

HTML5を広めようとするブラウザベンダーたちに反発する抵抗勢力とは?
(みたいな話をしました。)

動画サンプル(準備中)

Webクリエイターズスクール 学長 フクモトトモコ

【Webクリエイターズスクール】
学長 福本 智子

Webもデザインも未経験からいきなりフリーランス歴16年。
『仕事は自分で創りだす』をモットーに生きてきた50代。
WordPress・Webマーケティングが得意。

独学・Webスクールを卒業したのに仕事に繋げられない学習迷子さん、在宅・フリーランス希望の人を対象に「マーケティング理論に基づいた、じぶん事業計画」をお伝えしてサポートしています。

関連記事

じぶんの売り方に集中できる。おひとりさま専用Webデザインスクール
フリーランスwebデザイナー個別相談

受講者の声