fontタグに限らず、HTML5で廃止された要素を使い続けてる人は、まず使ってはいけないタグを知っておきましょう。 HTML5で廃止された要素一覧. 3. 値と単位を組み合わせて指定する方法 4. normalを指定する方法 HTML5で廃止された要素｜HTML5｜PHP & JavaScript Room, s要素は2010年10月、u要素は2011年5月からまた使えるようになったそうです。(情報元：@SaekiTominaga様), 正直、2012年現在ブログの中にそれらのタグがあっても大して問題ないと思いますよ。実際使えてるわけだし。, ただ、ブログを10年、20年、もしくは一生続けていきたいと思ってる人ならすぐやめた方がいいです。, いま使ってるブログのテーマがXHTMLで作られたものだったらfontタグは確かに使えますけど、HTML5では非推奨というか廃止しましたよって言われてるタグなので、動作の保証がないわけです。, HTMLはもともと文章に意味を持たせるための言語です。たとえば、羅列された文章の中にタイトルがあればそこを「見出し」としてマークアップしてあげることで、見出しとして認識してもらえるようになります。, CSSはデザインする言語。色を指定したり、大きさを指定したり、場所や幅・高さを決めたり。こういうことはすべてCSSで指定してあげるべきなのです。, HTMLとCSSについては、こちらのベストアンサーを見てもらうとより分かりやすいと思います。, 100歩譲ってHTMLに直接スタイルを書いて色を付けたり文字のサイズを変えたりしたいなら、fontタグじゃなくて「style=””」を使いましょう。, ガラケーのサイトってCSSの外部ファイルに対応してないので、色などの指定をすべて直接書かないといけないのですが、それを修正するためにすべて手動でやったんです。, HTML4からXHTMLになったあたりでfontタグを使った記述ってしなくなったので、ずいぶんと過去の遺物だと思ってたんですが、やっぱりこういう知識ってHTML初心者の方には分かりづらいからつい使ってしまいますよね。, この記事を読んだらもうfontタグを始めとしたHTML5で廃止された要素を使うのやめましょう。, 株式会社ondo 代表取締役。WEBサイトの制作や管理、WEBサービスの運営、iPhoneアプリ開発などをやってます。ロックバンド「アマオト」「World chord」のギタリストで曲も作ったりしてます。, 「ディレイマニア」はLINE, YouTubeなどのWEBサービスを中心としたインターネット系の話題や、iPhone, Macなどのコンピューター系の話題など、WEBデザイナーの管理人が気になった情報を発信しているブログです。, 廃止要素の動作保障についても情報いただきました。HTML5はユーザーエージェントに対してはサポートし続けることを要求しており、今後ブラウザがfont要素のサポートを止める可能性は少ないとのことです。(情報元：@SaekiTominaga様), HTML5で廃止された要素｜HTML5｜PHP & JavaScript Room, CSSだけでサイドバーに広告などを追尾させる「position:sticky」が便利すぎる！, font-familyにNoto Sans Japaneseは太さが細かく調整できて使いやすい, CSSのposition:absoluteで上下はピクセル指定しつつ、左右はきっちり中央揃えにするコツ, 動画などの大容量ファイルを送るのに「GigaFile(ギガファイル)便」が便利！無料で使えて1ファイルあたり50GBまでアップロード可能！. htmlの基本テクニック トップ > webページ作成入門 > htmlの基本テクニック 目次. デザインの柔軟なカスタマイズ性能・ショートタグ数・アフィリエイト機能トップクラステーマ。, 着せ替え自由な洗練されたテンプレートデザイン9種に加え、国産最強と称されるSEO構造最適化テーマ。, 自由自在な導線設計が可能に最適化された構造。メニュー設定が豊富でアフィリエイトに最適なテーマ。, WordPressテーマ「AFFINGER5」のフォント設定を完全版でお届けします。, テーマAFFINGER5を愛用しているSHINですが、先日フォントに「Noto Sans（400）」と「游明朝（500）」の2種類がデフォルト設定で追加されているのをご存じでしたか？間違いなく気に入る字体なので、ぜひ試されてみて下さい。, コンテンツ（記事）はテキストで構成されるため、より見やすく読みやすくする工夫は必要ですし、ウェブサイト（ブログ）のデザインによっても合う合わないというのは多少ありますよね。, 書体によってコンテンツを評価されるわけではないので、直接SEOに影響することはなくとも「ユーザービリティ」という観点なら、滞在時間や離脱率に影響する可能性は十分あり得ます。, AFFINGER5に新入りしたフォント書体「Noto Sans（400）」と「游明朝（500）」をご紹介と設定方法について解説していきます。, このNoto Sans（400）は、現在このブログで設定しているフォント書体です。, デフォルトはメイリオなので丸い書体イメージ。Noto Sansは若干カクっとしたイメージですね。, 僕のブログ（当サイト）の場合、解説や説明、紹介といったカテゴリのコンテンツが比較的多いので、やんわり過ぎる書体よりは少しかしこまった書体が合うと思っているので、まさにピッタリの書体で選びました。, 次にフォント「游明朝（500）」です。こちらは「M PLUS Rounded 1c（400）」と比較。, 比較したM PLUS Rounded 1cも丸い書体イメージなので、新フォント游明朝とは対照的な書体ですよね。, 游明朝は、いわゆる筆記体のようにキチっとしたイメージが伝わるので、ですます調などのコンテンツに合う書体ですね。こちらもどちらかと言えば僕のようなコンテンツに合う書体かなと思いますです。, フォント種類を変更する際は、別タブで自サイトページ画面を表示しながら進めると、リアルタイムで確認できるのでおすすめです。, step1WordPressダッシュボード画面から「AFFNGER5 管理」に進み、管理メニューにある「デザイン」をクリックして進みます。, step2デザイン設定画面下の方に「フォントの種類」というカテゴリで好きなフォントを選択して、画面最下部にある「save」をクリックすれば設定完了です。, 「全体」でフォント書体を選択したら「記事タイトル・見出し（h2～3）・ウィジェットボタンなど」と「追加の反映範囲」では、個別にフォント書体を変更することもできます。まさにかゆいところまで設定が可能ですね。, Googleフォント日本語版では9種類の書体が用意されており、それぞれ必要なHTMLコードとCSSコードをコピペするだけで設定変更できます。, step1まずGoogleFonts+日本語にアクセスし、トップページにある9種類から変更するフォントをクリックして下へ飛びます。, step2Googleフォントに変更するためのコード（HTML・CSS）を全てコピーせずに下の画像にある部分のみをコピーして保存しておきます。, 【HTML】