はてなブックマーク

こんにちは　ホネ吉です。今回はコーディングを行う上で便利なJSをご紹介します。 WordpressなどのCMSで記事にアイキャッチを設定する場合、システム構築者は縦長、横長などどんな画像にも対応できるようにコーディングする必要があります。 「object-fit」プロパティは画像を中央位置でトリミングしたり、画像を指定の枠内に縦横比を維持したまま納めたりと便利なプロパティなのですが、残念なことにIE/Edgeに対応していません。 今回紹介する「object fit images」は導入することでIE・Edgeでも「object fit」プロパティを使用可能になるとても有難いプラグインです。 導入方法 1.ファイルの読み込み Github 上記のGithubからobject-fit-imagesのファイルをダウンロードします。(ファイルパス：dist/ofi.min.js) ダウンロードした

こんにちは。 今日の記事は、私ちーかわが担当します。 ついこの間、スマホをiphoneからandroidに機種変したんですが、最近はスマホもタブレットもサイズがありすぎてデザインする側も大変な時代になってきたなと思う今日この頃です。 ってことで、今更ながらレスポンシブデザインとリキッドデザインについて一悶着あったので私なりにまとめてみようかと思います。 そもそもレスポンシブデザインって何だ？ 最近のサイトは、大体がこの手法で制作されているのではと思います。 そもそもレスポンシブとは、googleではこのように定義されていました。 ユーザーのデバイス（パソコン、タブレット、モバイル、非視覚的ブラウザ）に関係なく、同じ URL で同じ HTML コードを配信しますが、画面サイズに応じて（つまり「レスポンシブ」に）レンダリングを変えることができます。 引用：https://developers.

鳥獣戯画からインスパイアを受けたAdobeの新フォント 今気になっているフォントがあります。 Adobeが先月28日に発表したばかりの、まだまだ新しいフォントです。 江戸時代の瓦版印刷に見える運筆の特徴も取り入れ、それに丸みを加えた 「かわいくも妖（あや）しい」がコンセプトの【貂明朝（てんみんちょう）】。 鳥獣戯画などに描かれた愛らしい小動物の姿にもインスパイアされたというこのフォントは 日本の伝統美術の要素を取り入れ背景が暗い場合でも視認性が高く、書籍の装丁などの見出しに最適としているそうです。 隠し文字も妖しカワイイ！ 貂明朝の「貂」（てん）はイタチ科の哺乳動物の意味を持ちます。 貂明朝の中にはSVGイタチ科の哺乳動物「貂」（てん）の姿をしたグリフも隠されています。 貂明朝には、最新の常用漢字・人名用漢字を含む約6500文字、イタリック体を含むフルセットの欧文グリフ約2100文字、かな

SEO対策を行い、Googleの検索結果では1ページ目に表示されているのに、アクセス数があまり増えないと思うことは ありませんか？ 検索結果の1ページ目に表示されれば、アクセス数が増えると期待した方も多くいると思います。 再度順位をよく確認してみてください。 あなたのサイトは、検索結果の1ページ目のどこの位置（順位）に表示されていますか？ もし、1番目（1位）に表示されているのであれば、対策しているキーワードなどを見直す必要があるでしょう。 残念ながら、10番目（10位）に表示されているのであれば、1番目を目指してさらに対策を施してみる必要がありそうです。 なぜかというと、検索結果の1ページ目に表示されていても、表示されている位置が1番目と10番目では、クリックされる確率が大きく変わるからです。 「Internet Marketing Ninjas」より、2017年度のGoogle検索結果