はてなブログ開発ブログ

はてなブログからの公式のお知らせを発信します。

はてなフォトライフの画像を表示する際に、画面にズレが生じないよう変更しました

本日、はてなフォトライフの画像をはてなブログに貼り付けた場合に、画像表示時に画面にズレ(レイアウトシフト)が生じないよう変更しました。

この変更により、画面をスクロールした際に、後から画像の読み込みが行われ、閲覧中の領域が下にずれてしまう、という問題を回避することができます。

f:id:hatenablog:20210513145512p:plain

また、この変更に合わせて画像の遅延読み込み(lazy load)にも対応し、画像をたくさん掲載したブログでも快適に閲覧できるようになりました*1

なお、本変更が適用されるのは、本機能リリース後に投稿されたエントリのみとなります。過去に投稿されたエントリへの適用方法については、下記をご参照ください。

過去に貼り付けたフォトライフの画像について

編集モード「はてな記法」「Markdown」をご利用の記事については、記事を更新していただくと、自動的に本変更が適用されます。*2

編集モード「見たまま」で投稿された記事については、仕様上記事の再投稿を行っても本変更は適用されません。同じ画像を編集サイドバーから貼り付け直していただくか、「HTML編集」タブを開き、以下のようにimgタグのwidth,height属性に画像のサイズ情報を入力いただく必要がございます。

  • 変更前のimgタグ
    • <img src="https://cdn-ak.f.st-hatena.com/images/fotolife/s/sample/20210101/20210101000000.jpg" alt="f:id:sample:20210101000000:plain" title="" class="hatena-fotolife" itemprop="image" />
  • 変更後のimgタグ(赤背景が変更点)
    • <img src="https://cdn-ak.f.st-hatena.com/images/fotolife/s/sample/20210101/20210101000000.jpg" alt="f:id:sample:20210101000000:plain" title="" class="hatena-fotolife" itemprop="image" width=”画像の幅(数字が入ります)" height=”画像の高さ(数字が入ります)” loading="lazy" />

お手数をおかけいたしますが、ご理解いただけますと幸いです。

画像が誤った縦横比で表示されてしまう場合

本変更の影響で、ユーザーが作成したテーマを利用している場合、画像が誤った縦横比で表示されてしまう可能性があります。

そのような問題が発生した場合、下記の窓口より、問題が発生したテーマの情報とともにご連絡いただけますと幸いです。表示崩れを回避するには一時的に別のテーマへの変更をご検討ください。
お問い合わせ

*1:Safariなどloading属性による遅延読み込みに対応していないブラウザではご利用いただけません

*2:なお、必要に応じて、はてなにて表示用のHTMLの再生成を行う場合があり、その際には本変更が自動で適用されます

アドレスバーに “entry.new” と入力すると、はてなブログの記事が書けるようになりました!

本日より、ブラウザのアドレスバーにentry.newと入力してアクセスすると、はてなブログの記事編集画面に転送されるようになりました。

ブラウザでネットサーフィンをしていて、ふと日記を書きたくなった時、記事のアイデアを思いついた時などに、素早く記事編集画面にアクセスし、記事を書き始めることができます。どうぞご利用ください。

なお、複数のブログを開設している場合、メインブログに設定しているブログの記事編集画面が表示されます。投稿先をお間違えにならないようにご注意ください。

あわせて利用すると便利な機能

  • キーボードショートカットで下書き保存
    • 編集画面へのアクセスから、下書き保存までキーボードのみで素早く完結させられます。ブログ記事のアイデア保存に最適です

記事編集画面内で、誰でも簡単に「アイキャッチ画像」を作れるようにしました

はてなブログでは、記事編集画面(PC版)内で、記事のアイキャッチ画像を作成・編集できるようにしました。専用ソフトや技術がなくても100種類のテンプレートから選んで編集でき、オリジナリティを出したい方は自分でゼロから作成することもできます。グラフィックデザインプラットフォーム「Canva*1」による「Canvaボタン*2」を使った機能です。

