https://www.be-webdesigner.com/knowledge/

1<!DOCTYPE html>
2<html lang="ja"><!-- InstanceBegin template="/Templates/index.dwt" codeOutsideHTMLIsLocked="false" -->
3<head>
4<meta charset="utf-8">
5<!-- InstanceBeginEditable name="head" -->
6<title>Webデザイナーを知る-独学!未経験からWebデザイナーになる!!</title>
7<meta name="keywords" content="基礎知識,基本知識,ウェブ,Web,デザイナー">
8<meta name="description" content="ウェブデザイナーになる前に知っておきたい基礎知識のご紹介です。">
9<!-- InstanceEndEditable -->
10<meta name="viewport" content="width=device-width,initial-scale=1.0">
11
12<link rel="shortcut icon" href="/favicon.ico" >
13<link rel="stylesheet" href="/css/common.min.css?180719" type="text/css">
14
15<link rel="stylesheet" href="/css/pc.min.css?180719" type="text/css">
16
17<link rel="stylesheet" href="/font-awesome/css/font-awesome.min.css">
18<link rel="stylesheet" href="/css/sh/SyntaxHighlighter.min.css" type="text/css">  
19

20<script src="/js/lib/jquery-1.11.2.min.js"></script>

20
21

22<script src="/js/default_1.0.1.min.js?180719"></script>

22
23
24<!-- Global site tag (gtag.js) - Google Analytics -->

24
25<script async src="https://www.googletagmanager.com/gtag/js?id=

25UA-664036-7

25"></script>

26<script>
27  

