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

Slide 1

Slide 1 text

講師：吉川圭太（ 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

Slide 2

Slide 2 text

講師紹介 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

Slide 3

Slide 3 text

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人暮らし

Slide 4

Slide 4 text

● 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

Slide 5

Slide 5 text

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

Slide 6

Slide 6 text

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

Slide 7

Slide 7 text

長男（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

Slide 8

Slide 8 text

この講座で学べること 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

Slide 9

Slide 9 text

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 制作に必要な知識と技術

Slide 10

Slide 10 text

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 コーディング

Slide 11

Slide 11 text

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

Slide 12

Slide 12 text

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 デザイン

Slide 13

Slide 13 text

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 アクセス解析

Slide 14

Slide 14 text

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 その他にもマーケティングや仕事の取り方など

Slide 15

Slide 15 text

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 サイト制作に必要なもの

Slide 16

Slide 16 text

インターネット上に公開している、ブログやコーポレートサイト、ショッピングサイトの 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 サイトとは

Slide 17

Slide 17 text

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 ホームページのデータを保存し、パソコンやスマホなどからリクエストが来た時にデータを送ります。ホームページを作る時には必ずいるものです。サーバ

Slide 18

Slide 18 text

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 ドメインホームページの住所のようなものです。厳密には必須ではありませんが、一般的にホームページを作る時にはドメインを用意します。

Slide 19

Slide 19 text

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 でホームページを作る場合、必須になります。

Slide 20

Slide 20 text

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

Slide 21

Slide 21 text

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 ワードプレスとは

Slide 22

Slide 22 text

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）」

Slide 23

Slide 23 text

のシェア 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

Slide 24

Slide 24 text

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

Slide 25

Slide 25 text

の特徴 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 ・コンテンツ（ブログなど）を制作しやすい・たくさんのテーマやプラグインが使える・オープンソースで開発されている・ユーザーが多いため、情報が得やすい

Slide 26

Slide 26 text

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 など、専門的な知識がなくてもホームページの更新をすることができます。

Slide 27

Slide 27 text

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/

Slide 28

Slide 28 text

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 プラグイン

Slide 29

Slide 29 text

オープンソースとは「制作者が権利を主張しない」ソフトウェア開発の手法です。オープンソースのものは、個人 ɾ 企業（商用）を問わず誰でも利用 ɾ 修正することができます。オープンソースを利用し作ったものを、再配布してもかまいません。権利を主張しないことで、様々な人々が開発に参加でき、よりよいシステムや商品が生まれます。 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 オープンソース

Slide 30

Slide 30 text

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

Slide 31

Slide 31 text

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 スプリットライセンス

Slide 32

Slide 32 text

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 情報が多い使っている人、開発している人が多いので、カスタマイズに対応しやすい。また解説も充実している場合が多い。反面セキュリティに問題を抱えやすい弱点になることもʜʜ

Slide 33

Slide 33 text

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 サイトをデザインするとは

Slide 34

Slide 34 text

動 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 サイトのデザインをするには幅広い技術が必要

Slide 35

Slide 35 text

デザインプログラ写真画コーディング設計デザインコーディングプログラム 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

Slide 36

Slide 36 text

制作事例 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

Slide 37

Slide 37 text

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/

Slide 38

Slide 38 text

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/

Slide 39

Slide 39 text

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/ 制作事例 ③ɿタニカ電器（甘酒）

Slide 40

Slide 40 text

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/

Slide 41

Slide 41 text

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/ 制作事例 ⑤ɿ板蔵

Slide 42

Slide 42 text

制作事例 ⑥ɿ板蔵（ 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

Slide 43

Slide 43 text

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

Slide 44

Slide 44 text

制作事例 ⑧ɿ日本心臓血管外科学会 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

Slide 45

Slide 45 text

制作事例 ⑨ɿぎふの木ネット 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

Slide 46

Slide 46 text

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 以上ご清聴ありがとうございました