このアイキャッチ画像は「Canva」で作成しました

使い方

記事編集画面(PC版)の編集サイドバーから「アイキャッチ画像を作る」を押してください。

f:id:hatenablog:20210215190427p:plain:w300

Canvaの編集画面がその場で開きます。まずはCanvaのアカウントを作成し、ログインしてください(GoogleやFacebookアカウントでも登録できます)

好みのテンプレートを選択して編集するか、ゼロから画像を作成してください。画像の編集が終わったら、右上の「完了」ボタンで保存をすると、自動ではてなフォトライフにアップロードします。

f:id:hatenablog:20210215190500p:plain:w300

アップロード後、本文の先頭にフォトライフ記法が挿入されます。その画像がアイキャッチ画像として設定されていることをご確認ください。

再編集する場合

Canvaでアイキャッチ画像の作成が完了し、はてなフォトライフにアップロードされた後、同一セッション中に再度「アイキャッチ画像を作る」ボタンを押すと、直前に作成した画像を再編集できます。一度ブラウザを閉じるなど、セッションが途切れた場合は再編集できませんのでご注意ください。

アイキャッチ画像のテンプレートは100種類!

本機能の公開にともない、Canvaに「はてなブログのアイキャッチ画像のテンプレート」を100種類ご用意いただきました。

以下のCanvaの公式記事にて、詳しい画像の編集方法を解説しています。こちらも合わせてご覧ください
はてなブログのアイキャッチ画像はCanvaにお任せ!目を惹くアイキャッチ画像の作り方

記事にタグをつけられるようにしました(過去記事も新規投稿も対象のキャンペーン実施中!)

はてなブログでは、PC版の記事編集画面で、記事に任意のタグ(はてなブログ タグ)をつけられるようにしました。

記事にタグをつけられるようにしました

はてなブログ タグ*1は、“言葉”にまつわるネット上の意見や感想に出会える機能です。記事にタグをつけることで、同じ趣味の人や興味のある人に読んでもらいやすくなります

記事にタグをつけたイメージ
記事にタグをつけたイメージ

タグの追加、編集方法

記事編集画面(PC版)の左下にある「タグをつける」から任意の言葉をタグとしてつけられます。記事の内容に沿った、読者が理解しやすいタグを選ぶことをおすすめします。ガイドラインをお読みいただいた上で、ルールを守ってご利用ください。

記事にタグをつける
「タグをつける」から任意の言葉をつける

※タグは1記事当たり最大10件まで、1つのタグの文字数は32文字まで設定可能です。

タグをつけて #はてなブログで教えて ! 過去記事でも新規投稿でも参加できるキャンペーン実施中

本機能の公開にあわせ、1ヶ月間のキャンペーンを実施! 詳しくは以下のキャンペーン告知をご覧ください。

はてなブログ タグについて

はてなブログ タグは、はてなブログ・はてなブックマークのコンテンツを活用し、ある言葉についてネット上の意見や感想を知ることができる機能です。

どうぞご利用ください。

はてなブログの法人利用を気軽に。「はてなブログBusiness」プランの提供を開始しました【今なら永年割引キャンペーン中】

法人利用3つのプラン

本日、スタートアップ企業やスモールビジネスを手掛ける企業の方に「はてなブログ」を法人利用いただける「はてなブログBusiness」プランの提供を開始しました。2020年10月27日(火)までに利用開始すると解約まで永年割引になるキャンペーンも同時に開始しています。キャンペーン価格など詳しくは、以下の法人向けプランページをご参照ください。

はてなブログBusinessとは

コンテンツマーケティングの一環として、法人が「企業ブログ」を活用した情報発信を行うケースが増えてきました。「はてなブログBusiness」を活用することで、気軽に企業ブログを始めていただけます。

これまではてなブログでは、個人向け営利利用*1を認めており、法人向けには「はてなブログMedia*2」というプランをご用意しておりました。はてなブログMediaは、本格的なオウンドメディア運営に取り組む企業向けCMSとしてご愛顧いただいておりますが、その機能を絞り、より低コストで導入いただけるプランをご用意しました。

「はてなブログPro」や「はてなブログMedia」との違い

「はてなブログPro」や「はてなブログMedia」など各種プランの違い

詳しい機能比較は、はてなブログの法人向けプランページをご覧ください。

はてなブログBusinessの「サブディレクトリオプション」は提供対象を限定したβ版運用中です。サブディレクトリオプションを利用する場合には、キャンペーン価格の適用はありません。ご利用を希望される場合は、以下よりお申し込みください。

※先行β利用お申し込みより先にはてなブログBusinessプランを開始しないようにご注意ください。

参考記事

本プランの提供に合わせ、はてなが考える企業ブログのこれからの情報発信についての記事を2本公開しました。企業ブログオウンドメディアにお悩みの方は、ぜひこちらもご参照ください。

はてなブログ for DevBlog プラン

「はてなブログ for DevBlog 」プランは、法人が自社の技術的な取り組みや成果、知見等を発信するブログに限定したプランです。これまでは個人向けはてなブログのプランでの利用を許諾しておりましたが、法人向けのプランとして新設しました。

はてなブログが本プランを提供する主旨やより詳しい利用条件については、下記のガイドラインをご参照ください。

※採用メディアとして活用する場合は、採用向けオウンドメディアプラン*3やはてなブログBusinessプランのご利用をご検討ください。

新しく提供開始した「はてなブログBusiness」「はてなブログ for DevBlog」プランをどうぞご利用ください。

よくある質問

個人事業主やフリーランスは、どのプランを利用すると良いでしょうか?

個人事業主やフリーランスにつきましては、法人ではありませんので、個人向けの無料プランやはてなブログProをご利用いただいて問題ありません。より詳しい利用条件につきましては個人営利利用ガイドラインをご確認ください。

なお、提供予定のはてなブログBusinessのサブディレクトリオプションをご利用になりたい場合には、はてなブログBusinessをご利用いただくことも可能です。

これまで、法人として、「はてなブログPro」プランや「技術ブログ」として利用していましたが、今回のプラン提供で、それぞれ法人向けのプランに移行しなければならないのでしょうか?

法人がはてなブログをご利用になる場合、原則として、法人向けのプランに加入いただく必要がありますので、移行をご検討ください。

なお、提供開始以前のはてな利用規約やはてなブログ利用ガイドラインでは、原則として法人によるはてなブログの利用ははてなブログMediaに限定しておりましたが、はてなブログBusinessプラン、及びはてなブログ for DevBlog の提供にあたり、既にはてなブログを開設されていた法人ユーザー様については、2021年3月17日までの期間を、適切なプランへ移行する猶予期間と致します。猶予期間を過ぎた後も、他ガイドラインに違反していない場合は、即時の利用制限措置などはとらず、ご登録メールアドレスあての注意勧告として移行を促します。

法人利用ガイドラインの新設と各種ガイドラインの改訂

今回のリリースに合わせて、法人利用ガイドラインを新設いたしました。法人がはてなブログを利用する際のルールなどを記載しておりますので、ご利用の際には必ずご確認ください。

また、「はてなブログのガイドライン」及び「はてなブログ個人営利利用ガイドライン」についても、法人向けプランの追加に伴い変更を加えています。

更新フィードで記事の概要のみを配信できるようにしました(はてなブログPro)

はてなブログでは、有料オプション「はてなブログPro」利用者向けに、RSSやAtomなどの更新フィードで、記事の概要のみを配信できる機能をリリースしました。
これまでは、全文配信のみで提供してまいりましたが、はてなブログProをご自身のメディアとして自由に構築する際には、更新フィードの配信内容は利用者が選択できるべきと判断を変更し、提供することとしました。
ご要望いただいたユーザーの皆さま、ありがとうございました。

更新フィードの配信設定

