webデザイナーの実務未経験から応募するには、どのような会社が良いですか？ デザインツールからコーディング、WordPr…

Question

webデザイナーの実務未経験から応募するには、どのような会社が良いですか？
デザインツールからコーディング、WordPressなどの基礎知識はあります。

Answer 1

ランディングページ制作はテンプレが既に出来上がってたりするので、意外とハードルは低めだったりします。

Answer 2

ECの運用担当なんかは比較的就業ハードルが低いです。

コーディングがしっかりできるならコーダーとしてWeb制作会社に入るのも良いでしょう。

Answer 3

>webデザイナーの実務未経験から応募するには、どのような会社が良いですか？

Web系はフリーランスが基本で、奇跡でも起こらない限り就職は無理と思って下さい。
なので「未経験可」で募集している場合は怪しいと思って下さい、恐らくSES(客先常駐)に放り込むのが目的。
もし研修が有ったとしても、コーディングの場合、プロレベルは難易度が高いので、そんな研修程度では夢のまた夢です。
それで(コーディングの)ポートフォリオを作って、ベンダーに送ったところで、当然 案件など取れる訳も無いですが、「案件が取れるまでSES(客先常駐)で働いて下さい」と言われて、SES(客先常駐)に放り込むのがオチです。

>デザインツールからコーディング、WordPressなどの基礎知識はあります。

Webデザイナーは「Photoshop、Illustrator」などで(pxで)デザインカンプ(データ)を作ります(それがWebデザインです)。
つまりWebデザイナーは「Photoshop、Illustrator」のどちらかが必要と言うことです(業界標準です)。
コーダーはそのデザインカンプ(データ)を元に、(pxをvwに換算して)コーディングします(なので基本的にWebデザイナーはコーディングしませんし、コーダーはWebデザインはしません)。
稀に「Webデザイナー+コーダー」の兼業者も居ますが、Webデザイナーとコーダーは完全に別業種です。
なおコーダーはそのデザインカンプ(データ)を見るために、一般的に「Photoshop、Illustrator」をマニュアルを見ずにバリバリ使えるようにしておけと言われているようです(マニュアルを見ながらチマチマやってたら納期がキツくなるので)、つまりコーダーは「Photoshop、Illustrator」が必須と言うことですが、プロなら「XD」も揃えとけと言われています(XDは「Photoshop、Illustrator」で何か問題が発生した場合の保険と言う意味合いが強いようです)。
稀に「XD、Figma」の案件も有るようですが、これからはFigma案件は増えていくかもしれません。

なお(コーディングの練習に「Photoshop、Illustrator」が必須だと勘違いしている人が稀に居ますが)コーディングの練習には「Photoshop、Illustrator」が必須な訳ではありません。
モチロン最終的にはコーダーも「Photoshop、Illustrator」をバリバリ使えるように練習が必要ですが、それは本当の最終段階に成ってから「Photoshop、Illustrator」をバリバリ練習すれば良いでしょう(先に買ってしまって、途中で挫折したら、お金の無駄なので)。

もしも フロントエンド(プロ)を目指すなら、下記を理解でき具現化できてフロントエンド(プロ)の"基礎"レベルです、本職のフロントエンド(プロ)になるには更に上のレベルが要求されます。
初心者やフロントエンド(プロ)を目指さない場合は、そんなこともあるんだな～程度に流して読んでおけば良いですが、(フロントエンド(プロ)を目指さないにしても)欠陥Webページだと解像度によっては見にくくなってしまう場合も有ります。
バックエンド(プロ)を目指す場合も、フロントエンドは そこまでガッツリやらなくて良いです。
ここで言っているフロントエンド(プロ)とは、あくまでもコーダーの事です。

「特定の解像度に依存しない実用的なWebページ」詳解
http://ashtarte.pa.land.to/utf8/smt.cgi?r+twilight/&bid+0000031C&tsn+0000031C&bts+2022/04/27%2016%3A47%3A37&

例えばそれを理解せずにポートフォリオを作って、ベンダーに送った所で、素人の遊びぐらいにしか評価され無いのでご注意下さい。

(デザインカンプはpxで作成されていますので)フロントエンド(プロ)を目指すなら、当然px→vwの換算が必須になります、px→vwの換算は四則演算(＋、－、×、÷)とパーセントの概念さえ理解できていれば特に難しいことはありません(パーセントの計算も単なる四則演算なので、結局のところ全て四則演算です)、勉強用なら1pxぐらいズレても、全然 気にしなくて良いです。
※なお、フロントエンド(プロ)を目指さないならpx→vwの換算は全く必要ありません。

