Yahoo!ブログとFC2ブログの記事の書き方・特徴の違いと攻略ヒント

Yahoo!ブログとFC2ブログの記事の書き方・特徴の違いと攻略ヒント

カスタマイズ
2019/03/17 10
vanillaice (Akira)
vanillaice (Akira)
初心者向け FC2 Yahoo! 引っ越し

Yahoo!ブロガーさんが口々に「FC2ブログは難しい…」とおっしゃってますね。FC2ブロガーさん的には「… 何が? (´・ω・`)」という感じではないでしょうか(笑)

システムの違いや慣れの問題もありますが、実際のところは どうすれば良いのか理解できていない だけで、それを「難しい」と表現しているにすぎないような気がします。

変な文字列が出てきて書きづらい

変な文字列 = HTML です。
web上に何かを記すには必ずhtmlという言語が必要です。Yahoo!の かんたんモード というエディターはhtmlをユーザーの目に触れさせることなく処理するシステムで、一般的には WYSIWYG(ウィジウィグ) と呼ばれます。

FC2ブログにもWYSIWYGタイプのエディターはちゃんと有ります。
それが 新投稿画面 です。Yahoo!に於けるWYSIWYGエディターの名称が「かんたんモード」であり、FC2ブログに於けるWYSIWYGエディターの名称が「新投稿画面」というわけです。基本プログラムは同じで「htmlを不可視にして変換後の状態で編集できるようにする = 見たまんま編集」です。
WYSIWYGの語源は What You See Is What You Get で意味は「あなたが得るものは目に見えているもの」つまり、「あなたが書いているhtmlはこんな風に描画変換されます」をリアルタイムで表示してくれるプラグラムです。

FC2を解説した直後の記事作成画面は 旧投稿画面がデフォルト になっていますので、自身に初心者の自覚がある方は自主的にエディターの 切り替え を行ってください。

デフォルトの旧投稿画面
新投稿画面
かんたんモード(Yahoo!ブログ)

エディターのツールボタンがYahoo!かんたんモードよりも若干小さく、色も薄いですね。ここはもっと大きく濃くしても良いのになぁ、と個人的に思っています。

Yahoo!のスクショ、画面上部「かんたんモード」の左横に「Wiki / HTMLモード」というのがありますね。これがFC2に於ける旧投稿画面ですが、Yahoo!のWiki / HTMLモードは Internet Explorer での利用を前提に開発されているため、現在ではとてもじゃないが使い物になりません(試しました)
ですから Yahoo!ブログのWiki / HTMLモードの高性能版がFC2の旧投稿画面 と言えるかと思います。決して同等ではないですね。性能的にはFC2旧投稿画面の方が遥かに勝っています。正直比べ物にならない。FC2ブログが「初心者から 上級者 まで汎く使える」と言われるのはこの旧投稿画面の存在とその仕様も貢献しているのだと思います。

ちなみに Wiki はYahoo!ブログ内でしか使えない構文で、正規htmlの簡易記述です。FC2ブログを始め他サービスでは 利用できません。
これは一般的に「Wiki構文」「Wiki記法」「マークダウン」などと同じで言ってみれば「方言」みたいなものです。通じるところもあれば通じないところもある、という意味で。

いちいちリサイズがめんどくさい + 画像掲載(先行アップロード)がめんどくさい

そうかなぁ。この感覚はよくわからないなぁ (´・ω・`)

まずYahoo!ブログでの画像(及びその他ファイル)アップロードの特徴は以下の通り。

  1. 1枚あたりの容量制限 2MB
  2. 1記事あたりの容量制限 20MB まで
  3. 1ブログあたりのアップロード上限 10GB まで
  4. 横560px以上 の画像がアップロードされると自動で横560pxの サムネイル画像 が作成され、その サムネイルが強制表示される
  5. 4のサムネイル画像をクリックすると別タブで原寸画像が表示される
  6. 複数画像を一度にアップロードすることは できない

FC2ブログは以下の通り

  1. 1枚あたりの容量制限 2MB
  2. 1記事あたりの容量制限 なし
  3. 1ブログあたりのアップロード上限 10GB まで
  4. ユーザーの任意サイズでサムネイル画像を自動で作成できるが、原画を表示するかサムネイルを表示するかはユーザーが選べる
  5. 4のサムネイル画像または原画をクリックして別タブ表示 or アルバムページへ遷移するかどうかは ユーザーの任意選択
  6. 複数画像を一度にアップロードは一度に 20枚までできる

