attention admin about comments trackbacks you may also like

Ameba, Yahoo!, Livedoorのスマホ版を比較

2019年07月06日
webのあれこれ
25
Education Yahoo! Ameba Livedoor Smartphone 引っ越し

大手ブログサービスである「Ameba」「Yahoo!(2019年12月で終了)」「Livedoor」それぞれの スマートフォン版 表示の良い点や特徴を見てみたいと思います。

目的

や、私がやりたかっただけ(笑)
Yahoo!は残念ながら終了が決定していますが、個人的に 最も見やすいスマホ版 だと思っています(いました)
失くすには惜しい機能など、記録として残しておこうかと。

何故この3社か

「FC2」や「はてな」は レスポンシブテンプレートでのブログ運営 に舵を切っているようです。実際FC2のスマホ公式テンプレートは2015年を最後に新しいものは追加されておらず、便宜上PC版にカテゴライズされているレスポンシブテンプレートの更新が主体になっています。はてなブログも同じ方向性ではないかと思います。

レスポンシブテンプレート(PC, スマホ共通)とスマホ版(スマートフォン専用)を比較するのはフェアではありませんので、レスポンシブの提供が無く、どのユーザーもほぼ同じ見た目・同じ使い勝手となるこの3社をメインに据えています。あくまでも個人的・客観的に印象を述べるだけで、批判や否定の意図は持ちません。

FC2とは関係ない、ということになりますが、「何が必要」「何が不要」「何が便利」など、またweb一般で最近主流になっているのは「どんな」形なのか、などを知ることで参考になりますし、もしかしたら良い点は取り入れることができるものがあるかもしれません。

Amebaブログ

Ameba ポータル用ナビゲーション

最上部にあるのが ポータル用ナビゲーション ですね。

ポータル用ナビゲーション

このナビゲーションは上部固定なので常に画面内の定位置から動きません。そして滞在中ブログでの利便性ではなく、Amebaブロガー全般及び見込み客(アカウント非所有者)向けの内容です。ログオフ状態の方がクリックすると アカウント作成画面 へ誘導されます(検索以外)

ホントは自ブログ内に関連するナビゲーションを固定しておきたいところだと思いますが、Amebaではポータル優先・運営の目論見優先(笑)
ドロワーもありますがこちらもポータル的内容です。

Ameba ヘッダー

ヘッダー

ブログタイトルは非常にこぢんまりとした表記になっています。フォローボタンよりも小さい(笑)
ただ「日本の」web一般では ブログ名はそんなに大きくしなくとも良い という傾向にあります。昔のブログ・サイトだとまずサイト名が上部に目立つようにドーーーンと表示されている、という印象が強かったように思いますが、今はどちらかというと控えめ表示が主流のようです。

その最大の理由は「記事本文が主役である」という意識ですよね。なのでブログタイトルよりも寧ろ記事タイトルの方が大きくなっていることが最近では多い。そして当然「スマホという狭い画面のデバイス」を考えると全体的にいろんなものがコンパクトになる傾向があります。それとはまた別にこれは自論ですが、日本語のフォントの見た目にもよるのではないかと思います。

欧米諸国のブログというのは日本とは逆で ブログ名を大きく表記する 方が一般的。欧文フォントはサイズが大きくても体裁が良いんですね。ところが日本語は フォントサイズが大きいと途端に野暮ったくなる という特徴が ^^;
デカフォントのダサ感を軽減できるのは「明朝体」ぐらいなんですが、ところが明朝体は太字にするとこれまた途端に野暮ったくなります。もちろん個人感ですよ?なので個人的には日本のブログデザインよりも欧米のブログデザインの方が多少「簡単」という感じです。フォントで悩まなくて済むことが多いためです(笑)

ただこのアメブロの場合はどうだろう。フォローボタンが 近すぎて 男性なんか誤タップ率が高そうな。それでもこのサイズであればテキストの折返し(ブログ名の途中での改行)の機会は少ないでしょうから、「変なところで改行しちゃって気になって仕方がない」という場面は少ないのではないかと思います。

Ameba 自ブログ用ナビゲーション

自ブログ用ナビゲーション

こちらが自ブログというか、滞在中ブログ用のナビゲーションですね。固定はされずスクロールで画面外へ流れていくタイプ。そして 横スクロールタイプ です。スマホでのナビゲーションの主流は 展開型横スクロール です。なにせ画面が狭いのですから、パソコンのように「大量のリンクを横並びで2段」といったことはやりづらい。パソコンで2段ならスマホでは4段・5段にも渡る可能性あるいは画面外にはみ出す可能性があります。

スマホでの「展開(ドロワーやアコーディオン)」と「横スクロール」は現時点でかなりメジャーな方法ですから「ハンバーガーボタンとか言われてもわからない」といつまでも言っていないで慣れる(笑)
やっぱりwebでスタンダート的になっているものについては「慣れる」というのが最適解です。

Ameba 記事の並び

トップページ記事並び

これはもう問答無用で リスト系レイアウト です。どこのサービスもほぼこうしたリスト系・カード系のデザインになっています。スマートフォンという小さいデバイスで記事を 探す には これが最も適した表示です。ですから FC2ブログでレスポンシブテンプレートを採用 している方で 全文表示タイプを好んでいる方 はこのあたりのweb事情をよくよく考えてから選択をしてください。
(全文タイプでも「追記」を利用した文章量コントロールをしている方はその限りではありません)

あとこうしてみると サムネイル画像が重要 という点にも気付くかと思います。パッと見ただけでもサムネイルがついている記事が目立つはずなので。サムネイルが無い記事は見逃されやすい と言い換えができるかもしれません。

