Webデザイン制作完全マスターPro講座

 Discover the best Web Designer Pro lessons

ebデザイナープロコースで本格的にHTMLとCSSコーディングを学ぶ

 講師陣

全ての先生は、超が付くほど優しい!

京都市でホームページの作り方や、Webデザイン・DTPデザイン・Artデザインを専門に学べる「アートビスケットデザインスクール」では、超優しい先生があなたの学びをサポートします。アルファ波たっぷりのハイレゾ音楽が流れるリラックスした空間で、先生の丁寧な指導を受けながら、自然にスキルが身に付くレッスンをお楽しみください。

パソコン学習においては、国家検定である「Webデザイン技能士」の合格指導や、パーソナルコンピュータ認定試験の「Photoshop®クリエイター能力認定試験」、「Illustrator®クリエイター能力認定試験」に対応したレッスンも行えます。

卒業生インタビュー

「学び直す勇気が、人生を変えてくれた」

パソコンやタブレットで絵を描くことは、「自分には無理だ」と思っていた。

けれど心のどこかで、もう一度なにかを始めたい、という声も聞こえていた。

アートビスケットデザインスクールには、そんな「最初の一歩」を踏み出した人たちが集まってくる...

卒業生インタビュー

短編ビデオCM

Video 1

 Promotion Video

 Webデザイナープロコース

Webサイトを制作するために、HTML、CSS、JavaScript などのマークアップ言語やプログラミング言語を学び、オリジナルのサイトを自由にデザインできるスキルを身に付けませんか?
「HTML, CSS, JavaScript, cgi」のコーディング技術を修得

Webデザインの世界に興味があるけれど、何から始めればいいかわからない...そんな初心者の方にぴったりなのが、このコースです。

当スクールでは、Webデザインの作り方や色の組み合わせ、IllustratorやPhotoshopの使い方などを、先生がわかりやすく丁寧に教えてくれます。

さらに、「HTML」や「CSS」「JavaScript」「cgi」を使ったコーディングにもチャレンジ!

自分のデザインを実際にWebページとして形にできるようになります。

ゼロから学びたい人も、将来Webデザイナーを目指したい人にもおすすめです。

スクール受講とオンライン受講を選択できます!

学び方は、自分のスタイルに合わせて選べます。

  • 教室で先生と一緒に学ぶ「プライベート講座
  • 自宅や好きな場所から学べる「オンライン講座

どちらを選んでもOK!途中で切り替えることもできるので安心です。

オンライン講座では Zoom を使って行います。

パソコンがあればすぐに始められますよ。

詳しい使い方は、下のページをご覧ください。

はじめてのオンラインZoom講座

Photoshop icon
 Adobe Dreamweaver

完成イメージを確認しながらページを作成できるWebデザインソフトウェア

Sublime Text
 Sublime Text

Webデザイン技能士(国家資格試験)対応、HTML/CSSコーディング作成用テキストエディター(無料)

就転職に人気が高いWebデザイナーを養成する「Webデザイナープロコース」

スペシャリストを養成

スペシャリストを育てる実践カリキュラム

Webデザイナー(Web Designer)とは、Webサイトのデザインから構築までを手がける、インターネット時代のクリエイティブな専門職です。

本コースでは、Webデザインの基礎知識から、実際にホームページを制作するための技術までを段階的に学びます。

デザインの考え方、配色、レイアウト、画像加工、そしてHTML・CSSによるコーディングなど、「現場で求められるスキル」を一つひとつ丁寧に身につけていきます。

経験豊富な講師による温かく丁寧な指導で、初心者の方でも安心して学べる内容です。

学んだ技術は、就職・転職・フリーランス活動にも大いに活かせます。

コーディング技術を身につけて国家資格にも挑戦!

授業では、無料で使えるテキストエディター「Sublime Text」を使いながら、HTMLCSSなどのコーディング技術を実践的に学びます。

HTML, CSS, JSコーディング

