FC2ブログ新デザイン「新投稿画面」に改善がありました

FC2ブログ新デザイン「新投稿画面」に改善がありました

FC2ブログのあれこれ
2021/03/13 13
vanillaice (Akira)
vanillaice (Akira)
トラブル対処 新投稿画面 旧投稿画面 Education

「新デザイン」の「新投稿画面」。ややこしいったら… ( ̄∀ ̄;)
いくつか改善が見られるようなので記事にしたいと思います。Kさん、毎度情報提供ありがとうございます。実際は何日も前にご報告頂いてましたが私の時間が取れず遅くなり申し訳ないです (*_ _)

モードを記憶できるようになりました

HTML編集を利用している方に「新規記事を書くときいちいち編集モードを切り替えなければいけない」という不便さがありましたが解消されています。先回記事作成時にHTML編集で閉じたらそのモードを記憶する、という方式です。ブログ個人設定ではなく普通に記事を書けばOKという形。「本文」「追記」の切り替え時も有効です。

くれぐれも旧来の「旧投稿画面に於ける『改行の扱い』設定」とは違い、こちらは「モード」なので混乱しないよう注意。モードの記憶あるいは固定の機能ははこれまでも無かったので新規導入、ということになります。

画像挿入アイコンが下段左に移動しました

以前は上段の右上の中途半端な位置にありましたが、下段左に移動して直感的になったと思います。

クリックで拡大

エスケープ問題が一部解消されました

こちらは「一部」としておきます。ちょっと難しい話かもしれませんのでスクリーンショットで説明を 。

クリックで拡大

赤枠部位、元々この部位は以下のようなマークアップを行って「記事を保存」したものです。

<pre><code>&lt;img src=&quot;画像URL&quot; alt=&quot;&quot; width=&quot;100&quot; height=&quot;100&quot;&gt;</code></pre>

上記内容が「記事の編集」で画面を開くと以下のように変更されています。

<pre><code>&lt;img src="画像URL" alt="" width="100" height="100"&gt;</code></pre>

HTMLモード画面上でhtmlを変換させずに文字列として記すには、htmlの記号に対し エスケープ という処理が必要です。この場合 " (ダブルクォーテーション) を &quot; こうして書くんですね。

ところがエスケープしたはずの記号が編集時には 非エスケープ状態 に戻っています。これが以前は 軒並みエラー判定 になり、構文ルールがめちゃくちゃな状態になってしまう、という事態が起こっていました。

サンプルをご覧頂いて分かる通り、一つの記号をエスケープするのに結構な数の変換・手間が必要なんですが、例えばコードとは全く関係ない記事部分に誤字を見つけてそれを直して再保存したとします。するとコードの非エスケープによってエラーが発生。回避するにはたった一つの誤字修正によって壊れてしまったコード部位を全て再変換しなければいけない、というもうホント勘弁してくれ、な事態(笑)

で、現在は同じように非エスケープ状態に目視上戻りはするんですが、エラーにはならなくなった ということです。これは旧デザイン新投稿画面と同じ挙動になった、という意味でもあります。

みなさんが書いた記事内容、構文内容というのはそのままサーバーに保存されるのではなく、圧縮が行われます。でないと膨大なデータ量になってとてもサーバーが保たない。text nodeとか小難しい単語が出ますがここでは避けて、結果的に エラーではなくなったよ ということで。

いまだ未解消な問題

  1. ブラケットのエスケープ
  2. 集中モード利用時の記事作成画面の状態
  3. 引用アイコンが無い
  4. 画像掲載時、width, height属性が書き出されない

ブラケットのエスケープ

前章の「エスケープしたはずのダブルクォーテーションが非エスケープに戻る」とは 真逆 で、「エスケープすべきでないブラケットがエスケープされてしまう」という事象。こちらは解消されていません。旧デザイン新投稿画面でも同じ挙動でした。

クリックで拡大

上記内容は htmlではなくJavaScript です。初回記事保存時の赤枠部位は =>> =&& で、アロー関数(arrow function), 理論演算子(boolean operators) などと呼ばれるものです。

これらは前章の「文字列としてのコード掲載」とは違い、実行してもらわなければいけませんので、エスケープは行いません(行えません)。ところが勝手にエスケープされちゃう(笑)
こちらもうっかり誤字など修正して再保存するとJSが動かなくなってしまいます。

この件については旧デザイン時からそうでしたし、記事内でJSを利用する場面、JSにブラケットが含まれる場面というのは少ないでしょうから、利用する人が気をつける、ということで良いと思います。

集中モード

集中モード というのは以下のアイコンをクリックすると利用できます。

これを利用するとサイドメニューなどが非表示に、 入力範囲が大きく なり、記事作成に集中できる、とそのはずなんですが。