個人的にこのアメブロのデザインで気になる点は、右(画像配置)には余白が無く、左(記事タイトル)には余白がある点。なんか「位置がズレてる」感がありませんか。私だけでしょうか (∵`)

あと記事タイトル下にかなり小さい表示で「いいね数」「コメント数」「リブログ数」などがありますが、これらをクリックしても直接その位置に遷移(ページ遷移 + ページ内オブジェクト移動)は行われません。ただ該当記事が開くだけです。これは他サービスもほぼ同じ。ちょっと不便だな、と感じるところです。

ただスマホではタップの範囲を大きめにしておかないと「リンクが上手く開けない」というユーザビリティ面の難が生じますので、アメブロの「右側(サムネイル画像)タップで画像一覧へ、左側タップで個別記事へ」という仕様はある意味正解です。私なんかは指先がネイルでゴテゴテでタップは指先の側面がちょっと触れる程度という人間なので「フォントサイズ9pxとかでもフツーに押せるよ? (∵`)」と思っています(笑)
小さな文字の「コメント」などのページに直接行けるのが良いか、タップしやすさを取るか、というこのあたりは難しい選択ですね。

Ameba ページ送り

トップページ ページ送り

これですよねぇ (´・ェ・`)
前後にしか移動できない という仕様です。250ページ目に行きたいときとかどーする。とはいえ大手サービスのほとんどがこの形です。欲を言えば リスト型 が良いですよね。「だいたいこのあたりのページにあったはず」といった 予測がついている場合 もあって、そんなときはページを繰るのが非常に手間なんです。

といっても URLの数字を書き換えれば良い だけなんですけどね。それを知っている人がどのぐらい居るのか、です。アメブロでは

page-x.html

URL末尾の緑の部分がページ数ですからここを任意の数値に書き換えればOKです。参考までに。ただスマホでのURL入力(特に一部書き換え)はめちゃくちゃめんどくさい、と多くの方が感じているはず(笑)

個別記事 ページ送り

個別記事のページ送りが上記です。スクロールして画面内に入ると「気に入ったらフォローしよう」のバーがビヨンと右側から出てきます。個人的にはめっさウザいけれども、目立たせる という意味では正解です。スクロールするたび何度もこのアニメーションを繰り返さない点は好感が持てます(笑)

Yahoo!ブログ

Yahoo! ポータル用ナビゲーション

ポータル用ナビゲーション

アメブロ同様ポータルのナビゲーションがありますが固定はされていません。そしてこれまた同じく ハンバーガーボタン で展開する ドロワー がついており、中身は滞在中ブログとは直接関係のない色々です。

ドロワー

Yahoo! マイページとマイブログ移動用リンク

マイページとマイブログへの切り替え

Yahoo!から移転を余儀なくされたユーザーさんたちが「必要」だと感じているもののひとつがこれではないかと思います。他者ブログ滞在中でもすぐにマイページあるいはマイブログに飛べる リンクです。

FC2ブログはYahoo!のように全ブロガー(時には全閲覧者)向けのリンクバナーやナビゲーションというのは用意されていませんが、「マイページ」にあたるのが「Admin, アドミン」「Log in, ログイン」「管理画面」などと表記されているリンクです。各テンプレートの ナビゲーション部位 にそれらの文言があるかどうかを確認してください。そして「マイブログ」にあたるものは ありません。ログイン状態であっても他者ブログページから一発で自身が所有するブログへジャンプするボタンやバナーはありませんので諦めてください ←

FC2ではこれに似た感じの 検索バー というのがありますが、FC2ポータルトップへのリンクとブログ内検索しかありません。あとは広告(笑)
Yahoo!ブロガーさんだとここに「あるのでは?つか、フツーあるよね?」と感じる方も多そうですが実際にはありません。ただの広告です。そしてどのみちスマホデバイスでは自動的に検索バーは非表示化されます。

Yahoo! ヘッダー

ヘッダー

ブログタイトルはやはり小さいですね。まぁどこのサービスも スマホ専用版は 基本小さいですよ。(レスポンシブはまた別)

リンクになっているのはブログタイトル部位と、プロフィール画像部位のみ。ヘッダー画像を設定している場合はその範囲もトップへのリンクになっています。そしてプロフィール画像タップでプロフィール説明ページへと遷移します。FC2ブログは プロフィールページはありません ので、独立したページとして必要な場合は「記事として書き、その記事のリンクを記載する」という方法を取ることになります。もちろん代替として「プロフィールプラグイン」はあります。こちらを利用する場合は独立ページではなく常にサイドメニューに掲載する、という形になります。

こういう 時系列 とは無関係な静的ページを一般的に 固定ページ と言いますが、FC2には提供が無いんですね。はてなブログは最近(数ヶ月前?)に導入されたような気がします(うろ覚え)

Yahoo! 記事の並び

トップページ記事並び

当然ながら リスト系レイアウト ですね。アメブロと同様ブログ概要文無し、記事タイトルとサムネイル画像のみ、という構成です。で、個人的に 記事の概要文は無理に入れなくて良い と思います。読む人も少ないでしょうし。「あれば読むかもしれない」という感じですかね。ともかく狭い画面であることを考えると、概要を表記するより寧ろ 読みたいと思わせるタイトルづくり の方に力を注ぐほうが良いと思います。

「読んで欲しい」「読ませたい」と思うあまりトップにダラダラと文章を表示してしまう方も多いんですが、読むか読まないかは閲覧者が勝手に決めます。そしてRSS登録をしてくれたり、あるいはFC2でブロともになって新着を受け取る方はリンクをクリックすれば直接その個別記事に飛ぶはずですから「記事を読むのにワンクリック余分」なんてことは無いはずです。しばらくぶりに訪れた方でもトップに整然と記事タイトルが並んでいる方が「未読の記事」を探しやすいはずですYO

話をYahoo!に戻しまして、自ブログ用ナビゲーションが無いのは タブ切り替え の方式を取っているからです。

Yahoo! ページ送り

トップページ ページ送り

これよこれ。Yahoo!ブログの素晴らしい点のひとつ。リスト型ページ送り。何度も言いますが大手の主流は「前後のみ型」です。リスト型にするには複雑なJSが必要なのでページスピード面で劣ることはあるかもしれませんが、ユーザービリティ面の方が個人的には勝る。

アメブロの方で書きましたのでYahoo!のトップページURLも載せておきます。

yblog.html?p=x

Yahoo! 個別記事ページ送りとコメント投稿フォーム

個別記事ページ送りとコメント投稿フォーム

ここも個人的に すごくイイ と思っているのですが、まず サムネイル画像がついている 点。まぁこれは別に無くても良いか、と思っています(ぇ?)
それよりも下に コメント投稿フォーム がついていますよね。記事と同じページに投稿欄のあるサービスって実はなかなか無いんです。アメブロも 別ページ で書かなきゃいけませんし、受信コメントの一覧も別ページ。Yahoo!は コメント投稿フォームも受信コメント一覧も記事と同じページにある んですよね。ですから作業の流れが非常に円滑です。

個別記事というのはブログ内で最も大事なページですから、関連する事項でのページ遷移は少ないに越したことはありません。コメントなどはまさに「記事に関連する事項」ですから、同ページ内に収まっているのが理想ですよね。

さらにYahoo!には コメント一覧 という独立ページがあり、これまでに受信したコメントをリスト形式で延々と見ることが可能です。「どこの記事に」書かれたかは重要でなく、ともかく受信した順に確認することができます。

コメント一覧

これ何が良いかというと、日記ブログなんかはさておき、情報系ブログ記事や専門性の高いブログ記事などは コメント欄の内容が有益 であることが多いんですよね。そのコメント内容をリストとして見ることができる。そしてこのリストを一般閲覧者に可視化するかどうかはユーザーの選択性になっています。つまり非表示可能。

Yahoo!は「自分が誰にコメントしたか」がマイページでちゃんとわかるようになっていますが、さらにこの機能もある、ということですね。これは 寧ろFC2ブログに欲しい。可能っちゃ可能ですけどね。JSを使って作成することはできます。ただしページ種を犠牲にする必要が。まぁ「全記事リスト」になるかと思います。ただかなり無理矢理な形になりますので方法は紹介しません。

FC2へ移転時の注意点は、アメブロ・Yahoo!など多くのサービスと異なり、コメントする際に自動的に自分のブログへのリンクが記載されるというシステムはFC2には無い ので、自主的にURLを記載するようにしてください。一度入力すればクッキー情報の働きで次回からは自動入力になります。行ったり来たりは容易にしておかないと交流が困難ですし、訪問を受ける機会が減ってしまいます。そのためには よほどの理由が無い限りURLは記載する ようにしましょう。もちろん強制するものではありません。

余談になりますが、私個人がいつも思っているのは「スタッフブログへのURL無しコメントは時として損」ということです。ただ文句を言いたいだけ、という方も中には居ますのでそういう場合は除外するとして。何か問題や疑問が生じたときに、そのコメントにURLがついていれば「答えを知っている人」からの手助けが受けられるかもしれませんよね。そのためには「問題の目視確認ができるようにしておく」というのが大事。不平をぶつけるよりも答えあるいはそれに近いものを得られる方が得だと思うんですけどね (´・ω・`)

