これから自分がウェブデザイナーなろうとした場合、自分だったらこういう風にしていくなって言うことへのお話です
私がウェブ制作を始めたのは約25年前です。当時はGoogleがまだ存在せず、Yahoo!のディレクトリ検索やネットスケープといったブラウザが主流でした。ウィンドウズ95の時代ですね。その頃にはPhotoshopのバージョン2や3がリリースされており、HTMLやホームページという言葉もちょっとずつ広まりつつありました。ホームページを通じて情報発信する人もいましたが、まだビジネス利用としては初期の時代でした。
最初は建築の企画設計会社でCADを使って設計のオペレーションの一部を担当していました。プレゼンテーション資料の制作も頼まれることがありました。その流れで小さなホームページや漢字の提案資料などを作成する機会もありました。これが私がHTMLを使った制作に取り組んだ最初の作品と言えるでしょう。ホームページ制作に関連する部材や情報を提供しているサイトや2ちゃんねるのスレッドなども参考にし、直接メールで質問することもありました。
そのため、現在の環境と当時の勉強方法には大きな違いがあります。もし私が今の環境で20代前半だったとしたら、ウェブデザインを学ぶ際には以下のようなアプローチが良いと思います。
まず、ウェブサイトのビジュアルデザインを行うために、PhotoshopとIllustratorのスキルを身につける必要があります。これらのツールを使用してウェブデザインを行う方法について学ぶことが最初のステップです。勉強方法については後ほど解説します。
次に、HTMLとCSSを使用したコーディングの方法を学ぶ必要があります。特に、最新のHTMLとCSSの手法について常に学びながら、ウェブサイトの構築方法を習得していきます。定期的にメールやCSSの学習を行うことをおすすめします。
また、JavaScriptの基本的な知識も必要です。JavaScriptの動作原理や基本的なプログラミングスキルを習得することで、ウェブサイトに対してインタラクティブな要素を追加できるようになります。具体的な実装方法よりも、JavaScriptの基礎的な考え方や変更の影響などを理解することが重要です。
これらのスキルを身につけることで、基本的なウェブサイトの作成が可能になります。お客さんからの要望に基づいてデザインを作成し、HTMLとCSSを使用してコーディングし、サーバーを使用してウェブサイトを公開することができるでしょう。
まず、ホームページ制作に必要なスキルを習得するために、以下の具体的な方法をおすすめします。
まず最初に、PhotoshopとIllustratorを使用してデザインを行うスキルを身につけることを話しました。Photoshopは写真や画像の加工に使われるソフトウェアであり、明るさや色調の変更、背景の切り抜きや配置の変更、写真の合成など様々なクリエイティブな作業が可能です。Illustratorはポスターやチラシなどの印刷物作成によく利用されます。ホームページのデザインはどちらのソフトウェアでも行うことができます。一般的に制作会社では、主にPhotoshopとIllustratorを使用しています。また、普通の会社でも自社でチラシやバナーを作成する際には、PhotoshopやIllustratorを使うことが一般的です。
ですので、PhotoshopやIllustratorが使えない場合、そのスキルを習得していない場合は、地方の小さな会社にウェブ担当としてアルバイトや正社員として配属された場合や、潜り込んでも経営者からの信頼を得にくくなる可能性が高くなります。ですので、PhotoshopやIllustratorを使ってウェブサイトを作成できる基本的なスキルは習得しておくことを強くお勧めします。
具体的な勉強方法については、書籍を使用して学ぶ方法もありますが、本では理解しづらい場合もありますので、まずはYouTubeで基本操作やウェブサイト制作に関するチュートリアル動画を検索し、基本的なスキルをYouTubeで学ぶのが最適だと思います。まずは無料のYouTube動画で基本的な使い方を学んでみてください。
その後は、具体的な操作方法や拡大縮小、写真の移動、テキストの追加などの基本的なスキルを学ぶことが重要です。YouTubeやUdemyなどでウェブデザインに関するカリキュラムを探し、有料のコースを受講することも考慮してください。また、エルステップが運営しているコミュニティやオンライン講座も利用することで、無料で体系的に学ぶことができます。
これらの方法を組み合わせて、PhotoshopとIllustratorの基本的なスキルを習得していくことをお勧めします。
YouTubeやUdemy、無料の動画教材などを利用して、ウェブデザインの基本的なことやイラストレータやフォトショップを使ったウェブデザインの基本スキルを習得します。次に行うのは、ウェブデザインの模写です。まず、ウェブサイトでよく見られる飲食店やケーキ屋、パン屋などの店舗のホームページや、エステサロン、リラクゼーションサロン、歯医者などの店舗のホームページ、B2B向けの製造業や卸売業のホームページ、一般的な企業サイト、ネットショップなど、ビジネスモデルの業種業界別のホームページを5つほど選んでそれぞれを模写しています。
その際に、自分の知人が運営するホームページや自分がよく訪れる実在のお店や会社のホームページを模写することが最も良いと考えています。つまり、実際にイメージしやすい存在するお店や会社のホームページを自分自身で作ってみることです。そのため、同じ業種のホームページを検索し、どのようなデザインや機能を持ったホームページが魅力的だったり、自分が目指すデザインになるかを目標として選びます。
この作業の利点は、まず、さまざまなホームページのデザインに触れることができる点です。かっこいいサイトやダサいサイトなど、直感的にデザインの良し悪しを判断することができるようになります。デザインセンスを養うためには、感覚的に優れたデザインや劣ったデザインを判断する能力を持つことが重要です。理由はわからなくても、このサイトは素晴らしいとか、このサイトは良くないといった感覚的な判断ができるようになるのです。
さまざまなウェブサイトを見ながらデザインセンスを無意識に磨き、お手本にすべきサイトを見つけたら、そのサイトをキャプチャし、IllustratorまたはPhotoshopでホームページを模写してトレースしていきます。余白も含め、全体が
完全に一致するように模写します。これによって、実際に必要な実践的なスキルを学ぶことができますし、ウェブサイトに必要な最低限のスキルをここで習得することができます。PhotoshopやIllustratorはプロのデザイナーが使用するツールであり、さまざまな機能やメニュー、アイコンがありますが、ウェブサイト制作に特化しているため、必要以上の機能やメニューがあります。最初は操作に圧倒されるかもしれませんが、模写を繰り返すことで、ウェブデザインに必要な最低限のコマンドや操作が徐々にわかってきます。また、ウェブデザインのポイントやコツも徐々に理解できるようになります。このような作業を繰り返していくうちに、一定のホームページパターンやWEBデザインのレイアウトの作法なども学ぶことができるので、模写はおすすめです。
ですので、僕だったら繰り返しになりますが、Photoshopやイラストレーターを使ってYouTubeやユーデミーなどの無料のコミュニティで公開されている動画教材を使用して、フォトショップやイラストレーターの基本的な操作を学び、そのスキルを活かして興味のあるサイトを模写していくことで、ウェブデザインの操作方法を学びます。ここではビジュアルデザインに関する内容です。この段階である程度できるようになると、お客さんから「このようなサイトを作りたい」という要望があった場合、この業種のお店ならばこのようなサイトが適切だと具体的なイメージが浮かんできます。その後、模写で学んだスキルと操作方法を活用し、ウェブサイトを大量に制作していけば良いので、実際に実践的な作り方を学んでいきます。デザインが完成したら、マークアップとしてHTMLとCSSを使用してコーディング作業に入ります。コーディングはどの程度まで、どのように学ぶかという話ですが、まずホームページの構造を表現するためのマークアップ言語であるHTMLの構造を理解し、それにはどのようなタグを使用し、どのように記述すれば良いのかというルールを覚える必要があります。その後、ビジュアルデザインと同様の要素を再現するためのデザイン制御言語であるCSSの使用方法も学ぶ必要があります。
HTMLとCSSだけでもホームページは完成できますが、それだけでは物足りないことが多いです。例えば、クライアントからはよく写真をスライドショーのように表示したい、クリックするとボタンが反応して動くアニメーションを実装したい、ページの上部にスクロールするボタンを配置したいなどの要望があります。また、ページをスクロールすると画像がフェードインするなど、ページに動きを付けるためにはJavaScriptというプログラミング言語を使用する必要があります。JavaScriptで何ができるのか、どのようにスライドショーや他のアニメーションを実装
するかなど、学ぶ必要があります。それぞれを具体的にどのように学ぶかは、ウェブデザインの時と同じく、YouTubeやUdemy、オンラインコミュニティで提供されている教育動画などを活用して、HTMLやCSS、JavaScriptの基本的な知識を学ぶ方法をおすすめします。
最初に宣言文やフォルダーの構造など基本的な作法を学びます。その後、リンクを作成するために必要なタグや文字の拡大方法、2つの画像を並べる方法など、具体的な要素を実現するためにはどのように行えば良いかといった情報を学ぶことになります。これらの学習には動画教材を活用すると効果的です。
後は、先ほどもデザインの時の模写と同じようにコーディングも模写していきます。コーディングに関しては、CHEHONになるホームページを開いて右クリックすると、「ソースの表示」という選択肢が出てくるので、それを選択して表示を修正すると、どういうコードで書かれているのかがわかります。
また、Googleとクロームの場合、ホームページを表示させた状態でF12キーを押すと、開発者モードになり、HTMLソースとCSSが表示されます。ここから、どういう風なCSSが書かれているのかも確認できます。実際にどういう風なソースコードになっているのかを確認しながら、同じように模写してHTMLやCSSのコーディングを行います。ただし、デザインの時の模写と比べて、コーディングの模写は少し難しいですが、繰り返し練習していくことで、必要なタグやCSSの書き方を覚えていくことができます。インターネット上には、テンプレートやアセンブリーのような形で、親切な人たちが作ったお手本がたくさん公開されています。それらを参考にしながら、自分の作っているホームページに取り入れることで、勉強が進んでいくでしょう。
実際には、東京などの都市では、デザインのみを専門とするウェブデザイナーとしての仕事もありますが、コーディングはできない場合もあります。ウェブデザイン専門としての需要は多く、制作会社も多いため、分業制が確立しています。しかし、地方の場合は、ウェブ制作者はウェブデザインとコーディングの両方が求められることが多く、デザインのみやコーディングのみでは仕事を得るのは難しいと思います。制作会社に入る際も、両方のスキルを持っている方がアドバンテージになるでしょう。したがって、ウェブ制作会社やウェブ制作者、ウェブデザイナーを目指すのであれば、デザインと基本的なコーディングの両方ができると良いでしょう。私ならば、必ずそうします。まずは模写を
繰り返しながら、デザインとコーディングの勉強をしていきます。現在は、動画の教材やテンプレート、お手本などが豊富にありますので、それらを上手に活用して自身のスキルを広げていくことが良いでしょう。自分ならば、そうします。
後はサーバー周りの勉強もしていくといいと思います。サーバーの勉強といっても、専門的なことを勉強する必要はありません。ホームページを公開するためのレンタルサーバーの利用方法とドメインの取り扱いに関する勉強です。
現在はたくさんのレンタルサーバーがあります。例えばXサーバ、conohawing、さくらレンタルサーバ、ロリポップなどがあります。ですので、レンタルサーバーの契約方法やサーバー契約によって何ができるのか、ホームページを公開するためにはレンタルサーバーの管理画面でどのような操作をすればいいのか、FTPの使い方やドメインの取得方法、お名前.comで取得したドメインを自分やクライアントが契約しているサーバーとどのように紐付けるのか、さらにはメールアドレスの取得方法など、これらはホームページを公開するための基礎的なスキルを習得するために覚えておくべき内容です。まずはこれらの基本的な使い方をしっかり勉強しましょう。
また、ワードプレスの使い方も重要です。現在、ワードプレスを使ってホームページを作ることが一般的です。ワードプレスを使ったウェブサイト制作も必須のスキルと言えます。ワードプレスを使えないと制作現場での競争力が低くなってしまうため、ワードプレス周りのスキルもしっかり勉強しておくことが重要です。ワードプレスのインストール方法やテーマの作り方、プラグインの利用方法など、ワードプレスを使ったウェブサイト制作に関する知識を学んでいく必要があります。
具体的な学習方法としては、まずはYouTubeでWordPressウェブサイト制作やワードプレスを使ったブログの制作方法などの動画を探してみてください。多くの解説動画が存在しているでしょう。そこでワードプレスを使ってホームページを作るための手順や必要な基礎知識を学ぶことができます。また、Udemyや他のオンライン動画教材も無料で利用できる場合がありますので、そちらも活用
してみてください。自分が契約しているレンタルサーバーに実際にワードプレスをインストールしてみて、YouTubeや動画教材の指示に従って自分でも実践してみることもおすすめです。
さらに、現在はChatGPTなどのAIモデルも利用できます。自分がウェブデザイナーとしてのスキルを向上させるためのロードマップを作成する際に、ChatGPTに質問すれば学習のためのタスクやアドバイスを得ることができます。ただし、私が学んだ20数年前と現在では独学でウェブデザイナーとして勉強する環境に大きな違いがあります。現在の学習環境は非常に恵まれているため、この恵まれた環境を最大限に活用することをおすすめします。
以上が私ならばおすすめする方法です。実際には、ウェブデザイナーとしてのスキルを向上させるために自分自身で努力を重ねる必要があります。デザインやプログラミングが初めての素人でも、コツコツと学習を進めていけば、半年後にはウェブデザイナーとしての仕事を得ることができるでしょう。
おそらくウェブサイト製作者の勉強をしていて、まず最初につまずくのはイラストレーターとフォトショップの使いどころと、その後はコーディングの部分ですね。特にコーディングが挫折ポイントとなります。この部分で挫折するかどうかで、結果が大きく変わってきます。コーディングには魅力がありますし、ビジュアルデザインにも魅力があります。
人によってはデザインのセンスがないとか、算数や数学が苦手だからプログラミングが理解しづらいと感じるかもしれませんが、もちろん個人の適性や得手不得手はあると思います。ただ、ウェブデザイナーとしての勉強の学習コストは、プログラマーなどと比べると低いです。ですから、いくつかつまずく箇所はあるかもしれませんが、現在はさまざまな学習方法が存在していますので、自分に合った勉強方法を探し、独学での壁を上手く乗り越えていってほしいと思います。
また、個人で勉強していると煮詰まったりわからない部分が出てくることもあるでしょう。そこで、現在はメンターを探すサイトなども存在しますので、私のようなメンターを利用して家庭教師のように勉強期間をサポートしてもらいながら、自身でも勉強を進め、有料ですがメンターを利用して学習スピードを上げ、早い段階で実践経験を積んでいくことが最善だと考えます。
そして、ウェブサイト制作のスキル学習が終わったら、ウェブ制作会社の面接に臨む際に持参するためのポートフォリオを作成したり、実際にWEB人材を募集している会社での面接に備えるためのポートフォリオ作成に取り組むことが重要です。自身が習得したスキルを早く収入に結びつけるために、実践の方向に進むことが賢明です。
先ほど話したように、一般的な5つの業種などに関連したタイプのホームページをいくつか制
作し、採用活動に使用できるポートフォリオを作成することが良いでしょう。このポートフォリオは、トップページを含めた基本的な5ページ程度の規模で十分です。
具体的な構成は以下の通りです。
1. トップページ
2. 会社案内や店舗案内
3. 商品ページもしくはサービスページ
4. 選ばれる理由や私たちの強み
5. お問い合わせページ
この5ページで構成されたWEBサイトを作成し、面接を受ける際に持参することで、採用担当者は「ここまでできるなら基本的なことはできそうであり、即戦力として活用できる」と思っていただけるでしょう。
また、ネットショップを運営している会社の場合は、バナー制作のスキルも必要ですので、IllustratorやPhotoshopを使用してWEBサイトの模写をしながら、気に入ったバナーをピックアップし、同様にバナーを制作することで、基本的な制作スキルを学ぶことができます。
以上のように、IllustratorやPhotoshopを使用したWEBデザインやコーディング、WordPressの扱い、サーバー契約、そしてバナー制作などのスキルを習得することができれば、早急にポートフォリオを作成し、採用活動に取り組むことをおすすめします。
前にも言ったけど、20代なら制作会社に入って、先輩からいろいろ教わりながらホームページをたくさん作って現場経験を積んでいきながら、制作スキルを磨いて実績を作り、独立したり起業したりしてフリーランスとして仕事を請け負う流れがおすすめだと思います。
しかし、30代後半から40代でWEBデザイナーデビューする場合、制作会社への就職はかなり厳しいです。そのため、制作会社にはアプローチせずに、自社でWEBサイトやネットショップを運営している会社やお店に潜り込んで正社員やアルバイトとして採用してもらう方が良いです。最初は安くても良いので安定した給料をもらいながら実績と信用を積み上げ、会社と交渉して時給やリモート勤務についての交渉を進めながら、他の会社の仕事も受けながら報酬を増やしていく方法をオススメします。
30代後半になると家族を持っている方も多いと思いますし、20代のように少し給料が安くても何とかなるという年齢ではありません。月給20万では家族を養うのは厳しいと思いますので、最低でも25万円、できれば35万円くらいの給料が欲しいと考えた場合、1社で35万円は厳しいですが、10万円を5社からもらえるなら収入は50万円になります。
では、WEB担当者を求めている会社を見つける方法ですが、ハローワークや求人情報誌には結構な数の会社が掲載されていますので、まずはハローワークで探してみることをおすすめします。
ただし、残念ながらWEB制作の世界では年齢の壁というものがあります。特にクリエイティブな商売においては、雇う側も若い人を好む傾向があります。
私自身、以前勤務していた会社で採用を担当した経験があるため、募集案内には年齢不問と書いておきますが、実際に20代と40代がいた場合、採用するのは20代を優先します。これは仕方のないことです。そのため、そのあたりはそういうものだと受け止めて取り組むしかありません。
ただし、40代だからと言って完全にチャンスがないわけではありません。なぜなら、40代には20代にはない経験があるからです。例えば、アパレル業界でずっと働いてきた方や製造業で経験を積んできた方もいるかもしれません。ウェブの仕事はしてこなかったかもしれませんが、年齢を重ねていればそれなりに社会経験があります。この経験は20代にはない大きなアドバンテージだと自信を持って良いです。
例えば、アパレル業界にいた方なら、SNSの使い方やお客さんの喜ぶポイントなど、アパレル業界での経験を活かすことができるでしょう。また、ホームページを作る際にも、アパレル業界に精通しているからこそのアドバイスができます。経験した職種によっては専門用語も知っていると思います。年齢を重ねて経験してきたことは、ホームページ制作において20代にはないアドバンテージとなりますので、その経験値をどのように活かしていくかを考えていけば良いです。このような経験は、実際に企業に直接潜り込んだ際に生かすことができますし、採用やアプローチの際にも話のネタとして広げることができると思います。自身の経験に自信を持って良いですし、それについては気にする必要はありません。
今回、もし自分が20代でウェブデザイナーとして学び始める立場だったら、どのようなロードマップで学んでいくかや仕事の取り方について、私ならこうしますということをお話ししました。私の話が必ずしも参考になるとは限りませんが、こういう風に学んでいく方法があることを知ってもらえれば幸いです。
コメント