コハム

Webクリエイターのコハムが提供する、Web制作に役立つ情報をまとめたブログです。

2024-01-01から1年間の記事一覧

端末に合わせて文字が自動調整!今すぐ試したい画期的なCSSのタイポグラフィー術

Responsive Typography Techniques with CSS 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 今日のデジタル時代、ユーザーが様々な画面サイズのデバイスでウェブサイトやアプリケーションにアクセスす…

Copilotを使うならまずは読んでおきたい必読の一冊【Microsoft Copilot for Microsoft 365活用大全】

※本記事はアフィリエイトリンクが含まれています。 Microsoft Copilotはコーディングを支援するMicorsoftのAIです。 VSCodeやWindowsにも組み込まれ、プログラミング作業はCopilotを使うか使わないかで仕事の品質や速さに大きな差が出てくることは確実です。…

【完全無料】【商用利用可】Webデザイナー/UXデザイナー必見!絶賛の無料デザインリソースとUIキット:theme-ui

theme-ui theme-uiは無料で高品質なウェブデザインリソース、テンプレート、UIデザイン素材の配布サイトです。世界中の才能あるデザイナーが作った最高のUIデザイン素材とウェブデザインリソースが見つかります。 すべて無料、すべて商用利用可です。 配布さ…

Tailwind CSSとReactでかんたん実装!華やかなスタガーテキストアニメーションを取り入れたヒーローイメージ

Create Staggered Text Animation with Tailwind CSS and React 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 Linearのランディングページに似た、React と Tailwind CSS を使って作成されたスタガー…

ブロックテーマでも楽々フォント管理!GoogleフォントをWordPressで使う最新テクニック

Managing Fonts in WordPress Block Themes 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 フォントは、どんなサイトのデザインにおいても重要な特徴です。WordPressのテーマもその例外ではありません…

Safari17.5で使える新機能をチェックしよう:text-wrap: balance、light-dark()、@starting-styleなど

iOS17.5の配信と同時にSafariも17.5にアップデートされました。 Safari17.5で使用できる新しい機能やバグフィックスをチェックしておきましょう。 引用元: WebKit Features in Safari 17.5 CSS Safari 17.5には、text-wrap: balance、light-dark()カラー関…

SolidJSとReactの徹底比較:パフォーマンス、学習のしやすさ、人気度から選ぶべきフレームワークは?

Solidjs vs. React Comparison – Complete Guide 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 JavaScriptの旅路の岐路に立ち、どのフロントエンドフレームワークを選ぶべきか迷っていませんか? 「ど…

ReactとAngularとVue:どれを選ぶべきか2024年版

React vs Angular vs Vue: Which is Better in 2024? 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 ウェブ開発の分野が進化を続けるなか、適切なフロントエンドフレームワークを選ぶことが、堅牢でス…

コピペでOK!Tailwindを使用した実用的な1200以上!のコンポーネント集

1200+ Free Tailwind CSS Examples TailWindを使用した実用的で美しい様々なコンポーネントをなんと1200以上も掲載した1200+ Free Tailwind CSS Examplesを紹介します。 カード、フォーム、ボタンなど実用的なコンポーネントがそれぞれ数十種類以上用意され…

2024年の最旬ブルーカラーパレット21選!個性を最大限引き出す配色を見つけよう

20+ Best Blue Color Palettes for 2024 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 2024年の最高のブルーカラーパレット 組織の個性を反映するブルーカラーパレットを探しているなら、2024年のト…

Promise.tryによる同期/非同期処理のエラーハンドリングのベストプラクティス

Promise.try to improve error handling and sync/async interoperability 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 この記事では、JavaScriptのPromiseと同じくらい古い面倒なタスクの現代的な…

モダンJavascriptには必須!ES6で使えるスプレッド演算子を学ぶ

ES6 Spread Operator: Unleashing the Power of Modern JavaScript 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 JavaScriptはかつてはWebページのための単純なスクリプト言語と考えられていましたが…

これで大幅な作業時間短縮!WebデベロッパーのためのCSSジェネレーター100選

100+ CSS Generators for Web Developers 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 ウェブサイトを構築する際、CSSジェネレーターを使用すると大幅な時間を節約できます。幸いなことに、この目的…

たった1行で劇的な変化!モダンCSSで使えるワンライナートリック12選

css

12 Modern CSS One-Line Upgrades 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 アプリケーションのCSSを改善するには、1行のアップグレードや拡張で十分です。プロジェクトで取り入れ始めるプロパテ…

CSSの表現力は無限大!クリエイティブでユニークなCSSアニメーション30+1選