というわけで、Yahoo!のページ送り・コメントの仕様は他サービスに無い良い点だと思います。もったいないなぁ。ですがYahoo!の最大のデメリットは セマンティックな記事を書けない点 です。この点は他サービスに大きな遅れを取ってしまいましたね。もう終了ですから言ってもアレだけど。でもアメブロとかもそう変わらんかー (∵`)

そういえばYahoo!の個別記事は他サービスと 時系列が逆 になってますね。アメブロ・Livedoorは「左が新しい、右が古い」ですがYahoo!は逆で「左が古い、右が新しい」です。

Livedoorブログ

* 記事の様子が確認できないと説明になりませんのでスマホのモックアップ(mocup, 模型)からわざとはみ出させています

Livedoor ヘッダー

ヘッダー

既出の2社と比較すると大きめですかね。ヘッダー部位は全面リンクになっておりタップしやすいです。

Livedoor 自ブログ用ナビゲーション

自ブログ用ナビゲーション

アメブロ同様 横スクロールタイプ ですね。ポータル用ナビは見当たりませんがLivedoorユーザーさんがログイン状態の時は表示されてるのかしら。私アカウント持ってませんので未確認です。すみません。

あとこのすぐ上に「ブログリーダーで読者になる」というリンクバナーがあり、LINEでRSSを受け取る ことができます。RSSというのは簡単に言えば 新着情報受取 のことで、マイページや管理画面に表示されるお友達の記事のリストもRSSです。LivedoorのRSSはLINE連携でもって行う、ということになりますね。

Livedoor 記事の並び

トップページ記事並び

2社が リスト系 なのに対し、Livedoorは カード系 を採用していますのでスクロール量は多いですね。こちらもリスト系同様スマホ表示では最適解です。

そして 記事概要文 も表示されています。記事の書き出しを表示したい、という場合にはこうしてカードレイアウトにする方が無難。リスト系では文字の量によってはサムネイル画像とのバランスが悪くなりますので、記事タイトルの表示・概要文共に表記文字数の制限(省略)をかけることがあります。なので概要文が要る場合は「サムネイル大きめ + 概要文」で上下配置してカード系に仕上げる方が適していると言えるかもしれません。

また、カード系にするメリットは 個別記事以外に遷移するリンクを掲載しやすい 点です。アメブロで例に出しましたが、カード系の場合はリンクの上下に余裕を持たせることができますのでそういったことが可能。要はリンク同士は近すぎるとタップし辛いんですね。表示が小さめでもターゲット周りに余白を多めに取ることで改善になります。

ただしLivedoorは上記メリットに該当しません。カード全体が個別記事へのひとつのリンクになっています。上記はLivedoorスマホ版のメリットではなくカード系レイアウトのメリットを説明した、と思ってください。

Livedoor ページ送り

トップページ ページ送り

やはり前後のみページ送りで特筆すべきものはありません。

Livedoor 受信コメント一覧がスレッド形式

先日一度目視確認したんですが、もう二度と見つからない ←
SEOかなり弱いのではないかLivedoor…
なので下記のブログカード先でご確認ください。

コメント機能をリニューアルしました!(1月末にかけて順次適用) : ライブドアブログ 公式ブログ

【2018年12月17日 追記】リニューアルしたコメント機能の実装を順次行っておりますが、全てのブログに機能が反映されるのは2019年1月末までかかる見込みです。

簡単に説明すると、返信を該当コメントの直下に表示できる というのが スレッド型 です。投稿フォームではないですよ。受信コメントの表示形式のことです。

Wordpressなどはもうこの形が主流になっているような。これを欲しがっているFC2ブロガーは多いはず(笑)
私も一時期チャレンジしてみましたが、現状のFC2システムではかなり難しいなぁ、という結論です。Livedoorは運営がスレッドを用意してくれてるんですね。良いな (∵`)