実際の様子

記事画面の高さ大きくなってない。下の方随分余白ありますね。予想される結果は恐らく以下のような形だと思います。

理想

ボタンを含め高さがブラウズサイズいっぱいになる。これが理想のはず。そこでブラウザの高さを広げようとすると…

実際の様子

ボタンに被ってしまいます。そして記事作成領域自体もどこまでなのか不明瞭に。理想は以下。

理想

これ困りますね (´・ω・`)
記事作成画面の右下のリサイズ機能が無いのですから、集中モード時はブラウズ高さいっぱいになってくれないと。実現が難しいならば resize: none を解除して任意リサイズを有効化するとか(しかしこの内容のままでリサイズするとボタン被りは解消できません)

集中モード利用はサイドメニューが邪魔、といったこともあるでしょうが、入力範囲を増やしたい という場合の方が本命じゃないかと。

本件については問い合わせ済なので経過観察。

引用アイコンが無い

これはアカンやつ。引用アイコンは絶対必要 (´・ω・`) FC2リクエストを拝見しますと「新投稿画面にも引用を付けてほしい」といったものがあるんですが、これは新デザイン発表より随分前のものですから、旧デザイン新投稿画面に対しての要望です。がしかし 実際はある んですよぅ (´・ェ・`)

クリックで拡大

こうして「書式」の中に畳まれています。これをユーザーに気づけと言う方が酷で、気づかれない機能というのが一番無駄なので独立させるべきだろうと思うんですが、現時点では「独立」どころか「無い」(笑)

本件についても問い合わせ済、経過観察。

画像掲載時のwidth, height属性

本来はこれが理想ですが

<img src="画像アドレス" alt="" width="画像横" height="画像縦">

現時点では以下の通り。

<img src="画像アドレス" alt="">

本件については過去に一度問い合わせを行い、その際の返答として「別件の不具合を解消するためにwidth, height属性の削除を行った」ということで、私の方でも一旦飲み込んだという経緯があります。

明らかにユーザーに影響の出る不具合を抑え込むための処置、という事情で私個人としてもその方が優先順位は高いと思うんですよね。なので 根本的な不具合解消までの一時的対処 と捉えています。「これでOK」とされるのはちょっと良くない (´・ω・`)

既に問い合わせており、その上でリスクエストを上げるというのはなんか違う気がしますので、有志の方いらっしゃいましたらリクエストしてみると良いかもです(他力本願)

旧投稿画面と新投稿画面の互換性

互換性というのは無いです (´・ω・`)

無いと言っても、新旧投稿画面を行き来することで構文がぐちゃぐちゃになって取り返しがつかない、といった事態にまではならない。

旧投稿画面を愛用している方からよく聞こえてくるのは 「タグが全部横に繋がっているじゃないか」 という内容です。

あいうえお
かきくけこ
さしすせそ

こう書いたものが

あいうえお<br>かきくけこ<br>さしすせそ

あるいは 「勝手にゴミがくっついているじゃないか」といった内容。こちらは新投稿画面のデフォルトモードで記事を書き、その内容をHTML編集モードで覗いたときに発生する不満。

あいうえお
かきくけこ

さしすせそ

こう書いたものが

<div>あいうえお</div><div>かきくけこ</div><div></div><div>さしすせそ</div>

こうなっているじゃないか、と。「divタグ勝手に入れんな。ゴミが」ってことでしょうけれども。

これらは至って正常なことでありどうしようもないこと であります (´・ω・`)

そもそもコードを整形して管理できるのはhtmlモードのみ。新投稿画面のようなWYSIWYGエディター(見たままモード)はバックグランドでみなさんが書いたテキストの「見た目」を維持させるために色々付加します。そして付加する内容は概ね div要素 としてブロック化して扱われます。

なので新投稿画面に切り替えて一番「困る」と感じるのは 旧投稿画面の改行の扱い「自動」利用者 ということになります。divタグがゴミだゴミだ、と言うんですが、あなたが書いたその内容の見た目を上手く引き継ぐために わざわざ付けてくれている と考えた方が良いです。その認識の方が正しい。そりゃhtmlを知っている人間からしたらゴミだけれども(より正当性の高い書き方を知っている場合は、という意味です)
htmlを自分で書かない、という方の場合はバックグランドを過剰に気にしていたら記事が書けなくなってしまいますよ (´・ω・`)

で、個人的には新投稿画面になるべく早く慣れて使いこなせるようになった方が良いと思います。理由は至って単純。webの大波が今後訪れたとして。例えばブラウザの改変ですとかhtmlの定義の改変など。その場合に視覚的不具合が生じる可能性がありますね。エディターはそれに対応しなければいけない。

その際に「新」あるいは「デフォルト」とされるエディターについては 修正をする という選択しかありませんが、「旧」とされるものについては 修正をする あるいは 提供を終了する と二択です。常に「終了」の選択肢が準備されています。なのでできるだけ早く新しいものに慣れる、と。

旧と新の互換性は無いよ!と割り切った上で、これまで書き溜めた記事を修正する場面が訪れたとき、「旧投稿画面利用 + 改行「自動」」に当てはまる方は非常に苦労することが目に見えているんですねこれ (´・ω・`)
そういう意味で「なるべく早く慣れよう」とおすすめしているわけなんですが。

