結論を3行で
1. Webデザインの仕事は、見た目を設計する「デザイン」と、それをブラウザで動く形にする「コーディング」の二段構えでできています。
どんな場所で働くことになるのかが気になる方は、札幌のA型事業所は「作業所」じゃないもご覧ください。
2. 札幌・東区役所前駅直結のA型事業所ネクサスリンクでは、ネットショップのバナーや実店舗のPOP、WordPressの更新まで、実際に使われるものを作りながら両方の工程に未経験から関われます。
3. ハイスペックPCとPhotoshop・Illustratorは事業所に完備。AIも日常的に使いながら、職員が隣についてPC操作の基礎から一歩ずつ進みます。
「Webデザインに興味はあるけれど、デザインセンスに自信がない」「コードって難しそう」。そう感じて一歩を踏み出せずにいる方は多いと思います。この記事では、札幌の就労継続支援A型事業所ネクサスリンクの現場で実際に行われているWebデザインの仕事を、「デザイン」と「コーディング」の2つの工程に分けて、未経験の方向けに具体的に紹介します。
Webデザインの仕事はデザインとコーディングの二段構え
1本のホームページができるまでには、大きく分けて次の流れがあります。
- 企画・構成：誰に何を伝えるページかを決め、載せる内容を整理する
- デザイン：配色・文字・写真の配置を決め、完成見本（カンプ）を作る
- コーディング：デザインをHTML・CSSなどのコードで、ブラウザに表示される形にする
- 公開・運用：サーバーに公開し、更新や修正を続けていく
Web制作の現場では、この工程を「デザイナー」と「コーダー」で分業することが多く、求人もこの2つに分かれていることがよくあります。つまり、「絵を描くのは苦手」でもコーディングで活躍できるし、「コードは怖い」ならデザインから入ればいいのです。
ネクサスリンクはEC・IT・Web・バックオフィスに特化したA型事業所で、自社とグループのネットショップ・実店舗・Webサイトを実際に動かしています。だから、この工程全体が事業所の中に仕事としてあるのが特徴です。会社全体の業務はEC・IT・Webのサービス紹介ページにまとめています。
ネクサスリンクのデザイン工程 実際に作っているもの
何を作っているのか
ネクサスリンクのデザイン工程で利用者さんが作っているのは、たとえばこんなものです。
- ネットショップの商品ページ画像・バナー（EC運営と連携して「買いたくなる見た目」を作る）
- グループの実店舗で使うPOP・ポスター（セール告知、商品案内など）
- Instagram投稿やリール動画のサムネイル
- Webページの完成見本（カンプ）、名刺・チラシなどの紙もの
どれも練習用ではなく、お客様の目に実際に触れるものです。大事なのは、Webデザインはアート（自己表現）ではなく設計（伝える工夫）だということ。配色にもレイアウトにも「読みやすさのルール」があり、ルールを覚えれば未経験からでも形になります。センスは入口の条件ではありません。
AIに案を出させて「選んで整える」のがネクサスリンク流
ネクサスリンクのデザインの進め方には特徴があります。「3:4の縦長ポスター、赤を基調、明るく賑やか」のようにAIに具体的な仕様を伝えて複数の案を出してもらい、いちばん伝わるものを選んで微調整する――考える時間を「選ぶ時間」に変えるやり方です。実際、AIでの作り方を教わって約10分、その日のうちにPOPを仕上げられるようになった利用者さんもいます。利用者さんが作った実物のPOPはA型事業所でAIを”使いながら覚える”で公開しているので、ぜひ見てみてください。
道具はぜんぶ事業所にある
事業所のハイスペックPCには、プロ用のAdobe Photoshop・Illustratorが完備されています。個人で契約すると高額なソフトを、自己負担なしで実務の中で覚えられます。初心者はまずCanvaのような直感的なツールでバナー作りから始めるので、「いきなりPhotoshop」の心配もいりません。名刺・チラシなど紙ものデザインを含めた仕事の全体像は札幌のA型事業所でデザインの仕事って？で詳しく紹介しています。
ネクサスリンクのコーディング工程 デザインを動く形にする
何をしているのか
コーディング工程では、デザイン工程で作った見本をHTML（ページの骨組み）とCSS（色や配置の指定）で組み立てます。ネクサスリンクで実際にある業務は、自社・グループサイトのWordPress更新、ページやLPのコーディング、表示くずれの修正、ネットショップのテンプレート調整などです。
コードを保存してブラウザを更新すると、その場で画面が変わる――この「すぐ結果が見える」感覚が、コーディングのいちばんの面白さです。慣れてきたら、JavaScriptで動きをつけたり、AIと対話しながらコードを書く進め方（バイブコーディング）に挑戦したりと、できることが広がります。
「デザイン通りに、正確に」が最大の価値
コーディングで求められるのは、ひらめきよりも正確さと根気です。余白のズレ、色の違い、リンクの張り間違いに気づいてコツコツ直せる人が、現場ではいちばん信頼されます。この道をさらに進んだ先――PHPでの開発や業務ツールづくりなど、プログラミング全体の仕事内容は札幌でプログラミングを学べるA型事業所 どんな仕事をする？で紹介しています。
未経験からの進め方 職員が隣につくネクサスリンクのサポート
ネクサスリンクでは、いきなり「ホームページを1本作って」とは言いません。次のように一段ずつ進みます。
- PC操作の基礎：マウスの持ち方・タイピングから。職員が隣について一つずつ
- Canvaでバナー作り：配色・文字組みの基本ルールを、手を動かして覚える
- HTML・CSSの基礎：小さなページを組んで、コードと画面の関係をつかむ
- 実際の業務へ：商品ページ・バナー・POP・WordPress更新など、実案件に参加
間違えても大丈夫です。ネクサスリンクでは職員が作業を随時見ているので、ミスはその場で一緒に直します。「あとでまとめて指摘される」形ではないから、未経験でも安心して手を動かせます。スピードも最初は求めません。
働く環境と1日の流れ 東区役所前駅直結のデザイナーズオフィス
ネクサスリンクは、地下鉄東豊線「東区役所前駅」直結（セレスタ札幌1階）。雪の日も雨の日も、外をほとんど歩かずに通えます。天井が高く開放的なオフィスで、いわゆる”作業所”のイメージとはかなり違う環境です。人との距離に不安がある方は、ヘッドホンをして一人で黙々と作業に集中してもOKです。
| 時間 | Webデザイン業務の1日（例） |
|---|---|
| 9:30 | 出勤・朝礼・今日のタスク確認 |
| 午前 | バナー制作やPOPのデザイン、ページのコーディングなど |
| 12:30 | 200円の日替わりまかないランチ |
| 13:30 | 午後の業務。職員に相談しながら仕上げ・修正 |
| 15:00 | 退勤 |
雇用契約を結ぶので最低賃金が保証され、週20時間から体調に合わせて働けます。時給や月収例は給料・労働条件のページで具体的な数字を公開しています。
デザイン向き？コーディング向き？両方試して決められる
どちらの工程が合うかは、性格や特性によって傾向があります。目安を表にしてみました。
| タイプ | デザイン工程向き | コーディング工程向き |
|---|---|---|
| 好きなこと | 色・写真・レイアウトを眺める、作る | パズル、ルール通りに組み立てる |
| 考え方 | 視覚で考える、感覚を言葉にできる | 筋道を立てて考える、原因を探すのが好き |
| 強みになる特性 | 細部の違和感に気づける観察力 | 几帳面さ、正確さ、集中の深さ |
| 達成感の瞬間 | 「見やすくなった」と言われたとき | 書いた通りに画面が動いたとき |
ネクサスリンクでは決めてから入る必要はありません。両方の工程が事業所の中にあるから、やってみてから選べます。「両方やったら、意外とコーディングが楽しかった」という方も多くいます。几帳面さや「指示通りに正確にやる力」がITの現場でどう武器になるかは発達障害の几帳面さが武器になる働き方で、音や光がつらい方への配慮は感覚過敏に配慮した環境で紹介しています。
もし両方試して「Web系は合わないかも」と感じても大丈夫。ネクサスリンクにはデータ入力、動画編集、飲食などほかの仕事もあり、事業所を変えずに仕事を変えられます。詳しくはITの仕事が合わなかった方への働き方の見直し方をどうぞ。
身につけたスキルはその先へ 一般就労までの道
ネクサスリンクで積んだデザイン・コーディングの実務経験は、「作ったもの」がそのまま実績になります。面接で「A型事業所で実際のネットショップのバナーやWordPressの更新を担当していました」と具体的に語れるのは、大きな強みです。ネクサスリンクには提携企業への就職斡旋の仕組みもあり、一般就労への道筋を一緒に考えます。
スキルの活かし方はA型で身につけたスキルが一般就労につながるキャリア、経験の書き方は履歴書・職務経歴書の書き方で解説しています。学んだ内容をITパスポートなどの資格で形にしたい方には、合格時に受験料を全額補助する資格受験費用補助制度もあります。
よくある質問
デザインセンスがなくても、Webデザインの仕事はできますか？
できます。Webデザインはセンスではなく「読みやすさのルール」を積み重ねる設計の仕事です。配色や文字組みには型があり、型は練習で身につきます。ネクサスリンクではAIにデザイン案を出してもらい、そこから選んで整える進め方も日常的に使っています。
デザインとコーディング、どちらから始めればいいですか？
決めてから来る必要はありません。ネクサスリンクでは両方を少しずつ試せるので、手を動かしてみて「楽しい」と感じたほうを深めるのがおすすめです。
ソフトやパソコンは自分で用意する必要がありますか？
いいえ。事業所のハイスペックPCにPhotoshop・Illustratorなどのソフトが完備されているので、自己負担なしで実務用の環境を使えます。
見学だけでも大丈夫ですか？
もちろんです。実際の制作風景やツール環境、オフィスの雰囲気を見て、自分に合いそうかをゆっくり確かめてください。地下鉄東豊線「東区役所前駅」直結なので、冬でも通いやすい立地です。見学と体験と面接の違いは見学・体験・面接はどう違う？で整理しているので、はじめての方はこちらもどうぞ。
Webデザインの仕事は、「デザイン」と「コーディング」の二段構え。絵が得意な人だけの世界でも、理系の人だけの世界でもありません。駅直結のオフィスで、200円のランチを楽しみに通いながら、実際のネットショップやWebサイトを舞台に手を動かす――そんな働き方が、ネクサスリンクにはあります。まずは見学・体験から、お気軽にどうぞ。
札幌市東区の就労継続支援A型事業所ネクサスリンクでは、見学・体験を随時受け付けています。日程が決まっていなくてもお申し込みいただけます。
見学・体験のお問い合わせ
見学だけ、話を聞くだけでも構いません。
日程が決まっていなくても、お申し込みいただけます（下の日付は空欄のままで送れます）。
体験時に、日替わりランチを無料でお試しいただけます。
札幌市東区の就労継続支援A型事業所ネクサスリンク
