ワードプレスの文字が、にじんでしまいます

質問

はじめまして。どなたか、分かる方がいらっしゃったら、教えてください。

ワードプレスを使ってブログを書いているのですが、記事本文の文字が「にじんだ」ように、汚く表示されてしまいます。

他のサイトや、自分のサイトの見出しなどは、キレイに表示されます。
さらに、PCでは汚いのに、スマホでみると本文ににじみはなく、キレイに表示されます。

HTMLやCSSなどには詳しくないので、特別なカスタマイズをしているわけではありません。
いくつか、一般的なプラグインを入れただけです。

本文のにじみ方を、キャプチャーで撮って添付いたしました。

どなたか、教えていただければ助かります。

回答No.4

yuki_n_y

indexの116行の
.hentry{ font-family: "TBUDゴシック R";}
のTBUDゴシック R外すと良くなります

ホームページを右クリックでソースをchromeで検証しました

他のブラウザでも、全て同じ表示でした

テーマの編集で
index.phpかindexを開き
.hentry{ font-family: "TBUDゴシック R";}を探し
/*●●*/を使い一時的に無視してみてください。

お礼

実際に見ていただき、ありがとうございました。

感謝です！

ちょっとハードルが高そうですが、チャレンジしてみます。

分かりやすく丁寧に回答してもらって、有り難いです。

回答No.3

Katsu_Kaiz

ブログを拝見させていただきましたが、本文には『TB UDゴシック』という書体が使われているようです。おそらく、《TypeSquare Webfonts》みたいな名前のプラグインを使っていませんか？　ここでいうWebフォントとは、ブラウザに表示される文字を自由に変更するための技術のことをいいます。

このうち《TypeSquare》というのは、書体メーカー大手のモリサワが提供しているWebフォントのことで、たとえば さくらのレンタルサーバーやエックスサーバーなど、このTypeSquareの一部を無料で提供する会社も増えてきました。

◆Webフォント機能について | レンタルサーバー【エックスサーバー】
　https://www.xserver.ne.jp/functions/service_webfont.php

「かんたんにWebサイトの見映えを美しく！」と公式サイトには書いてあるものの、けれども実際の見映えは、環境によって異なるのが実情です。もっとも綺麗に表示されるのがAppleのRetinaディスプレイ系（iPadやiPhone、Macなど）で、ついでAndroid系のスマホやタブレット、そして一番汚いのがWindowsです。

おっしゃるように、大きな見出しに使う分には問題がないものの、小さな本文となるととたんに文字が「にじんで」しまい、お世辞にも美しいとはいえません。誤解のないように申し添えておきますが、TB UDゴシックやヒラギノ、さらには游ゴシック体が汚いのではなくて、Windowsの画面表示が汚いのです。Windowsでまともに表示できるのは、好き嫌いにかかわらずメイリオしかありません。

◆Webフォント設定について(WordPressプラグイン) | レンタルサーバー【エックスサーバー】
　https://www.xserver.ne.jp/manual/man_server_webfont_wp.php

公式サイトの説明を読むと、ある程度まではフォントの変更ができるようです。本文は<p>タグを使っているはずなので、CSSの《font-family》を書き換えていくことになるかと思います。HTMLやCSSの知識がないと、ちょっと難しいかもしれません。

あるいは反対に、このプラグインそのものを無効化（オフに）してしまう方法もあります。あまり書体にこだわらないのであれば、こちらのほうが簡単です。

お礼

おっしゃる通りです！！

wpxのサービスを使っているのですが、やはりそう簡単にはいかないのですね…。

わたしが使っているのもウィンドウズなので、とても納得いたしました。
設定も、おっしゃる通りです。
そして、納得しすぎて、あきらめもつきました。

深みにハマる前に気づかせていただき、本当に、ありがとうございました！！

回答No.2

4017B

結論から言うと自力でテーマを編集して修正出来る技術と知識が無いと無理ですね。まあ、最近はwebサイトへのアクセスは半分以上がスマホからなんで、スマホからきれいに見えてるのであれば気にしなくてイイかも。

P.S.
これは使用しているテーマが本文表示用に使っているフォントがPC用モニタと相性が良くないと言うか、多分テーマ製作者がMacか何かで作っててWin用の解像度でのテストを充分に行ってないのかな？(恐らく[ヒラギノ丸ゴシック]系フォント

アンエリを抑えたWindows系のフォント(メイリオフォント/Meiryo)ならクッキリとした表示になると思いますが、世のテーマ製作者の多くがヒラギノ教や游ゴシック教が多くて滲むフォントばかり使いたがるんですよね…。

スマホで見るとキレイなのは通常のスマホ(Android/iPhone共に)はwebサイト側で指定されたフォントを無視して、スマホ本体内蔵の標準フォントで表示する仕様だからです(Androidなら[メイリオ]、Safariなら[ヒラギノ角ゴ]で表示される)。

お礼

4017Bさん、回答ありがとうございました。

なるほど、やはりＣＳＳの知識がないと、根本的には改善しないんですね。
同じテーマ（ストーク）を使っているひとのサイトを見ると、似たような感じで文字がにじむような、色むらがあるので、サイト制作者の意図と画面が合っていないというお話し、納得です。

残念ですが、文字の見栄えは悪いままで諦めるしかないかもですね。

詳しく説明していただき、ありがとうございました。

回答No.1

yuki_n_y

ワードプレスを閲覧した時、すべての文書ページで－になる様な文字が太くなるのですか
新規投稿時の画面でビジュアルで、フォントファミリーとフォントサイズを変えて見るとか
プラグインを一時停止・有効化するとか

効果が有るか分かりませんが、私はこのプラグインを入れています
WP Multibyte Patch
https://eastcoder.com/code/wp-multibyte-patch/

後、この文章で検索しましたがヒットしませんでした
もし宜しければ、この文章とかタイトルなど検索にかかるブログを教えてください
アドレスはダメです
違うブラウザ見て見たいと思います

お礼

yuki_n_yさん、回答ありがとうございます。

フォントの種類や大きさを変えてみたのですが、ダメでした。
教えていただいたように、プラグインのオンオフを、色々ためしてみようと思います。

載せていただいたプラグインも、ためしてみます。

ちなにみサイトは、「電子書籍つくろう」で検索すると7番目くらいに出てくる「電子書籍つくろう！」というサイトです。

詳しく教えていただき、ありがとうございました！