--- 2019.7.6 追記

ちょっと私勘違いしていました。Livedoorスマホ版のコメント一覧は該当記事の下、同ページ内にいくつか表示されており、恐らく3件が上限ではないかと思います。4件目以降は「もっと見る」をクリックして コメント一覧ページ(記事とは別ページ)へ遷移 すると表示されます。Yahoo!のようにそのページ内で残りを取得するのではなく、別ページ遷移です。

で、その別ページであるコメント一覧ページに滞在している場合しかスレッド返信を行うための返信矢印が表示されない、という仕様のようですね。

ということはコメントが3件以内の場合コメント一覧ページへのリンクである「もっと見る」は表示されないので、スレッド機能も使えないということ?え?そゆこと? (´・ω・`)
え?(笑)

まぁそうなるだろうな、というのはわかります。スレッド式で1つのコメントに3つの返信が付けば合計4件になり、同記事内で表示するコメント制限数を超えてしまうことになります。それはわかるんですが、そもそもその3件は必要か?という疑問(笑)
10件, 20件ならわかるんですけど3件って。

--- 追記ここまで

まとめ

どのサービスもシステム上のメリット・デメリット、使い勝手の好き嫌いなどは付き物ですが、総じて言えるのは 今最も大事なのはスマートフォンでの見え方・使い勝手 です。アメブロなんかはスマホ閲覧率がかなり高いはずですし、どのサービスもそうなっていく、というよりも既にそうなって来ているはずです。

で、「閲覧者」を指すときにどうしても「同じサービスを利用しているユーザー」「いつもコメントしてくれる常連さん」をイメージしてしまいがちですが、実際はそうではありません。アカウントを持っていない人だって見ていますし、全く会話を交わしたことのない方、他ブログサービスのユーザーだって見ているはずです。

ですからweb一般で主流の方法、主流の考え方を識ることは大事ですし、良い点はどんどん取り入れたら良い。FC2ブログはそれができるブログサービスです。で、Yahoo!のお引越し組さんにアドバイスしたいことは Yahoo!はYahoo!他は他 という点。「Yahoo!と同じようにやりたい」「Yahoo!となるべく同じ見た目に近づけたい(テンプレートなどの見た目)」というお気持ちもわかりますが、本当にその必要があるのかどうか です。特に見た目ですよね。そして パソコンでの見た目しか気にしていない人が多すぎる ように思いますし、旧式のレイアウトを維持しようともがき続ける 人がこれまた多すぎる。

どのサービスも スマホ最優先 にシフトしていくはずです。幸いFC2ブログはレスポンシブテンプレートの提供があるのですから、思い切ってチャレンジしてみるとか。スマホ版を設定するにしても他社の良い点・悪い点を抑えた上で選ぶとか、まぁ色々方法はあります。ともかく スマホでの見た目はものすごく大事 という意識を持つことが重要。そこが理解できれば「トップから個別記事へのワンクリックが余分で…」「トップでも全文を表示したい…」という考え方にはたどり着かないはずです。

しかしYahoo!スマホ版は惜しいですね。他社と比較しても良い点が結構見つかります。サービス終了は本当に残念ですよねぇ (∵`)

関連する記事
vanillaice (Akira)
Author: vanillaice (Akira)
* Internet Explorerはサポートしておりません。
* メールでの返信をしておりません。
ブログ内で必ずお返事はしておりますので
ご面倒ですがリコメの確認に再度お越しくださいね *

コメント(25)

There are no comments yet.

Janedoe1471  

2019/07/06 (Sat) 14:37

分かれましたね…

日本語話者向けのサービスは、本当に、方針がはっきり分かれましたよね…。
レスポ推進がはてなとFC2と忍者。
ただしはてなは、実際には、有料にしないと、レスポにする意味は、あまりありません。
そしてはてなとFC2と忍者以外は、すべて、スマホ版(の広告)死守、です。
GMO系も、試してはいませんが、同じでしょう。
muragonも、なんだかんだ言って、PC版は自由にいじらせますが、レスポは拒否です。
知らないうちに、PC版にも、広告が増えていました笑。
これだったら、現状では、忍者のほうが、広告が少ない。

Tumblrとか、Bloggerとか、外国系のサービスは、レスポが当たり前なのに、日本語話者向けのサービスは、なんか、非常に特殊な方向に、展開しているな…みたいな。
とにかく、スマホ版を死守するという、固い決意が。
そのうちのひとつであるYahooは、終わりますが。

微妙なのが、Seesaaで、たぶん、まだ、どっちにするのか、方針が決まらないのでしょう。

が、利用者の側が、スマホ版で満足ならば、それはそれで、いいのかもしれませんが。

エキサイトなんかは、残念だなあ、と。
どっかで切り替えればよかったのにな…みたいな感じですね。
最近、目安箱とかいうシステムを始めましたが、今さら、何を言っているんだ、もう、遅い、みたいな。

Akira  

2019/07/06 (Sat) 18:46
vanillaice (Akira)

To Janedoe1471さん

Janedoe1471さん、こんばんは ('0')/

