WebDesign/Introduction をテンプレートにして作成

開始行:
*Webデザイン｜序説 ~ このページでは、WWWのしくみ、Webでの情報発信の種類、閲覧... ~ ***CONTENTS #contents2_1 ~ **WWWとは WWW(World Wide Web)は、ネットワーク同志をつなぐ、蜘蛛の巣... もともとは、大学や研究所などの個々のネットワーク同士が同... どこかが断線しても、別の経路で目的のコンピュータにつなが... Webはクライアント・サーバモデルに基づくシステムで、クライ... -1) ブラウザにURL(アドレス)を入力、あるいはリンクをクリッ... -2) URLがDNSというデータベースによってIPアドレスに変換さ... -3) IPアドレスに対応するサーバにHTTPというプロトコルで接... -4) HTMLで書かれたページが画像などとともに、要求元に送信... -5) 受け取ったデータはブラウザによって画面上に描き出される 多くのWebページは他のページへのリンクを含んでいて、このリ... これは、人間の脳内ネットワークの仕組みと同じです。WWWは、... ~ ***HTMLの歴史 ページを独立させました　＞　[[WebDesign/History]] ~ ***Webサーバー -[[世界最初のWebサーバー（画像）>http://ja.wikipedia.org/... -[[日本最初のWebサーバー>http://www.ibarakiken.gr.jp/www/... -[[日本で最初のホームページ（アーカイブ）>http://www.ibar... 高エネルギー加速器研究機構 計算科学センターの森田洋平博士... 情報源＞[[株式会社つくばマルチメディアが管理するサイト>ht... ~ ***Internet Archive -https://archive.org/ --[[internet archives / mac>https://archive.org/details/s... ~ ***Webブラウザについて -記載内容を別ページに移動しました。＞ [[Browser]] ~ ***Webメディアの特質 -Head(見出し) と Body(本文) という構造・・わかりやすい情... //※ポスターの構造　 映画におけるマスターショットシステム -内容(HTML)と形式(CSS)の分離 -クローズドからオープンへ //※従来型のビジネスモデルは変革をせまられています。 -リンク　という概念の一般化 //※人間は基本的にリンクを張る動物である。　記号　→　実体... -「書きかけです」・・という暫定公開の容認 //***読んでおきたい２冊の本 //梅田望夫著　「ウェブ進化論」 ちくま新書 //中川淳一郎　「ウェブはバカと暇人のもの」 光文社新書 ~ ~ **情報公開の様々なかたち -Blog、WikiなどのWebサービスを利用したWebサイト HTML+CSSの知識は不要。アカウント取得で、すぐに情報発信が... --Blog ＞　事例：[[WordPress>https://ja.wordpress.com/]] --Wiki ＞　事例：[[Seesaa Wiki>https://wiki.seesaa.jp/]] -ノーコードツール（Webサイトビルダー）で編集・作成するWeb... HTML+CSSの知識は不要。お好みのテンプレートを選んで、画面... --''Google Sites''　https://sites.google.com/　← 最も手軽... --STUDIO（スタジオ） https://studio.design/ja/ --Jimdo(ジンドゥー）　http://jp.jimdo.com/ -- Wix（ウィックス）　http://ja.wix.com/　 --Jimdo(ジンドゥー）　http://jp.jimdo.com/ -HTML による一般的なWebサイト Webサイトの構築と公開のための基礎知識を必要とします。 --HTML、CSS、JavaScript 等を直接コーディングして作成 --[[テンプレート>Google:Webデザイン テンプレート]]を利用... -[[CMS]]をカスタマイズした Webサイト HTML、CSS、JavaScript、PHP といった言語とサーバー管理の知... --Blog：[[WordPress]]　← 世界中のサイトの約40%がこれです。 --Wiki：[[PukiWiki]]、[[MediaWiki]] ~ //-FLASHを用いた視覚的にインパクトのあるサイト //--かつて一世風靡しましたが、[[事実上、終焉を迎えていま... //~ #aname("notice") ~ **Web開発に関わるソフトウエア 作るソフト ・ 見るソフト ・ 転送するソフト IllustratorやPhotoshopでグラフィックを作成するのと異なり... ~ ***1) 作るソフト・・　 Webサイトの構成ファイルは、HTML、CSS、JavaScript等のテキ... //※～.htmlをダブルクリックしても、通常はこれらのソフトは... -[[TextEditor]] ~ ***2) 見るソフト(ブラウザ)・・　 Chrome、Firefox、Safari、Microsoft Edge、Internet Explore... -[[Browser]] ~ ***3) 転送するソフト(FTPソフト)・・　 FileZilla、FFFTP、Cyberduck、FireFTP(Firefox拡張)など、出... -[[FTP]] ~ ~ ***補足：オーサリングソフトについて 授業では原則として[[テキストエディタ>TextEditor]]を用いま... -1） [[Dreamweaver>http://www.adobe.com/jp/products/dream... Adobeのソフトウエアで、多くの制作現場で使用されています。 http://ja.wikipedia.org/wiki/Adobe_Dreamweaver -2） [[Aptana Studio>http://www.aptana.com/]] オープンソースの開発環境です。WYSIWYGではありませんが高機... http://ja.wikipedia.org/wiki/Aptana http://aptana.cssmaid.net/　マニュアル 以下のサイトからダウンロードできます。 http://www.aptana.com/ -3）[[BlueGriffon>http://www.bluegriffon.org/]] Webオーサリングツール、Nvu(Kompozer) の後継バージョンです。 HTML5に対応しています。 http://ja.wikipedia.org/wiki/BlueGriffon -4） [[Kompozer(N|vu)>http://kompozer.net/]] これもオープンソースのソフトウエアです。WYSIWYGです。 使いやすいのですが、HTML5に対応していません。 http://ja.wikipedia.org/wiki/KompoZer http://kompozer.cssmaid.net/index.html　マニュアル 以下のサイトからダウンロードできます。 http://kompozer.net/ ~ &aname(Considerations); ~ **情報発信についての留意事項 情報の公開に際しては、以下のことに十分注意して下さい。 -著作権侵害行為がないか確認して下さい。 [[著作権とは何か>Google:著作権]]、簡単な記事でいいので、... -肖像権や、個人情報にも注意が必要です。 人物が写った画像については原則、その本人の許諾が必要であ... 　ただし、将来の活動のために、自身のプロフィールをきちん... -他者が見て、不快に感じるような表現がないか注意して下さい。 Webは公の場です。個人を攻撃する発言はもちろんいけませんが... -「立場上知り得る情報」を投稿しないこと 団体・組織に所属するメンバーには「守秘義務」があるのが普... -facebook その他SNSを利用中の学生さんへ 人間関係のトラブルが多発しているようです（学生のではなく... 　''さらに''、というか、こちらの方が重要な話かもしれませ... 　試しに、誰かの名前で適当に検索してみて下さい。まったく... [[公開範囲の設定について、正しく理解しておきましょう。>ht... ~ ~ ~