まとめ

というわけで、いくつかの改善点をまとめてみました。新旧の互換の問題はFC2ブログでは避けて通れない問題、頭の痛い問題ではありますが、それはそれとして、新投稿画面の方はあと若干の修正が入れば上手く稼動するんじゃないかな、と思います。

みなさんまだ慣れなくてなかなか大変だと思うんですが頑張りましょう ^^;

 13

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

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

2021/03/14 (Sun) 12:11
hige

 なんかFC2が一生懸命何かに向って改修していこうとしているのではという意図を強く感じます。なので中途半端に終わらないでやりきって欲しいですね。

 またAkira氏が積極的にFC2へ意見を述べられているのを拝見して、素敵っ! との思いが強いです。

 でも集中モードなんぞ、今まであった入力欄の右下隅をマウスの右クリック押しっぱなしでドラッグ&ドロップで広げる操作が何でできないのかと、素人眼には思ってしまうのですがねぇ。

 どちらにしろ、HTMLモードを使いこなせるブログユーザーなどはほんの一握りなのだと思っています。
 見たママ編集のユーザーが殆どだと思いますので、そんなユーザーがHTMLのゴミがっ!だのと言われても何のことと。素人にはどうしようもないですよねぇ。超ストイックマニアだけがなにをゴチャゴチャ言ってるん?とか。

 HTMLを使いこなせる方はどうにでもやりようがあるのでそんな事どっちゃでもいいのではと思ってます。ただ今まさに勉強中の方には悩ましい事なのかなと。とは言っても私も勉強中ですが。

 是非HTMLの知識など全くない人達が使いやすいエディタを提供して欲しいですね。

 専門知識が必要なブログなんて⋯

 ごめんなさい。
 Akira氏の広報にめっちゃ後ろ向きのコメントを入れてしまいました。じじいになると頭硬くてやばいです。

2021/03/14 (Sun) 21:43
-
管理人のみ閲覧できます

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

2021/03/15 (Mon) 08:17
呑兵衛あな
No title

>引用アイコンが無い
この件は以前より不満のタネでした。ということで、試行して見ました。
結果、ChromeとChromium Edgeでは表示されますが、Firefoxでは表示されない事が判りました。
まあ、FC2ブログでも「Chrome推奨」との理書きがありますから、文句は言えませんがね。

>画像掲載時のwidth, height属性
Akiraさんは絵文字なんか使わないでしょうが...FC2ブログの提供する絵文字を使うと alt=""が付きません。

2021/03/15 (Mon) 14:38
vanillaice (Akira)
Akira
To higeさん

こんばんは ('0')/

専門知識は今の新投稿画面でも特に要らないと思います。ただ古参ユーザーさんは既に「htmlを見ること」に慣れていて、色々できることも知っているので却って難しく考えてしまう面もあるのかもしれませんね。

リサイズなんですが、実際は入力範囲が100vhまで到達したらそれ以上広げても実際はあまり効果は無いんですね。で、リサイズは何を目的とするかというと、目線の調整だと思うんですよ。全体の目線が画面3/4より下に行くと作業しづらいので、旧来のような100vh固定を避ける(これによって縦スクロール余幅が生まれる)という形になっていますが、さらに言うと全体の目線調整だけでなく「白い範囲(まだ何も書いていない部分)」が無いとなんとなく辛い、という方も居ます。その場合は「リサイズが欲しい」という要望が出てきますね。

集中モードはコードを書く人にとっては必要じゃないかと思います。サイドメニューが無くなることで中央に配置されますので、「さあやるぞ」と襟を正すときは集中モード使いたいです(笑)
例えば普段の制作でも集中したいときは他の余分なタブやブラウザやアプリなど全て閉じて、エディターを画面中央に据えてやったりします。(それ以外は結構画面の左端の方で作業しています, 個人的に)

2021/03/16 (Tue) 23:21
vanillaice (Akira)
Akira
To 新投稿画面の件 内緒さん

こんばんは。お気遣いありがとうございます :)

全然関係ないけど、最近は娘と「進撃の巨人」見ています。アニメの。なんかハマった ^^;
しかし見たことのあるエンディングにならないか心配で。コードギアス?なんとか?(ルルなんとかが「我に従え」って言うアニメ)、のラストと同じオチになるんじゃないかと非常に心配している次第(笑)

