タグ

2018年2月17日のブックマーク (7件)

  • oEmbed APIの使い方まとめ!URLから埋め込みHTMLタグを作ろう!

    oEmbedとは、埋め込み用コードを取得するためのシステム、統一規格です。TwitterやYoutube、Vimeoなどといった世界的に有名なwebサービスの各々がこのoEmbedの規格を採用しています。 統一規格ってどういうこと?統一規格があることで、web開発者はoEmbedの仕様だけを知っておけば、「個別に各サービスの仕様を調べる」といった学習コストをかけることなく、様々なサービスの埋め込み用コンテンツを利用することができるわけです。 2014年9月には日で人気のブログサービスはてなブログが、このoEmbedの規格を採用して、ブログ記事の埋め込み用コードを取得するAPIを公開しました。採用するサービスが増えれば増えるほど、web開発者にとって好ましい環境が整っていくというわけですね。

    oEmbed APIの使い方まとめ!URLから埋め込みHTMLタグを作ろう!
    jed_lee
    jed_lee 2018/02/17
    oEmbed APIについてのまとめ。自分用おさらい的にメモ。
  • Zurb Foundation 6 を使うとサイト構築がとっても楽ちん - 楽しい!わんわん動植物園

    ※ 当記事はFoundation 6.2時代に書かれたものです。現在のバージョンではXY-Gridが導入され、そちらを使用することが推奨されます。 記事はZurb Foundation 6についての解説書です。 筆者はCSSフレームワークを触ったことがない状態から1年間Foundation 6を試行錯誤している状態です。まだ使いこなせていない機能が幾つかありますが、Foundationは作業効率を上げるのに十分な力を持っているフレームワークです。 既存WebサイトにFoundationが使用され困っている人や、Foundationを使用して制作をする人に活用していただけば幸いです。 記事ではCSSフレームワークについては簡単な説明をしますが、Foundationはバックエンドのフレームワークに比べて簡単なため、Foundation 6の主な記法と、メリットが大きい機能を中心に解説します

    jed_lee
    jed_lee 2018/02/17
    Bootstrapに次いでそこそこ著名なCSSフレームワークZurb Foundationの紹介記事。
  • Bootstrapだけじゃない!2017年のCSSフレームワークベスト5

    WebサービスUIやサイト制作のベースに使えるCSSフレームワーク。Bootstrapが代表的ですが、ほかにも人気のフレームワークをピックアップして紹介します。 CSSフロントエンドフレームワークは百花繚乱です。しかし当に優れたものだけに絞り込むことは可能です。 この記事では、私が考える「現在のフレームワークのベスト5」を比較します。強みと弱み、向いている分野があるので、プロジェクトで求めるものに応じて使い分けてください。プロジェクトが単純なら、複雑なフレームワークは不要です。また大半はモジュールベースですから、必要なコンポーネントを選んで使うか、別々のフレームワークのコンポーネントを併用することもできます。 紹介するフレームワークはGitHubの評価を基にしているので、最初に紹介するのは、もちろん一番人気のBootstrapです。 注:紹介する情報の一部は翌週ないし翌月には古くなっ

    Bootstrapだけじゃない!2017年のCSSフレームワークベスト5
    jed_lee
    jed_lee 2018/02/17
    2017年の主なCSSフレームワーク。
  • これが欲しかった!記事上でリンクテキストをブログカードのように美しく見せることができるツール「embed.ly」|広報・マーケティング向けブログ|ネットPR.JP

    これが欲しかった!記事上でリンクテキストをブログカードのように美しく見せることができるツール「embed.ly」 ブログなどの記事投稿上で、テキストリンクを作ることは簡単なのですが、やや味気なく感じることはありませんか?だからといって、リンクテキストや画像をきれいに並べて記事上に配置するのも手間がかかります。 ブログ記事上で簡単にリンクを「はてなブログ」のブログカードのように見せてくれるツールはないかと探していたろころ、社内スタッフから「embed.ly」というサービスを教えてもらいました。これがとても簡単に、テキストリンクを見栄えの良いリンクに変えることができるツールだったのでご紹介します。 リンクURLを入れると自動的に画像、タイトル、文冒頭をブログカードみたいに見せてくれて記事内に挿入できる「embed.ly」 下記のリンクは、実際に「embed.ly」を使って表示しているリンクで

    これが欲しかった!記事上でリンクテキストをブログカードのように美しく見せることができるツール「embed.ly」|広報・マーケティング向けブログ|ネットPR.JP
    jed_lee
    jed_lee 2018/02/17
    少し前からたまに見かける「ブログカード」のカスタム版(?)的な「Embedly」について調査。oEmbed規格を利用しているので期待できるが、カスタマイズ制限など、ブログカード同様デメリットがある模様。
  • 「Embedly」他社サービスを紹介する際のレスポンシブ対応ブログカード作成サービス

    サイト内のコンテンツはNORILOGが独自に制作しています。メーカー等から商品提供を受けることもありますが、その場合は記事内に明記しております。コンテンツの内容や評価に関するランキングの決定には一切関与していません。メーカー等の指示による表示部分にはPRを表記します。記事内で紹介する商品を購入することで、当サイトに売り上げの一部が還元されることがあります。詳しくはサイト運営ポリシーをご覧ください。 最近ブログを書いている上でクールで便利な外部リンク作成ツールだと思ったものを紹介。 それが無料で使える「Embedly」(エンベッドリー)。 はてなのブログカードに近い感覚で記事を貼り付けられる上に、レスポンシブ対応ときたら・・・これはもう使わないという理由が見つかりません。しかし世界中には面白いWEBサービスがいろいろありますね!

    「Embedly」他社サービスを紹介する際のレスポンシブ対応ブログカード作成サービス
    jed_lee
    jed_lee 2018/02/17
    少し前からたまに見かける「ブログカード」のカスタム版(?)的な「Embedly」について調査。カスタマイズ制限など、ブログカード同様デメリットがある模様。
  • 新時代のブログカード「Embedly」がアツい!今までとはここが違う!! | KOTOBAKO - コトバコ

    ブロガーの皆さんも多く使ってるブログカード。もともとはてなブログカードが正しいんですかね。これねこれ。 僕のテーマでは相性が合わずプラグインが使えなかったのですが、先日お友達のシゲ(@piece_hairworks)さんにブックマークレットを教わってようやく使える様になったのです。 そんなようやく使えるようになったブログカードな訳ですが、いつのまにかブログカードに変わる新しいリンクが話題になってますね。こちらもブックマークレットでの作成ができます。 「Embedly」がアツい!! ブロガー界隈で話題になってる新時代のブログカード「Embedly」。色々なブログで取り上げられていますが、僕の敬愛して止まないOZPA(@OZPA)さんも紹介しておりました。 上の記事で紹介されている通り、ブックマークレットページの赤枠で囲ったボタンがブックマークレットのURL。好きな方法でブックマークに設定しち

    新時代のブログカード「Embedly」がアツい!今までとはここが違う!! | KOTOBAKO - コトバコ
    jed_lee
    jed_lee 2018/02/17
    少し前からたまに見かける「ブログカード」のカスタム版(?)的な「Embedly」について調査。カスタマイズ制限など、ブログカード同様デメリットがある模様。
  • 【PHP】HTML 内の OGP 情報を取得する | MEMO REAL

    RSS がない場合などで、リンク先のページ情報を表示する時などに HTML 内の OGP 情報を取得する方法です。 [PHP] $html = file_get_contents( 取得するページの URL ); preg_match_all( “<meta property=\”og:([^\”]+)\” content=\”([^\”]+)\”>”, $html, $ogp ); for( $i = 0; $i < count($ogp[1]); $i++ ) { $result[$ogp[1][$i]] = $ogp[2][$i]; } $title = $result[‘title’]; $url = $result[‘url’]; $image = $result[‘image’]; echo ‘<a href=”‘ . $url . ‘”><img src=”‘ . $imag

    jed_lee
    jed_lee 2018/02/17
    PHPで、任意URLで設定されているOGP情報を取得する記述。よく忘れるのでメモ。