終了行:
*Webデザイン｜序説 ~ このページでは、WWWのしくみ、Webでの情報発信の種類、閲覧... ~ ***CONTENTS #contents2_1 ~ **WWWとは WWW(World Wide Web)は、ネットワーク同志をつなぐ、蜘蛛の巣... もともとは、大学や研究所などの個々のネットワーク同士が同... どこかが断線しても、別の経路で目的のコンピュータにつなが... Webはクライアント・サーバモデルに基づくシステムで、クライ... -1) ブラウザにURL(アドレス)を入力、あるいはリンクをクリッ... -2) URLがDNSというデータベースによってIPアドレスに変換さ... -3) IPアドレスに対応するサーバにHTTPというプロトコルで接... -4) HTMLで書かれたページが画像などとともに、要求元に送信... -5) 受け取ったデータはブラウザによって画面上に描き出される 多くのWebページは他のページへのリンクを含んでいて、このリ... これは、人間の脳内ネットワークの仕組みと同じです。WWWは、... ~ ***HTMLの歴史 ページを独立させました　＞　[[WebDesign/History]] ~ ***Webサーバー -[[世界最初のWebサーバー（画像）>http://ja.wikipedia.org/... -[[日本最初のWebサーバー>http://www.ibarakiken.gr.jp/www/... -[[日本で最初のホームページ（アーカイブ）>http://www.ibar... 高エネルギー加速器研究機構 計算科学センターの森田洋平博士... 情報源＞[[株式会社つくばマルチメディアが管理するサイト>ht... ~ ***Internet Archive -https://archive.org/ --[[internet archives / mac>https://archive.org/details/s... ~ ***Webブラウザについて -記載内容を別ページに移動しました。＞ [[Browser]] ~ ***Webメディアの特質 -Head(見出し) と Body(本文) という構造・・わかりやすい情... //※ポスターの構造　 映画におけるマスターショットシステム -内容(HTML)と形式(CSS)の分離 -クローズドからオープンへ //※従来型のビジネスモデルは変革をせまられています。 -リンク　という概念の一般化 //※人間は基本的にリンクを張る動物である。　記号　→　実体... -「書きかけです」・・という暫定公開の容認 //***読んでおきたい２冊の本 //梅田望夫著　「ウェブ進化論」 ちくま新書 //中川淳一郎　「ウェブはバカと暇人のもの」 光文社新書 ~ ~ **情報公開の様々なかたち -Blog、WikiなどのWebサービスを利用したWebサイト HTML+CSSの知識は不要。アカウント取得で、すぐに情報発信が... --Blog ＞　事例：[[WordPress>https://ja.wordpress.com/]] --Wiki ＞　事例：[[Seesaa Wiki>https://wiki.seesaa.jp/]] -ノーコードツール（Webサイトビルダー）で編集・作成するWeb... HTML+CSSの知識は不要。お好みのテンプレートを選んで、画面... --''Google Sites''　https://sites.google.com/　← 最も手軽... --STUDIO（スタジオ） https://studio.design/ja/ --Jimdo(ジンドゥー）　http://jp.jimdo.com/ -- Wix（ウィックス）　http://ja.wix.com/　 --Jimdo(ジンドゥー）　http://jp.jimdo.com/ -HTML による一般的なWebサイト Webサイトの構築と公開のための基礎知識を必要とします。 --HTML、CSS、JavaScript 等を直接コーディングして作成 --[[テンプレート>Google:Webデザイン テンプレート]]を利用... -[[CMS]]をカスタマイズした Webサイト HTML、CSS、JavaScript、PHP といった言語とサーバー管理の知... --Blog：[[WordPress]]　← 世界中のサイトの約40%がこれです。 --Wiki：[[PukiWiki]]、[[MediaWiki]] ~ //-FLASHを用いた視覚的にインパクトのあるサイト //--かつて一世風靡しましたが、[[事実上、終焉を迎えていま... //~ #aname("notice") ~ **Web開発に関わるソフトウエア 作るソフト ・ 見るソフト ・ 転送するソフト IllustratorやPhotoshopでグラフィックを作成するのと異なり... ~ ***1) 作るソフト・・　 Webサイトの構成ファイルは、HTML、CSS、JavaScript等のテキ... //※～.htmlをダブルクリックしても、通常はこれらのソフトは... -[[TextEditor]] ~ ***2) 見るソフト(ブラウザ)・・　 Chrome、Firefox、Safari、Microsoft Edge、Internet Explore... -[[Browser]] ~ ***3) 転送するソフト(FTPソフト)・・　 FileZilla、FFFTP、Cyberduck、FireFTP(Firefox拡張)など、出... -[[FTP]] ~ ~ ***補足：オーサリングソフトについて 授業では原則として[[テキストエディタ>TextEditor]]を用いま... -1） [[Dreamweaver>http://www.adobe.com/jp/products/dream... Adobeのソフトウエアで、多くの制作現場で使用されています。 http://ja.wikipedia.org/wiki/Adobe_Dreamweaver -2） [[Aptana Studio>http://www.aptana.com/]] オープンソースの開発環境です。WYSIWYGではありませんが高機... http://ja.wikipedia.org/wiki/Aptana http://aptana.cssmaid.net/　マニュアル 以下のサイトからダウンロードできます。 http://www.aptana.com/ -3）[[BlueGriffon>http://www.bluegriffon.org/]] Webオーサリングツール、Nvu(Kompozer) の後継バージョンです。 HTML5に対応しています。 http://ja.wikipedia.org/wiki/BlueGriffon -4） [[Kompozer(N|vu)>http://kompozer.net/]] これもオープンソースのソフトウエアです。WYSIWYGです。 使いやすいのですが、HTML5に対応していません。 http://ja.wikipedia.org/wiki/KompoZer http://kompozer.cssmaid.net/index.html　マニュアル 以下のサイトからダウンロードできます。 http://kompozer.net/ ~ &aname(Considerations); ~ **情報発信についての留意事項 情報の公開に際しては、以下のことに十分注意して下さい。 -著作権侵害行為がないか確認して下さい。 [[著作権とは何か>Google:著作権]]、簡単な記事でいいので、... -肖像権や、個人情報にも注意が必要です。 人物が写った画像については原則、その本人の許諾が必要であ... 　ただし、将来の活動のために、自身のプロフィールをきちん... -他者が見て、不快に感じるような表現がないか注意して下さい。 Webは公の場です。個人を攻撃する発言はもちろんいけませんが... -「立場上知り得る情報」を投稿しないこと 団体・組織に所属するメンバーには「守秘義務」があるのが普... -facebook その他SNSを利用中の学生さんへ 人間関係のトラブルが多発しているようです（学生のではなく... 　''さらに''、というか、こちらの方が重要な話かもしれませ... 　試しに、誰かの名前で適当に検索してみて下さい。まったく... [[公開範囲の設定について、正しく理解しておきましょう。>ht... ~ ~ ~

ページ名: