初心者目線のhtmlとCSS｜文字コード｜utf｜JIS｜フレーム｜tableタグ｜favicon

初心者目線のhtmlとCSS｜文字コード｜utf｜JIS｜フレーム｜tableタグ｜favicon｜

2025/03/14

以下に覚書します。

先ず、画像を用意する。（icoファイルが良いらしいが、jpgでも出来ました！）
　↓
メニューから
　↓
メディア－ライブラリ－新規追加で、アップロード
　↓
画像のＵＲＬをメモして以下のタグの「画像ファイルのアドレス」を

該当するurl（自分のブログやホームページなどにアップロードした画像などのURL）

に変更。↓コピペして使ってください・・あくまでも、参考に。
　↓

<link href="画像ファイルのアドレス" rel="shortcut icon">　</link>

　↓
（メニュー）外観ーテーマの編集ーテーマヘッダー（header.php）を開く

（※　テンプレによって違うかもです。
index.php　も考えられると思って探しました。）
　↓
　～　の中に　上記のタグを張り付ける。
　↓
・・でうちの場合は表示されていました。が・・これが正解なのか不明。

明日になれば消えているかもしれないという不安を感じておりますが。

ファビコンの設置方法、色々なサイトで紹介されていましたが、

Wordpressはプラグインで、ほぼ解決しそうですが

あとはＯＳ・ブラウザ毎のタグとか、指定とか

ややこしいので、上記のコピペで出来なかった場合、

「html　ファビコン　設定　方法」で検索する時に、

「html」使った方が良いのではないかと思います。

２：　初心者目線のhtmlとCSS

・
・

少しずつやっていくことにしました。

すごく分かりやすいサイトを発見したので、このサイト様のおかげです。覚書します。

http://html-css.aimary.com/

↑　こちらのＨＰ，なんと10年ちかくも前の様ですが、ここが一番わかり易いです。↑

ここで分かったこと。

今までHTMLとＣＳＳが一体どうやって繋がっているのかすらも

訳が分からなかったのですが、（※　以下、やり方が分からないのですが

WEBで表示される様に、＜＞を半角ではなく全角にしています）

＜link rel=stylesheet type=”text/css” href=”style.css”＞

というタグをhtmlファイルの＜head＞と＜/head＞の間に貼り付けておく（コピペなので・・）と、

CSS　の情報を反映させることが出来るという事が分かりました。

あと、個人的にとても気になるのがフォントだったりしますが

メイリオのフォントにしたいので、以下にしました。↓

（style.cssというファイルの中に貼り付けました。↓）

シンプルな方法

body{
font-family: “Meiryo”, sans-serif;
}

又は、

body{
font-family:’メイリオ’, Meiryo, ‘ヒラギノ角ゴ Pro W3’, ‘Hiragino Kaku Gothic Pro’, sans-serif !important;
}

先ず、今日はここまで・・。初心者目線のＨＴＭＬとＣＳＳでした。

３：　文字コード｜utf｜JIS｜フォント

　文字コードのどれが良いのか迷ったときに、取り敢えず「utf-8」が主流で世界中でもよく使われているらしく、こちらを選んでおくと無難だそうです。
他には、
EUC-JP---UNIXに最適化
・Shift-JIS---windowsに最適化

フォントは、上記のように
「メイリオ’, Meiryo, ‘ヒラギノ角ゴ Pro W3’, ‘Hiragino Kaku Gothic Pro’, sans-serif」
などが今風でスッキリして読みやすく、無難かもしれません。

４：　参考・終わり

　Ｗｏｒｄｐｒｅｓｓの時のお話です。過去記事でした。

古いバージョンの方など参考になるかもしれませんので置いておきます。　

今更のことで申し訳がないような感じなのですが・・

既に知識のある方がたまたまここを見ている場合は

スルーして頂きたいようなお話です。

私と同じ様に初心者でＨＰを作ってみたい人に向けて。

今までのネット生活では、無料ブログを使用するのが大半だったせいもあり

まともなＨＰって作ったことがなかったので

一度はチャレンジしてみたくて、なんか少し最近になってやってみたのですが

その時はたまたま「やってみました」でしたが、折角なので時々やる気がある時にでも

ここまで読んでいただきありがとうございました。

いかがでしたでしょうか。

何か少しでも参考になりましたら幸いです。

良かったら気が向いたときにでもまた覗いてやってくださいませ。

よろしくお願いいたします。

参考サイト：

table　タグ　コピペ　＜ｐ＞　　html　入らない

Category: Encodings of Japanese/ウィキペディア
https://en.wikipedia.org/wiki/Category:Encodings_of_Japanese

文字コード/ウィキペディア
https://en.wikipedia.org/wiki/Shift_JIS

http://html-css.aimary.com/stylesheet/css_class.php
https://www.tagindex.com/stylesheet/link/color.html
フォントファミリーの指定/コピペできる
https://ameblo.jp/amecafe2011/entry-11220216419.html

https://careersoft-tech.blogspot.com/2017/04/nested-frames-in-html.html

参考サイト：参考サイトはリンク切れのため削除しています。

このブログを検索

gotaku memo