初めてのパソコン / 福田博同...
Transcript of 初めてのパソコン / 福田博同...
-
音声と図解 ホームページ作成入門 高齢者・障がい者の方が使いやすいHTML5で学ぶ
2015年度公開講座 4月25日, 5月2日 跡見学園女子大学文学部准教授 福田 博同
-
4月25日
準備編
• 見本コピー(実習) ダウンロード
• パソコンと周辺機器
• 起動と終了(実習)
• フォルダを作る(実習)
• タッチタイピング
• 日本語入力
• MS-IME
• よく使うショートカットキー
• エディタを使う
• ファイルの保存
– CD-RWへ保存
• 単語登録(実習)
ホームページの仕組み(説明)
• 元の文書の作り方
• 静止画ファイル
• 音ファイル
• 動画ファイル
• HTML文書
• スタイルシート
アクセシビリティページ
• チェッカー
• HTML5の理解
-
5月2日
•ブログの理解
•図のファイル作成法
–ペイント形式
–写真撮影
–ドロー形式
–画面キャプチャ
•音ファイル作成法
–マイク録音
–MIDI作成
–テキスト2音声変換
•動画のファイル(説明)
•絵日記サイト完成
•アップロード方法(説明)
目次へ
html5Nyuumon201502.pdfhtml5Nyuumon201502.pdfhtml5Nyuumon201502.pdf
-
見本のコピーと保存
1. 教材CD-RWを開く
1. 教材CD-RWには、フォルダ「m見本」がある
2. デスクトップに移動
2. ウェブサイトからダウンロード (著者許可済み)
1. Google検索→ キーワード「artnavi 電脳」→ 「公開講座」→
「2014-15年度」→ 「gift」フォルダをクリック
2. ダウンロード先をデスクトップにする
3. 編集後、リムーバルメディア(USBやCD-RW等)へ保存
目次へ
http://www2.mmc.atomi.ac.jp/~artnavi1/librarySci/koukaiKouza/html5Homepage2014/mihon.htmlhttp://www2.mmc.atomi.ac.jp/~artnavi1/librarySci/koukaiKouza/html5Homepage2014/mihon.html
-
アプリのダウンロード(1)説明
評判やウィルスチェック等でウィルスのないアプリをダウンロード
IEにGoogleをダウンロード(自宅実習)→ 利用可能
• 方法は次頁
Google ウィルスか
目次へ
-
アプリのダウンロード (2)説明
Googleツールバーのダウンロード方法
• 「Google インストール」で検索
• 「Google ツールバーのインストール」をクリック
• 同意してダウンロードをクリック
目次へ
-
アプリのダウンロード (3)プラグイン
• 同意してダウンロードをクリックします(Tabキーで選択し、改行)
• いくつか同意してインストールされる
説明:Google ツールバーなどはプラグインといい、ブラウザに追加されます。
PDFファイル閲覧や、Flashアニメーション、
ブログなどの新着情報を届けるRSSフィードなど
目次へ
-
アプリのダウンロード方法(5)電子メール
固定電話同様にプロバイダ契約した電子メールが必要
• 契約した接続方法で電子メールを設定しておく
• ウィンドウズには「電子メール」が付属。
• ウィンドウズキーを入れ、outlookと入れ。
• ウィザードに従いメールを設定。
目次へ
-
アプリのダウンロード方法(6)圧縮と解凍
• ファイルはZipやLHAなどで圧縮
• ダウンロードしたZIPファイルの解凍方法(説明)
1. Zipファイルを右クリック
2. すべて展開をクリック
3. 展開ウィザードが出るので従う
4. 解凍される
• LHAファイルは解凍ソフトをダウンロードし使用
目次へ
-
パソコンと周辺機器 パソコン本体に加え 入力装置には キーボード マウス マイク ビデオ, カメラ, スキャナ等があり、 出力装置には プリンター モニタ スピーカー プロジェクター等 入出力装置には HDD,CD/DVD, USBや、 LANや無線LANなどが
あります 質問! LANとは何ですか?
構内のネットワークです
目次へ
-
起動(実習)
電源を入れると
パソコンが起動し
「Ctrl + Alt + Delを入れてください」と言われます。
左手でCtrlキーとAltキーを押し、
右手でDeleteキーを押します。
「パスワードを入れよ」と言われます。
パスワードを入れ、Enterキーで確定します
Ctrl + Alt + Deleteを入れよ
Pass wordを入れよ
目次へ
YouTube復習(3分02秒から)
https://www.youtube.com/watch?v=2hJlvDu8o9Ihttps://www.youtube.com/watch?v=2hJlvDu8o9Ihttps://www.youtube.com/watch?v=2hJlvDu8o9Ihttps://www.youtube.com/watch?v=2hJlvDu8o9Ihttps://www.youtube.com/watch?v=2hJlvDu8o9Ihttps://www.youtube.com/watch?v=2hJlvDu8o9I
-
パソコンの
パスワードとは
はい、ここでは ウィルスからの防御のためのコンピュータの合言葉を意味しております。
パソコンを購入し、最初の起動時に設定します。忘れないようにしましょう。
後でパスワードを変更する方法:
スタート→ コントロールパネル→ ユーザーアカウント→ 変更するユーザーアカウント
で設定しなおします。
起動(説明)へ戻る
目次へ
-
終了(実習)
• 終了は
「ウィンドウズキー」を押し
「右矢印キー」でシャットダウンに行き、
Enterキーで終了します。
目次へ
-
フォルダ作成(実習)
データ保存のためフォルダ作成法(実習)
• ウィンドウズキー+Dキーでデスクトップに行く
• Ctrl + Shift + Nキー または
• (右クリック→新規作成→フォルダ)
• そのまま名前を入れる
• 例:「HTML作成法」
• 最初にアルファベットを入れると便利
画面切り替えはAlt + Tabキー
目次へ
YouTube復習(5分54秒から)
https://www.youtube.com/watch?v=2hJlvDu8o9Ihttps://www.youtube.com/watch?v=2hJlvDu8o9Ihttps://www.youtube.com/watch?v=2hJlvDu8o9Ihttps://www.youtube.com/watch?v=2hJlvDu8o9Ihttps://www.youtube.com/watch?v=2hJlvDu8o9Ihttps://www.youtube.com/watch?v=2hJlvDu8o9Ihttps://www.youtube.com/watch?v=2hJlvDu8o9I
-
タッチタイピング
見ないでキーボードを打つと能率的で老眼になってもパソコンが利用できます。なるべくマウスを使わない
• 左人差し指を Fキーに • 右人差し指を Jキーに置きます。 左人差し指は 4RFV 5TGB 右人差し指は 6YHN 7UJMが守備範囲です • 定番ソフトをダウンロー
ドするにはインターネットを見ます
目次へ
-
日本語入力
Windowsには、
MS-IMEが付いていま
す。
昔から定評のATOKや、
無料のGoogle日本語入
力 が良く使われていま
す。
では、MS-IMEで説明し
ます。
目次へ
http://www.atok.com/http://www.google.co.jp/ime/http://www.google.co.jp/ime/http://www.google.co.jp/ime/http://www.google.co.jp/ime/
-
MS-IME
MS-IMEのメニューはワープロやエディタの文字入力画面で、Ctrl+F10キーで出てきます。 次にPキーでIMEパッド、Wキーで単語登録などに切り替えられます。 ローマ字漢字から、「直接ひらがな入力」にするには、 Alt + 「カタカナ・ひらがな・ローマ字キー」 「漢字」から「全角英数」等切り替えは、 Ctrl+F10,Nキー
目次へ
-
IMEパッド
Ctrl+F10,PでIMEパッドを開く
•文字一覧, 手書き, ソフトキーボード, 画数、部首検索が出る。
文字一覧では文字コード(Unicode, Shift-JIS, JISなど)とフォントを指定可能
パソコンはShift-JISだが、多言語対応のUnicodeも可能、Web上のデータはUnicodeへ向う
メール等の文字化け=コード変換不適切が原因
目次へ
-
よく使うショートカットキー
マウス使わないと格段に作業が速い よく使うショートカットキーは少ないので覚えてしまいましょう
• エクスプローラ: ウィンドウズキー+E
• アプリ開始
• アプリ切り替え: Alt+Tab
目次へ
-
よく使うショートカットキー 2
• コピー:Shift+→キー
で範囲選択し、
Ctrl+Cキーでコピー
し、
• 貼付: 範囲選択し、
Ctrl+Vキーでペース
トします
• 切取り: Ctrl+X
• 復活: Ctrl+Z
• ハイパーリンク:
Ctrl+K
目次へ
-
「色盲の人にもわかるバリアフリープレゼンテーション法 」より 岡部正隆・伊藤啓編
よく使うショートカットキー :まとめ
★スタート: Windowsキー(田キー)
★エクスプローラ: 田にEキー
★画面切り替え: AltにTabキー
★漢字変換: スペースバー
★決定: Enterキー
★ファイル保存: CtrlにSキー
★別名保存: AltにFキー、Aキー
★終了: AltにF, XキーかCキー
★複写: CtrlにCキー
★切取: CtrlにXキー
★削除: 範囲選択、Deleteキー
★貼付: CtrlにVキー
★復活: CtrlにZキー
★アドレス取得: AltにDキー
★ハイパーリンク: CtrlにKキー
★パソコン終了: 田にUキー
目次へ
http://night.nig.ac.jp/color/http://night.nig.ac.jp/color/
-
エディタ試し←文書作成・編集
Editorや
ワープロソフト、
プレゼンテーションソフト、
HTMLエディタ、
電子書籍作成ソフト
などで、
文書を作成・編集・
保存し、印刷したり、
インターネット共有もできます。
目次へ
-
エディタを使う
単に文字を入力、編集するソフト
文字コード:Shift-JIS以外にUnicode。UTF-8で保存
• ウィンドウズは「メモ帳」
• 手順:スタート→ メモ帳と記入→ 検索で出るのでクリックし起動
目次へ
-
エディタを使う
右端折り返しとフォントの大きさを変えてみる
• Alt→ O→Wキー
折り返し
• Alt → O →Fキー
フォント変更
• 文字を入れる
• 漢字は「半角全角キー」
• 何か入れる
• スペースで変換
• Enterキーで確定
• シフトキーは上段にある文字
目次へ
-
ファイルの保存(実習)
• CtrlキーにSキーで保存
• 最初は「ドキュメント」画面が開きます。
• 名前を入れます。例:m見本
• Enterキーで保存されます
m見本.txt
目次へ
-
CD-RWへ複写(フォーマット)
1. DVD-RWトレイボタンを押すと開く
2. CD-RWを入れる 3. トレイを押す 4. エクスプローラー画
面が出る 5. DVD-RWをクリックか
Enterキー 6. メニューが出る 7. 名前を入れる 8. 「USBフラッシュドライ
ブと同じように,,,」をクリック
9. フォーマット開始 これで書き換え可能なCD-RWができる
目次へ
-
CD-RWへ複写(実習)
• 開いているアプリや文書をすべて閉じ、
Alt+F4キー(右上の☓印)
• エクスプローラを2つ出す
ウィンドウズキー+Eを2回
• DVD-RWを開く
• ドキュメントのファイルをコピー
• DVD-RWフォルダへ貼付け
目次へ
-
単語登録
よく使う文章を単語登録すると便利
1. 文書編集中
2. 右下弁当箱のようなMS-IMEを開く
3. 単語、よみを入れ確定:例を
「あ」で登録
4. 閉じる
5. 「あ」と入れると
もでる
目次へ
2 3
-
ホームページの仕組み
1. 元の文書、図、表、音、動画等を作る
2. HTML形式やXHTML形式ファイルへ変換
3. プロバイダ等へファイル転送
4. ブラウザで読む
プロバイダのサーバ
見る人
サイト開設者
見る人
インターネット
目次へ
-
元の文書の作り方 1. ブログやMedia WikiはWeb上で書く
2. エディタやHTMLエディタで書く→保存
3. ワープロソフトで書く → 保存 → 変換
4. プレゼンテーションソフトで書く→ 保存 → 変換
5. 表計算ソフトで書く → 保存 → 変換
6. データベースを作る → 保存 → 変換
サイト開設者
目次へ
YouTube復習(2分12秒)
https://www.youtube.com/watch?v=yyscUlTErAIhttps://www.youtube.com/watch?v=yyscUlTErAIhttps://www.youtube.com/watch?v=yyscUlTErAIhttps://www.youtube.com/watch?v=yyscUlTErAIhttps://www.youtube.com/watch?v=yyscUlTErAIhttps://www.youtube.com/watch?v=yyscUlTErAI
-
静止画ファイル 拡張子 Web用ファイル
• ペイント形式で描く ペイント, Gimp bmp, tif など gif, jpg, png
• ドロー形式で描く(ぎざぎざなし)
Inkscape (フリー) svg svg
Illustrator ai, pdf, svgなど jpg, pdf, png, svg, tif等
Power Point ppt pdf に印刷 ○ HTMLで出力 ×(理由:MSのみ) • 写真を撮る tiff, bmp, jpg jpgで出力
• スキャナーで写す bmp, jpg, pdf jpg, pdf • PC画面をキャッチ bmp, jpg jpgへ変換
• 詳細はノートを参照
サイト開設者
目次へ
-
元の音ファイル 拡張子 Web用ファイル
• 録音
マイク録音
サウンドレコーダー、超録など使用
| .wav | .aiff | bwf
ディジタル録音機
ICレコーダ mp3, wma
リニアPCMレコーダー: wav
DSD (ハイレゾ)録音: .DSF
• DAW ソフトで作曲 例:cwp, mml
(代表的ファイル形式例を記載)
サイト開設者
Web用に変換
.ogg | .mp3 | .ra | .aac | .wma |.m4a
mp3, wma
Wav, mp3
FLAC, WAV, DSD
.mp3 | .mid | wav
目次へ
-
動画ファイル 拡張子 Web用ファイル
• ビデオ撮影
通常STD画質撮影 MPEG2,AVI
ハイビジョンHVCSD撮影
MPEG4-AVC
• ソフトで描く
Flashアニメーション FLA
SMILアニメーション RM,MOV
3Dアニメーション Blenderほか
(代表的ファイル形式例を記載)
サイト開設者
コンバーターや編集ソフトで変換 QT, RM, SWF, WMV, H.264, MOV等 高スペックPCと編集ソフトで変換 FLV, MPEG4-AVC/H.264 等
SWF, アニメーションGIF等 SMI VRML, SWF,X3D等
目次へ
-
HTML文書(ファイル名.html)
この文書の属性(著者だとかキーワードとか
スタイルとか)
見える部分 図とかはすべてリンクで可能
サイト開設者 目次へ
-
HTML/XHTMLと CSS(スタイルシート)
• HTMLは文書を、スタイルはCSSを使う。
– 理由: 文書と見映えの分離:メンテナンス性
– アクセシビリティ
– SEO(検索エンジン対策)
– W3C(Webの仕様を決める団体)国際標準
詳しくは
• ユーザビリティ___スタイルシート作成 / 筆者
目次へ
http://www2.mmc.atomi.ac.jp/~artnavi1/help/webSiteMake/style02.htmlhttp://www2.mmc.atomi.ac.jp/~artnavi1/help/webSiteMake/style02.htmlhttp://www2.mmc.atomi.ac.jp/~artnavi1/help/webSiteMake/style02.htmlhttp://www2.mmc.atomi.ac.jp/~artnavi1/help/webSiteMake/style02.htmlhttp://www2.mmc.atomi.ac.jp/~artnavi1/help/webSiteMake/style02.htmlhttp://www2.mmc.atomi.ac.jp/~artnavi1/help/webSiteMake/style02.html
-
見本のスタイルシート解説
詳しくは ユーザビリティ___スタイルシート作成 / 筆者 ですが見本の解説 ファイル名:dunWhite120.css(意味:dun焦げ茶地White白文字120%の大きさ)
body { /* 背景焦げ茶文字白120%大きい */ width:90%; margin:1% auto; background-
color:#320; color:white; } a{ color:yellow; } a:visited{ color:#ff6; } h1{ font-size:135%; } h2{ font-size:130%; } h3{ font-size:125%; } h4{ font-
size:120%; } h5{ font-size:115%; } h6{ font-size:110%; } p.right {text-align: right;} p.center {text-align: center;} p.left {text-align: left;}
目次へ
背景色
文字色
リンクの色
見出しの大きさ
段落の右寄せ
Body部の設定
http://www2.mmc.atomi.ac.jp/~artnavi1/help/webSiteMake/style02.htmlhttp://www2.mmc.atomi.ac.jp/~artnavi1/help/webSiteMake/style02.htmlhttp://www2.mmc.atomi.ac.jp/~artnavi1/help/webSiteMake/style02.htmlhttp://www2.mmc.atomi.ac.jp/~artnavi1/help/webSiteMake/style02.htmlhttp://www2.mmc.atomi.ac.jp/~artnavi1/help/webSiteMake/style02.htmlhttp://www2.mmc.atomi.ac.jp/~artnavi1/help/webSiteMake/style02.htmlhttp://www2.mmc.atomi.ac.jp/~artnavi1/help/webSiteMake/style02.htmlhttp://www2.mmc.atomi.ac.jp/~artnavi1/help/webSiteMake/style02.html
-
見本のスタイルシート解説.2
header, nav, section, footer { display:block; margin:1px auto; padding:5px; } header { text-align:left; padding:10px; background-color:#210; color:white; }
header h2 { text-align:left; } header ul, header li { display:inline; } div.hidari{ float:left; line-height:1.5; margin:1px auto; background-color:#320;
color:white; } div.migi{ float:right; line-height:1.5; margin:1px auto; background-color:#320; color:white; }
目次へ
Header,nav,section,footerの設定
テキスト左寄せ
行間
-
見本のスタイルシート解説. 3
nav {
float:right;
font-size:90%;
line-height:1.4;
margin:2px auto;
display:inline;
background-color:#320;
color:white;
}
#nav ul li{
display: inline;
}
nav.hirari {
background-color:#320;
color:white;
float:right;
font-size:90%;
line-height:1.4;
margin:2px auto;
}
section {
float:left;
width:98%;
line-height:1.5;
background-color:#320;
color:white;
}
p.resizeimage img { width: 100%; }
p {
margin: 0;
}
目次へ
箇条書き 余白
-
見本のスタイルシート解説
aside{
float:right;
width:20%;
line-height:1.3;
font-size:90%;
background-color:#320;
color:white;
}
footer {
clear:both !important;
text-align: right;
font-size:85%;
background-color:#320;
color:white;
}
form.migi {float:right;}
form.hidari
{float:left;}
目次へ
サイドバー
フッター部:脚注
-
HTML, CSSのアクセシビリティチェック
• W3C Markup Validation Service
• Another HTML -lint gateway /石野恵一郎氏(HTML4まで)
• W3C CSS Validation Service
• 色覚チェック / 岡部正隆氏、伊藤啓氏
• aDesigner / 浅川千恵子氏グループ
では心当たりの会社等を調査してみましょう
目次へ
http://validator.w3.org/http://openlab.ring.gr.jp/k16/htmllint/htmllint.htmlhttp://openlab.ring.gr.jp/k16/htmllint/htmllint.htmlhttp://openlab.ring.gr.jp/k16/htmllint/htmllint.htmlhttp://jigsaw.w3.org/css-validator/validator.html.jahttp://jfly.iam.u-tokyo.ac.jp/html/manuals/pdf/color_blind_J.ppthttp://jfly.iam.u-tokyo.ac.jp/html/manuals/pdf/color_blind_J.ppthttp://www.eclipse.org/actf/downloads/tools/aDesigner/index.php
-
HTML5とは(背景説明) •1986年, SGML(Standard Generalized Markup Language)がISO規格となる。
テキスト文の特定文字をタグで囲み、コンピュータが意味を解釈できるようにするマークアップ言語。記法は複雑。
•1990年, ティム・バーナーズ=リー (CERNに所属していた)
HTML (ハイパーテキスト・マークアップ・ランゲージ),URL(アドレス), HTTP(ハイパーテキストの通
信規約)などからなるWorld Wide Web(WWW) を立ち上げる(典拠)
–HTMLは一般的なタグを決め、SGMLをインターネット対応に特化し、普通の人が利用しやすいようにした(神崎正英氏解説)。
目次へ
http://www.iso.org/iso/catalogue_detail.htm?csnumber=16387http://www.iso.org/iso/catalogue_detail.htm?csnumber=16387http://www.w3.org/People/Berners-Lee/http://www.w3.org/People/Berners-Lee/http://www.w3.org/People/Berners-Lee/http://www.w3.org/People/Berners-Lee/http://home.web.cern.ch/http://tenyears-www.web.cern.ch/tenyears-www/Story/WelcomeStory.htmlhttp://www.kanzaki.com/docs/htminfo.html
-
HTML5とは (背景説明 その2) •1993年, CERNがWWWを公開
•NCSAのマーク・アンドリーセン
WebブラウザのMosaic(後のNetscape Navigator → Mozilla Firefox)を公開→画像が利用しやすい(インターネットマガジン(199412))
1994年,ティム・バーナーズ=リー等
標準化団体WWWコンソーシアム(W3C)結成
1995年,Sun Microsystems社、Java (Javaとは)を公開、JavaScriptを公開(JavaScriptとは:All About記事) ブラウザのNetscape2等で動画を表現→
WWWは一気に普及
目次へ
https://web.archive.org/web/20120229043859/http:/archive.ncsa.illinois.edu/mosaic.htmlhttp://i.impressrd.jp/files/images/bn/pdf/im199412-028-sp1.pdfhttp://i.impressrd.jp/files/images/bn/pdf/im199412-028-sp1.pdfhttp://www.w3.org/Consortium/Translation/Japanesehttp://www.oracle.com/us/sun/index.htmhttp://www.java.com/ja/download/faq/whatis_java.xmlhttp://www.java.com/ja/download/faq/whatis_java.xmlhttp://allabout.co.jp/gm/gc/23220/http://allabout.co.jp/gm/gc/23220/http://allabout.co.jp/gm/gc/23220/http://allabout.co.jp/gm/gc/23220/
-
HTML5とは (背景説明その3) •1996年, Internet Explorer 3公表
– Netscape Navigatorとのブラウザ機能の拡張合戦開始
•1998年, W3CがXMLを勧告
–SGMLをWWW用に改良したもの(XML1.0仕様/村田真ほか訳)
–例えば、異なるシステムでもメタデータを同一にすると検索できます
•1999年, W3CがHTML4.01を勧告(邦訳)
–HTMLとスタイルシートとの分離
•1999年, W3CがWCAG(Webコンテンツアクセシビリティガイドライン)を勧告(邦訳)
–視覚障害者・聴覚障害者・肢体不自由者もインターネット文書を読めるための基準
目次へ
https://web.archive.org/web/20070220040551/http:/www.fxis.co.jp/xmlcafe/tmp/wrapper-xml-19980210.htmlhttps://web.archive.org/web/20070220040551/http:/www.fxis.co.jp/xmlcafe/tmp/wrapper-xml-19980210.htmlhttps://web.archive.org/web/20070220040551/http:/www.fxis.co.jp/xmlcafe/tmp/wrapper-xml-19980210.htmlhttps://web.archive.org/web/20070220040551/http:/www.fxis.co.jp/xmlcafe/tmp/wrapper-xml-19980210.htmlhttps://web.archive.org/web/20140205223608/http:/www.asahi-net.or.jp/~sd5a-ucd/rec-html401j/cover.htmlhttps://web.archive.org/web/20130311023808/http:/www.zspc.com/documents/wcag10/index.html
-
HTML5とは (背景説明その4) •2000年, W3CがXHTML1.0を勧告(邦訳)
–XMLから自動的にHTML文書に変換するための共通形式
•2009年, Linked Dataの提案(ティム・バーナーズ=リー)
–タグでデータの主語・述語・目的語を理解できるようにし、オープンデータが連携できるデータのWWW
•2014年, HTML5を WHATWGが作成、W3Cが後に加わった「最新HTML勧告」(邦訳)
–(W3CはXHTML1.0の後継を断念し、HTML5に)
目次へ
https://web.archive.org/web/20130423141603/http:/www.doraneko.org/webauth/xhtml10/20000126/Overview.htmlhttp://www.whatwg.org/http://www.w3.org/https://web.archive.org/web/20140305151132/http:/momdo.s35.xrea.com/web-html-test/spec/html5-dev/Overview.html
-
HTML5の利点 • 音声、静止画、動画等に特別なプ
ラグイン(追加機能)が不用
• PCとモバイル(スマフォやタブレット端末)の区別なくWebページを書ける
• タッチパネルでフリック(軽くはたいて移動)やピンチ(摘んで拡大縮小)などが出来る
• 縦書レイアウトも標準装備
• リフロー(再流動)型サイト作成が可能
• タグにセマンティクス(意味)を加えた(例:は文頭, は道案内, は記事, は文末)
• ローカル保存データ枠の拡大
• モバイルでは、JavaScriptで位置情報の取得、など
目次へ
http://ja.wikipedia.org/wiki/%E3%83%97%E3%83%A9%E3%82%B0%E3%82%A4%E3%83%B3http://ja.wikipedia.org/wiki/%E3%83%97%E3%83%A9%E3%82%B0%E3%82%A4%E3%83%B3http://ja.wikipedia.org/wiki/%E3%83%95%E3%83%AA%E3%83%83%E3%82%AF%E5%85%A5%E5%8A%9B
-
HTML5の欠点
• 未対応ブラウザがある
• ついアクセシビリティへの配慮を忘
れがちになる
• 音声、動画等、主要ブラウザに表
示するため複数のファイルが必要
となる
• XMLから自動出力するためには、
XHTML形式のタグを行うことで解
決(XHTML5)
目次へ
-
Head部:例:
ここにホームページ名を書きます
目次へ
-
Head部:例:
目次へ
-
Body部
ここに見出しを書きます
この段落に何か書きます
目次へ
-
Body部
ナビゲーション
リンクしたいファイル名を書きます
次のリンクを書きます
目次へ
-
Body部:例: 2/3
文章の見出しを書きます
この段落に何か書きます
この段落に何か書きます
目次へ
この方法を推奨
E:/2015%E5%85%AC%E9%96%8B%E8%AC%9B%E5%BA%A7/f%E7%A6%8F%E7%94%B0%E3%83%9B%E3%83%BC%E3%83%A0/sakura01.jpg
-
Body部:例: 2/3
トップページの呼び出し語 | CC-BY-SA | 作者名を書きます | 2014年4月26日 - 2014年 | 次ページへ
目次へ