サイト構築 -制作
レスポンシブ対応のレイアウトを実装する最新テクニックを解説、モバイルファーストとデスクトップファーストの現状
Post on:2021年9月9日
モバイルファーストとデスクトップファーストの現状、それぞれのワークフローを解説し、今日のレスポンシブ対応のレイアウトを実装するより良いアプローチ方法について紹介します。 ビューポートサイズとは関係ないすべてのデバイスで共
これは便利、VS Codeの設定を変更しよう!v.1.60のアップデートで、ブラケットのカラー化にネイティブ対応
Post on:2021年9月8日
VS Codeがどんどん便利になっていきますね。 先日のv.1.60のアップデートで、ブラケットのカラー化に対応しました! VS Codeの設定を変更するだけで、開始と終了のブラケットをセットで同じカラーにします。今まで
CSSによる微調整、フォントのベースサイズ、レスポンシブ用の増減、スペースの基本単位などを確認しながら変更できる無料ツール -shaper
Post on:2021年9月6日
WebページのUI要素に適用したフォントのベースサイズ、レスポンシブ用の増減、スペースの基本単位、マージン・パディングの量、カラー、ボタンの形、ボーダーのサイズ、ボーダーの角丸など、表示を確認しながらスタイルの値を調整で
[CSS]「display: contents;」がすごい便利!ラッパーを使った実装が大きく変わるこれからのテクニック
Post on:2021年9月4日
例えばカードで、見出しが1行・3行、本文の量が多かったり少なかったりする場合、それぞれの高さを揃えるのは非常に難しく、かなりトリッキーな実装が必要でした。もしくは、JavaScriptを使用しなくてはできなかった実装です
レスポンシブデザインの確認に便利なツールが登場!複数のデバイスサイズで同時確認できる優れもの -Responsivize
Post on:2021年9月1日
Webページのレスポンシブの確認が簡単にできる、新しい無料アプリがリリースされました! iPhone, Android, Pixelのスマホをはじめ、タブレット、ラップトップ、ワイドスクリーンなどのサイズでWebページを
SVGでレイティングに使用するスター(星形)を実装するテクニックを解説
Post on:2021年8月31日
Webページやスマホアプリで見かけるレイティングに使用するスター(星形)を実装するSVGのテクニックを紹介します。 一口にスターといってもさまざまな状態があり、オン・オフ、半分、アウトライン、サイズ変更など、さまざまな実
各ソーシャルメディアに適した画像サイズは102種類!画像を1クリックでトリミングしてくれる無料ツール
Post on:2021年8月16日
Twitter, Facebook, Instagram, TikTok, YouTubeなど、各ソーシャルメディアに最適なサイズで画像をトリミングしてくれる無料ツールを紹介します。 AIで自動化されているので、1枚の画
Googleデベロッパーが解説、Webページに画像の遅延読み込みを使いすぎるとパフォーマンスに悪影響を与える
Post on:2021年8月5日
loading="lazy"によるネイティブ画像の遅延読み込みのリスクとリターン、注意点とパフォーマンスを向上させる実装方法を紹介します。 Webの新機能は便利で魅力的なものが多いですが、効果的な使い
コーディングに役立つ!Visual Studio Codeのちょっとかゆいところに手が届くような便利な機能とテクニック
Post on:2021年7月20日
あまり知られていないけれど、コーディングの作業が捗るVS Codeの機能とテクニックを紹介します。 今開いているファイルを残しながら新しいファイルを開けるようにしたり、コード内のコメントのカラーだけを自分好みに変更する方
webpファイルをPhotoshopで開く・書き出すことができる機能拡張 -WebPShop
Post on:2021年7月16日
最近増えてきたwebpファイルをPhotoshopで開いたり、書き出すことができる無料の機能拡張を紹介します。 更新: 2021/11/1: Photoshop 2022もwebpをサポートしていませんが、ここで紹介する
sponsors