サイト構築
CSSの「calc()関数」を使ったレスポンシブ対応のレイアウトで高さを最適化するテクニック
Post on:2018年11月14日
レスポンシブ対応のレイアウトを実装する際に手間なのは、ブレイクポイントの定義です。ここ1,2年でもたくさんのデバイスがリリースされ、それに伴いスクリーンサイズの種類も増えてきました。 そんな時に便利なのがCSSの「cal […]
Adobe公式の最新版！Adobe XDで使用できるすべてのショートカットが一枚にまとめられたチートシート
Post on:2018年11月13日
Adobe XDで使用できるすべてのショートカットが一枚にまとめられたチートシートを紹介します。 基本操作は他のAdobe系アプリのと同じですが、リピートグリッド（command+R）など独自のショートカットもあります。 […]
円グラフや棒グラフをわずか数クリックで、簡単に作成できる無料オンラインツール -Chartify
Post on:2018年11月13日
数字のデータを見せたい時は数字を並べるだけでなく、グラフやチャートを使用すると、分かりやすく、非常にインパクトがあります。プレゼンをはじめ、ソーシャルメディアでの共有にもさくっと作成できる無料のオンラインツールを紹介しま […]
head内に記述するソーシャルメディア・検索エンジン用のmetaタグを簡単に生成できる無料ツール -Meta Tags
Post on:2018年11月12日
head内のmetaに記述するTwitterカードやFacebookのOGPなどのソーシャルメディア用のコード、Googleなどの検索エンジン用のコードを簡単に作成できる無料のオンラインツールを紹介します。 公式のデバッ […]
CSSの新機能のまとめ -2018年、CSSワーキンググループの会議で変更が加えられたCSSの新機能とそのデモ
Post on:2018年11月9日
先週、CSSワーキンググループの会議でCSSの仕様にさまざまな変更が加えられ、Webデザイナーや制作者にとって興味深い議論が行われました。 CSSの新機能とそのデモ、現在議論されている点について紹介します。 The CS […]
プログレスバーの実装もこれなら簡単！複数ファイルにも対応した超軽量JavaScriptライブラリ -preload-it
Post on:2018年11月8日
動画ファイル、音楽ファイル、画像ファイルなど、大容量のファイルを使用したコンテンツでは、プログレスバーがあると非常に便利です。さまざまなタイプのファイルをプリロードするための超軽量（1kb）JavaScriptライブラリ […]
Web制作者が備えておきたい最新版チートシートのまとめ
Post on:2018年11月7日
あれはどうだったかな？ という時にすぐ分かる、Web制作の実装や勉強に役立つチートシートを紹介します。 iPhone 8やXsのスクリーンサイズはいくつだったかな？ CSS FlexboxやGridの挙動がまとめて知りた […]
あまり知られていないかもしれない、CSS-in-JSを実装するライブラリでできる5つの便利なテクニック
Post on:2018年11月6日
CSS-in-JSはJavaScriptを使用してコンポーネントをスタイルするテクニックです。 Reactには従来のCSSに加えて、スタイリングのオプションとして、インラインスタイルとCSS-in-JSがあります。 CS […]
Google Fonts + 日本語を使用して、Webサイトやブログがどのように表示されるか試すことができるツール -Fonty
Post on:2018年11月5日
2018年9月にGoogle Fontsは日本語が正式にサポートされ、既に利用されている人、検討されている人も多いと思います。当ブログでも早期アクセスから使用しています。 日本語の正式サポートに伴い、Google Fon […]
[CSS]これは知らなかった！セレクタを使った条件分岐のテクニック
Post on:2018年11月2日
古いブラウザ用のスタイルシートとモダンブラウザ用のスタイルシートは、どのように分けて記述していますか？ CSSのセレクタだけを使用して、古いブラウザ用とモダンブラウザ用にスタイルシートを条件分岐させるテクニックを紹介しま […]
sponsors
