島のWeb屋より
  • 18Apr
    • アメブロのプロフィールページが変更されました

      昨晩(2018/4/18)のメンテナンスで、予定されていたアメーバのプロフィールページの仕様変更が実施されたようです。『【プロフィール統合】メンテナンスのお知らせ 4月18日』いつもAmebaをご利用いただきありがとうございます。2018年4月18日(水)に実施予定のプロフィール統合のメンテナンスについてご案内いたします。<日時>2… スタッフブログ(当記事ではパソコン版のプロフィールについて書いてありますので、アプリ版などでは異なる部分があると思います。)新しいプロフィールページは、事前に告知されていたとおり・全体のデザインの変更・ヘッダー画像を表示できるようになった・設定できる項目が変わった・各項目の言い換え表現が廃止された・自己紹介やフリースペースでHTMLタグを使えなくなった・PCとスマートフォン、アプリのプロフィールが統合されたという仕様になっています。特にHTMLタグの件は、せっかく自分なりに、あるいは有料で業者に頼んでカスタマイズしたプロフィールページが素の状態にリセットされてしまいましたので残念に思っている方も多いかもしれませんね。また、以前はリンクにしてあった部分が素のテキストに変わっていたりしますので、リンクでも何でもないただの文字で「こちらをクリック」と書いてあったりしてちょっと間抜けな感じになっていることもありますので、一度ご自身のプロフィールページを確認しておいたほうが良いでしょう。その他の仕様変更また、アメーバさんらしく事前告知にはなかった(と思う)変更もあります。例えば・・・、URLが変わりました。以前は「http://profile.ameba.jp/~」でしたが、「https://profile.ameba.jp/ameba/~」となっています。旧URLにアクセスすると新URLへ自動転送されますので、過去のリンクを一つ一つ修正する必要はなさそうですが、今後は新しいURLを使うほうが良さそうですね。ちなみに、自分のプロフィールは「https://profile.ameba.jp/me」で表示できるようですが、人に伝える時にこちらを伝えてしまう間違いが増えそうですので気をつけましょう。レイアウトの変更はできなくなったようです以前は、プロフィールページに表示する項目や、それらの位置をある程度ユーザー側で指定できるようになっていましたが、どうやらできなくなったみたいですね。アメンバーを一切募集していなくてもアメンバーの一覧が表示されたりしますので、表示項目の選択くらいはできるようになってほしいと感じます。良いか悪いかは・・・僕はもともとあまりプロフィールページを重視していませんでしたので、個人的には影響はほとんどなく、なので、今回の変更が良いか悪いかの判断はあえてしないでおこうと思いますが、少なくとも、・運営側は色んな意味で管理がしやすくなった・デザインを壊されるなどして残念に思っているユーザーが多いんだろうなぁ、と思っています・・・みなさんはどう感じられたでしょう?

      118
      テーマ:
  • 24Mar
    • プロフィールの仕様変更について

      アメーバスタッフブログで、プロフィールに関する仕様変更の記事が出ていました。『【プロフィール統合】リリース日や統合に関する影響についてのご案内』いつもAmebaをご利用いただき、ありがとうございます。先日お伝えしたブログプロフィールとスマートフォンAmebaのプロフィールの統合に関して、リリース日や統… スタッフブログブログプロフィールとスマートフォン版のプロフィールの統合という趣旨で書かれた記事ですが、記事中に、・自己紹介とフリースペース欄へのhtmlタグの入力ができなくなります。という仕様変更の記述があります。恐らくこれにより、プロフィールページにヘッダー画像を付けたりメニューバーを設置したりと言った、プロフィールページのカスタマイズは不可能になるのではないかと思います。これらのカスタマイズを行っている方は、ある日突然プロフィールページがおかしくならないかチェックしておくほうが良いのではないでしょうか。

      102
      2
      テーマ:
  • 23Mar
    • 予定されているマイページの仕様変更の件

      アメーバスタッフブログで「マイページの仕様変更」について書かれていますが、なかなか攻めた(?)仕様変更ですね。まず、URLの「mypage」が「www」に変わるようです。そして、画面は、多くのユーザーがマイページのメインコンテンツと考えているであろうチェックリストはサイドバーに移動させて、メインカラムは概ね宣伝で埋め尽くす感じでしょうか??告知記事にはコメントやリブログもたくさんついていますが、ユーザーのこの反応を見ても本当にこの仕様変更を実施するのか・・・?ある意味ちょっと楽しみです。あと、別記事で「アメブロ以外のお気に入りの廃止」についても書かれていますが、廃止が決まってるのなら、10日くらい前に質問した時に「廃止予定です」と、ひとこと教えてくれれば↓こんな記事を書くこともなかったんですが・・・『WordPressを常時SSL化すると「アメブロ以外のお気に入り」に表示できなくなるかも?』WordPressなどのブログをやっていて、アメブロ内にファンの多い方は、下手に常時SSL化すると、アメブロ内のファンに更新情報が届かなくなる可能性があります… 島のWeb屋よりそれにしても、いつもながらアメブロの仕様変更にはいろいろと驚かされることが多いです。でもまあ、がんばってついて行ってみます(笑)

      64
      テーマ:
  • 14Mar
    • WordPressを常時SSL化すると「アメブロ以外のお気に入り」に表示できなくなるかも?

      WordPressなどのブログをやっていて、アメブロ内にファンの多い方は、下手に常時SSL化すると、アメブロ内のファンに更新情報が届かなくなる可能性がありますのでご注意を。アメーバのマイページに「アメブロ以外のお気に入り」というのがあります。その名の通り、アメブロ以外のブログ(も)更新情報を受信して知ることができるようになっている、いわゆるRSSリーダーと呼ばれるものの一つです。僕も、アメブロの運営母体であるサイバーエージェント社の開発関連の情報など、いろんなブログの更新情報を取れるよう設定しています。CyberAgent Developers Blog | サイバーエージェント デベロッパーズブログサイバーエージェントのエンジニア・クリエイター・テクニカルクリエイターが執筆する公式ブログです。サイバーエージェントの技術情報を日々発信していきます。ところが、最近、この「アメブロ以外のお気に入り」で更新情報を取得できないブログが増えています。ちょっと調べてみたところ、Let's Encryptという認証局で発行されるSSLの電子証明書を使ってサイトの通信を暗号化(常時SSL化)したWordPressなどの更新情報が「アメブロ以外のお気に入り」で取れなくなるようです。Let's Encryptは、無料で電子証明書を発行できるため、世界中でサイトをSSL化するためにこれを利用する人が急増中で、現状、個人が自分のWebサイトをSSL化する際は、第一候補、若しくは唯一の候補として名前が上がる認証局だと思います。Googleが色んな方法でサイトのSSL化を強く推進していますので、きっと、今後ますます増えるてくることでしょう。ですが、このLet's Encryptを使って常時SSL化してしまうと、どうやら「アメブロ以外のお気に入り」に更新情報が表示されなくなってしまいますので、アメブロ内にファンの多いWordPressサイトを運営されている方は、「アメブロ以外のお気に入り」に対応している他の有料の認証局を利用したほうが良いかもしれません。念のため、Let's Encryptの証明書を利用しているサイトを20サイト以上試してみましたが、全て登録できませんでしたので。まさかそんなことが!?と思ったんですが、そういうことのようです。ちなみに、有料を使えば必ず大丈夫か?と言うとそれもわかりませんので、既に大丈夫と分かっている認証局を調べて利用するほうが安全です。なお、念のため、この症状をアメーバの運営に連絡して対応を問い合わせてみたんですが・・・、「現状が仕様であり、今後対応の予定もない」との返信を受け取っています。対処法はあるか?では既にLet's Encryptで常時SSL化してしまった場合の対処法はあるか?というと、考え方しだいだと思いますが、あります。1.「アメブロ以外のお気に入り」なんか相手にしない2.更新情報(RSSフィードのみ)非SSLでも配信する(現状)3.トップページとRSSフィードを両方とも非SSLでも配信する(常時SSL化前の状態)4.「アメブロ以外のお気に入り」が対応している認証局に変える1は、まあそういうことです(汗)。多くの人はこの選択肢でOKだと思いますが、中にはそういうわけにも行かないという方もおられるでしょうから、その場合は2以降になります。2や3は、WordPressの方で少し設定(若しくはカスタマイズ)してやれば実現できます。2の場合は、http:の方のフィードURLを入力して貰えば登録可能、3の場合は、http:のトップページURLを入力して貰っても登録可能です。4はLet's Encryptを諦めて、有料の認証局に切り替える方法です。ただし、アメブロ側が対応している認証局がどれなのかがわかりませんので、利用する認証局が対応していることを事前に確認しておく必要があります。なんだか面倒ですね・・・ちなみに、僕の↓こちらのサイトもLet's Encryptを利用しましたが、2の方法を使って対応しました。アメブロカスタマイズ専科:新CSS編集用デザイン対応新タイプ(第2世代)のCSS編集用デザインに対応したアメブロカスタマイズ方法を分かりやすく解説します。初心者からコピペでできる方法もご紹介しています。本当は、アメーバの運営さんが対応してくれるのが一番ですが、対応予定はないとの答えをもらっていますので期待薄です。でもまぁ、アメーバさんなら、ある日コッソリ対応なんてこともあるかもしれませんので、ほんのちょっとだけ期待しておくことにしましょう(笑)

      79
      テーマ:
  • 15Feb
    • アメブロのヘッダーが消えた!!

      [お客さま]松本さん!大変です!アメブロのヘッダーが消えてしまいました!!という連絡があったので調べてみたら・・・またアメブロの仕様が変わったようですね。今回のお客さまからの連絡は、新CSS編集用デザインのPC(およびiPad)向けの画面でヘッダーのリンク先URLの記述方法が変わったのが原因でした。前は、//ameblo.jp/wazameba/のようになっていたと思いますが、それが、/wazamebaと、ホスト名を無くして、パスのみの指定に変わったようです。追記:2018/02/17現在 https://ameblo.jp/wazameba/にコッソリとまた変わっています・・・もちろん正しい指定で、間違ってはないんですが、敢えて変える意味はわかりません。「変えたい気分だったんですか?」と聞きたくなります(汗)あと、個人的に、最後に「/」がついてないのもちょっと不満・・・で、肝心のヘッダーが消えた件ですが、僕が別サイトで公開しているヘッダー画像の設置方法で、今回の仕様変更の影響が出てしまったためでした。アメブロにヘッダー画像を表示するカスタマイズ方法 アメブロにヘッダー画像を表示するカスタマイズ方法です。 新CSS編集用デザイン(新タイプ/第二世代)に対応しているカスタマイズ方法です。 ヘッダー画像はブログの看板…問題が出ていたのは、CSSの、.skin-bgHeader a {という行なんですが、これは既に修正したあとで、前は、.skin-bgHeader a[href*="//ameblo.jp/"] {としてありました。なぜこんな面倒くさい指定にしたのかはハッキリとは覚えていないのですが、公開当時は、単純に「.skin-bgHeader a {」としたのでは何か問題があったのだと思います。でも、HTMLを見る限り、現状では「.skin-bgHeader a {」で十分だと思いますので修正しました。もし同じやり方を使っていてヘッダー画像が消えてしまった方がおられましたら、ここを修正すれば直るかもしれませんので、よかったら参考になさって下さい。なお、このほかにも幾つも仕様変更がありましたので、カスタマイズに大きな影響がありそうな箇所を見つけたらまた書かせてもらいますね。それにしても、仕様変更する場合は事前にどこがどう変わるのかを教えてくれると助かるんですが・・・。そうはならないですかね・・・。

      106
      テーマ:
  • 14Feb
    • Instagramを貼り付けると禁止タグになってしまう・・・

      アメブロでInstagramを貼り付けできないトラブルが発生しているということなのでちょっと調べてみました。どうやらInstagram側の貼り付けタグが少し変わったんですかね?その新しい貼り付けタグにアメブロが対応できずに「禁止タグ」となってしまうみたいです。昨日今日とやってみたところ、時と場合によって新旧どちらのタグになるかよくわからない感じなので、今、切り替えをしている途中なのかもしれません。具体的には、貼り付けタグの一番最後の部分が<script async defer src="//www.instagram.com/embed.js"></script>となっているとダメなようなので、この部分を、<script async defer src="//platform.instagram.com/en_US/embeds.js"></script>に修正すると貼り付けできました。そのうちアメブロの方で新しいタグも貼り付け可能なようになると思いますが、「今すぐ貼り付けたいんだ!」という方は、試してみてください。追記:2018/03/06現在 、新しい方のタグでも使えるようになっています。いつの間にかアメブロの方で対応したようです。 #鮎屋の滝 #滝 #洲本市 #淡路島 #景観 #HDR #fall #landscape #awajishima #japan matsmotojpさん(@matsmotojp)がシェアした投稿 - 11月 9, 2017 at 6:45午前 PST

      56
      テーマ:
    • YouTube動画を画面サイズに合わせて自動調整するように貼り付ける

      アメブロにYouTube動画を貼り付けた時、記事幅に合わず右側に隙間ができたり、縦横比がうまく調整されずに上下左右に黒い帯が表示されたり、スマホで見たらはみ出したり・・・と、「なんだか不細工だなぁ・・・」と思ったので、画面のサイズ(記事の幅)に合わせて自動的にサイズが調整されるように貼り付けできないかやってみました。↓こんな感じです。PCでもスマホでも画面幅(記事幅)いっぱいに表示され、はみ出さず、上下左右に黒い帯もつかないのが目標です。たぶんできたと思いますが、どうでしょう?ちなみに、やり方は難しいと言うほどではありませんが、HTMLタグをかなりイジる必要があるので、残念ながらあまり簡単とまでは言えず、一般的ではないかもしれないです・・・あと、インラインスタイル(HTMLの属性にCSSを書く)を使うので、AMPには無力です(^_^;)一応、次期アメケアにはこの貼り付けができるよう機能を搭載しようと思います。

      27
      テーマ:
  • 13Feb
    • アメブロで吹き出しを使った会話風記事を書く

      読者さん松本さん!最近よく見る「吹き出し」を使った会話風の記事をアメブロで書きたいんですが難しいですか?まつもとそうですね・・・CSSを使えば、PC向け画面で吹き出しを表示するのはそれほど難しくはないと思いますが、アメブロの場合、スマホ向け画面にはCSSでのカスタマイズが効かないのでちょっと面倒ですね。読者さんでも、ぜひやってみたいんですが・・・やっぱり無理でしょうか?まつもと無理ということではありません。例えば、スマホでも表示できる「吹き出し風の囲み枠」のようなタグを準備しておいて、それを使ってやれば可能ですね。読者さんできるんですね!! まつもとはい。ただしAMPには対応できませんので、スマホでGoogle検索から来てくれた人にはやっぱり吹き出しは表示されないことになります。読者さんそうなんですか・・・ちなみに、AMPではどんなふうに表示されるんですか?まつもとどんな囲み枠タグを用意するかにもよりますが・・・例えば↓こんな感じですね。この記事のAMP向けページ読者さん・・・やっぱり、せめて記事内だけでもカスタマイズできるようにスマホやAMPにもCSSを用意してほしいですね。まつもとはい。本当にそう思いますね。

      70
      テーマ:
  • 09Feb
    • アメブロをGoogleにインデックスさせないことができるか?

      普通の人はあまりやりたくないだろうなと思う実験をしてみました。きっかけは、「自分のアメブロをGoogleに表示させたくないとき『フリープラグインにmeta noindexを書けば良い』という話を聞いたんですが、本当ですか?」という内容の質問をいただいたことです。<meta>タグは、<head>タグ内入れるのがルールなので、<head>タグ内を弄れないアメブロでは「noindex」にできないと思っていたのですが、そんなことってあるのでしょうか?・・・質問を頂いた時点でハッキリと回答できる材料を持っていなかったので、当アメブロで実験してみることにした。具体的には、2/1にフリープラグインに以下のタグを追加してGoogleからのアクセス流入と、インデックスの状況を観察しました。<meta name="robots" content="noindex,follow">これでGoogleからのアクセス流入がなくなっていき、当アメブロがGoogleの検索結果から消えていけばその通り、そうでなければデマということで。さて、約1週間経過してどうなったかと言うと・・・・・・Googleからの流入が急降下中です。また、当アメブロのトップページや、実験前にGoogleからのアクセス流入が最も多かった記事のインデックスが削除されたようで、キーワードで検索しても、URLで検索してもGoogleの検索結果に出なくなりました(汗)というわけで、今のところ・・・「アメブロをGoogleで表示させたくないとき『フリープラグインにmeta noindexを書けば良い』という話は本当らしい」と言えそうです。(→追記あり:その後、大きく変わりました)ただし、フリープラグインはモバイル向けページには反映されないため、既に導入が始まったとも言われるGoogleのモバイルファーストインデックスが本格化してくると、この方法は無効になるのではないかと予想しています。■2018/02/15追記:一時はGoogleからのアクセス流入がゼロまで落ち、検索結果を見る限りインデックスもほぼ無くなったように見えたんですが、その後少しずつGoogleからアクセスが復活してきました。また、Googleで検索してみると、トップページや記事が検索結果に出るようになってきましたので、インデックスも復活してきているようです。原因はわかりませんが、結局この方法で確実にGoogleのインデックスから消すことはできそうもないという結論になりそうです。もしかすると、有効であったものが、モバイルファーストインデックスが始まったなど、Googleの仕様が変わったことで無効になった可能性もありますが、定かではありません。■2018/02/16追記:昨日よりもさらに多くのページがGoogleの検索結果に上がってくるようになりました。ですので、現時点では、当記事のタグをフリープラグインに入れても「Googleにインデックスさせないことはできない」のは確実と言えそうです。というわけで、意味がなくなったと思えるタグは外しました。それにしても、当初はどんどんインデックスが減っていったのに、突然再度インデックスされ始めたのは、やはりGoogle側でインデックスするかどうかの判断が変わったということでしょうかね?

      72
      2
      テーマ:
  • 29Jan
    • 新タグ編集エディタが正式リリースされて

      スタッフブログの12月20日の記事のとおり、今日、タグ編集エディタが旧タイプが無くなり、新タイプだけに変わりました。この新しいタグ編集エディタは、↑スタッフブログの記事のコメントを見る限り、かなり不評のようですね・・・。新タグ編集エディタは、・旧でHTML5で使えないタグを吐いていたボタンが修正された・画像のアップロードが素早く簡単にできるようになった・記事を書くのに時間がかかっても「現在時刻」で投稿できるようになった・記事作成中に閉じてしまっても自動バックアップから復元できるようになったなど、良いところもたくさんあるのですが、今現在のパソコンの画面解像度として最も一般的な(だと思う)1366x768のモニターで使った時、ページ内のレイアウトが妙に中途半端で収まりが悪く、とても使いにくいと僕も感じました。これ、個人的に「もっと大きな画面で使う」ことを想定して画面デザインが考えられているからではないかと思っています。実は僕はプログラミングをする事もあって、ふだん、ノートPCに1920x1200という解像度の比較的大きめの外付けモニターを接続して使っていますが、これだと必要なものが概ね画面内におさまるからか、旧タイプのタグ編集エディタよりも使いやすく感じています。でも、実際は僕みたいなのはレアケースだと思うので、やっぱり、最も多く使われる画面サイズで使いやすくなるよう作るのが、ユーザー目線なんでしょうね。ちなみに、僕が使っているのは↓こちらで買ったEIZOの中古モニターEIZO FlexScan S2243W-HX 22インチ 1920x1200 WUXGA(中古)使用1000時間未満の、新品か?と思うようなものが、2万円くらいの破格値でした。僕が買ったのはもう数年前ですが、今でも売っているようですし、探せばもっと新しいタイプの良いモニターが見つかるかもしれませんね。

      94
      2
      テーマ: