そろそろWebPに切り替えよう。変換方法や対応ブラウザ、使い方を解説！ | Web Design Trends
WebP（ウェッピー）は、Googleが開発している次世代画像フォーマットです。PNGやJPEGと比べてファイルサイズを抑えることができ、トラフィックの削減やページ表示速度の向上を実現することができます。 今回は、WebP（ウェッピー）の基本と、メリットやデメリット、変換方法、対応ブラウザなどをご紹介したいと思います。 WebP（ウェッピー）とは？ WebP（ウェッピー）は、Googleが開発している次世代画像フォーマットで、拡張子は「.webp」です。 WebPは、JPEGやPNGと比べ、同程度の画質の画像をより小さなファイルサイズで保存することができます。Googleの発表では、PNGよりも26%、JPEGよりも25%〜34％程度ファイルサイズを抑えることができると言われています。 また、WebPは背景透過（アルファチャンネル）や、アニメーションにも対応しています。つまり、JPEGのよ
WordPressのおすすめブランクテーマ・スターターテーマまとめ【2021年版】 | Web Design Trends
WordPressの自作テーマを作る場合、0から自分で作る方法でも作ることはできますが、WordPress独自のコードを記述する量が多くなってしまい、かなりの手間がかかってしまいます。 そんな時に使えるのが「ブランクテーマ」「スターターテーマ」と呼ばれるテーマです。ブランクテーマやスターターテーマを使うと、基本機能が備えられたコードを元にテーマを作ることができるので、効率的にテーマ制作を行うことができます。 今回は、ブランクテーマの基本と2021年最新のおすすめブランクテーマをご紹介したいと思います。 【2024年最新】WordPressの使い方を徹底解説！初心者向けのおすすめ設定も WordPressは初心者でも簡単にWebサイトを作ることができる人気のソフトウェアです。 しかし、機能がやや複雑で初めてWordPressに挑戦する人には導入時のハードルがやや高く、どのように設定す...
Web制作者必見！VSCodeのおすすめ拡張機能15個まとめ | Web Design Trends
VSCodeを使ってHTML/CSS/JavaScriptなどを使ったWeb制作、Webコーディングを行っている人も多いのではないでしょうか。 VSCodeは様々な拡張機能が公開されていて、それらを活用するとさらにWeb制作の作業効率が向上したり、使い勝手が良くなったりします。 今回は、Web制作者、WebコーダーにおすすめのVSCode拡張機能をご紹介したいと思います。 VSCodeとは VSCodeとは、Microsoftが提供するテキストエディタ「Visual Studio Code」のことです。つい数年前までは、人によって使っているテキストエディタが違うことも多かったのですが、最近ではVSCodeを使ってコーディングやプログラミングを行っている人がかなり多くなってきました。 VSCodeは、設定や拡張機能の追加など、マウス操作で行うことができ、初めてコーディングやプログラミングをす
コピペでOK！CSSで作る背景パターンのサンプルコードまとめ | Web Design Trends
Webサイト上の要素に背景を表示したい場合、シンプルに画像で表示する形が一般的ですが、CSSを使って背景パターンを表示するという方法もあります。 ドット柄やチェック模様、ストライプなど色々な種類の背景パターンをCSSだけで作ることができ、使い方を覚えておくとWebデザインに色々と活用することができます。 今回は、CSSだけで背景パターンや模様を表示するメリットや、様々なサンプルコードが掲載されているおすすめのサイトをご紹介したいと想います。 CSSで背景パターンを作るメリット Webページ上の要素に背景を適用する場合、一般的には画像ファイルを用意してbackground-imageプロパティに指定することが多いですが、CSSだけでも様々な背景パターンや模様を作ることができます。 画像ではなくCSSで背景パターンを作った場合のメリットとして、例えば次のようなものが挙げられます。 背景画像を書
2022年版：おすすめのWebアイコンフォントサービス10選 | Web Design Trends
Webアイコンフォントを利用することで、数千種類のアイコン素材をWebサイト上で簡単に表示することができます。 Webサイト上で多くの画像ファイルを読み込むとページの表示速度に影響してしまいますが、Webアイコンフォントであればファイルサイズをほとんど気にせず利用することができます。 今回は、Webアイコンフォントの基本と、2022年現在のおすすめWebアイコンフォントサービスをご紹介したいと思います。 【2024】無料で使えるフリーアイコン素材サイト30個まとめ【商用利用OK】 アイコン素材はWebデザインのあらゆる場所で活用することができます。ボタンやリストの見出し、ラベルなどにアイコン素材を取り入れれば、より使いやすくデザインも優れたWebサイトを作ることができますね。 ... Web Design Trends Webアイコンフォントとは Webアイコンフォントとは、HTMLのタグ
Web上でアニメーションを表示するなら「Lottie」がおすすめ！特徴や使い方など | Web Design Trends
Web上でアニメーションを表示するなら「Lottie」がおすすめ！特徴と使い方など Webサイト上でアニメーションを実装する場合、簡易なアニメーションはCSSやJavaScriptで手軽に作ることができますが、リッチなアニメーションを作ろうと思ったらコード量も結構なボリュームになってしまいます。 そんな時におすすめなのが「Lottie」です。LottieはAfter Effectsで作成したアニメーションを簡単にWebやアプリで表示することができ、パフォーマンスにも優れています。 今回は、Lottieの特徴や使用するメリット、使い方などをご紹介したいと思います。 Lottieとは LottieはAirbnbが公開しているアニメーションを表示するためのライブラリです。スマホなどのネイティブアプリがメインのようですが、Webサイト上でも高クオリティのアニメーションを簡単に表示することができ、非
「STUDIO」がついに正式版をリリース！作成したデザインをそのままWebサイトとして公開可能に | Web Design Trends
TOP > デザイン > デザインツール > 「STUDIO」がついに正式版をリリース！作成したデザインをそのままWebサイトとして公開可能に STUDIOとは、STUDIO株式会社が提供する国産デザインツールです。デザインツールといえば、SketchやAdobe XD、InVision Studioなどが人気のデザインツールですが、それらのツールに引けを取らない操作性や使いやすさがSTUDIOの大きな特徴の1つです。 2017年1月にベータ版をリリースしていましたが、それから1年の間に様々な追加機能を加え、ついに正式版のリリースとなりました。 さらに、今回の正式リリースに合わせて追加されたパブリッシュ機能は、STUDIO上でWebサイトのデザイン作成から公開までできてしまうという驚きの機能で、プログラムコードを一切書かずにWebサイトの公開が完了してしまいます。 今回は、正式版がリリース
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