ご存知なかったらごめんなさい。スルーで ^^;

2021/03/16 (Tue) 23:26
vanillaice (Akira)
Akira
To 呑兵衛あなさん

こんばんは ('0')/

そうだったんですね。firefoxだと確かに項目が無いですね。リクエスト起案者さんもfirefoxユーザーさんかもしれませんね。
私も絵文字は使いますよ。新デザインの新投稿画面の絵文字は画像ではなくなりましたのでalt属性自体書く必要が無くなっています。
FC2ブログはサムネイルなどalt抜けが結構あるのでここらで整備してもらいたいですよねぇ (´・ω・`)

----- 追記
少し気になる一文があったので。

> システム屋が西洋の流儀で仕切るのは如何なものか。〜

そういったことはしていないと思いますよ (´・ω・`)
西洋の流儀、というよりも、web上では何らかのスタンダードが必要です。もしそのスタンダードが日本語であり日本の文法だとしたら、世界的に見て日本語の認知度はどのぐらいあるのか。最も汎く認知されいてる英語を基準にしているからこそワールドワイドウェブが成り立つのであって、日本語やイタリア語やペルシア語のルールが基準だとしたらコーダーや貴殿の言う「システム屋」の絶対数って減ってしまいますよね。
そしてそれぞれの国がそれぞれの自国システムでやっていたらワールドワイドにはならないしできません。

とかく「英語至上主義」「西洋文化の押しつけ」のような感じで責められることが多いのですが、コードを書く人間としては「至上」なんて思ってもいませんし、ましてや「仕切って」も「押し付け」てもいません(笑)
段落など日本独特の文化があるのなら個人単位でそれを尊重すれば良い話で、実際htmlの世界は「特定の国の独自の文化への対応」というのは日々行われています。だから縦書きもできるし、左右どちらからの書き出しもできるし、物理から論理へ移行させるプロジェクト(右書き出しの国への便宜)が進んだりしているわけで。

私はあまり日本のサイトを参照することはありませんけれど「p要素以外は認めない」といった強い内容を読んだことはないと思います。段落(p要素)をすすめる記事があったとして、「なぜ勧めるのか」の真意に注目していただくことでまた違った解釈になるのではないでしょうか。

2021/03/16 (Tue) 23:33
呑兵衛あな
To Akiraさん

>新デザインの新投稿画面の絵文字は画像ではなくなりましたので

新投稿画面は食わず嫌いでしたが、pタグを含めて馴染んでみます。
また、情報を御待ちしています

2021/03/17 (Wed) 08:54
-
管理人のみ閲覧できます

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

2021/03/17 (Wed) 11:36
hige
脱帽

いつもAkiraさんの説明は客観的というか偏見がないと感じています。
さらに幅広い見識の上で語られているので説得力があるのでしょうね。
専門知識がない人にも、上から目線ではなくて優しい対応をされてますしね。

Akira氏のブログは記事欄だけでなくコメント欄も非常に勉強になるのでいつも拝見させて戴いてます。

お返事は不要でございます。

2021/03/17 (Wed) 21:35
-
管理人のみ閲覧できます

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

2021/03/18 (Thu) 10:45
bon

Akiraさん、こんにちは。
いつもためになるブログをありがとうございます。

モードが記憶できるようになったり、画像挿入ボタンが本来の位置に戻ったり、どんどん改善されて使いやすくなっていますね。勝手に<p></p>で括られる現象もなくなりました。
私は画像挿入ボタンの位置と、勝手にp要素にされてしまうのが嫌で、しばらく旧管理画面の新投稿画面に戻していましたが、現状であれば新管理画面の新投稿画面のほうが使いやすいと思いました。運営の方がユーザーの声に耳を傾けてくださっていると感じ、FC2ブログへの信頼も増したように思います。

あとはAkiraさんが記事に書かれている、入力範囲の高さですね。旧管理画面の新投稿画面に慣れてしまった今となっては、もうちょっと下まで…!と思ってしまいます。ご意見出して下さりありがとうございます。改善されることを期待します。

2021/03/20 (Sat) 13:27
vanillaice (Akira)
Akira
To bonさん

お返事遅くなりました (*_ _)

そうですね。高さ欲しいですよね ^^;
以前の形だとデフォルトモード利用者さんにはちょっと辛かったのではないかな、と思います。
WYSIWYGの場合はhtmlモードのように任意改行での目線調整ができないので、画面の最下部で入力せざるを得ませんでしたよね。
今はWYSIWYG・htmlともに目線自体の調整はできますが、いかんせん高さ足りない ^^;

2021/03/22 (Mon) 22:52

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

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

FC2ブログのあれこれ