LogoMark.png

Webデザイン/2020/0512

第2回 動画・画像の掲載

Webデザイン/2020造形短期大学部|2020.05.12

第2回目の展開と要件


以下、順に説明しますので、お読み下さい。



本日のメニュー


はじめに

第2回目の遠隔授業では、動画の掲載、画像の掲載について体験します。以下、架空の受講生 JaneSmith さんのページで、完成イメージをご確認ください。
https://design.kyusan-u.ac.jp/OpenSquareJP_MW/index.php/JaneSmith

前回編集した、あなた専用のページを確認してください(お名前が無い場合、あるいは表記に間違いがある場合、共有シートの「質問」に書き込んで下さい)。
 受講生のページ ブックマークしておいて下さい。

サイト右上の「ログイン」をクリックして、事前に連絡通知した、受講生共通の 利用者ID と パスワードでログインして下さい。

以後、このページとあなたのページを両方同時に開いて作業を進めて下さい。



1. リンクの張り方

リンクには、サイト内の別ページへジャンプする「内部リンク」と、他のサイトへジャンプする「外部リンク」があります。

1.1. 内部リンクの例

1.2. 外部リンクの例

1.3. 演習1

あなたのページの下の方に、以下の部分をコピー&ペーストして、いくつかのリンクを張って下さい。

==リンク集==
===サイト内リンク===
* [[Webデザイン2020]]
* [[編集ガイド]]
<br>

===外部リンク===
* [https://xxx.xxxx.xxx ◯◯◯◯]
* [https://xxx.xxxx.xxx ◯◯◯◯]
<br>


付記:リンクに許諾は不要です

重要なことですが、リンクするのに相手の許諾は不要です。よく、「勝手にリンクしていいんですか?」という質問を受けることがありますが、リンクというのは、閲覧を誘導しているだけなので、著作権侵害にはあたりません。
 Webサイトというものは、あちこちからリンクされる(被リンク数が多い)方がサイトの価値が上がって、検索ランキングも上がるので、リンクされることは「うれしいこと」なのです。リンクを張っておくと有益・・と思われるサイトは、見つけたらすぐ、自分のページにリンクしてしまいましょう。



2. 動画の掲載

2.1. 動画の掲載方法

以下のコード書式に従って記載するだけで、ページに動画が掲載可能です。

2.2. 演習2

あなたのページ内に動画を掲載して下さい。場所はどこでも構いません。

付記:動画の埋め込みはOKです

YouTubeなどの「動画共有サイト」は、文字通り、動画を共有することを目的としているので、動画のリンクや、埋め込みコードは、そのサイト自身が提供してくれる・・という仕様になっています。したがって、あなたのページに動画を埋め込むことに、問題はありません。
 但し、違法にアップロードされた動画は、それ自体が問題です。例えば、ミュージックビデオの類についても、公式サイト以外のチャンネルで個人がアップしたものは、違法である可能性があるので、そのような動画の埋め込み掲載は避けるようにしてください。



3. 画像の掲載

画像つまり、写真やイラストの掲載には、いくつかの予備知識が必要です。はじめに、Web用の画像の最適化に関する知識が十分かどうか、確認・下準備を行なった上で、画像の掲載を行って下さい。

画像の掲載は本日の時間中に完了する必要はありません。

3.1. 画像の掲載に必要な予備知識

はじめに、画像データの取り扱いに関するあなたの現在の知識を確認します。画像の掲載には、少しだけ追加の学習が必要になります。以下、ご確認下さい。

注)SNSの場合、利用者がアップした画像は、サービス側で最適なサイズに自動調整されています。しかし、WikiやブログなどのCMSや、自分でWebサイトを作る場合は、制作者側で画像のサイズをWeb用に最適化する必要があります。



以上、ご自身の経験上、問題なければ、先へ進んでください。ちょっと自信がない・・という場合は、以下のページもお読み下さい。

3.2. 画像の準備

もちろん、自宅のPCに AdobePhotoshop 等の環境が整っている方は、ファイルメニューにある「Web用に保存」を利用して下さい。

3.3. MediaWiki での画像掲載手順

画像の掲載には、以下の2つの手順が必要となります。

3.4. 画像をWikiにアップロードする

画像のアップロードは、左メニュー「ツール」の「ファイルをアップロード」 から行います。

3.5. 画像を掲載するコードをページ内に書く

3.6. 演習3

あなたのページ内に、画像を掲載して下さい。場所はどこでも構いません。

付記:写真はあなたのオリジナルに限ります。

ネットで見つけた画像等をアップすることは、著作権法上問題となるので注意して下さい。あなた自身が撮影した写真、あるいは、あなたが描いたイラスト等、オリジナルのものをアップするようにして下さい。




第2回目は、以上をもって終了とします。



APPENDIX

第3回について

次回も同様に、授業開始前に、ページを更新・アップするので、授業時間を中心に、同様に演習を行なって下さい。

遠隔授業が長期化しています。MediaWiki をベースとした学習は、今回までとし、第3回から、自宅での演習の準備を行なって、HTML+CSS+JavaScript の学習をスタートさせます。




PAGES

GUIDE

DATA

Last-modified: 2020-05-12 (火) 18:39:47