Yahoo!の方に「画像(及びその他ファイル)」と書きましたが、Yahoo!は画像以外のファイルアップロードってできないですよね。FC2の場合はJSファイル、CSSファイル、swfファイル、txtファイルなど様々な拡張子をサポートしています。今のところ音声や動画のmp3やmp4とかは対応していません。

条件面を見てもFC2の方が有利ですね。FC2は有料アカウント(300円/ 月)に登録すると1ブログあたり10GB制限が解除され 無制限 になります。

リサイズは面倒ではない 寧ろYahoo!より簡単で自由

まず リサイズ なんですが、原画アップロード時に 自動で作成できる という点にお気づきでない方が。

FC2ブログ アップロード画面

赤枠で囲った内容「サムネイル 同時に作成する(jpg, png. gif)」とありますよね。例えば常に横560pxにリサイズしたいのであれば、横サイズに560pxを指定してチェックを入れておいてください。後はアップロードする度に各画像の560pxサムネイルが作成されます。あとは記事を書く際に「この画像で記事を書く」をクリックすれば原画が掲載されますし、「サムネイルで記事を書く」をクリックすれば560pxにリサイズされたサムネイルが掲載されます。「リサイズがめんどう」という方は機能を把握していないだけではないかと思います。

注意点として、縦サイズmaxは999pxです。縦長画像に注意するのと、横サイズを基準にしても縦が999pxを超えない範囲までという制限がかかります。まぁサムネイルで縦999もあるという方が考えにくいですけどね。

また、FC2は画像リサイズの独自サービスも持っています。以下の記事を参照のこと。

FC2画像縮小を活用して簡単に画像を縮小しよう!

いつもFC2ブログをご利用いただきありがとうございます。FC2ブログスタッフです。ブログの記事を作成するうえで、画像は切っても切り離せない存在ですよねそこで、画像サイズを手軽に変更することができる、「FC2画像縮小」サービスをご存知ですかパソコンに編集ツールがなくても簡単に画像サイズを変更することができるサービスです♪今回は、FC2ブログでの画像縮小サービスの活用方法についてご紹介します。...

ここまでの内容でいろいろな「不思議」が解決するのではないかと思います。
例えば「大きい画像をUPしてもYahoo!は画像が劣化する」とよく目にしますが、原因は原画ではなく横560pxのサムネイルが表示されるためです。特にjpgは拡大はおろか縮小しても劣化します。

先行アップロードは寧ろ便利

「先にアップロードを済ませる = めんどくさい」という方はたぶん(ちょっと言葉が悪いですが)行き当たりばったりの記事の書き方をしているのではないかなぁ、と思います。

Yahoo!の場合
文章を書く → 画像を入れたい場所に到達 → 画像をアップロード → 画像を間違えた → アップロードし直し
また文章を書く → 画像を入れたい場所に到達 → さっきと同じ画像を使いたい → 同じ画像をアップロード(またはコピペ) ... 繰り返し

FC2の場合
使用を予定する画像をまとめてアップロード(別窓表示) → 文章を書く → 画像を入れたい場所に到達 → 別窓を見ながら「この画像で記事を書く」をクリック → 画像を間違えた → 消して別画像をクリック
また文章を書く → 画像を入れたい場所に到達 → さっきと同じ画像を使いたい → 別窓を見ながら「この画像で記事を書く」をクリック ... 繰り返し

いちいちその場その場でアップロードって クッソめんどくさい と思うのは私だけなんでしょうか ( ̄∀ ̄;)
間違えたらまたアップロードしなきゃいけないんですよね。同じ画像を使う場合もコピペするかアップロードになるんですよね。えーえーえー めんどくさ… ( ̄∀ ̄;)

ちょっと驚くようなことが書いてあるのを発見しました。概要はこんな ↓

管理画面から「ファイルアップロード」をクリックしてアップロード画面を表示させ、別タブで記事作成画面を開いてそこで記事を書き、画像を掲載するときはいちいち別タブの画面から画像を選んで貼り付ける、タブを行ったり来たりさせるという不親切な仕様。

