Web制作に役立つ情報一覧

【Photoshop新機能】テキストが自動で整う！「ダイナミックテキスト」実際に使ってみた

2025/04/28(Mon) 08:52

文字を入力して、改行して、サイズや行間を微調整して……そんな地道な作業に、Photoshopがついに終止符を打ちました。新しくベータ版に追加された「ダイナミックテキスト」という機能、もう試してみましたか？ざっくり言うと、「テキストボックスの形に合わせて、文字が自動でいい感じに整列してくれる」夢のような機能。

https://photoshopvip.net/165011#google_vignette

UIデザイン用のアクセシブルなカラーパレットを自動生成するツール -Accessible Color Palette Generator

2025/04/24(Thu) 08:59

UIデザイン用のカラーパレットを作成するのは、簡単そうに思うかもしれません。しかし、アクセシビリティの要件を満たし、ブランドのアイデンティティやスケールのバランスが取れたカラーパレットを作成するには手間と時間がかかります。ほとんどのツールを使用しても、これらの要件を満たせるものは数が少ないです。

https://coliss.com/articles/build-websites/operation/design/accessible-color-palette-generator.html

無料・商用OKのおしゃれ＆かわいいフォントが探せる！新ライブラリ「Best Fonts」登場

2025/04/23(Wed) 09:11

「この前紹介したフォント、どの記事だったっけ？」ふと使いたくなって思い出そうとしても、雰囲気しか覚えてなくて、記事をひとつずつ開いて探すはめに…。これ、何度もくり返してきました。自分でまとめておいて、自分で探すのに苦労する謎ループ（笑）フォント選びって楽しいはずなのに、探すのが面倒で、その楽しさが半減してしまう。

https://photoshopvip.net/164927#google_vignette

読めばSEO分析ができる！初心者にもわかりやすく解説【2025年版】

2025/04/21(Mon) 08:54

「SEO分析のやり方がわからない」「どのツールを使えばいいのか、何を見ればいいのか、結果をどう解釈すればいいのか、完全に迷子になっている」このような悩みを抱えていないだろうか。SEOはビジネス成長に欠かせない要素となっており、その分析が重要なのはいうまでもない。しかし、見るべきところが多すぎて、出だしからつまずく方が後を絶たない。

https://lucy.ne.jp/bazubu/seo-analysis-available-53073.html

ツールチップの実装に役立つ！HTMLの新属性popover="hint"の使い方

2025/04/18(Fri) 09:00

前回の記事『階層メニューやトーストUIが簡単に作れる新技術!　JavaScriptで利用するポップオーバーAPI』ではポップオーバーAPIについて紹介しました。今回はその続編として、Chrome 133、Edge 133で新しく追加されたpopover="hint"属性に焦点を当てます。ツールチップなどのUIの実装に便利な属性で、その特徴や使い方、他の属性との違いを詳しく説明します。

https://ics.media/entry/250417/

ブックマークしておくと便利！ よく見かけるUIコンポーネントやUI要素を実装するCSSのまとめ -CSSnippets

2025/04/18(Fri) 08:59

Webサイトやスマホアプリでよく見かけるボタンやカード、フォーム、ローディングなど、UIコンポーネントやUI要素を実装するCSSのコード、Tailwind CSSのコード、さらにはReactのコードをまとめたCSSnippetsを紹介します。

https://coliss.com/articles/build-websites/operation/css/cssnippets-by-shefali.html#google_vignette

CSSで幾何学模様や繊細なグラデーションなど、さまざまな要素の背景にパターンを実装できる -MotifyX

2025/04/16(Wed) 08:58

美しい幾何学模様のパターン、ドットやグリッドベースのパターン、繊細なカラーの変化が楽しめるダークグラデーション、マトリックスのような近未来のパターンなど、CSSで実装された背景パターンを紹介します。商用プロジェクトでも完全に無料で利用できます。カラーの変更などのカスタマイズも簡単で、ダークモードでもライトモードでも機能します。

https://coliss.com/articles/build-websites/operation/css/modern-background-patterns-motifyx.html

SEOにかなり使える「ラッコキーワード」とは？具体的な活用法も紹介

2025/04/10(Thu) 08:53

「ラッコキーワードって何？使えるツールなの？」という疑問に端的にお答えすると、 ラッコキーワードは無料で使える純国産のキーワード分析ツールだ。ラッコキーワードは、UI設計が秀逸なことも特筆すべき点だ。海外ツールになじみにくい人でも、ラッコキーワードならサクサク使えるだろう。

https://lucy.ne.jp/bazubu/what-are-sea-racco-keywords-that-are-very-useful-seo-52807.html

noindexとnofollowの違いとは？正しい書き方を解説

2025/04/09(Wed) 08:56

SEOをより効果的にする上で、「noindex」と「nofollow」の設定は欠かせません。noindexとnofollowは一見すると似ていますが、それぞれ役割は大きく異なります。それぞれの役割を曖昧なままにしていると、検索エンジン経由でのアクセス数の減少や、検索エンジンから低い評価を受ける可能性があります。

https://www.seohacks.net/blog/27579/

HTMLとCSSで勉強すべきことがしっかりまとめられている、アクセシビリティやパフォーマンスを考慮した実装を学べる良書 -モダンHTML＆CSS 現場の新標準ガイド

2025/04/07(Mon) 08:52

最新のHTMLとCSSをしっかり学びたい人にお勧めの解説書を紹介します。HTMLとCSSの最新の仕様に基づき、必要な知識を身につけ、アクセシビリティやパフォーマンスに考慮した実践的なテクニックをしっかり学べます。Web制作者が持っておいて間違いのない一冊です。

https://coliss.com/articles/book-review/isbn-9784839986933.html#google_vignette