また、PhotoshopIllustratorを使用した画像編集のスキルも習得。

デザインから制作までを一貫して行えるWebデザイナーを目指します。

最初は覚えることが多く感じるかもしれませんが、基礎から順に理解すれば、確実に身についていきます。

経験豊富な講師が、一人ひとりの進度に合わせてサポートしますので安心です。

本コースでしっかり基礎を固めれば、国家資格である「Webデザイン技能士(1〜3級)」にも挑戦できます。

国家資格(厚生労働省)

Webデザイン技能士

学ぶ環境も安心のサポート体制

長年にわたり多くのデザイナーを育ててきた当スクールは、実務経験を積んだ講師陣によるプライベート制の丁寧なレッスンが特徴です。

「Web業界で活躍したい」「手に職をつけたい」という方を、基礎からプロのレベルまでしっかり導きます。

Webデザインの基礎を学ぶ

Web Designer Pro Course

(修了後のアフターフォローも万全!)

学習の流れ Part 1

Webデザイナーの基礎をマスター

  • ① コンピューターの基礎
  • ② Mac/Windowsの基礎
  • ③ デザインの基礎
  • ④ カラーコーディネイトの基礎
  • ⑤ HTMLの基礎
  • ⑥ PHPの基礎
  • ⑦ CSSの基礎
  • ⑧ JavaScriptの基礎
  • ⑨ cgiの基礎
  • ⑩ Responsiveの基礎
  • ⑪ Animationの基礎
  • ⑫ OGPの基礎
  • ⑬ サーバー設定の基礎
  • ⑭ FTPの基礎
  • ⑮ SSLの基礎
  • ⑯ セキュリティの基礎
  • ⑰ 生成AI導入の基礎

学習の流れ Part 2

Webデザイナーの応用を実践

  • ① 最新Bootstrapの活用
  • ② Slider導入
  • ③ Map導入
  • ④ 動画導入
  • ⑤ JavaScript アニメーション導入
  • ⑥ Google fontsの活用
  • ⑦ Font Awesomeの活用
  • ⑧ CMS導入
  • ⑨ 高度 SEO/検索エンジン最適化
  • ⑩ 先端 Home Page 制作実践
  • ⑪ 先端 WordPress 制作実践
  • ⑫ Webデザイン関連ソフトの基本操作
  •    Sublime Text
  •    Dreamweaver
  •    Photoshop
  •    Illustrator

 習得できるスキル 11

習得できるスキル
Webサイト

Webサイト制作基礎

Webサイト制作に必要なスキルやツールは何が必要なの?など、Webサイト制作の基本的な構造と制作プロセスが明確に理解できます。

カラーデザイン

カラーデザイン

デザインをする中で「配色をどうしよう?」と、悩まれないための技を身につけます。Web制作に直結するカラースキルが得られます。

HTML

HTML

Webサイト制作では、デザインや内容をコンピューターへ理解させるため、目印を記述した「HTML」マークアップ言語を完全マスターします。

CSS

CSS

Webページのスタイルを設定する「CSS」プログラミング言語を習得、目的に合わせレイアウトやデザインを自由に設定できるようになります。

HTML/CSSコーディング

コーディング

創作したデザインを、Webサイト上で再現するために、仕様書に従いコードを記述し、Webブラウザ上で「見える形」にしていきます。

Photoshop

Photoshop

画像を美しく描写させるためのカラーモードや色調補正、チャンネル機能などの基本知識や自在に活用できるような操作方法を総合的に学びます。

Illustrator

Illustrator

イラストやロゴ制作の基本操作方法、図形の作成、パスの描画、文字の加工、キレイなマップの作成、表組みやグラフ作りなどを学びます。

セキュリティ

セキュリティ

自社サイトや利用者の個人データなどを保護する上でニーズ急拡大中!不正アクセスやデータの盗難、改ざんなどからシステムを守る方法を学びます。

JavaScript

JavaScript

「JavaScript」はウェブページをアニメーション可するなど、動きのあるデザインを表現する際に使われるプログラミング言語です。実装方法などを実践的に学びます。

セキュリティ

cgi

「cgi」とは訪問者数表示カウンターや、アンケートやお問い合わせ、ネットショッピングなどの申し込みや決済、掲示板・チャットなどの機能提供時に使います。

SEO対策

SEO対策

「SEO対策」とは検索エンジンからサイトに訪れる人を増やす方法。特定のキーワードで検索した際に検索上位にサイトが表示されるための技をマスターします。

 Webを学んで良かった(生徒さんの感想より)

National qualification

webデザイン技能士(国家資格試験)

  • ① 受験指導
  •    3級指導
  •    2級指導
  •    1級指導

本講座はオプションで対応いたします。ご希望の方は、担当講師に直接お申し付けください。レッスン時間の範囲内で指導させていただきます。別途費用は必要ございません。

試験区分は1級から3級までが存在しておりますが、特に2級と1級には受験資格が必要なので、申し込む前に注意が必要です。webデザイン技能検定は、Web業界唯一の国家資格で、Webデザイナーを目指す上で必要となる知識や技術が問われる試験です。

  •  3級
  • 学科試験と実技試験の2つに分かれています。webデザイン技能検定3級の難易度はそれほど高くなく、誰でも合格しやすいレベルであるといえます。近年のwebデザイン技能検定3級の合格率は60%〜70%です。当スクールでしっかりと試験対策を行い、基本的な勉強をしておけば十分に合格を狙えるでしょう。
  •  2級
  • 学科試験と実技試験の2つに分かれています。受験資格は2年以上のWeb制作の実務経験や、Web制作に関する学校で教育を修めた経験がある、もしくはwebデザイン技能検定3級に合格している必要があります。
  •  1級
  • 1級も、2級や3級と同じく学科試験と実技試験の2つに分かれていますが、学科試験に合格している人だけが実技試験を受けることができます。また受験資格として学科試験を受ける際に、7年以上の実務経験を有する者、など厳しい条件が設けられています。

詳しくは、「特定非営利活動法人インターネットスキル認定普及協会」のホームページをご覧ください。

Webデザイン技能検定 - ウェブにかかわる全ての人のための、国家検定

Job description

Webデザイナーの仕事内容

Webサイトの使いやすさや見た目の美しさをデザインし具現化する仕事!

 仕事の流れ
  1. クライアントにWebサイトの目的を確認、ターゲットの設定、コンテンツ、デザインや配色の好みなどを、Webディレクターと共に具体的に聞き出します。
  2. 聞き込み内容をベースにトップページの大まかなデザインレイアウトを準備、その後、サブページの構成を設計図であるワイヤーフレームに作成。
  3. デザイン案は、Web全体の配色やグラフィックイメージを準備、ロゴやバナー、アイコンなども加え完成イメージを具体化します。
  4. デザインの承諾をクライアントから得られたら、htmlコーディングの作業に入ります。その後、CSSでカラーや見出しなどの装飾を指定し、動きがあるものに付いてはJavaScriptの実装を行います。
  5. 仕上がったWebサイトをクライアントに仮納品し、最終確認を行いWebサイトが完成します。

Annual income

Webデザイナーの年収モデル

以下は、国内の就職情報・調査データをもとに、あくまで“目安”として整理した、Webデザイナーの年収モデルです。実際の年収は、スキル、勤務企業、地域、業務範囲、フリーランスかどうかなど多くの要因で変わるため、参考としてご覧ください。

主な平均値・全体傾向

  • 平均年収:約340万〜400万円程度。
  • また、別の調査では約480万円前後という値も報告されています。
  • フリーランスでは、案件次第で600万円以上〜1000万円以上を実現している例もあります。
 経験年数による平均年収

収入は目安であり、実際の支給額は地域やご自身の経験やスキルなどにより変動します。
賞与は含んでいません。