アメブロの開発者ブログ(SEO担当?)の方に「レスポンシブの導入は断念した」と書いてあったんですが、技術的なこと云々よりも広告の都合でしょうね (´・ω・`)
スクロールすると下層にある動画広告が出てくる(z-index, 固定スクロール系)とか(笑) こういうのはレスポンシブでは困るはずなので、どうとでも調整できるスマホ版を切り捨てるわけにはいかない、という事情だと思います。

FC2はアダルトをはっきり区分していて、有料登録は一般ブログよりも高額設定です。そしてあれやこれやアダルト部門でかなり稼いでいる(笑) なので「稼ぎどころはアダルト」という感じですね。

はてなはアダルト禁止なので一般会員の有料登録がもともと高額ですよね。そしておっしゃるように、一般開放しても良さそうな機能まで有料に限定していたり。
やっぱりどこかで収益を確保しなければいけないので、それぞれのブログサービスが選択するあの手・この手がそれぞれの結果ではないかと思います。レスポンシブを許すならば特定広告を断念せざるを得ない分、ユーザーからの徴収で補填、という感じではないかと。

Akira  

2019/07/07 (Sun) 13:19
vanillaice (Akira)

To Janedoe1471さん(p要素について)

今リクエストの方で拝見したので余計なおせっかいをしておきます。

p要素はdisplay: blockあるいはそれに準ずるふるまいの要素を入れ子できません。旧htmlで言うところの「ブロックレベル要素」のことです。
プロフィールプラグインのアウトラインはpですが、中身はユーザーの任意ですよね。
仮にユーザーがdiv要素を用いた場合

<p>
<div>内容</div>
</p>

これは構文エラーで、特にp要素は終了タグを省略できる要素ですからブラウザ補完が働きます。すると

<p>
</p><div>内容</div>
<p></p>

こうなります。終了タグを省略できる要素がありますよ、と先回お伝えしました。これらの要素は言い換えると「ブラウザの自動補完が働く要素」と言えます。仮に終了タグを省略せずに明示した場合でも正しいと思われる位置に自動で終了タグが挿入されます。
なので「プロフィールプラグインの中身がどんな場合でもp要素で囲う」というのは無理なんです。FC2の都合ではなくhtml構文(及びブラウザ)の問題なので。
私の方ではプロフィールプラグインは無難なdiv要素にしておくことをおすすめしています。

参考記事: FC2ブログのプロフィール文にhtmlを使わない方が良い理由
https://vanillaice000.blog.fc2.com/blog-entry-812.html

pはメジャーなタグですが実際は初心者さん向けではない要素です(笑)
先日のul要素も同様。

Janedoe1471  

2019/07/07 (Sun) 16:03

To Akiraさん

はい、ありがとうございます。
divがpやspanの中に入れ子になるのは、変なのですが、FC2公式のフッター部分とか、確かそれがあったり、ある時点では、基本をpに決めてあったのかな、という感じがあります。
紹介文の場合は、pでなく、もともとdivにしてほしかったのですが、または、私のほうで、変数をdivで囲んでおくべきだったのかもしれません。
ただ、ここの仕様を今からdivに変えられると、私のテンプレの仕様も、全部直さねばならず、非常に困ったことになり。
やはり、前例のないことをすると、いろいろあるんだな、と。
ほとんどの方は、文章から書き始めているので、この件については、ほかの方の場合は、特に問題は起きていないのですが。
いろいろと、勉強になります。

Janedoe1471  

2019/07/07 (Sun) 16:40

To Akiraさん

逆でした、プラグインの中身は、こっちではいじれないので、やはり、ここは仕様任せにするしかなく、記事上部分をdivで囲んでも、意味がなく。
ゆえにやはり、p.plugin-myimage+pの.removeにするしか、なく。
または、公式のプロフィールプラグインをやめて、テンプレに埋め込むかですが、それだと、普通の人は、ダブるので、公式のほうを外さねばならず、できれば、余計な手間をかけさせないために、公式をそのまま使いたいというのが、私の考えで。
今回の方のようなケースは、比較的例外とは言えますが、今後もないとは言えませんで、これはもう、私のほうで、問題が出た際に、個別対処をするしかなく。
こうなったのは、この方も、超未来日付の記事を書いておられたので、それを、やめるようにということで、中身を移した結果、でした。
私のほうで、中身を移す前に、前もって、もっと知識があれば、よかったと思います。
このシステムをやめるかどうかというと、全体的に見れば、数行の文章の方がほとんどなので、全体的に見ればですが、初心者の利用者に対しては、プラスの効果のほうが高いと、現段階では、言えると思います。
フリーの拡張プラグインを追加して、そこに書けとか、そういうことを最初からやるのは、なかなか難しく、もともとあるものを見やすい場所に表示してやるということのほうが、合理的だと、いうのが、現段階の私の考えです。
せいぜいaを貼ったり、imgを1枚貼る程度なら、特に問題はないのでは、と。利益のほうが、大きい場合が多い、と。
今回の方のケースは、特殊でしたが、やはり、スマホから見たときに、トップページのヘッダー直下に、自己紹介文が見えるというのは、利用者のブログプロモーションの一環としては、捨てがたい選択肢で、トップページの一番最初だけなら、害が出た場合でも、害のほうが少ない、のではないかと。
やはり、HTMLへじかに書き込むというのは、ほとんどの人には、無理だろうと、思います。
なかなか、難しい問題です。


-  

2019/07/07 (Sun) 19:33

管理人のみ閲覧できます

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

Akira  

2019/07/07 (Sun) 21:40
vanillaice (Akira)

To Janedoe1471さん

Janedoe1471さん、こんばんは ('0')/
まとめてお返事しますね。

----- p要素の件
現時点では個別対応するしかない、と思っています。
Janedoe1471さんの細かい事情については存じませんが、一般論としてもし運営に要望するとしたら、「いかなる内容でもp要素になるようにしてくれ」は無理筋なので、「アウトラインをp要素からdiv要素に変更してくれ」ってことになりますかね。それが一番不具合の起きにくい構成ですし、既に入手済みの方はいずれにしろプラグインのpかプロフィール文を修正することになるとしても、新規開設者への被害は避けられます(笑)

----- iframeの件
構いませんよ。どうぞお使いください。
ただiframe要素はYouTubeだけというわけではないので、どう区別するかは考える必要がありますね。

Janedoe1471  

2019/07/07 (Sun) 22:10

To Akiraさん

ありがとうございます。

リクエストの件については、取り消しました。

また、p内に入れることを考えると、spanにすべきかと、考えています。
もちろん、それは、純粋に、私の方の問題です。
いろいろと、お騒がせいたしまして、申し訳ありませんでした。

Akira  

2019/07/08 (Mon) 13:22
vanillaice (Akira)

To Janedoe1471さん

こんにちは。

うーん、spanだとプラグインの方が崩壊してしまいますね。
プロフィール文は原則「html利用可」になっていますので、アウトラインがspanになってしまうと

<span>
あいうえお
<hr>
かきくけこ
<div style="text-align: center;">さしすせそ</div>
たちつてと
</span>

「あいうえお」から「たちつてと」までがプロフィール文だとして、こういう構文を書かれたら即アウトです。
spanで仕上げるならプロフィール文で利用できるhtmlタグにかなりの制限を設けなければいけなくなりますね。
そしてやはりブロックで仕上げてもらわないとたぶんみんな困る(笑)
そういった意味で汎用性の高いdivをすすめました。
p要素にしても文章が入っていれば全体をpで囲う、という単純なことではないので、やっぱりp自体もあまり適していないような気が。

いずれにしろたぶん運営は修正してくれないと思いますので(過去の利用者への影響を考慮)、「個別対応しかないと思う」というのはそういう理由です。
公式プラグインや個人設定で表示可能な某は結構構文エラーがあるんですが、私もそこを指摘して良いのかわからないんですよ。
指摘し、仮に改善「されてしまう」と、既存テンプレートで修正必須になるものもあって、それは私が修正すれば良いだけでなく、テンプレート配布者ほぼ全員に修正が強制されることになるのでなかなか言えずにいるというか(笑)
関連記事なんかがそれにあたります。

修正ではなく別ものとして新規追加はありえるかもしれません。
独自変数にも topentry_discription というスペルミスのものがありますが、topentry_description も同時に使えます。
discriptionを先に作ってしまい、ミスに気づいて正しいスペルのものを追加、という感じだと思います。
あと calender って変数もあります(笑)

Janedoe1471  

2019/07/08 (Mon) 14:58

To Akiraさん

言葉が足りなくて、すいません、spanにしようかなと言ったのは、iframeの外側を囲む要素のことです。
今は、テストブログでは、divでやってみましたが、p内に入れることを考えると、spanをブロックで使ったほうが、いいのかな、とか。
あなたの紹介文が、必ずpで囲まれる仕様というのは、やはり、「文章とか、せいぜいaタグ」という「想定」のもとで作られたものだろうと、思いますね…。
そして、現実にも、私のテンプレをお使いの方は、ほとんど「文章とか、せいぜいaタグ」なんです。
ですので、問題になったケースは、非常に例外的だったとは、言えますが、今後、同じようなケースが出ないとは言えないというところが、問題で。
あなたの紹介文は、とにかく、文章から書き始めてくださいというのが、最もわかりやすい説明かな、と。
本来は、この部分を、自分と自分のブログを説明するために使ってもらって、ヘッダー下に表示させることで、コメントは承認制ですとか、しばらく更新を休みますとか、連絡はツイッターのほうにしてくださいなり、そういう「お知らせ事項」のために、活用してもらいたい、と。
スマホから見た場合は、やはり、あなたの紹介文の内容は、たとえトップの1ページだけでも、ヘッダー下にあったほうが、いいと思うので。

テンプレート製作の段階では、サイドバーパーツに手を加えることができないので、本来ならば簡単に変えることのできるものが、仕様任せになってしまうと。
または、Museのような組み込み型にして、製作側でいじれるようにしてしまうか、ですね。

Akira  

2019/07/08 (Mon) 15:05
vanillaice (Akira)

To Janedoe1471さん

iframeのことでしたか。失礼しました。
そうですね。プロフィールにiframeということ自体非常にイレギュラーなケースだと思いますが、現時点での仕様を考えればspanで入れてdisplay操作、という形になりますかね。

ただこれについても例えばはてなブログカードを入れている人(実際にいらっしゃいます)などはデフォルトで縦横比固定が入ってしまうと害になりますので、やっぱり個別相談という形にするのが無難ではないかと思います。

FC2ブログだと慣例的にプラグイン3をヘッダー下に配置することで他社で言うところのメッセージボードを実現しているテンプレートは多いですね。
ただプラグイン3の登録数が問題になりますので、メッセージボードをデフォルト導入する場合は
lorem ipsumで代理文字にしておき任意編集(テンプレート内編集)にしている方もいらっしゃいます。
FC2ブロガーの場合「プロフィールはサイドメニュー部に常時表示」という感覚の方が多く、メッセボードが必要な方はやはりプロフィールとは別の文章を入れたい、という方の方が多いような気がしますので、そうなるともうテンプレートを編集してもらうしかないというか。

初心者向けに、ということなんですが、FC2に来た以上テンプレート編集はいずれ直面することなのでまぁ、アレですよね(笑)
あとやっぱり「他製作者テンプレートに変更する可能性」も考慮しないといけないので、個人が所有する内容(プラグインやプロフィール文など)はテンプレートに左右されないよう元を綺麗にしておく、というのが一番ではないかと思います。

----
プロフィール文をどこに掲載するかについては個人の好みでしょうね。私の場合はスマホのabove the fold部分はヘッダーとコンテンツであって欲しいと思う方なので(笑)
お知らせが入ってても良いんですが、複数回スクロールしないとコンテンツが出てこないほど長いのはちょっとどうかなぁ、と思ったり。
私がテンプレートにメッセーボードを入れないのとプラグイン3をヘッダー下に入れないのは結局製作者側で分量のコントロールができないからなんですよね (´・ω・`)
方向性が違いますがプロフィール用の固定ページがあっても良いんじゃないかと思っています。
つってもFC2ブロガーしかクリックしないと思うけど。アメブロとかYahoo!とかを訪問してブログ主のプロフィールページ見るかって言ったらまず見ないです。私だけかしら(笑)
そう考えるとプロフィール文ですごく大事ならばヘッダー下に、というのは正解かもしれませんね。一番目立つところに掲載するわけなんで。アフィリエイターさんが広告掲載に割り当てたい部位(笑)

