tanayasu99(たなやす)です。
1つ前の記事で、Blogger(Google?)の中の人が、新しいインターフェースの変更内容が記されている投稿がありましたーという内容を書きました。その中で、興味の高い「画像を挿入」について、ボリュームが大きくなったので、本記事に記したいと思います。
参考：Blogger新しいインターフェースは、行間と改行その他変更をしたみたい
HTMLビューに「画像を挿入」ボタンが追加された
ついに、念願の機能が復活しました。素晴らしい。よくぞ、追加(復活)させた！！と、喜ぶのはまだ早いか...どう機能してくれるのか、警戒心をもって扱わねばならぬ。
メニューの右端に2つアイコンが増えました。 
「画像を挿入」機能を試す
今回は、「画像を挿入」に注目していきます。さっそく、画像を挿入してみます。「画像を挿入」→「Blogger」...既にBlogger経由でアップロード済みの画像を再利用するという想定実験です。
この画面に遷移するのですが、画像の枚数が多いせいか読み込みに時間がかかります。30秒ぐらい待ったような。遅すぎるとPageSpeed Insightsさんに怒られますよ？
画像をたくさん載せる人は、Bloggerに向かないのでは...と思わせるほど遅いです。Blogger経由で画像をアップしなければ良さそうですが、なんだか本末転倒な気がします。どんな日付の画像でも、1つのBloggerフォルダ内に突っ込むような仕様になっているから、読み込みに時間がかかっているのだと思う。
これは変わらないんだろうなぁ。Androidカメラもそうだけど、なんで日付別にフォルダ作成しない仕様が流行るのかね。1つのフォルダに1000枚超の画像が保存されていくと、そのフォルダを読み込むのに時間がかかるし、バックアップもやりにくいんだよなぁ。
Androidの場合、キャッシュ(一時保存)しまくりで、読み込みにかかる時間を速くしているようだが、キャッシュしている分は容量が圧迫していることは気付きにくい。。。
無事に読み込まれ、載せたい画像を選択する画面。複数選択を出来るのは、ありがたい。
が、しかし、選択した順番が分からなくなることがあるんじゃないかと。チェックマークだけでは信用できないというのもあるが。LINEとかだと、選択した順番どおりに番号が表示されます。改良しがいのある案件だと思うけどなぁ。
画像を選択した後の画面。「レイアウトの選択」画面が表示されている！！素晴らしい。ちなみに、作成ビューでは表示されませんでした。
HTMLコードにDIVタグが...。
そして、相変わらず長い画像URLです。画像のサイズに関係なく、このURLの長さなので、1つの記事で画像を使いまくると、それだけでHTMLのサイズが膨れてしまい、とある評価・検証サイトで「HTMLが長すぎます」という警告を頂けます(笑)。
そうなるには100枚以上の画像が必要だったのでレアケースかなぁ。気にするほどではないかも。
複数の画像を横に並べたい
案の定、複数の画像は横並びに出来ません。画像が大きくて横並びに出来ないのかもと思って、画像を小さく表示させてみましたが関係ありませんでした。
style属性の「clear: both;」って、すべての回り込み解除っぽいので、横並びになってくれも良いと思うのですが、出来ませんね。
試しに、3つすべての画像(DIV)を「float: left;」に変更してみた。
なんか惜しいことに(笑)。
その文字は回り込みさせたくないので、3つ目の画像(DIV)だけ、「float: none;」にしてみたら、回り込みはされなくなりましたが...。
なぜ、そこから文字が再開されるのか分かりませんでした。
3つ目の画像(DIV)も「float: left;」にし、次の文字にDIVタグstyle属性「clear: both;」を持たせてみたら、理想どおりとなりました。
画像を挿入した時に、自動で付いてくるclass属性の「class="separator"」が読み込んでいる内容なのかな...。「display: block」が関係しているのかと思いましたが、blockをinlineに変更しても、期待したものにはなりませんでした(2個前の並びと同じ)。
まとめると...
画像を横並びにしたい場合、画像を挿入した後にHTMLコードを編集しなければならない・挿入した各画像に自動付加されるDIVタグ内にある「clear: both;」を「float: left;」に変更する。
・最後の画像の後にある文字列を「clear: both;」をDIVタグstyle属性で持たせる。
まだ、半自動化させることが出来る内容なので、そこまで面倒な作業ではないかなぁ。調べるのは、めんどくさかった...。
ちなみに、ここまでHTMLビューをメインで使っているとこうなります。HTMLビューで投稿文章を書くのは、かなりストレスになりそうです。
従来インターフェースのHTMLビューなら、Enterキーによる改行のたびに、自動(見えない形)で<br />が付加されていました。新しいインターフェースでは、そうならないみたい。なにか方法があるのかなぁ(Shift＋Enterキーでは変化無し)。
新しいインターフェースの作成ビューで改行すると、DIVだらけに...そうかShiftキーを押しながらの改行なら、brタグが生成されるはずかと、期待したのだが...。さっきは深く考えなかったのだが、どうやら、<br />と がセットで付加されるみたい。
しかも、作成ビューやプレビューで見ると、半角スペース分空いてしまっていた。さすが、強制半角スペース...おそるべし。いや、一緒に付加してくるヘンテコな仕様が恐ろしいのだ。
って、警戒していたら、再現しなくなった( ,,`･ω･´)ﾝﾝﾝ？
後記
ユーザーの意見が聞き入れられたのは、「いったん古いシステムに戻した」という英断みたいなことがあったからですかねー。結局、モバイル向けに表示出来るようになったものの、すべての機能がモバイルで使い易いかというとそうでもない。そもそも、本当にその目的メインで進んでいたかどうかすら疑わしい。
だって、新しいインターフェース(作成ビュー)の「画像を挿入」の機能に、画像ファイルをドラッグアンドドロップで追加させることが出来るようになっていたからだ。これって、モバイルではなく、パソコン向けでしょ？っていう機能。
「古いシステムに戻した」という宣言と共に、使えなくなったようです。余計なことをするなとは思わないが、モバイル向けも絡めて活きる改善内容は、いくらでもあると思う。
表示速度とかではなく、もっと骨太でやりがいのある内容が。。。それに気付いているけど技術的に無理なのか、そもそも気付いていないのか...頑張れチームBlogger！！
おわり。
↓これをクリックすると、私のやる気が出ます。ブログ村が開かれるようになっていますが閉じて良いみたいです。よろしくお願いします。
0 件のコメント:
コメントを投稿