実務経験 月収 年収
1年未満 約23万〜25万円 約300万円前後
1~2年 約25万〜28万円 約330〜350万円
2~3年 約27万〜30万円 約350〜380万円
3~5年 約30万〜33万円 約380〜430万円
5年以上 約33万〜38万円以上 約500〜600万円以上
経験豊富なWebデザイナーやスペシャリスト
(管理職・上級)
約35万〜45万円以上 720万円
フリーランス 非定型(月収変動) 約400万円〜1,000万円以上
(スキル・案件次第で変動)

※月収モデルは賞与・手当を除く通常給与換算の目安です。

※フリーランスは収入の幅が非常に大きいため、「〜以上」表記としています。

補足・注意点
  • 経験年数が長くても、スキル(コーディング/UI・UX/マーケティング等)や案件規模・役割(デザイナー → ディレクター)によって年収に大きな差が出ます。
  • フリーランスの場合、安定性は低いものの、高収入を狙えるポジションもあります。
  • 地域・会社規模・業種によっても年収水準が変動します。
  • 上表はあくまで「目安」であり、個々の条件・実績により上下します。

ホームページをより簡単に作成できるAIによる自動コーディングサービスが成長、しかし、時代のニーズは個性であり独創的なデザインの素晴らしさや、使いやすさ検索上位表示技術が今後ますます要求されています。

私たちの提供するWebデザインのレッスンでは、このことを重視し、他スクールでは通常行わないデザイン技法や検索上位表示技術について、より深く学べるようカリキュラムを組んでいます。

ブラシで描くようにデジタル画像アプリを操作

Adobe CC(最新版)

本コースでは最新ソフトを使用し学習します。


もし貴方が旧バージョンをご希望の場合、そのバージョンで学習することもできます。

対応バージョン: CS, CS2, CS3, CS4, CS5, CS6, CC, CC (2014), CC (2015), CC (2016), CC (2017), CC (2018), CC (2019) / CC (2020) / CC (2021) / CC (2022) / CC (2023) / CC (2024) / CC (2025) / CC (2026)

Photoshop, Illustrator などのソフトをセットでお求めになられますと安くなります。また、アートビスケットデザインスクール学生超割引などもございます。

Web Designer Business Course

レッスン料金

01 プライベート講座の教室

プライベート講座

 週1回/予約制
受講回数/基本
  • 受講回数:全48回修了(追加受講可)
  • 受講時間:各60分
  • 補習可能:下記に解説あり(注1)
受講期間
  • マスターできるまで完全指導
入会金(初回限り)
  • 19,800円(税込)
受講料(1回あたり)
  • 4,950円(税込)
お支払い方法
  • 4回毎の前払い
  • クレジット・デビットカード決済
  • 現金納付
  • 銀行振込
 プライベートレッスン

プライベートレッスンとは、一般的に講師と生徒が1対1、もしくは生徒2名で行われるレッスンを指します。受講生のペースに合わせて授業を進められるため、自信を持って学習を続けることができます。個々の能力に応じてスキルアップが可能ですので、学習についていけないという心配はありません。


 知りたいところだけを学ばれたい方

4回レッスン毎のお支払いで、ご受講ください。途中修了していただくか、他のコースにチャレンジしていただくこともできます。途中終了の場合の過払い納入金は精算の上、返金させていただきます。

 補習として、もう少し学ばれたい方(注1)
  • マスターできるまで追加期間を設け親切指導させていただきます。
  • 追加料金:1回 4,950円(税込)/1時間×希望回数分

 PC/Adobeソフト使用料
  • 必要な方:1レッスンに330円(税込)×4回分を月謝に加算し別途お支払いください。
  • 自前でご持参の方:料金不要
02 オンライン講座の教室

オンライン講座

 週1回/予約制
受講回数/基本
  • 受講回数:全48回修了(追加受講可)
  • 受講時間:各60分
  • 補習可能:下記に解説あり(注1)
受講期間
  • マスターできるまで完全指導
入会金(初回限り)
  • 19,800円(税込)
