■ Webページ作成メモ このWebサイトは HTML と CSS のみ利用しています。 色々なサイトを検索して調べながら作成しましたが、一番苦労したのがメニュー画面です。 メニューとしてHTMLの"フレーム"を利用すると、ブラウザ検索時にメニュー画面と内容画面が 分かれてしまいメニュー画面のない内容画面のページだけが開いてしまうのであまりよくないそうです。 "インラインフレーム"を流用して試行錯誤してみましたが、こちらもあまり見栄えの良いものになりませんでした。 "WEBページの多くは、全てのHTMLファイルに同じメニュー項目を記載している" このことに気づくのに時間がかかりました。 "全てのHTMLファイルに同じメニュー項目を記載する"となると、複数ページ作った後からのメニュー項目変更は大変です。 後からカスタマイズしやすくするため、下記のようにしました。 ・画面構成はタイトル記載箇所と本文のみ ・常に表示させるタイトル記載箇所はTOPページに戻るリンクのみ ・メニュー項目はTOPページに記載 ・文字フォントなどは全てCSSファイルに記載し、HTML内には記載しない ・HTMLファイル本文は、見た目通りに表示させるタグ <pre>を利用 これでページ追加時は、作成済 htmlファイルをコピーして <pre> ～ </pre> 内の変更と、 TOPページのメニュー画面の変更だけで済むようになりました。 気分的に文字色などを変更したい時はCSSファイルの変更を行うだけで済みます。 まだまだ不明点も多く勉強中です。 ・本サイトのデフォルトページ（コピー用html)更新日：2022年6月4日
●HTML 標準カラー色 (W3C®で定義されている16色) ※和名は正式名ではありません。 赤色 Red #FF0000 黄色 Yellow #FFFF00 黄緑色 Lime #00FF00 水色 Aqua #00FFFF 青色 Blue #0000FF 桃色 Fuchsia #FF00FF 茶色 Maroon #800000 黄土色 Olive #808000 緑色 Green #008000 青緑色 Teal #008080 紺色 Navy #000080 紫色 Purple #800080 黒色 Black #000000 濃灰色 Gray #808080 薄灰色 Silver #C0C0C0 白色 White #FFFFFF ←白色文字。カーソルドラッグすると読める。 ●html特殊文字 （半角で文字列として認識させるには) 半角＆ & →コード上 & と記載(単体利用時は&とそのまま記載) 半角＜ < →コード上 < と記載 半角＞ > →コード上 > と記載 半角” " →コード上 " と記載 半角ｽﾍﾟｰｽ →コード上 と記載 ●コード・タグのメモ ※テキストファイルをダウンロード ・memotxt_code.txt ●レイアウトメモ (お試し確認用) ・レイアウト確認ページ ●不明点 ・横線(ﾀｸﾞ<hr>)が、FireFoxでは問題ないが、Edgeで表示されない →CSS記載の仕方をhtml同様にしていた。CSSの記載とは異なり、修正したところ解決 ・横線(ﾀｸﾞ<hr>)が、Edgeで太さが異なる箇所がある
▽FC2ホームページ … このホームページで利用しているサーバー(無料)です。 https://fc2.com/ ▽窓の杜 … フリーソフト特集 http://www.forest.impress.co.jp/ ▽Vector … フリーソフト特集 http://www.vector.co.jp/ ▽fRename … ファイル名一括変更（Windows7で動いています） http://hp.vector.co.jp/authors/VA004030/Soft/Frename.html ▽Ralpha … 画像サイズ変更、トリミング(Windows7で動いています） http://www.forest.impress.co.jp/library/software/ralpha/ ----------------------------------------------- ▽とほほのWWW入門 http://www.tohoho-web.com/www.htm ▽Webページ作りのお勉強 …★昔からよく参照させて頂いております。 http://masaboo.cside.com/index.htm ▽ホームページ入門サイト https://beginners-hp.com/ ▽超初心者のホームページ作成 …★CSSのページ構成について参考になりました。 https://beginners.atompro.net/ ▽1時間でつくるホームページ WEBデザインの素 https://www.shoshinsha.com/hp/index.html ▽ゼロから始めよう！わかりやすい！ホームページ作成ガイド http://hpzeroguide.web.fc2.com/ ▽デジタルハリウッドスクール JavaScriptでできること https://school.dhw.co.jp/course/web/contents/r_JavaScript-cando.html ▽クロノドライブ タグ辞典 https://html-coding.co.jp/ ▽キャッシュ(更新)対策…修正したのに修正ページが反映されていないという現象の対応。本ページは未対応です。 (自分のPCであれば更新(F5キー)すれば問題ないが、作成者側が対応するのが普通) https://b-risk.jp/blog/2021/08/cache_clear/ ▽ファビコン(画面上タブの左端に表示される画像)作成…本ページは未対応です。 https://keywordfinder.jp/blog/seo/favicon/