27window.dataLayer = window.dataLayer || [];
28  function gtag(){dataLayer.push(arguments);}
29  gtag('js', new Date());
30
31  gtag('config', '

31UA-664036-7

31');

32</script>

32
33<!-- InstanceBeginEditable name="headAppendix" -->
34
35
36<!-- InstanceEndEditable -->
37</head>
38<body class="drawer drawer--right drawer--navbarTopGutter">
39<div id="container">
40
41<div id="summary">
42<!-- InstanceBeginEditable name="top" -->
43<h1><a name="TOP" id="TOP">Webデザイナーを知る</a></h1>
44<p>Webデザイナーっていったいどういう職業なのでしょうか。現役Webデザイナーの馬場がご紹介します。</p>
45<!-- InstanceEndEditable -->
46</div><!-- /#summary -->
47
48<!-- ************************Start Header************************ -->
49<div id="header">
50<h2><a href="https://www.be-webdesigner.com/"><img src="/img/logo.gif" alt="独学!未経験からWebデザイナーになる!!" width="327" height="64"></a></h2>
51
52
53
54<div id="headerNavi">
55<ul>
56<li><a href="https://www.be-webdesigner.com/contact/mail/"><i class="fa fa-chevron-circle-right"></i>メール</a></li>
57<li><a href="https://www.be-webdesigner.com/info/whats_new.htm"><i class="fa fa-chevron-circle-right"></i>更新履歴</a></li>
58<li><a href="https://www.be-webdesigner.com/info/sitemap.htm"><i class="fa fa-chevron-circle-right"></i>サイトマップ</a></li>
59</ul>
60
61

62<script>
63<!--
64printSearchBox();
65//-->
66</script>

66
67</div>
68
69	
70	
71<div id="gnav">
72<ul class="clearfix">
73<li class="first"><a href="https://www.be-webdesigner.com/"><img src="/img/wakaba.png" width="19" height="19" alt=""></a></li>
74<li class="active"><a href="https://www.be-webdesigner.com/knowledge/">Webデザイナーを知る</a></li>
75<li><a href="https://www.be-webdesigner.com/be/">Webデザイナーになる</a></li>
76<li><a href="https://www.be-webdesigner.com/tips/">Web制作Tips </a></li>
77<li><a href="https://www.be-webdesigner.com/technotes/">テクニカルノート</a></li>
78<li><a href="https://www.be-webdesigner.com/feature/">コーヒーブレイク</a></li>
79<li><a href="https://www.be-webdesigner.com/info/">インフォメーション</a></li>
80</ul>
81</div>
82
83
84
85</div>
86
87<div class="topicPath">	
88	<p><a href="/">独学!未経験からWebデザイナーになる!!</a>&nbsp;&gt;&nbsp;<strong>Webデザイナーを知る</strong></p>
89</div>
90<!-- InstanceBeginEditable name="directory" -->
91
92<!-- InstanceEndEditable -->
93
94<div id="wrapper" class="clearfix">
95	<div id="content" >
96<!-- InstanceBeginEditable name="contentLeft" -->
97<h2>Webデザイナーを知る</h2>
98      <!--<div style="border:1px solid #999;padding:10px;margin:20px 0;background-color:#eee;">
99      <strong>2022/06/01　副業・フリーランスの実務が不安な方へ。</strong><br>
100      馬場の個人サイトで、試験的に<a href="https://babamakoto.com/works/freelance/support/" class="external">副業・フリーランス実務トータルサポート</a>を1時間から利用可能にしました。
101      また、<a href="https://babamakoto.com/works/freelance/counseling/" class="external">単発相談</a>もやってます。ココナラなどで案件を始める際等にご利用ください。
102      </div>-->
103      <p class="affiliate">※当サイトは、アフィリエイト広告を掲載し、収益を得て運営しています。</p>
104      
105<div id="category-image"><img src="img/main_img.jpg" alt="Webデザイナーってどんな職業なんだろう？" width="585" height="200"></div>
106<p>このサイトにお越しいただく方は、<b>「これからWebデザイナーになりたい！」</b>と考えている方や、<b>「ちょっとだけ興味があるんだけど」</b>という方がほとんどだと思います。そのような方向けに、現役Webデザイナーである管理人：馬場誠が、Webデザイナーについてのイロイロをご紹介します。<!-- #EndLibraryItem --></p>
107
108
109<dl id="s_menu">
110<dt class="menuTitle" style="background:#B7B7B7 !important;"><img src="/img/folder.gif" width="16" height="14" alt="">[&nbsp;Webデザイナーを知る&nbsp;]&nbsp;カテゴリ内のページ一覧</dt>
111<dd>├<a href="/knowledge/works.htm">Webデザイナーってどんな仕事をするの？</a></dd>
112<dd>├<a href="/knowledge/soft.htm">どんなソフトウェアを使用するの？</a></dd>
113<dd>├<a href="/knowledge/flow.htm">どんな流れでWebサイトを作っているの？</a></dd>
114<dd>├<a href="/knowledge/work_types.htm">Webデザイナーの働き方は？</a></dd>
115<dd>├<a href="/knowledge/income.htm">収入（年収・月収）はどれくらい？</a></dd>
116<dd>├<a href="/knowledge/future.htm">Webデザイナーの将来性は？</a></dd>
117<dd>├<a href="/knowledge/adequate.htm">Webデザイナーの適性とは？</a></dd>
118<dd>├<a href="/knowledge/is_easy.htm">Webデザイナーになるのは簡単？</a></dd>
119<dd>├<a href="/knowledge/cost.htm">Webデザイナーになるにはどのくらいお金がかかる？</a></dd>
120<dd>├<a href="/knowledge/unexperienced.htm">業界未経験でもWebデザイナーになれる？</a></dd>
121<dd>├<a href="/knowledge/trial.htm">Webデザイナーの世界を体験してみよう</a></dd>
122<dd>└<a href="/knowledge/faq.htm">おまけ ： FAQ-よくある質問と回答</a></dd>
123</dl>
124
125
126		<!-- InstanceEndEditable -->
127
128<div id="socialBtn">
129<p>↓もし参考になりましたら、シェアしていただけると嬉しいです(^-^)</p>
130<ul>
131<li><span class="box"></span><a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" data-lang="ja" rel="nofollow">Tweet</a></li>
132<li><a href="http://b.hatena.ne.jp/entry/" class="hatena-bookmark-button" data-hatena-bookmark-layout="vertical-balloon" data-hatena-bookmark-lang="ja" title="このエントリーをはてなブックマークに追加" rel="nofollow"><img src="/img/external/[email protected]" alt="このエントリーをはてなブックマークに追加" width="20" height="20" style="border: none;" /></a></li>
133<li><div class="fb-like" data-layout="box_count" data-action="like" data-show-faces="true" data-share="false"></div></li>
134<li><div class="g-plusone" data-size="tall"></div></li>
135<li><a data-pocket-label="pocket" data-pocket-count="vertical" class="pocket-btn" data-lang="ja" rel="nofollow"></a></li>
136</ul>
137</div><div class="ads">

138<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

138
139<!-- 336x280, 作成済み 10/12/11 -->
140<ins class="adsbygoogle"
141     style="display:inline-block;width:336px;height:280px"
142     data-ad-client="ca-pub-5915508777224984"
143     data-ad-slot="8495627386"></ins>

144<script>
145(adsbygoogle = window.adsbygoogle || []).push({});
146</script>

146
147
148</div>
149<div id="facebook">
150<p>12/06/30 facebookページ開設しました。RSS代わりにも使いたいと思います。</p>
151<div class="fb-page" data-href="https://www.facebook.com/bewebdesignercom/" data-tabs="timeline" data-width="500" data-height="220" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true"><div class="fb-xfbml-parse-ignore"><blockquote cite="https://www.facebook.com/bewebdesignercom/"><a href="https://www.facebook.com/bewebdesignercom/">独学！未経験からWebデザイナーになる！！</a></blockquote></div></div>
152</div>
153

154<script type="text/javascript">
155<!--
156// print_comment('/knowledge/index.htm', 'INDEX');
157//-->
158</script>

158<div id="toHome"><img src="/img/home.gif">&nbsp;<a href="https://www.be-webdesigner.com/">ホームページへ戻る</a></div>
159	</div><!-- /#content -->
160	
161<div id="sideBar">
162
163			<dl id="sideNavi">
164			<dt>CONTENTS</dt>
165			<dd><dl id="menu">
166<dt id="menuUp"><img src="/img/home_s.gif" width="16" height="14" alt=""><a href="/">独学!未経験からWebデザイナーになる!!</a></dt>
167<dt class="menuTitle" style="background:#B7B7B7 !important;"><img src="/img/folder.gif" width="16" height="14" alt="">Webデザイナーを知る</dt>
168<dd>├<a href="/knowledge/works.htm">Webデザイナーってどんな仕事をするの？</a></dd>
169<dd>├<a href="/knowledge/soft.htm">どんなソフトウェアを使用するの？</a></dd>
170<dd>├<a href="/knowledge/flow.htm">どんな流れでWebサイトを作っているの？</a></dd>
171<dd>├<a href="/knowledge/work_types.htm">Webデザイナーの働き方は？</a></dd>
172<dd>├<a href="/knowledge/income.htm">収入（年収・月収）はどれくらい？</a></dd>
173<dd>├<a href="/knowledge/future.htm">Webデザイナーの将来性は？</a></dd>
174<dd>├<a href="/knowledge/adequate.htm">Webデザイナーの適性とは？</a></dd>
175<dd>├<a href="/knowledge/is_easy.htm">Webデザイナーになるのは簡単？</a></dd>
176<dd>├<a href="/knowledge/cost.htm">Webデザイナーになるにはどのくらいお金がかかる？</a></dd>
177<dd>├<a href="/knowledge/unexperienced.htm">業界未経験でもWebデザイナーになれる？</a></dd>
178<dd>├<a href="/knowledge/trial.htm">Webデザイナーの世界を体験してみよう</a></dd>
179<dd>└<a href="/knowledge/faq.htm">おまけ ： FAQ-よくある質問と回答</a></dd>
180</dl>
181</dd></dl>
182
183<div id="profile" class="clearfix">
184	<div id="profilePhoto"><a href="https://www.be-webdesigner.com/info/babamakoto.htm"><img src="/img/common/m.baba_small.jpg" width="60" height="70" alt="Webデザイナー馬場誠"></a></div>
185	<h4>作者プロフィール&nbsp;-&nbsp;<a href="https://www.be-webdesigner.com/info/babamakoto.htm">詳細</a></h4>
186	<p>名前：馬場　誠</p>
187	<p>フリーランス兼会社代表のWebクリエイター。今は茨城県取手市で仕事をしてます。</p>
188</div>
189
190
191
192<div id="sideAdHuman">
193<a href="https://www.be-webdesigner.com/feature/school/human_academy.htm"><img src="/feature/school/img/human_academy/banner.png?update=0209" width="350" height="117" alt="2017/1 ヒューマンアカデミーの資料を頂く機会に恵まれたのでシェアします"></a>
194</div>
195
196
197
198<div id="lets">フリーランスを目指す方は姉妹サイト、<a href="http://web.lets-freelance.net/" target="_blank">レッツ！フリーランスWebデザイナー.net</a>もご覧ください</div>
199
200
201
202<div id="onayamiBanner"><a href="https://www.be-webdesigner.com/contact/onayami/"><img src="/img/common/onayami_banner.gif" width="350" height="45" alt="お悩み相談始めました!!　 →詳しくはこちら"></a></div>
203
204
205
206<div id="feedbackWrapper">
207<!--

207<script src="/js/contact/feedback_1.0.0.min.js?180719"></script>

207

208<script src="/js/contact/feedback_1.0.0.js"></script>

208-->
209</div>
210
211
212
213
214<div class="sideBarSub">
215<dl>
216<dt>スポンサード　リンク</dt>
217<dd class="section">
218
219	

219<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

219
220<!-- 120x600, 作成済み 10/03/01 -->
221<ins class="adsbygoogle"
222     style="display:inline-block;width:120px;height:600px"
223     data-ad-client="ca-pub-5915508777224984"
224     data-ad-slot="1647384830"></ins>

225<script>
226(adsbygoogle = window.adsbygoogle || []).push({});
227</script>

227
228
229	</dd>
230
231
232<dt>最近のコメント</dt>
233<dd class="section">
234<ul class="recentComment largeMargin">
235<li><a href="https://www.be-webdesigner.com/technotes/server/httpd_conf/virtual_host.htm#comment_824">バーチャルホストを設定する</a>&nbsp;&nbsp;&nbsp;by&nbsp;馬場誠さん(12/27)</li><li><a href="https://www.be-webdesigner.com/technotes/server/httpd_conf/virtual_host.htm#comment_823">バーチャルホストを設定する</a>&nbsp;&nbsp;&nbsp;by&nbsp;初心者トマトさん(12/27)</li><li><a href="https://www.be-webdesigner.com/tips/coding/mojibake.htm#comment_822">文字化けを防ぐ&解消する方法</a>&nbsp;&nbsp;&nbsp;by&nbsp;しんじゆみこさん(11/29)</li></ul>
236</dd>
237
238</dl>
239		
240		
241</div><!-- /#sideBarSubMain -->
242
243<div class="sideBarSub" id="sideBarSubMain">
244<dl>
245<dt>初めての方へ</dt>
246<dd class="section">
247<p><a href="https://www.be-webdesigner.com/info/introduction.htm"><img src="/img/first_visitors.jpg" width="140" height="51" alt="初めての方へ、サイト案内"></a></p>
248</dd>
249
250<dt>お勧めコンテンツ</dt>
251<dd>
252
253	<dl>
254	<dt>あなたの悩み、よろしければ馬場に相談してください！</dt>
255	<dd>
256	<p><a href="https://www.be-webdesigner.com/contact/onayami/">お悩み相談、始めました。もちろん相談無料です！詳細はこちら</a><br>
257<a href="/onayami/">お悩み相談の回答を見たい方はこちら</a></p>
258	</dd>
259
260	<dt>Webデザイナーを目指す方は絶対買った方がいいです</dt>
261	<dd>
262	<p><a href="https://www.be-webdesigner.com/feature/bookstand.htm">本を使った学習が超はかどる、Webデザイナー必携のアイテムとは！？</a></p>
263	</dd>
264	
265	
266	
267	<dt>勉強しながら収入を！</dt>
268	<dd>
269	<p><a href="https://www.be-webdesigner.com/feature/affiliate.htm">ウェブデザインの勉強をしつつ、楽しみながら収入が得られる方法とは！？</a></p>
270	</dd>
271	
272		</dl>
273</dd>
274</dl>
275
276
277</div><!-- /#sideBarSubMain -->
278
279<br class="clear">
280</div><!-- /#sideBar -->
281</div><!-- /#wrapper -->
282</div><!-- /#container -->
283
284
285<div id="footer">

286<script type="text/javascript">
287<!--
288acclog();
289//-->
290</script>

290
291

292<script type="text/javascript">
293  (function () {
294    var tagjs = document.createElement("script");
295    var s = document.getElementsByTagName("script")[0];
296    tagjs.async = true;
297    tagjs.src = "//s.yjtag.jp/tag.js#site=0WhS2Pp";
298    s.parentNode.insertBefore(tagjs, s);
299  }());
300</script>

300
301<noscript>
302  <iframe src="//b.yjtag.jp/iframe?c=0WhS2Pp" width="1" height="1" frameborder="0" scrolling="no" marginheight="0" marginwidth="0"></iframe>
303</noscript>
304
305
306<p>Copyright&copy; Makoto Baba All Rights Reserved.</p>
307<p>このウェブサイト内における画像、文章（適切な引用は除く）の無断転載、無断コピーなどはおやめください。</p>
308<p class="last">当サイトは、デザイン未経験から独学でフリーランスになった管理人が、Webデザイナーになるための情報を発信するウェブサイトです。</p>
309</div><!-- /#footer -->
310
311<div id="pageTop"><a href="#container">&nbsp;</a></div>
312

313<script src="/js/sh/mySh.min.js"></script>

313

314<script src="/js/jquery.magnific-popup.min.js"></script>

314
315

316<script src="https://platform.twitter.com/widgets.js" charset="utf-8" async></script>

316

317<script src="https://b.st-hatena.com/js/bookmark_button.js" charset="utf-8" async></script>

317

318<script src="https://apis.google.com/js/platform.js" async defer>
319  {lang: 'ja'}
320</script>

320
321
322
323<div id="fb-root"></div>

324<script>(function(d, s, id) {
325  var js, fjs = d.getElementsByTagName(s)[0];
326  if (d.getElementById(id)) return;
327  js = d.createElement(s); js.id = id; js.async = true;
328  js.src = "//connect.facebook.net/ja_JP/sdk.js#xfbml=1&version=v2.5";
329  fjs.parentNode.insertBefore(js, fjs);
330}(document, 'script', 'facebook-jssdk'));</script>

330
331

332<script>!function(d,i){if(!d.getElementById(i)){var j=d.createElement("script");j.id=i;j.src="https://widgets.getpocket.com/v1/j/btn.js?v=1";var w=d.getElementById(i);d.body.appendChild(j);}}(document,"pocket-btn-js");</script>

332
333
334
335
336</body>
337<!-- InstanceEnd --></html>