フロントエンド(プロ)を目指すなら、下記のコードを見ずに、CSSで その挙動を再現できるレベルを推奨します。
なおCSSで出来るよるなことをJavaScriptで書いたらベンダーに基本が出来て無いスキルの低い人だと評価されます。
(ベンダーは基本的にJavaScriptよりもCSSを重視するので)「HTML、CSS」のみの案件で、無暗にJavaScriptを使うと、恐らくベンダーにダメ出しされて、CSSで書き直すように言われるでしょう(ただしPolyfillは使って良いです)。

高度なCSSの勉強法としては、下記のような既存のCSSを気の済むまでバリバリ改造してみると良いでしょう(プロの仕事で既存のCSSコードをコピペすると著作権法･違反になる可能性があるので ご注意ください)。
なお 高度なCSSの独学には根性が必要です(当方は全く根性が無いので習得に長期間かかってまってますが)、もしメンターを雇う場合には高度なCSSの知識があるのか確認したほうが良いでしょう(メンターを雇うのも有りですが、それでも理解できないようなら諦めるしか無いでしょうけど)。

CSSデモ集(-)
http://ashtarte.pa.land.to/utf8/smt.cgi?r+twilight/&bid+0000025C&tsn+0000025C.&

もしフロントエンド(プロ)を目指すなら、(案件で改造して使えるように)当方のCSSデモ集よりも遥かに大量のストックを作っておくのが常識です。
フロントエンド(プロ)では、簡単に改造して使えるようにSassで記述する人も居ます、単にSassで記述すれば良いと言う事では無く、如何に改造しやすく記述するかが腕の見せ所になります(Sassで記述しても改造しやすくならなかったら、無駄なだけですので)。

現在は「PC画面、タブレット画面、スマホ画面」などの画面･解像度ごとにレイアウト構成を変えることが推奨されています(レスポンシブ･デザインと言う手法が推奨されています)。
それはあくまでも推奨なのでアマチュアならそこまでガッツリやらなくても良いです(フロントエンド(プロ)なら当然 必須)。
下記はワイヤー･フレームの一例です(それはレスポンシブ･デザインのイメージでも有ります)。
※プロなら4パターン、5パターンのレイアウト構成も普通に有るようです。

//images.app.goo.gl/c6DPhnTj5Xrw1GcQ7
※3パターンの場合

//images.app.goo.gl/Wu8gBmoLJiyRK8Qn6
※3パターンの場合

下記はブレイク･ポイントで画像のレイアウト構成が変化するだけの単純なデモです。
とりあえずChromeモバイル･エミュレーターで一般的には約「300px～3000px」解像度でチェックしてみると添付画像のようになります。
そのコードを確認したい場合は、Chromeの開発者ツール(デベロッパー･ツール)で参照して下さい。
(プロを目指さない場合でも)最低限「Chromeの開発者ツール(デベロッパー･ツール)、Chromeモバイル･エミュレーター」ぐらいは使えるようにしないと困ります。
添付画像の左からPC画面のレイアウト構成、タブレット縦画面のレイアウト構成、スマホ縦画面のレイアウト構成(どれもページ内の画像は10個だと言う事に注意して下さい)。
なお一般的にタブレットの横画面はPC画面と同じレイアウト構成にします。
そのレイアウト構成をレスポンシブ･デザインで具現化します。

【ユーザー･フレンドリー･デモ】 (ブレイク･ポイントで画像のレイアウト構成が変化する)
http://xd305417.html.xdomain.jp/responsive/001
※それは(メディアクエリは除き)全てvwで指定されていることに注意して下さい。

それを完璧に理解したら、実際にポートフォリオを作ってみると良いでしょう。

プロなら6k解像度モニターぐらいは使ってるかもしれませんので、ポートフォリオを作成するならChromeモバイル･エミュレーターで約「280px～6000px」解像度ぐらいのチェックが必要になるので、Chromeモバイル･エミュレーターぐらい使えないようではプロは無理と思って下さい。

Chromeモバイル･エミュレーターの操作法
http://ashtarte.pa.land.to/utf8/smt.cgi?r+sara/&bid+0000052B&tsn+0000052B&bts+2021/11/29%2015%3A52%3A51&

Answer 4

当たり前ですが募集要綱に実務未経験可と書いてあれば選考の対象になります。WEBデザイナーは実務経験者を求めてるところが多いのでその記載があるかを見とけばいいのでは。あと多くはないですが募集要綱に実務経験と書いてあっても同等の知識があれば未経験でも面接してくれるところはあります。ただしそれなりのポートフォリオは求められます。