LogoMark.png

情報デザイン研究I/2020 の変更点


#author("2020-08-25T15:47:02+09:00","default:inoue.ko","inoue.ko")
#author("2020-08-25T16:22:31+09:00;2020-08-25T15:47:02+09:00","default:inoue.ko","inoue.ko")
*Whiteboard
[[情報デザイン研究I]]|情報デザイン専攻3年|&small(木曜1・2限  遠隔 + 17801 + DL 502);
[[受講生一覧>https://design.kyusan-u.ac.jp/socialdesign/?%E6%83%85%E5%A0%B1%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E7%A0%94%E7%A9%B6I]]
[[情報デザイン研究 I|受講生一覧>https://design.kyusan-u.ac.jp/socialdesign/?%E6%83%85%E5%A0%B1%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E7%A0%94%E7%A9%B6I]]
~

-当科目は [[岩田研究室>http://www.iwata.art.kyusan-u.ac.jp/wordpress/]] との合同授業です。情報一元化のためこちらには情報を記載しておりません。岩田研究室の当該科目ページをご覧ください。
http://www.iwata.art.kyusan-u.ac.jp/wordpress/category/idr01_/

-[[情報デザイン研究 I|学科情報共有サイト>https://design.kyusan-u.ac.jp/socialdesign/?%E6%83%85%E5%A0%B1%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E7%A0%94%E7%A9%B6I]]。
~
~

**参考:プレゼン動画の作り方|2020.07.02
***1. Zoom で一芝居する方法
Zoom は「会議を開催」の後、誰も招待していない状態でも「録画」が可能です。この機能を使うと、オンライン講義のような形式で、語ったり、資料を見せたりする動画を作成することが可能です。
#YouTube(dRC5iPxAyf0)
参考:[[Zoom ミーティングの使い方>Zoom]]
~


***2. パソコンの画面収録を使う方法
Macの画面収録機能で画面操作を録画できます。
-QuickTimePlayer(標準のものです)を起動。
-ファイル>新規画面収録
-録画ボタン(赤●)を押したあと
--クリックすると画面全体の動画記録になります。
--一定範囲をドラッグするとその範囲を記録するモードになります。
「収録を開始」をクリックでスタートします。
-停止ボタン(黒■)を押すと記録した動画が確認できます。
-ファイル>書き出し、あるいは、「閉じる」で保存ダイアログが開きます
>.mov形式で保存できます。
-Windowsでも同様の作業が可能です > [[Google:Windows 画面録画]]

#youtube(sWuDt7UIHu0 )

~
~
~


**WordPress入門|2020.06.18
***はじめに
WordPress とは、近年最も注目度の高いオープンソースの Blogシステムで、多くの Webサイトがこれを使っています。以下、2つの公式サイトがあります。

-http://ja.wordpress.com/   ← とりあえず、ブログサービスを利用
事例:https://opensquarejp.wordpress.com/

-http://ja.wordpress.org/ ← 本体をダウンロードしてインストール
事例:http://opensquarejp.starfree.jp/wordpress/ 

参考:[[W3Techs Usage of content management systems for websites>http://w3techs.com/technologies/overview/content_management/all]]
~

***CMS|Content Management System
#image(CMS/CMS.jpg,right,32%)
WordPress は CMSの一種です。CMSとは、Webページの構成要素であるテキストや画像をデータベース的に統合管理し、HTMLをその都度自動生成して配信するシステムの総称です。ブログ、Wiki、SNS、Commerceなど、更新頻度の高い活発なサイトは、いずれもCMSでできているといって過言ではありません。

サーバーサイドで動くシステムであるため、導入にはサーバーの知識が必要で、多少ハードルは高いのですが、自分のサイトをこれで構築することができれば、これほど便利なツールはありません。

本格的なカスタマイズには HTML+CSS の知識が必要ですが、既存のスキンを利用する前提であれば、インストールしてすぐに稼働させることができます。

参考:[[MediaWiki]] [[PukiWiki]]

~

***WordPress を体験してみる
まずは、アカウントをとるだけで WordPress が体験(もちろん同時に情報発信)できる wordpress.com の活用をおすすめします。必要なのはメールアドレスだけです。開設には5分もかかりません。

-[[WordPress.com に接続>http://ja.wordpress.com/]]
-WordPress.comでアカウントを作成 > [[WordPress/Account]](別ページ)
~

''留意事項''
WordPress.com でブログを開設した場合、記事の投稿を行う画面が2パターンあって、混乱することがあります。以下2つの管理画面、WordPressサービスの管理画面(図1)と、あなたのサイト上の管理画面(図2)の区別が必要です。どちらからでも投稿可能ですが、将来、オリジナルのWordPressサイトを持つことを前提としている場合は、投稿や各種設定には、''図2に示す「ダッシュボード」を使いましょう''。

-図1. WordPress.com のサイト上にある、利用者用の管理画面
 https://wordpress.com/posts/xxxxxx.wordpress.com/・・
&lightbox(WordPress/Account/wordpress_sc2.png,,25%); 

-図2. あなたのサイト上にある管理画面(ダッシュボード)
 https://xxxxx.wordpress.com/wp-admin/    ←  xxxxx はあなたのサイト名
&lightbox(WordPress/Account/wordpress_sc3.png,,25%); 

~

***WordPress をレンタルサーバーで
CSSを直接編集するなど、本格的なカスタマイズを行うには、WordPress を独自のサーバーにインストールする必要があります。

WordPress は[[PHP]]で動くWebアプリケーションです。また、記事はMySQLというデータベース管理ソフトによってサーバーに蓄積されるので、レンタルサーバーを探す際は、以下の条件を満たすものを検討する必要があります。

-PHP(HyperText PreProcessor)が動くこと
-MySQLが使えるサーバーであること

WordPress というキーワードでPRしているレンタルサーバーでは、WordPress はボタン一つで自動インストールされます。今回は、これを前提に話を進めます。

参考:[[Google:レンタルサーバー フリー WordPress]]
~

***サイトの情報管理をしっかりと
WordPress サイトの管理には、接続名,ID,PW他、様々な情報の管理が必要で、これは頭で覚えられるものではありません。レンタルサーバー上で WordPress をセットアップする際は、以下の情報をしっかり管理するようにして下さい。

-メールアドレス:
-レンタルサーバー管理者情報
--レンタルサーバーの管理ページのURL:
--アカウント名:
--パスワード:
--登録メールアドレス:( 上記のもの )
-公開サイトのURL:
-FTP接続情報
--FTP接続先(ホスト名):
--FTP接続のアカウント名:
--FTP接続のパスワード:
-WordPress管理者情報(ダッシュボードにログインする際のID,PW)
--ユーザ名:
--パスワード:
~

#hr
'''''以下、WordPress の実際の使い方です。'''''
#hr
~

***ダッシュボードにログイン
-ページ内に「ログイン」の表示がある場合はそれをクリック。
-あるいは、以下のようにタイプしてログインします。
 http://(WordPressサイトのURL)/wp-admin
~

***ダッシュボード内の主な管理メニュー
-投稿(記事の投稿管理です)
-メディア(画像などのメディアファイルを一括管理します)
-固定ページ(投稿とは異なる静的なページを管理します)
-外観の設定(テーマ、メニュー、ウィジェット)
-プラグイン(プラグインの追加で機能の拡張ができます)
-ユーザー(一つのサイトを複数のユーザで編集できます)
-ツール(エクスポート、インポート)
-設定(タイトル、キャッチフレーズ、フロントページの設定など)
~

***初期設定
-サイト名(タイトル)とキャッチフレーズ(サブタイトル)
--設定>一般設定> でこれらを変更することができます。
-フロントページの設定
サイトのトップには、「最新の投稿」あるいは「固定ページ」を利用することができます。前者はBlog、後者は一般サイトのイメージになります。
~

***外観(テーマ)の設定
サイトの外観はページの雛形となるHTML構造とCSSによって決まります。これをセットで扱っているのが「テーマ」で、その変更は非常に簡単です((テーマを変更すると、今まで表示されていたメニューが表示されなくなるなどの現象が生じることもあります(テーマを戻せば元どおりになります。メニューのデータそのものが消えてなくなるわけではありません)。))。
 外観>テーマの変更>1つ選んで「有効化」

-おすすめのテーマ(GPL)
--Cocoon:https://wp-cocoon.com/
--Lightning:https://lightning.nagoya/ja/
--BOYO:https://blogonyourown.com/themes/
-WPにはデフォルトテンプレートがあります。
例えば2020年の標準テンプレートには、TwentyTwenty など、西暦を英語読みした名称がつけられています。
~

***記事の作成
WordPress の情報公開には「投稿」と「固定ページ」の2つの方法があります。

-投稿
お知らせ、近況報告など、Blog的な情報公開には「投稿」を使います。 

-固定ページ
About、リンク集など、常設的な情報公開には「固定ページ」を使います。

~

***メニューのカスタマイズ
固定ページをメニューバーに並べることで、一般的なサイトと同様のナビゲーション環境を構築することができます。メニューのカスタマイズには、「メニューの編集」と「位置の管理」の2つの設定作業が必要です。

-メニューに使える項目
--固定ページ:About など単体で作成したページ 
--カテゴリー:該当する投稿記事が自動回収されて一覧表示されます
--リンク:外部リンクをメニューに登録することができます。

-メニューの編集
--外観>メニュー>固定ページやリンクをメニュー構造へドラッグ
メニューに登録できるのは、固定ページ、リンク、カテゴリーの3種類
--メニュー表記などを編集して>メニューの保存
--ラベル(実際に表示される文字列)は後から自由に変更できます

-位置の管理
メインメニュー以外にも複数のメニューを追加することができる設定になっています。したがって、テーマ(外観)上のどの位置に、どのメニューを表示するかを明示的に指定することが必要です。
~

***[[カテゴリーとタグ>InformationDesign#CategoryTag]]
WordPressでは、投稿記事(情報要素)にカテゴリーとタグを付けることができるようになっていて、カテゴリーはメニュー項目として、タグは、タグクラウドなどを用いることで、記事の抽出に役立てることができます。

-Category:
--一定の観点から一挙に仕分けられるもので、階層構造を持つ
--要素の集合を分類する観点(視点)は無限にある*1
--観点(視点)を定めて要素を分類する際、(原則としては)ひとつの要素が2つ以上のカテゴリーに重複して存在することはない

-TAG:
--要素に関連する「目印」で、系統的に整理されるものではない
--タグは、分類上の「観点」とは無関係に存在する
--ひとつの要素には複数のタグをつけることができる


&image(InformationDesign/CategoriesAndTags.png,,40%); &image(InformationDesign/CategoriesAndTags_WP.png,,36%);

~
~


**参考情報|2020.05.15

***WordPress.com でとりあえずブログ投稿体験
-WordPress.com(アカウントを取るだけですぐ使えます) 
https://ja.wordpress.com/
-WordPress.com でブログをはじめるための手順
https://design.kyusan-u.ac.jp/OpenSquareJP/?WordPress/Account
-WordPress ブログの使い方
https://design.kyusan-u.ac.jp/OpenSquareJP/?WordPress/Basics
~
***WordPress を自分のサーバーで本格利用
-WordPress のダウンロード
https://ja.wordpress.org/
-WordPress のインストール
https://design.kyusan-u.ac.jp/OpenSquareJP/?WordPress
-WordPress のカスタマイズ(おすすめフリーテーマも紹介しています)
https://design.kyusan-u.ac.jp/OpenSquareJP/?WordPress/Customize


~


***GitHubPages について
-Webサイトを公開する方法の一つ: [[GitHubPages]]
HTML+CSS+JavaScript の範囲であれば、公開可能です。
公開リポジトリです。レンタルサーバーではありません。
~
~


情報デザイン研究Ⅰ

https://zoom.us/j/95666050510?pwd=RjNpR2xzc1g3ZklWVWR1SGZxYUJBUT09

// ミーティングID: 956 6605 0510
// パスワード: 1KCwr7

~
~