富山新聞文化センター説明資料.pdf

Transcript

1. 講 師 ： 吉 川 圭 太 （ D E R A - D E S I G N ） 富 山 新 聞 文 化 セ ン タ ー 高 岡 ス タ ジ オ W e b デ ザ イ ン 講 座 D E R A - D E S I G N W e b D e s i g n c o u r s e
2. 講 師 紹 介 D E R A - D E S I G N W e b D e s i g n c o u r s e
3. D E R A - D E S I G N W e b D e s i g n c o u r s e 吉川 圭太 （38才） ɾデザイナー （デザイナー歴11年） ɾWebデザイン/グラフ ィ ックデザイン ɾ愛知県名古屋市 出身 ɾ砺波市在住 （2020年6月に移住） ɾ妻と長男 （2才） と次男 （1才） 4人暮らし
4. • 27才〜ɿDTPデザイナー （2年） • 29才〜ɿ看板デザイン （1年） • 30才〜ɿWebデザイン グラフィ ッ クデザイン （10年） デ ザ イ ナ ー 歴 約 13 年 デ ザ イ ン に 携 わ っ て き ま し た D E R A - D E S I G N W e b D e s i g n c o u r s e
5. D E R A - D E S I G N W e b D e s i g n c o u r s e
6. 15 才 〜 27 才 総 合 格 闘 技 D E R A - D E S I G N W e b D e s i g n c o u r s e
7. 長 男 （2才） 次 男（1才） D E R A - D E S I G N W e b D e s i g n c o u r s e
8. こ の 講 座 で 学 べ る こ と D E R A - D E S I G N W e b D e s i g n c o u r s e
9. D E R A - D E S I G N W e b D e s i g n c o u r s e W e b 制 作 に 必 要 な 知 識 と 技 術
10. 10 DERA-DESIGN D E R A - D E S I G N W e b D e s i g n c o u r s e コ ー デ ィ ン グ
11. W o r d P r e s s ( ワ ー ド プ レ ス ) D E R A - D E S I G N W e b D e s i g n c o u r s e
12. D E R A - D E S I G N W e b D e s i g n c o u r s e デ ザ イ ン
13. D E R A - D E S I G N W e b D e s i g n c o u r s e ア ク セ ス 解 析
14. D E R A - D E S I G N W e b D e s i g n c o u r s e そ の 他 に も マ ー ケ テ ィ ン グ や 仕 事 の 取 り 方 な ど
15. DERA-DESIGN D E R A - D E S I G N W e b D e s i g n c o u r s e W e b サ イ ト 制 作 に 必 要 な も の
16. インターネット上に公開している、ブログやコーポレートサイト、 ショッピングサイトの Web ページの集まりです。 最近では、小さなお店や会社でも、ホームページを持っておかなきゃい けないと言われる時代になりました。 D E R A - D E S I G N W e b D e s i g n c o u r s e W e b サ イ ト と は
17. DERA-DESIGN 17 D E R A - D E S I G N W e b D e s i g n c o u r s e ホームページのデータを保存し、 パソコンやスマホなどからリクエ ストが来た時にデータを送ります。 ホームページを作る時には必ずい るものです。 サ ー バ
18. D E R A - D E S I G N W e b D e s i g n c o u r s e ド メ イ ン ホームページの住所のようなもの です。 厳密には必須ではありませ んが、一般的にホームページを作 る時にはドメインを用意します。
19. D E R A - D E S I G N W e b D e s i g n c o u r s e デ ー タ ベ ー ス サーバとは別に、データを蓄積し て必要に応じてを取り出せるよう になっています。 WordPress でホームページを作る 場合、 必須になります。
20. D E R A - D E S I G N W e b D e s i g n c o u r s e W e b で 使 う 言 語 HTML CSS PHP JavaScript
21. D E R A - D E S I G N W e b D e s i g n c o u r s e ワ ー ド プ レ ス と は
22. DERA-DESIGN 22 D E R A - D E S I G N W e b D e s i g n c o u r s e WordPress とは、コンテンツマネ ジメントシステム （CMS） です。 専門の言語がわからなくても、簡 単にホームページが作れて、コン テンツ （ブログ） を管理できるソフ トのことです。 WordPress 日本公式キャラクター 「わぷー （Wapuu） 」
23. の シ ェ ア D E R A - D E S I G N W e b D e s i g n c o u r s e
24. D E R A - D E S I G N W e b D e s i g n c o u r s e の シ ェ ア 429 % が W P
25. の 特 徴 D E R A - D E S I G N W e b D e s i g n c o u r s e ・コンテンツ （ブログなど） を制作しやすい ・たくさんのテーマやプラグインが使える ・オープンソースで開発されている ・ユーザーが多いため、 情報が得やすい
26. D E R A - D E S I G N W e b D e s i g n c o u r s e 管 理 が し や す い HTMLや CSS など、専門的な知識がな くてもホームページの更新をするこ とができます。
27. WordPressはテーマを変えることに よって簡単に見た目を変えることが できます。 公式テーマは使用すること も改変することも自由です。 またテー マを販売することも自由です。 D E R A - D E S I G N W e b D e s i g n c o u r s e テ ー マ https/ /jawordpressorg/themes/
28. WordPressはプラグインで機能を拡張 できます。 公式プラグインの登録数は 60、 104 個 （2022年9月現在） あります。 問い合わせフォームやライトボックス など、 多くの機能を簡単に実現できます。 https/ /jawordpressorg/themes/ D E R A - D E S I G N W e b D e s i g n c o u r s e プ ラ グ イ ン
29. オープンソースとは 「制作者が権利を主張しない」 ソフトウェア開発 の手法です。 オープンソースのものは、 個人 ɾ 企業 （商用） を問わず誰で も利用 ɾ 修正することができます。 オープンソースを利用し作ったも のを、 再配布してもかまいません。 権利を主張しないことで、 様々な 人々が開発に参加でき、 よりよいシステムや商品が生まれます。 https/ /jawordpressorg/plugins/ D E R A - D E S I G N W e b D e s i g n c o u r s e オ ー プ ン ソ ー ス
30. PHP index.php image.jpg logo.svg style.css script.js CSS JS 世界のWordPressコミュニティが 100%GPLを推奨している D E R A - D E S I G N W e b D e s i g n c o u r s e 1 0 0 % G P L
31. D E R A - D E S I G N W e b D e s i g n c o u r s e PHP index.php 100％ではないGPLは 自由が制限されるので好ましくない logo.svg script.js JS image.jpg style.css CSS スプリットライセンス
32. D E R A - D E S I G N W e b D e s i g n c o u r s e 情 報 が 多 い 使っている人、開発している人が多い ので、 カスタマイズに対応しやすい。 ま た解説も充実している場合が多い。 反面セキュリティに問題を抱えやす い弱点になることもʜʜ
33. D E R A - D E S I G N W e b D e s i g n c o u r s e W e b サ イ ト を デ ザ イ ン す る と は
34. 動 D E R A - D E S I G N W e b D e s i g n c o u r s e W E B サ イト の デ ザ イ ン を す る に は 幅 広 い 技 術 が 必 要
35. デザイン プログラ 写真 画 コーディング 設計 デ ザ イ ン コ ー デ ィ ン グ プ ロ グ ラ ム S E O 写 真 イ ラ ス ト 設 計 動 画 D E R A - D E S I G N W e b D e s i g n c o u r s e
36. 制 作 事 例 D E R A - D E S I G N W e b D e s i g n c o u r s e
37. D E R A - D E S I G N W e b D e s i g n c o u r s e 制 作 事 例 ①ɿタ ニ カ 電 器 https://tanica.jp/
38. D E R A - D E S I G N W e b D e s i g n c o u r s e 制 作 事 例 ②ɿ吉 川 養 鶏 https://yoshikawa-youkei.com/
39. S D E R A - D E S I G N W e b D e s i g n c o u r s e https://subaruya.com/amazake/ 制 作 事 例 ③ɿタ ニ カ 電 器（甘 酒）
40. SEO イラスト D E R A - D E S I G N W e b D e s i g n c o u r s e 制 作 事 例 ④ɿヨ ー グ ル テ ィ ア https://tanica.jp/yogurtia-pro/
41. D E R A - D E S I G N W e b D e s i g n c o u r s e https://itakurawood.com/ 制 作 事 例 ⑤ɿ板 蔵
42. 制 作 事 例 ⑥ɿ板 蔵 （ L P ） https://itakurawood.com/itakura-sp/ D E R A - D E S I G N W e b D e s i g n c o u r s e
43. DERA-DESIGN 42 制 作 事 例 ⑦ɿ板 蔵 フ ァ ク ト リ ー https://itakura-factory.com/ D E R A - D E S I G N W e b D e s i g n c o u r s e
44. 制 作 事 例 ⑧ɿ日本心臓血管外科学会 https://plaza.umin.ac.jp/~jscvs/ D E R A - D E S I G N W e b D e s i g n c o u r s e
45. 制 作 事 例 ⑨ɿぎ ふ の 木 ネ ッ ト https://gifunoki.net/council/ D E R A - D E S I G N W e b D e s i g n c o u r s e
46. D E R A - D E S I G N W e b D e s i g n c o u r s e 以 上 ご 清 聴 あ り が と う ご ざ い ま し た