Janedoe1471  

2019/07/08 (Mon) 17:08

To Akiraさん

そうですね、他テンプレートに変更した場合のことは、考慮すべきなんですが、あなたの紹介文なら、特に、ただ普通にサイドバーにあるだけで。
プラグイン3を使うというのは、初心者さんには、なかなか難しいだろうと、人にもよりますが、本当に何もわからないような方も、おられて、FC2基準で使いこなすということは、時間がかかるだろう、または、無理かも、と。

Yahooブロガーさんの大量流入でもって、「FC2文化」みたいなものも、多少、変わっていくのかもしれません。
やはり、Yahooの仕様で10年以上やっていたような、年配の方に、今からHTMLを操作してくださいと言っても、無理であって、そういう方は、例えば、60代70代なら、あと数年とか10年とか、楽しくブログを書ければ、それでいい、ということになって、無理に改造に精を出すというよりも、記事の作成や、交流のほうを、重視されているのでは、と。
私のテンプレートでは、そういう層のニーズを、最も重視したいと思っているので、改造に時間を割いて、HTMLを勉強するよりは、限られた時間を、記事作成のほうに、有効に使ってもらいたいな、と。
Yahooからやってきたとか、どんなテーマのブログを書いているかということが、ぱっとトップページに出ているというのは、やはり、自己プロモーションとしては、かなり有益だと思います。
higeさんのような方は、すごい例外だと思って、驚いています^^
ああいう方は、なかなかいないというか。