あなた一体何やってんですか。そんなことしてるFC2ブロガーなど居ません(笑)

アップロード画面 別窓表示

タブ ではなく 別 で開いてください。エディターのツールをクリックすれば勝手に別窓で開きます。
これはエディターツールの動作確認していない証拠ですね。気づいていないのですから (´・ω・`)
あるいはブラウザのタブ設定に制限をかけているか。だとしたら自分のせい。

修正時により面倒なのはどちらの方式でしょう。同じ画像を使い回す時によりめんどうなのはどちらでしょう。20回アップロードするのと20枚を1回でアップロードするのとどちらがより面倒でしょう。

使いまわしたい画像は

キーワード検索 ファイル名修正
ファイル名修正

ファイル名修正で自分が後から検索できる文言を入れておくと良いですね。
ただし ここに書いた内容は alt属性 として出力されます ので、SEOに気を使う方は貼り付けた後にaltの部位を適切な内容に書き換えた方が良いと思います。alt属性は第三者から容易に確認可能な内容であり、Googleが画像を検索結果に掲載する際の検索キーワードにもなります。個人情報などは書き込まないよう注意してください。
例) 長男あきらのFC2小学校5年生の同級生たち

FC2ブログはスマホ版でもhtmlが有効

Yahoo!ブロガーさんでこういうのがお好きな方って結構多いですよね ↓

ちょっとしたメッセージボードというのではなく、かなりイカツい感じで全文をこの中に書いちゃう、みたいな。Yahoo!では良かったんですが、FC2では注意… というより 辞めたほうが良い と思います。文句でも嫌味でもなくアドバイスとしてお読み頂きたいと思います。

「Yahoo!では良かった」の意味は、Yahoo!ブログはスマホ版でhtmlが無効化される 仕様であるためです。スマホから見るとこうなります ↓

正式な名称を存じませんので便宜上「壁紙」と表現します。スマホでは壁紙の部分がゴソっと無くなっていますよね。スマホでは html内容が強制的に破棄される ためにこうなります。そしてそれは寧ろ「良いこと」です。

何故それが良いことなのかはFC2ブログでの状態と比較すればすぐわかります。FC2ではYahoo!と違い、記事で利用されたhtmlはスマホでも有効なので以下のようになります。

言わんとしていることがおわかり頂けますでしょうかね。これ完全に右側が見切れているんですね。見切れているだけならまだ良いのですが、テンプレートによっては右側が強引に画面に入ろうとするためスクロールのたびに画面が右へ行ったり左へ行ったり、正直もう 閲覧に耐えられないレベル です。

この コンテンツがビューポートを超過している という状態は今最も避けなければいけないんですね。何故なら モバイルフレンドリーではない からです。Googleは既にパソコンからスマホに重要度をシフトしており、今や最も大事なのはスマートフォンでの表示です。そしてこの画面超過はGoogleが重要視しているので厳しい警告を受けますし、それ以前に スマホユーザーにとって苦痛でしか無い のであります。

何故超過するかというと、htmlソースを書く時にパソコンのことしか考えてないからです。今もうそれではダメなんですよぅ (´・ω・`)
最低でもこう ↓

なんとしても画面内に収める(笑)
でもこれ全然良くないですよね。サンプルのように比較的質素な枠でも左右が押されてテキストを書く部位はギチギチの領域です。ちょっと文章書いたらすぐ折り返し(改行)がかかり、まともな文章構成にならないですし、この壁紙自体が縦に長く伸びきってお世辞にもかっこいいとは言えない感じに。

FC2ブログでこういう遊びをするにはちょっと無理があるかなぁ、と思います。まして フラッシュ掲載など言語道断 です。今どこのサイトもフラッシュ排除に勤しんでいるのにわざわざ自分で掲載するとかマジでどうかしてる。全てが画面内に綺麗に収まっていてもフラッシュがたった1つでも掲載されているとGoogleはそのページをモバイルフレンドリーと認めません。「Googleがそう言うから」ではなく、Googleは一般的なスマホユーザーを代弁しているだけで、端的に言えば スマホユーザーにひどく嫌がられるページだから です。