受講料(1回あたり)
  • 4,950円(税込)
お支払い方法
  • 4回毎の前払い
  • クレジット・デビットカード決済
  • 現金納付
  • 銀行振込
 オンラインレッスン

オンラインレッスンとは、自宅や好きな場所からパソコンを使って、リアルタイムで講師とコミュニケーションを取りながら学べます。一般的に講師と生徒が1対1、もしくは生徒2名以下の少人数で行います。個々の能力に応じてスキルアップが可能ですので、学習についていけないという心配はありません。


 知りたいところだけを学ばれたい方

4回レッスン毎のお支払いで、ご受講ください。途中修了していただくか、他のコースにチャレンジしていただくこともできます。途中終了の場合の過払い納入金は精算の上、返金させていただきます。

 補習として、もう少し学ばれたい方(注1)
  • マスターできるまで追加期間を設け親切指導させていただきます。
  • 追加料金:1回 4,950円(税込)/1時間×希望回数分

 ビデオ通話アプリ「Zoom」利用
  • 「Zoom」アプリを利用しレッスンします。当スクールから招待したレッスンとなりますので、Zoom使用料は不要。
  • 使い方は「はじめてのオンラインZoom講座」をご参照ください。
レッスンカレンダー

レッスン曜日と時間帯

曜日と時間帯を指定した予約制

プライベート・オンライン講座
(基本+応用)
No. 曜日 時間帯
月~土 09時00分~60分間
月~土 10時00分~60分間
月~土 11時00分~60分間
月~土 13時00分~60分間
月~土 14時00分~60分間
月~土 15時00分~60分間
月~土 16時00分~60分間
月~土 17時00分~60分間
月~土 18時00分~60分間

※祝日、夏季休暇、冬季休暇、社内旅行、研修、計画休講、臨時休講

 休日休暇のご案内

よくある質問

Frequently Asked Questions for Web Designer Pro Course

  • もちろん受講できます。Web作成の基本であるhtmlやCSSのプログラムコードの書き方を少し学ぶだけで、1時間もすればプログラムを少しだけ操れるようになります。後は、ほとんどの方が楽しくなって来ますので、自然に上達しマスターできるようになります。
  • もちろんです。担当講師と相談され学ばれたい内容をお伝えください。通常WebデザイナーのPro課程の修得まで48回レッスンが必要ですが、学ばれたいところだけをマスターされ修了とすることもできます。
  • 職場の直接的な紹介は法律上できませんが、情報提供は可能です。本クラスのスキル修得に加え、【Illustrator】【Photoshop】のスキルを修得されると、多くの職場で歓迎されることが期待できます。
  • オンラインレッスンはビデオ通話アプリ「Zoom」を利用して行いますので、Zoomの登録とインストールが必要です。また、ビデオ通話を行う上で、Webカメラ、ヘッドセットなどが必要になることもあります。
    Zoomでオンライン講座を受講される方は下記ページをご参照ください
  • 受講期間中の一時休会は可能でございます。次の理由などにより1ヵ月以上連続しレッスンを欠席される場合、担当講師にご連絡ください。その間のレッスン料金は全額免除されます。
    1. 生徒ご本人が出張や病気、傷病などで1ヵ月を超えてレッスンが困難な場合
    2. 災害による被害など、止むを得ずレッスン受講が1ヵ月以上困難な場合
  • 受講料支払い完了後のキャンセルはできません、中途解約となります。この場合、未レッスン分の受講料金はご返却致します。
  • はい、可能でございます。見積書、請求書、領収書などを、電子文書のPDFファイル形式で発行することもできます。
  • 適格請求書発行事業者登録番号は次の通りです。
    T1130001069351
  • その他、ご不明な点やご質問がございましたら、どうぞお気軽にお問い合わせください。
    お問い合わせ

体験レッスンお申し込みについて

About applying for trial lessons

