Web Design Trends

Webに関わるすべての人のためのメディア

Category

Web制作

WordPressサイトを高速化するための9つの方法

SEO対策において、ページの表示速度は注意すべき指標の1つです。 ページの読み込みに3秒以上かかると50%以上のユーザーが離脱してしまうと言われており、たった数秒の違いで与える影響の大きさは計り知れま...

簡単!WordPressサイトにSNSシェアボタンを追加する方法

WebサイトはSEO対策も重要ですが、SNSを活用したマーケティングも非常に重要です。 特にメディアやブログなどは、投稿にSNSシェアボタンを設置することにより、SNSからのアクセスアップを増やすこと...

【2020年最新】WordPressの使い方を徹底解説!初心者向けのおすすめ設定も

WordPressは初心者でも簡単にWebサイトを作ることができる人気のソフトウェアです。 しかし、機能がやや複雑で初めてWordPressに挑戦する人には導入時のハードルがやや高く、どのように設定す...

2020年最新!SEOに強いおすすめWordPressテーマまとめ

WordPressを使ってWebサイトを作成する時、みなさん最初に悩むのがテーマ選びだと思います。 今回は、WordPressのSEO対策が簡単に行えるSEOに強いおすすめのテーマをご紹介したいと思い...

2020年版!おすすめのWebアイコンフォントサービス7選

Webアイコンフォントは、気軽にWebサイト上でアイコンを表示するための便利なサービスです。 画像をたくさん表示してしまうと、ページ読み込み速度に影響してしまいますが、Webアイコンフォントであればフ...

2020年版!WordPressのおすすめブランクテーマ・スターターテーマまとめ

WordPressの自作テーマを作る場合、0から自分で作る方法でも作ることはできますが、WordPress独自のコードを記述する量が多くなってしまい、かなりの手間がかかってしまいます。 そんな時に使え...

もう迷わない!CSS Flexboxの使い方を徹底解説

CSS Flexboxは、CSSによるレイアウト作成でよく使われるCSSのレイアウト手法です。 レイアウトを作成する方法は他にもCSS Grid Layoutや、inline-blockを使用する方法...

CSSだけで画像をトリミングできる「object-fit」の使い方

Webサイトで画像を表示する場合に、用意された画像のサイズと表示したいサイズが異なることはよくあります。 もちろん、自分でトリミングした方が最適なサイズでアップロードできるというメリットもありますが、...

2020年版:おすすめの人気CSSフレームワークと特徴の総まとめ

様々な種類のCSSフレームワークが公開されていますが、種類が多すぎてどれを選べばいいのか分からないというパターンは多いと思います。 今回は、2020年おすすめのCSSフレームワークと、それぞれの特徴に...

【WordPress】カスタム投稿タイプの基本と使い方を徹底解説!パーマリンクのカスタマイズ方法も

WordPressの便利な機能の1つが、カスタム投稿タイプです。これによって、1つのサイトの中で複数のタイプの投稿を管理することができます。 ただ、設定項目が少し多く、パーマリンクの設定なども少し複雑...

Font Awesome 6がもうすぐ提供開始!新たなアイコンの種類やスタイルの登場も

Font Awesomeと言えば、Web上でアイコンを表示することができる人気サービスです。 そんなFont Awesomeから、新たに「Font Awesome 6」の登場が発表されました。 現在は...

CSS Grid Layoutを使った便利なテクニックやツールなど

CSS Grid Layoutを使えば、他の方法と比べてシンプルにコードを記述することができたり、柔軟なレイアウトを作ることができます。 知っておくと役立つテクニックや、ジェネレーター、CSSフレーム...

2020年版:CSS Grid Layoutの対応ブラウザやベンダープレフィックスについて解説!

CSS Grid Layoutは、CSSで柔軟にレイアウトを作ることができる便利なレイアウト手法です。 しかし、Flexboxと比べてブラウザ対応が遅れているなど、推奨環境について気になる方も多いので...

2020年版!おすすめのリセットCSSまとめ

リセットCSSとは、ブラウザによって異なるデフォルトのCSSを打ち消してブラウザ間の表示を揃えるためのCSSファイルのことを言います。 分かりやすい例だと、inputタグなどはSafariとChrom...

一番分かりやすいCSS Grid Layoutの使い方ガイド

CSS Grid Layoutは、CSSによるレイアウト手法の1つです。様々なレイアウトをこれ1つで実装することができます。 ただ、覚えなければならないことも多く、初心者の方にとっては少し難しく感じる...

【2020年版】Webサイトのファビコンや各種アイコンの作り方・設定方法

ファビコン(favicon)や、iOSやAndroidでホーム画面に保存した時に表示される画像、Windows8や10でスタート画面にピン留めした時の画像など、Webサイトでは様々なアイコン画像に関す...

オリジナルのシェアボタンを作ろう!各種SNSのボタン設置用URLまとめ

Facebook、TwitterなどのSNSに記事をシェアしてもらうのに必要なのが「シェアボタン」です。サービスごとにURLやパラメータが異なるため、オリジナルでシェアボタンを作成する場合はそれぞれ設...

Emmetの使い方を覚えてHTML/CSSの高速コーディングを身に付けよう

Emmetとは、HTMLやCSSのコード入力を補完してくれるプラグインです。Emmetを使うことによってコーディング作業を効率化することができ、使わない場合と比べるとコーディング速度にかなりの差が出ま...

2020年版:WordPressのおすすめプラグインまとめ

WordPressはプラグインを使うことによって、SEO対策から関連記事の表示、ページの表示速度改善など、様々な機能拡張を行うことができます。 ただし、プラグインの数が増えすぎると逆に処理が重くなって...

WordPressに一番おすすめのレンタルサーバーとは?

WordPressでWebサイトを作ろう!と思った時、最初に悩むのが「レンタルサーバー」です。 色々なサービスがあって、さらに難しい説明も多いため、どれを選べばいいのか分からないという方も多いのではな...

【2020年最新】Flexboxの対応ブラウザとベンダープレフィックスまとめ

CSS FlexboxはCSSでレイアウトを組む時に使われる主要な手法の1つです。 しかし、比較的新しいレイアウト法なので、一部のバージョンが古いブラウザでは正しく表示されないという課題も抱えています...

高クオリティで魅力的な有料写真素材・ストックフォトサービスまとめ

有料写真素材サイトとは、Webサイトや制作物で利用する写真素材を有料で手に入れることができるサービスです。 無料で素材を手に入れることができるフリー写真素材サービスも多く公開されていますが、有料素材の...

Web上でアニメーションを表示するなら「Lottie」がおすすめ!特徴や使い方など

Web上でアニメーションを表示するなら「Lottie」がおすすめ!特徴と使い方など Webサイト上でアニメーションを実装する場合、簡易なアニメーションはCSSやJavaScriptで手軽に作ることがで...

デザインにおけるフォントの選び方と「絶対フォント感」を身に付けるための方法

あなたはどのくらいのフォントの使い分けができていますか? 一般的に、デザインスキルに合わせて使い分けができるフォントの種類が増えていきます。ただし、意識してフォントに触れていかなければフォントを見分け...

1234

© 2020 Web Design Trends