で、「パソコン版に切り替えて御覧ください」とか「IEの互換設定を入れて御覧ください」とか、そういうのは根本的に ダメ です。ユーザーにブラウザの個人設定を促すなどありえないですよ (´・ω・`)
FC2ブログではスマホでパソコン版に切り替えると後に訪問する先の表示にも影響してしまう仕様です。相手方がしっかりとスマホ版設定をしていても、パソコン版が強制表示されてしまい結局他人にまで迷惑が。自分で切り替えた場合は自己責任ですけどね。促された場合はそうは言えないと思ふ (´・ェ・`)

とはいえ記事内の装飾を「やってはいけない」わけではないので、html, CSSの構成をもっと良く考えるとか、枠の部分ももう少し減らして文章が台無しにならないよう工夫するとか。そういう努力は必要じゃないかと思います。もう今の時代「スマホ表示を無視するやつ = 超自己マン野郎」と言って良いと思います。え。だってこのぐらい強く言わないと聞き入れないじゃん。こういうタイプの方って((((笑)

FC2ブロガーさんはどちらかと言うと「ちゃんとした文章をちゃんと読んでもらいちゃんと評価してもらう」という感覚の人が圧倒的に多いと思うんですね。ですから「テンプレートはレスポンシブにしようか」「画面からはみ出しているからどうやって直そうか」「もっとアクセスしてもらうには要約タイプに変更しようか」などいろいろ検討されるわけなんです。すると結局は「読み手がどう思うか」に行き着くというかね。自己の満足はほどほどに、閲覧者の利便をなるべく優先させる、という方が多い気がします。

まぁでもアレですよ。「その人の勝手」というか。やりたければやりたいようにやれば良いんです。ただし自己責任。「アクセスが伸びない〜」「検索結果が〜」とか言っちゃダメ。

まとめ

FC2ブログに馴染めるかどうかはやはり自分次第です。それにはYahoo!で慣例化していた負の要素を切り捨てることも大事でしょうし、逆に正の部分は活かせると良いですよね。
で、難しい難しいはわかるんですが、「Yahoo!ではこうだった」に重点を置きすぎているからかもしれません。「FC2はこうなんだ」と思って何事も取り組んで行くが吉。なんにでも優劣があるとはいえ、どうも皆さんの言う「難しい」が私から見ると「わかってないだけ・わかろうとしていないだけ」に感じます。越してきて全てを数日で把握しようなんて土台無理な話です。気を楽にして少しづつ覚えて行くよう頭を切り替えると、きっとその工程も楽しめると思います。

心を落ち着け、不平を漏らさず、発見があれば喜ぶ。それが最大の攻略法です。

 10

There are no comments yet.
-
管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

2019/03/17 (Sun) 07:37
kotabuska
引っ越し組です

はじめまして。3月はじめにYahooからFC2に引っ越してきた者です。好きなテンプレートを「追加」していたら全部Akiraさんのものだったのでこちらのブログを拝見するようになりました。現在Hymnをほーんの少しカスタマイズ(などと言えるレベルではありませんが)して使わせて頂いています。素敵なテンプレートありがとうございます。
Yahooのコメントが引っ越せない時に来てしまったので先日のAkiraさんの記事を読んでグググ…となってしまいましたが仕方ないですね。Yahooではあの内々感と転載の嵐に馴染めなかったので、FC2さんではまだ慣れない事も多いですがとっても使いやすくてうれしいです。これまでできなかったテンプレートのカスタマイズももっと勉強してみたいと思うようになりました。
ひとまず、IEは使うのをやめました(笑)これからも楽しみにしております。

2019/03/17 (Sun) 10:22
vanillaice (Akira)
Akira
To Yahoo!の件 内緒さん

こんにちは (●'0'●)/

ホントは致死性の高い猛毒を吐きたいところですがお腹壊す程度にしておきました。
IEの互換設定はマジでない。ないわー。もうありえない(笑)
だってブラウザの個人設定ですよ?「アップグレードしてください」はわかるし当然だけど「ダウングレードしてください」に従うわけないっつーの。

クリック乞食も嫌ですよねぇ (´・ω・`)
同じ思いの方が居てくれて私も心強いです(笑)

2019/03/17 (Sun) 18:06
vanillaice (Akira)
Akira
To kotabuskaさん

ありがとうございます (●'0'●)/

タイミングが微妙でしたよね。FC2がもう少し早く対応してくれてれば ^^;
Yahoo!ではデザインの自由度がほぼゼロでしたがFC2ではその気さえあればほぼなんでも可能です。
楽しんでくださいね :)

2019/03/17 (Sun) 18:09
そふぃあ
目からウロコです!

Akiraさん こんばんは!
画像サイズ、この1年ずっと1枚ずつ手直しして掲載していました。(;^ω^)
Yahoo!ブログでサムネイルというと、記事の上の方に小さく出る画像がそれだったので、使ったことも無かったのです。
なのでFC2で本格的に記事を書くようになっても、サムネイルのチェックはわざわざ外して使っていました。(;^ω^)
改めてお聞きして、なるほど!でした。ありがとうございます。

例えば1,000pxの画像を800pxにして記事に載せた場合、少しボヤッとした感じで見えるような気がするのですが、これは仕様でしょうか?私がそう見えるだけ?

2019/03/17 (Sun) 21:45
vanillaice (Akira)
Akira
To そふぃあさん

そふぃあさん、こんばんは (●'0'●)/

はい、意外と便利なのに埋もれている機能がFC2にはまだありそうな気がします(笑)
>例えば1,000pxの画像を800pxにして 〜

これは原寸のリサイズのことでしょうか。それともCSSでの縮小かしら。リサイズ関連の内容だから前者かなぁ。
仮にリサイズ(原画を編集する)の場合、jpg画像は縮小しても解像度が落ちます。
CSS縮小(原画の編集なし、表示サイズを調整)の場合、見ている端末の画面解像度(dpi)によります。4K, 5Kといった密度の高いディスプレイの場合、原寸を表示寸の2倍にしておかないとぼやけます。

参考記事: スマートフォンで画像がぼやける際の対処と画像容量削減
https://vanillaice000.blog.fc2.com/blog-entry-376.html

-----
一応補足説明なんですけども、この記事内容は超初心者向けといいますか。
Yahoo!ブロガーさんって「レスポンシブ」の意味をご存じない方がほとんどなんですよ。で、テンプレートデザイン的にも旧式というか、昔ながらのデザインを選ぶ方が多いような気がするんですね。
そうなると固定幅ですから、リサイズせざるを得ない環境になるわけです。だから「リサイズが面倒」という意見が出てくるんだと思います。

そふぃあさんは現在レスポンシブテンプレートをご利用ですから、リサイズを気にする場面は少ないと思います。
OGP画像(トップページのサムネイル画像)は横1200pxでアップロードするのが良いですね。そして縦横サイズを小さくするのではなく、容量を削減するようにしてください。

参考記事: 画像の容量気にしてますか?
https://vanillaice000.blog.fc2.com/blog-entry-228.html

参考記事: 2018年時点でサムネイル画像・OGP画像は横1200px以上が最適解
https://vanillaice000.blog.fc2.com/blog-entry-715.html

1200pxについてはGoogle discoverっていうのがありまして、ちょっと詳細説明ここでは控えますが、まぁいろいろ考えると1200pxは無いとアカン、ということです(笑)

2019/03/17 (Sun) 22:24
そふぃあ
To Akiraさん

お忙しいのに、素早いお返事ありがとうございます。
画像の大きさと表示のスピード、難しい問題ですね。(;^ω^)
ご紹介の記事、再読して勉強し直してみます。

2019/03/17 (Sun) 23:01
vanillaice (Akira)
Akira
To そふぃあさん

なんだかとてもややこしいことになってますが、お互いがんばりましょう ^^;

2019/03/17 (Sun) 23:55
-
管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

2019/03/18 (Mon) 03:50
vanillaice (Akira)
Akira
To フレーム(壁紙)の件 内緒さん

こんばんは。コメント見落としておりました。ごめんなさいね。

そのフレームというのを修正して欲しいという意味でしょうか。
申し訳ないんですが他所様が製作したhtmlを私が修正する義理がありませんし、私は便利屋ではありませーん (´・ω・`)

2019/03/19 (Tue) 02:27

テンプレートに関するご質問・不具合のご報告の際はご自身のブログアドレス記載必須です。
ご質問の前に 必ずお読みください
テンプレートに関するご質問時のお願い

必ず該当テンプレートの専用記事にお願いします。無関係な記事・別のテンプレート専用記事でのコメントはお控えください。
テンプレートカテゴリ
テンプレート一覧

カスタマイズ