CSSでついにif elseの条件文が使える! if()関数の便利な使い方を解説 コリス 著者:コリス🥦 2025年7月17日 09:36 5月にリリースされたChromeとEdgeで、CSSのif()関数がサポートされました。これによりCSSでもif elseの条件文が使えるようなり、プロパティに対して条件付きで値を設定できるようになりました。 新機能なの...記事の続きを読む
デザイナーはダウンロードしておこう! TikTokからオフィシャルフォント「TikTok Sans」がオープンソースでリリース コリス 著者:コリス🥦 2025年7月16日 09:36 TikTokで使用されているTikTok Sansがダウンロードできるようになるのを待っていた人は少なくないと思います。 TikTokのオフィシャルフォントが、オープンソースでGitHubからダウンロードできるようなりま...記事の続きを読む
ユーザーのマウスやキーボードの動き(運動量や方向)から次にどの要素を操作するか予測するスクリプト -ForesightJS コリス 著者:コリス🥦 2025年7月15日 09:36 ユーザーがWebサイトにアクセスした際、マウスやキーボードの動きをから次にどの要素を操作するか予測し、プリフェッチすることができるJavaScriptのライブラリを紹介します。 1ヵ月ほど前に紹介したForesightJ...記事の続きを読む
2025年のプライムデーもいよいよセール最終日! 見逃しがちな超目玉お買い得品を紹介します コリス 著者:コリス🥦 2025年7月14日 09:36 ※本ページは、アフィリエイト広告を利用しています。 年に一度のビッグセール「Amazon プライムデー2025」が期間限定で開催されており、本日(7/14)がセール最終日です。 プライムデーはプライム会員限定のセールで、...記事の続きを読む
これは絶対見逃すな! 値上げ前最後のアドビセールが開催、AmazonでCreative Cloud コンプリートプランが驚きの46%オフ コリス 著者:コリス🥦 2025年7月12日 09:26 ※本ページは、アフィリエイト広告を利用しています。 Amazon プライムデー2025で本日から、アドビセールも開催されています! 期間は7/25まで、、Adobe CC コンプリートプランが期間限定でかなりお買い得にな...記事の続きを読む
Amazonで、2025年プライムデーのセールが開催! 私が購入して本当によかったものを紹介します コリス 著者:コリス🥦 2025年7月11日 09:36 ※本ページは、アフィリエイト広告を利用しています。 年に一度のビッグセール「Amazon プライムデー2025」が、本日7/11から7/14までの期間限定で開催です! プライムデーはプライム会員限定のセールで、通常のセー...記事の続きを読む
ビー・エヌ・エヌ社のKindleセールはかなり貴重! 1年ぶりとなる夏のセールが開催、Web制作・デザイン・イラスト関連のKindle本がお買い得です コリス 著者:コリス🥦 2025年7月10日 09:36 ※本ページは、アフィリエイト広告を利用しています。 当ブログでも人気が高く、良書揃いのビー・エヌ・エヌ社のKindle本セールが7/9から開催しました! ビー・エヌ・エヌ社のセールは年に一・二回、非常に貴重です。丸1年ぶ...記事の続きを読む
UIコンポーネントをAIで簡単に実装できる、Tailwind CSSのコードをプロンプトから生成できるツール -TailwindGenAI コリス 著者:コリス🥦 2025年7月9日 09:36 Tailwind CSSを使用してUIコンポーネントを実装するのは、慣れていないと時間がかかります。Tailwind CSSのユーティリティファーストのフレームワークを使用してUIコンポーネントを生成するために設計された...記事の続きを読む
Amazonで、2025年プライムデーの先行セールが7/8から開催! 最安値更新のものが多くて驚きました コリス 著者:コリス🥦 2025年7月8日 09:36 ※本ページは、アフィリエイト広告を利用しています。 年に一度のビッグセール「Amazon プライムデー2025」が、7/11から7/14までの期間限定で開催します。そして、本日7/8から先行セールが開催しました。 先行セ...記事の続きを読む
Kindleセールが開催! SBクリエイティブの夏の読書フェア、Web制作・デザイン・イラストのKindle本が超お買い得です コリス 著者:コリス🥦 2025年7月7日 08:03 ※本ページは、アフィリエイト広告を利用しています。 Webデザインやグラフィックデザイン、同人誌・絵師さん向けのイラスト関連の良書がかなりたくさん対象となったSBクリエイティブの夏の読書フェアが開催です! 期間は、来週の...記事の続きを読む
実在するWebサイトのワイヤーフレームからデザインに落とし込む際の意図やテクニックを詳しく解説したデザイン書 -Webデザイン&ワイヤーフレーム比較見本Book コリス 著者:コリス🥦 2025年7月4日 09:36 ※本ページは、アフィリエイト広告を利用しています。 他の人はどういう工程でWebデザインを仕上げているのか、気になりませんか? 通常は表に出ることのない実在するWebサイトのワイヤーフレームの設計、デザインカンプへの落と...記事の続きを読む
Adobe Creative Cloudのプランと価格が変更されます! 既存プランは実質値上げ、AI生成が制限される格安プランが登場 コリス 著者:コリス🥦 2025年7月4日 09:26 2025年8月から、Adobe Creative Cloudのプランと価格が変更されるとリリースされました。 既存のCreative Cloud コンプリートプランは、「Creative Cloud Pro」と名称が変更...記事の続きを読む
最近のロゴに使われているデザインテクニックのまとめ -2025年、ロゴデザインのトレンド コリス 著者:コリス🥦 2025年7月3日 09:36 デザインの基本となるタイポグラフィ、カラー、形などのデザイン要素が詰まった、最近のロゴデザインに使われているトレンド、デザインテクニックを紹介します。 サステナビリティを重視したアースカラー、進化しているグラデーションの...記事の続きを読む
簡単に使えるイラスト生成AIツールが登場! Notion風のイラストを無料で生成できる -Notion Style Illustration Generator コリス 著者:コリス🥦 2025年7月2日 09:36 プロンプトにテキストを入力するだけで、Notion風のイラストを簡単に作成できる生成AIツールを紹介します。 人物イラストはもちろん、植物や動物、景色など、モノクロのイラストでもカラーのイラストでも生成することができます...記事の続きを読む
これは朗報! width: 100%;より便利なstretchキーワードが使えるようになります、Chrome 138で新しく追加された6個のCSSの機能 コリス 著者:コリス🥦 2025年7月1日 09:36 先日リリースされたChrome 138で追加された、CSSの新しい機能6個を紹介します。今回のアップデートで目玉は、stretchキーワードをはじめ、新しい関数がいくつかサポートされました。Web制作者は要チェックです!...記事の続きを読む
新作フリーフォントがリリース! マンガや同人誌、動画のタイトルにぴったりな超極太ゴシック体「源暎きわみゴ」 コリス 著者:コリス🥦 2025年6月30日 09:36 「源暎アンチック」「源暎エムゴ」「源暎こぶり明朝」など、マンガや同人誌などに使えるフリーフォントを数多くリリースされている「おこねや」から新作のフリーフォントがリリースされました! 今回は、同人誌のタイトルや動画のタイト...記事の続きを読む
Copilotの生成AIで仕事を効率化! 具体的な事例を挙げて分かりやすく解説した解説書 -Copilotの基本が学べる教科書 コリス 著者:コリス🥦 2025年6月27日 09:36 ※本ページは、アフィリエイト広告を利用しています。 最近はさまざまな生成AIが登場し、どれを使えば何ができるのか悩む人もいると思います。まずは簡単に無料で使えるMicrosoftのCopilotがお勧めです。 Copil...記事の続きを読む
HTMLの仕様が変更され、属性値内に記述した<と>がエスケープされるようになります コリス 著者:コリス🥦 2025年6月26日 09:36 先日、HTMLの仕様が変更され、属性値内に記述した<と>がエスケープされるようになりました。この変更は6/25にリリースされたChrome 138やFirefox 140をはじめ、Edge, Safariも次...記事の続きを読む
本日(6/25)限り、国産ノーコードツール「Studio」の解説書「Studio Webサイト制作入門」が80%オフのワンコイン! コリス 著者:コリス🥦 2025年6月25日 09:36 ※本ページは、アフィリエイト広告を利用しています。 当ブログで紹介した際に大好評だったので、セールをずっとチェックしていたのですが、「Studio Webサイト制作入門」が本日(6/25)限り、なんと80%オフです! 先...記事の続きを読む
商用利用OKの無料版と有料版が同時リリース! 万年筆で一文字ずつ手書きされた、やさしい雰囲気のフォント「ノエリーフ」 コリス 著者:コリス🥦 2025年6月24日 09:36 愛嬌のある丸ゴシック「くすくすあめ」暗号チックな「セネシオまちっく」など、かわいいフォントをリリースされているf6typeから、新作フリーフォントがリリースされました! 今回は初の手書きとなるフォント「ノエリーフ」無料版...記事の続きを読む
セール初登場もたくさん! 年に一度のKindle本プライムデーセールが開催、Web制作・デザイン・イラストの良書が最安値です コリス 著者:コリス🥦 2025年6月23日 09:36 ※本ページは、アフィリエイト広告を利用しています。 7/11から7/14まで開催されるAmazon プライムデー2025に先駆けて、Kindle本のプライムデー特大セールが開催しています。Webや紙のデザイン、HTML/...記事の続きを読む
こういうデザイン書が欲しかった! 日本語フォントを使用したデザインの知識と実践テクニックが基礎から学べる解説書 -怖くないタイポグラフィ コリス 著者:コリス🥦 2025年6月20日 09:36 ※本ページは、アフィリエイト広告を利用しています。 デザインにどういうフォントを使えばよいのか、使用するフォントの善し悪し、読みやすくなる文字組みのこつ、魅力的な文字レイアウトのテクニック、さまざまなタイトルの作り方など...記事の続きを読む
CSS GridやFlexboxでアイテム間のスペース(ギャップ)をスタイル設定するCSSの新しいテクニック コリス 著者:コリス🥦 2025年6月19日 09:36 CSS GridやFlexboxは非常に便利ですが、アイテム間のスペース(ギャップ)をスタイルするときにはボーダーや疑似要素や背景画像を使ったハックでしか実装できませんでした。 アイテム間にボーダーを設置したり、交差する...記事の続きを読む
翔泳社Kindle夏の超ビッグセール2025が開催! Web制作やデザイン、イラスト関連の良書が半額で、超お買い得です コリス 著者:コリス🥦 2025年6月18日 09:36 翔泳社Kindle夏の超ビッグセール2025が昨日から開催しました! 超ビッグセールということで単体の版元セールとしてはスクロールバーを見ると分かると思いますが、かなりのボリュームです。Webや紙のデザイン、Web制作、...記事の続きを読む
簡単な手順でWebページの読み込み時間を高速化! クリティカルCSSを抽出してくれるツール -Critical CSS Generator コリス 著者:コリス🥦 2025年6月17日 09:36 クリティカルCSSとは、Webページで最初に表示される部分(ファーストビュー)をレンダリングするために必要な最小限のCSSです。このクリティカルCSSを既存のWebページから抽出し、HTMLにインラインのCSSとして記述...記事の続きを読む
CSSで簡単カスタマイズ、洗練されたデザインと気持ちいいアニメーションで動作するUIコンポーネント -SmoothUI コリス 著者:コリス🥦 2025年6月16日 09:36 WebサイトやスマホアプリのUIでよく使用されるアコーディオンやモーダルといった基本的なコンポーネントをはじめ、AppleにインスパイアされたカードやフォトギャラリーやDynamic Islandなどの気持ちよく動作する...記事の続きを読む
センスのいい作例で、デザインのモチベーションも上がる解説書 -Illustrator&Photoshop 基本がしっかりわかる授業 コリス 著者:コリス🥦 2025年6月13日 09:36 ※本ページは、アフィリエイト広告を利用しています。 デザイン制作に欠かせないAdobe IllustratorとAdobe Photoshopの使い方を実際に操作しながら両方を同時に学べる入門書を紹介します。 Illus...記事の続きを読む
CSSのreading-flowプロパティが便利! CSS GridやFlexboxで見た目とDOMツリー内の順序を一致させることができます コリス 著者:コリス🥦 2025年6月12日 09:36 CSS GridやFlexboxは便利でよく使用していると思います、ただし、見た目の順序とDOMツリー内の順序が一致しないことがあります。これはキーボードやアクセシビリティツールで操作するユーザーにとって非常に問題です。...記事の続きを読む
レトロなデザインがいい感じ! 8-bitのゲーム風にデザインされたUIコンポーネントが揃ったフレームワーク -8bitcn コリス 著者:コリス🥦 2025年6月11日 09:36 ゲームボーイやSegaやNintendoやAtariなどのレトロな8-bitのゲーム風にデザインされたUIコンポーネントが揃ったフレームワークを紹介します。 ボタンやカード、ログインフォーム、カレンダー、タブ、サイドバー...記事の続きを読む
商用利用無料、UIデザイン用のSVGアイコンが3000種類以上! 改変・再配布も可の太っ腹ライセンス- MingCute Icon コリス 著者:コリス🥦 2025年6月10日 09:36 WebサイトやスマホアプリのさまざまなUIデザイン用に、シンプルなデザインで洗練されたSVGアイコンが完全無料で利用できるMingCute Iconを紹介します。 MingCute Iconのアイコンの特徴は、小さなサイ...記事の続きを読む
ボタンの色やアイコンを変えるだけでクリック率は本当にアップするのか、参考になるA/Bテストのまとめ -abtest.design コリス 著者:コリス🥦 2025年6月9日 09:36 ボタンの色を変えるとどうなる? アイコンを変えただけで効果はあるのか? レイアウトはどっちがいいか? さまざまなWebサイトやスマホアプリでA/Bテストが実施され、どちらの方が効果が高いか測定されています。 スマホアプリ...記事の続きを読む
デザインの引き出しが確実に増える! 小さなスペースに潜むデザインのさまざまなテクニックがよく分かるデザイン書 -バナーデザインの教科書 コリス 著者:コリス🥦 2025年6月6日 09:36 ※本ページは、アフィリエイト広告を利用しています。 バナーのデザインは、非常に奥が深いです。限られた小さなスペースに、伝わるデザイン、分かりやすいデザイン、クリックしたくなるデザインのテクニックが詰まっており、視線誘導・...記事の続きを読む
Web制作者はチェックしておきたい! モダンCSSやデベロッパーツールなど、これからの実装に役立つ新機能のまとめ コリス 著者:コリス🥦 2025年6月5日 09:36 2025年もCSSをはじめ、Web制作関連の進化は止まらないですね! Google I/O 2025で、これからのWebを実装するための新機能が発表されました。先日の記事でも紹介したCSSのみでカルーセルを実装する疑似要...記事の続きを読む
マウスやキーボードの動きからユーザーが次にどの要素を操作するかを予測するスクリプト -ForesightJS コリス 著者:コリス🥦 2025年6月4日 09:36 通常のホバーエフェクトのトリガーは、要素にカーソルをホバーした後に開始されます。しかし、これはユーザーの操作(ボタンに移動)から実際のホバーイベントまで100-200ms遅れます。また、キーボード操作によるトリガーも同様...記事の続きを読む