規約
司会者
司会者
今回は、実際に「コーディング」を体験しながら学ぶ「WebデザインPro」の体験レッスンについてご紹介します。
講師のユミ先生にお越しいただきました。よろしくお願いします!
講師
講師
よろしくお願いします。Webデザイン講師のユミです。
このレッスンでは、デザインの見た目だけでなく、実際に「HTML」と「CSS」を使ってページを「自分の手で形にする」ところまで体験していただけます。
司会者
司会者
自分で作ったページが画面に出るのは嬉しいですよね!
それに、プロの現場でも使える技術が学べるのは魅力的です。
講師
講師
そうなんです。HTMLやCSSは、Web制作の土台になるスキル。
デザインのセンスだけでなく、「実際に動くWeb」を作れるようになると、デザイナーとしての価値がぐっと上がります。
この体験では、実際の仕事に近い流れで、デザイン → コーディング → ブラウザ確認まで体験していただけます。
司会者
司会者
なるほど。つまり、見た目だけじゃなく「動くデザイン」を作る力が身につくんですね。
初心者でも大丈夫ですか?
講師
講師
もちろん大丈夫です。
初めての方でも分かりやすいように、構文の意味や記述のコツをひとつずつ解説します。
また、デザイン経験がある方には、レスポンシブ対応(スマホ・PC両対応)や、CSSアニメーションなど、より実践的な内容にも挑戦していただけます。
司会者
司会者
すごいですね!まさに「Webデザインの本質」を体験できそうです。
最後に、受講を検討している方へメッセージをお願いします。
講師
講師
コーディングを学ぶと、デザインの見方が一気に変わります。
「どうやって作られているのか」が分かると、より自由に、より的確に表現できるようになります。
この体験レッスンでは、その第一歩を楽しく実感していただけます。
ぜひ一緒に、「動くデザイン」の世界を体験してみましょう!
司会者
司会者
ありがとうございました!
WebデザインProの体験レッスンは、こちらのフォームからお申し込みください。
初心者の方も、スキルアップを目指す方も大歓迎です。
ぜひこの機会に、自分の手でWebページを作る楽しさを体験してください!

レッスン規約について

アートビスケットデザインスクールでは、生徒さんと講師が信頼関係を築きながら、安心・快適なレッスンができるように規約を定めております。

次のレッスン規約をご承諾の上、お申し込みください。

レッスン規約

ご入会時のお支払いについて

お支払いは入会申し込み受付後、初回レッスン時または初回レッスン時までに、現金または各種カードで入会金と月謝を納付ください。

お支払いの詳細につきましては、入会申し込み受付後、担当講師よりご連絡いたします。

各種カード払いご希望の方は、入会受付時に作成する「生徒マイページ」より簡単に決済できます。

生徒マイページ

体験レッスンお申し込み

体験レッスン50% OFF 開催中!

  • 1名様: 2,250円(税込2,475円)
  • 付き人や保護者様は無料!

お申し込み後、2営業日以内にご連絡させていただきます。

ご参加を心よりお待ちしております!一緒に本講座を楽しみましょう。

対象年齢は小学生以上〜大人

Location

 レッスン場所

アートビスケットデザインスクールへ通学するネコザワ

 アートビスケット

Webデザインスクール京都

〒603-8424
京都市北区紫竹下芝本町79

  駐車場・駐輪場について

バイク・自転車の場合

無料:P① 教室前の駐車場

当スクール前の駐輪場に無料で駐車できます。

自家用車の場合

有料:P②〜P⑤

下記コインパーキングをご利用ください。

  1. P② BooBooPARK北山猪熊南第2
    • 京都市北区紫竹下芝本町1-1
  2. P③ BooBooPARK北山猪熊南
    • 京都市北区紫竹桃ノ本町38
  3. P④ タイムズ北山大宮
    • 京都市北区紫竹下緑町83
  4. P⑤ コンセプト北山大宮
    • 京都市北区紫竹下緑町100
アートビスケットデザインスクール地図

交通アクセス

(拡大できます)