30 Creative and Unique CSS Animation Examples to Inspire Your Own 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 CSS アニメーションを使えば、ボタンをよりクリックしやすくしたり、ランディング…

2024年も進化が止まらない!ワークフローを強化するFigmaプラグイン10選

10 Figma Plugins That Will Supercharge Your Workflow in 2024 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 Figmaは、数多くのUI/UXデザイナーの選択されるデザインツールとなっています。その基…

絶対と相対だけじゃない:CSS単位の追求

CSS

Exploring CSS Units 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 ピクセルから百分率、秒数まで、各CSS単位タイプにはユニークな機能があり、開発者がデザインのビジョンを生き生きと現実のものに…

Webサイトの配色に迷ったらこれ!カラーパレットを作成するためのツール10選

10 Essential Tools for Crafting the Perfect Website Color Palette 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 Happy Hues Huemint couleur Muzli Colors Coolors pppalette Accessible Palette…

UdemyがGWに向けて大セール中!90%以上オフの講座が盛り沢山!

※本ページは、アフィリエイト広告を利用しています。 GW中の余暇を利用して何か勉強したい、そう考えている方にはUdemyがおすすめです。 なんと90%以上オフの講座が盛り沢山!セール期間は4月25日までですが、一旦購入しておけばあとから視聴が可能です。 興…

Javascriptは不使用!無限スクロールをCSSだけで実装するチュートリアル

Infinite-Scrolling Logos In Flat HTML And Pure CSS 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 自動スクロールするロゴファームを作るように頼まれたとき、私は自問しました。「つまり、<marquee>のよう</marquee>…

WordPressのテーマを自作するのはもうやめよう:おすすめの日本語対応有料テーマ6選

※本ページは、アフィリエイト広告を利用しています。 WordPressは現在に置いてもシェア第1位のCMSですが、そのテーマを自作するのはWordPressのアップデートに伴い非常に難しくなりました。 ブロックエディタ、フルサイト編集、theme.jsonの作成、対応PHPの…

インパクト抜群!CSSで演出するグリッチ効果26選

CSS

25+ CSS Glitch Effects 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 ウェブやモバイルアプリケーションにテクニカルなひずみのある外観を追加するためのグリッチ効果のコレクションをお探しでしょ…

改めて学び直す:CSS Transitionの詳細と実装例

CSS

CSS Transitions: A Detailed Guide With Examples 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 現代のウェブデザインは、静的なページだけではありません。訪問者にインタラクティブな体験を提供す…

2024年版!HTML/CSSで作るリボンデザイン20選

20 Best Free CSS Ribbons Designs In 2024 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 ウェブサイトのデザインにぴったりなCSSリボンをお探しですか? そうであれば、ここにいらしたのが幸いです…

CSS-in-JSが現在抱える問題とCSS Hooksという解決策

CSS Hooks and the state of CSS-in-JS 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 フロントエンドアプリケーションとコンポーネントベースのアーキテクチャが範囲と複雑さを増すにつれ、モジュラ…

効率的なレイアウト設計のためのCSSサブグリッド:CSS subgridの基本的な使い方

CSS

Unlocking The Power Of CSS Subgrid For Efficient Layout Design 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 Webデベロッパーにとって、ピクセルパーフェクトなレイアウトを実現することは常に難…

業務で使うならFirefly一択!「デザインの仕事がもっとはかどるAdobe Firefly活用テクニック50」のご紹介

※本ページは、アフィリエイト広告を利用しています。 Mid JourneyやStable Diffusion、Bing Image Creatorといった画像生成AIをお仕事で利用されていますか? 写真やイラスト素材を探し回る必要もなく、高品質で思い通りのイメージがすぐ手に入る画像生成AI…

レスポンシブデザインにとってステロイドのような強力な解決策になるか?コンテナクエリの基本的な使い方

Responsive Design On Steroids: CSS Container Queries 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 待望のレスポンシブデザインの機能であるコンテナクエリーが、ついに安定したバージョンとなり…

信頼性・コスト・SEO……悪いデザインのWebサイトが与える悪影響とは

What Negative Effects Does a Bad Website Design Have On My Business? 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 明らかにウェブサイトのデザインが悪いと、企業に悪影響があります。この記事…

アンチウイルスソフトはWindows Defenderで十分か?サードパーティー製アンチウイルスソフトを選ぶ必要性は?

Is Windows Defender All the Antivirus Protection You Need? 記事は上記記事を意訳したものです。 ※当ブログでの翻訳記事は元サイト様に許可を得て掲載しています。 Windows Defenderですべての必要なアンチウイルス対策ができますか? 優れた無料アンチウ…

©コハム