iframeは、Twitter、facebookもありますし、Twitterは横幅はだいたい自動で対応ですが、facebookは、ちょっと難しく、はてなやエキサイトのブログカードを、ご法度で貼るような人はもう、例外と思うしか^^
やはり、他サービスが身銭を切って設置しているような機能を、勝手に使わせてもらうというのは、よくないですね。
とにかく、iframeすべてに対応しようと思うと、やはり、無理があり、しかし、動画というのは、利用率が高いことから、対応しなければならないかな、と。
私のテンプレの場合は、もう配布をしてしまっているのですが、今からでも、やらねばならないかな…と。
頭が痛いです。

なにしろ、一番の目的は、古い固定幅テンプレを選ぶ人を、減らしたい、と。
あとは、要約表示タイプに慣れてもらう、と。
全文タイプを追記なしで使う人が増えれば増えるほど、表示速度も、下がっていきますし…^^
長くなってしまって、すいません。

Janedoe1471  

2019/07/08 (Mon) 17:30

To Akiraさん

申し忘れました、確かに、長すぎるのは、問題で、たぶん、最低限伝えたいことを、数行~10行程度にまとめるのが、よいだろうと、思います。
例えば、この方ですが、紹介文の中に、自分のプロフィール用に作った記事ページへの誘導リンクを貼っておられまして、こういう使い方が、理想的だろうな、と思っています。
https://tamaki498.blog.fc2.com/

確かに、プロフィール用ページがもともとあるほうが、親切で、ですが、プロフィールページというものは、他サービスでも、だんだんと縮小される傾向で、FC2ブログでは、今、あえて新設するという可能性は、あまりないのかな、と。
「FC2プロフィール」という別サービスは、あれはちょっと…しょぼくて使い物にならない、と言いますか。
固定ページが新設されれば、それを使えますが、それも、初心者には、そのまますぐに使える、というわけではなく。
チュートリアルをひと通り読んでからでないと、無理でしょう。

また、プラグイン3をテンプレに組み込んだという場合に、他テンプレに変えたという場合には、どうするのか、わかりませんが…そういう場合は、「変えないという前提」なのかもしれませんね。

Akira  

2019/07/08 (Mon) 20:27
vanillaice (Akira)

To Janedoe1471さん

こんばんは。

私の考えはちょっと違うんですね。個人的には「脱・Yahoo!の風習」をすすめたい。
というのは、「ブログ説明文」「プロフィール文」は全く別のものですよ、ブログ説明文はGoogleなどの検索でヒットしたときに代表ページの説明文としても使われるので重要ですよ、何を目的とするサイトかはプロフィールではなくここに書くのですよ、とか。
せっかくFC2に来たのだからなるべく正しく使った方が良いと思うんです。

懸念材料としてはYahoo!ブロガーさんは「ゲストブック」というのがあって、ゲストブックにプロフィール的なことを書いていた方が多いと思います。
するとかなりの長文になる方、動画を載せている方なども居て、恐らくそれらを移植するとなればプロフィール文に目をつけるのではないかと。
実際のYahoo!ゲストブックの紹介文はFC2で言うところの「ブログ説明文」で検索に出る文章なんですけどね。気づいている人はとても少ないようですが。

プロフィール文を記す入力ボックスの高さの初期値が小さいことから、FC2運営は長文掲載を想定していないだろうと察知してくれると良いんですが(笑)
長文記載を想定するならばボックスは大きく設定されているはずですし、察しの良い方やカンの良い方は気付くんですけどね。

なのでヘッダー下を活用するならば「文章は端的に」を啓蒙して頂ければなぁ、と思います。FC2ブロガーの場合は長文になるなら「フリーエリアプラグインを使う」という意識が既に根付いているので良いんですが、Yahoo!の方はたぶんすぐにはわからないと思うので。

-----
プラグイン3はFC2の独自文化のようで、たぶんかなり前に今回の話題になっているような「ブログ説明文・プロフィール文以外でお知らせしたいことをヘッダー付近に掲載したい」という要望があり、それゆえに「プラグイン1, 2とは別の目的で利用されることがあります」としている説明(古参ユーザーさんによるもの)がたくさん出てきます。
他の目的というのは「サイドでなくヘッダー下への配置」に他ならないのですが。
私個人としては「1も2も3も等しく副情報にすぎない」と思ってるんですが、FC2ブロガーさんが築いて長く続いている文化ですから否定しません。
といってもスマホデバイスが無かった時代、レスポンシブテンプレートが無かった時代、above the foldの概念が無かった時代の文化ですから、当然変わって行くだろう、変わらないといけないだろう、とは思っています。

なので「プラグイン3がヘッダー下になっているテンプレート」という条件で探す人もまだ結構多いようですよ。私の方にもヘッダー下配置へのカスマイズ指南の依頼が届くことがありますが、お断りしています(笑)