ブログの詳細設定から更新フィードの配信設定を変更することができます。

設定 >詳細設定>フィードの配信方法

f:id:hatenablog:20200831174257p:plain

「フィードでは概要のみを配信する」にチェック入れ、「変更する」ボタンを押して設定を変更すると、概要のみの配信が可能となります。なお、初期設定では、チェックが入っておらず、全文を配信しています。
記事の概要については、記事の編集オプションで入力ができ、未入力の場合は記事本文の冒頭が抜粋されフィードで配信されます。

iPhone・iPadアプリで、新規ユーザー登録・ログイン時に「Appleでサインイン」をご利用いただけるようになりました

本日、iPhone・iPadアプリ「はてなブログ」のバージョン4.16をリリースしました。

iPhone・iPadアプリから新しくはてなユーザー登録する際に、Apple IDをご利用いただけるようになりました。ユーザー登録時にApple IDと連携することで、ワンタップで簡単にログインできます。

Apple IDを利用して、はてなユーザー登録・ログインするには?

はてなユーザー登録時にApple IDを利用する
  • 最新バージョンのiOSアプリのログイン画面で、「Appleでサインイン」をタップします
    • Apple IDの2ファクタ認証が有効になっている必要があります。デバイスの「設定」>「[ユーザ名]」>「パスワードとセキュリティ」から2ファクタ認証を有効化してください
  • Apple IDの確認画面でメールの共有設定を確認し、[続ける]をタップしてサインインします
    • 必要に応じて「メールを共有」または「メールを非公開」を設定してください
    • メールを非公開」を選択した場合、ランダムなメールアドレスでユーザー登録できます*1*2
  • はてなユーザー登録画面に、Apple IDの「メールアドレス」が入力されます。必要な項目を入力・編集し、ユーザー登録を完了します
Apple IDを利用してログインする
  • はてなユーザー登録後、ログイン画面で「Appleでサインイン」を選択するだけで、登録したはてなIDでログインが完了します

注意事項(2020年6月29日現在)

  • Apple IDのみで、はてなのサービスのログイン機能はご利用いただけません。ユーザー登録時にはてなIDも合わせて作成いただく必要があります
    • メールを非公開」を選択して生成された「ランダムなメールアドレス」を使ってユーザー登録しても、登録完了メールやその他お知らせはApple IDの個人用メールアドレスに転送されます
  • 「Appleでサインイン」は、新規にユーザー登録する場合のみ利用いただけます。現時点では、すでに登録済みのはてなIDには連携いただけません
  • 「Appleでサインイン」は、iOS 13以上にのみ対応しています(「Apple でサインイン」の使い方 - Apple サポート
    • iOS 13未満をご利用の場合、はてなIDを作成いただくか、「Googleでサインイン」をご利用ください
  • 現時点では、Web版は「Appleでサインイン」を使ったユーザー登録・ログインに対応していません
    • Web版をご利用いただく場合、はてなIDとパスワードで直接ログインするか、「Googleでサインイン」をご利用ください
  • Apple IDの設定画面から[Apple IDの使用を停止する]を選択し、Apple IDとはてなブックマークの連携を解除しても、はてなIDは削除されません
    • 一度連携したはてなIDを退会しない限り、ユーザー登録時に連携したApple IDで「Appleでサインイン」を行うことで、同一のはてなIDにログインできてしまうことをご留意ください

*1:「メールを非公開」を選択してランダムなメールアドレスで登録いただいた場合、はてなからのメールの送信元ドメインが「@hatena.ne.jp」ではなく「@privaterelay.appleid.com」になります。予めご留意いただければ幸いです。

*2:iOSアプリの[不具合報告・ご意見]からメールでお問い合わせいただくと、送信元にランダムなメールアドレスを指定いただけません。メールアドレスを非公開にしたお問い合わせをご希望の場合、大変お手数ですがPC・スマホブラウザから「お問い合わせ」をご利用いただけますと幸いです。