Janedoe1471さんの行っている「プロフィール文のみヘッダー下」という構成はそういう意味で良いと思いますよ。プラグイン3という大きなくくりではいくつもいくつも入れてしまう方が居るわけで、プロフィール文に的を絞ればよほど困ったことにはならないはずですし。ただやはり情報量・文章量ですよね。
動画とか要るかなぁ ( ̄∀ ̄;)

リンクのその方の使い方を紹介するとか。私も全文タイプに関する啓蒙で実際のユーザーさんを「好ましい例」として取り上げています。文章で説明するよりイメージを掴みやすいかも。
ただ「スマホで見てよ?」と言ってもなかなか…。Yahoo!の方はスマホでの見え方を二の次にする傾向がまだ強いようです。スマホ非所有者も多いのではないかと感じています。

-----
プロフィール固定ページはFC2でもスマホ版にはありますよ。「クリックする人居るのかな?」とは思いますが。
固定ページの提供は有料会員限定で良いと思います。「プロフィールに使う」という用途よりも、FC2は会社のページとして利用している方も多いので、会社概要や求人に利用したり、といったことができるようになりますよね。こういうのは時系列が絡まない方が良いわけで。

Janedoe1471  

2019/07/08 (Mon) 21:33

To Akiraさん

そうですね、今後の利用状況を見ながら、考えて行きたいと思います。
テンプレートの提供は、本当に難しいなと、今回は、実感しました。

Akira  

2019/07/08 (Mon) 21:57
vanillaice (Akira)

To Janedoe1471さん

難しいですよねぇ (´・ω・`)
私も常に勉強、常に模索、という感じです。

-  

2019/07/08 (Mon) 22:25

管理人のみ閲覧できます

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

Akira  

2019/07/08 (Mon) 23:32
vanillaice (Akira)

To 要約タイプへの移行について 内緒さん

これはホントに難しいですよねぇ (∵`)
特にお引越しされた方などは全ての文章が自動的に「本文」に入るわけで、じゃあそれを全部「追記」と切り分けろ、と言ったって500ページも1000ページも有る方にとっては拷問でしかない(笑)

まぁ、要約だとどうしても「サムネイルとなかよし」という感じになるので、ううーん… 難しい(笑)
ただ現況のwebでは「サムネイル必須」と言い切って良い時代に突入していますので、今後の方針としては「サムネイルをつけようね」というのは伝えても良いのかな、と思います。

今製作中のテンプレートは「アフィリエイターさんも使える」ものにするつもりで、サムネイル画像も比較的小さめではあるんですが、画像使用なし(ヘッダー含む)、カスタマイズ難易度高め、になると思いますのでやっぱおすすめできないな ^^;
サムネイルを使わない方ならヘッダー画像ぐらいは欲しいですもんね (´・ω・`)

もう要約記事タイプでサムネイル部位の編集(除去 or サイズ縮小)でまかなうしかないのかも。
その場合は概要文なし、記事タイトルのみをおすすめしたいですが(申請予定テンプレートもその形です)、きっと概要文は欲しいですよね。全文を好んでおられた方であれば。となると「サムネ小さめ、文字回り込み」または「画像あり記事と画像無し記事のレイアウトを分ける(画像無しの場合は概要文をコンテンツ幅100%, no image代替無し)」という形になるか…。

うーん、どうだろ。ご相談に乗れなくてごめんね、と言うしか無い感じかな ^^;

----
該当の方は総記事数200ページ以内ですね。
その場合は私なら酷だとしても「追記の切り分け」をすすめます。酷だとしても(笑)
新投稿画面を利用すればワンクリックで済みますので、ゆっくり少しづつ毎日修正、ということで。酷だけど(笑)
そしたらもう「全文」だ「要約」だと今後悩まずに済むある意味根本的解決になると思うので。私の目安は200以内ですね。
あーでも記事数にすると600だもんな。やっぱ辛いかー ( ̄∀ ̄;)

-  

2019/07/09 (Tue) 00:39

管理人のみ閲覧できます

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

Akira  

2019/07/09 (Tue) 01:06
vanillaice (Akira)

To 要約タイプへの移行について 内緒さん②

あー私ホント無理ですね。そういうの。一体何に囚われているのか意味がわからない。

私も全文タイプの提供を辞めてしまうという選択もあるんですが、そうなると「自分でできる人」が困ってしまうんですよね。
要約タイプは後発なので全文でずっとやってきた、という人もまだまだ多いとは思いますが、個人的には全文の方こそ上級者向けというか。それこそなんでも自分でできる人向けに作っているような感じなんですけどね。

Akira  

2019/07/09 (Tue) 10:24
vanillaice (Akira)

To Janedoe1471さん(重要)

MaBelleを元にしてひとつ作ってみますね。

・ヘッダー画像あり
・簡単カスタマイズ
・サムネあり・なしの切り分け
・概要文多め

メッセボードについては導入しません。これは方針なのですみません ^^;
(必要があればJanedoe1471さんの方で指南をお願いします)
限定配付にすると思います。そして日中作業できませんので今夜あたりに。たぶん1日でできると思ふ。
お役に立てるかはわかりませんが、一応そういう予定で居ます。

Janedoe1471  

2019/07/09 (Tue) 13:09

To Akiraさん

ありがとうございます。
今、Sさんのところにも、コメントでお知らせしました。
MaBelleは、終了にしてしまうのは、もったいないなあと、私も思っていたので、本当によかったと思います^^

Akira  

2019/07/10 (Wed) 11:52
vanillaice (Akira)

To Janedoe1471さん

Janedoe1471さん、こんにちは ('0')/

テンプレートはもう出来ているんですが、記事を書くのが大変だこりゃ ( ̄∀ ̄;)
今しばらくお待ち下さいね。

anedoe1471  

2019/07/10 (Wed) 15:16

To Akiraさん

了解です^^

Akira  

2019/07/10 (Wed) 23:40
vanillaice (Akira)

To anedoe1471さん

こんばんは ('0')/

ちょっと今日バタバタして作業が遅くなってしまいました。最新記事の方をご確認ください。
よろしくお願いします。

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

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