#Webデザイン

画像からフォント検索できるサービスを紹介 デザインでは、適切なフォント選びがアウトプットの印象を大きく左右します。しかし、フォントを選ぶのも大変な作業ですよね。参考画像を集めても、そこで使われているフォント名を知りたいというケースも少なくないと思います。What Font isWhatTheFontAdobe FontsAdobe Captureここでは、画像からフォントを見つけ出すのに役立つ4つのWebアプリをご紹介します。各アプリは、提供形態や対応言語、特徴などが異なりますので、自分のニーズ

近年はフォントのサブスクリプションサービス導入も増えて、さまざまな種類の日本語フォントをデザインに取り入れることが以前よりも容易になったのではないでしょうか？しかし、フォントファイルの配信が必要なWebフォントとしての利用には、サービス提供者によるサブスクリプションサービスの導入が必要となる場合もあり、クライアントワークなどでは導入が難しい場合も多いですよね。このような時にも、無料のGoogle Fontsで提供されているフォントであれば安心してデザインに取り入れることができます。この記事では、

ノーコードとは、プログラミングをしたり、コードを書かずにWebサイトやアプリケーションが開発できる手法のことです。IT人材の不足や開発費用の削減が求められる中で、ノーコードの利用は急速に広がっています。とくに、自社のプロダクトを持つ企業の営業企画部やマーケティング部署などで、低コスト・短納期での開発が必要とされるケースで効果を発揮します。ノーコードツールとは？ノーコードツールとは、ドラッグ＆ドロップなどの直感的な操作で、Webサイト制作やアプリケーション開発ができるツールのことを指します。たとえ

処理結果を確認しながら画像の変換・圧縮ができる『Squoosh』とは？Squoosh（スクワッシュ）とは、Googleが開発した画像変換・圧縮用のWebサービスで、変換前後の画像をリアルタイムで比較しながら設定を調整できるという特徴があります。Webで使用する画像サイズは軽ければ軽いほど良い一方、デザイン的な観点から画質もある程度担保したいというようなニーズも多いと思います。Squooshは、プレビュー画面で変換前後の画質をリアルタイムで確認しながら圧縮設定を調整することができるので、ファイルサ

みなさんは、最近よく聞く言葉である『アクセシビリティ』に関する正しい知識を持っていますか？社会の多様化に伴い、Webサービスやアプリケーションをデザインするデザイナーにも、アクセシビリティに関する知識が求められるようになってきました。この記事では、主にWebデザイナーの方に向けて、アクセシビリティの基本からWebサイト制作におけるWebアクセシビリティ実現のポイントをご紹介します。アクセシビリティとは？サービスが「利用可能な状態」であることアクセシビリティとは、利用者にとってサービスが「利用可能

WebP（ウェッピー）とは？WebP（ウェッピー）とは、Googleが開発した画像フォーマットの一種で、Web上での利用に適している形式です。高い圧縮率背景透過に対応アニメーションに対応上記の特徴があるため、Webサイトの制作者やデザイナーにとって、効率的な画像管理と高い表現力を両立するための重要な選択肢となっています。圧縮率が高く画像が軽量WebP最大の特徴とも言えるのが、圧縮率が高く画像が軽量であることです。JPEGやPNGといった従来のフォーマットと比べて、同じ画質でもファイルサイズを大幅

Webデザインを仕事にするうえで、資格は必要なのでしょうか？本記事では、Webデザインの資格の必要性・有利になる資格6選をご紹介します。将来性のあるWebデザイナーになるために必要なスキルについても解説します。これからWebデザイナーを目指したい方Webデザイナーとしてのキャリアアップをしたい方フリーランスのWebデザイナーとして活躍したい方におすすめの内容です。Webデザイナーになるには資格が必要？結論から言うと、Webデザイナーとして働くうえで、Webデザインの資格は必須ではありません。しか

Webサイトにとって検索エンジンが重要なユーザー獲得経路であることはよく知られていると思います。しかし、WebサイトをデザインするデザイナーにはSEOに効果的なサイトの設計方法やデザインはあまり知られていないのではないでしょうか？デザイナーの中にも、「Webサイトをデザインする際にSEOに関する知識がなくて不安」という方は多いかと思います。今回は、そんなデザイナー向けに「デザイナーも知っておくと安心なSEOに効果的なWebデザインのポイント」を5つ紹介します。大前提として、Googleは「ユーザ

レスポンシブデザインとは？レスポンシブデザイン（レスポンシブWebデザインとも）とは、Webサイトを様々なサイズのデバイス環境に対応させるための技術です。WebサイトはHTMLで表示内容を記述し、CSSを使ってレイアウトや見た目を指定します。このCSSを画面サイズに合わせて変更させることで、同じWebサイトでありながら画面サイズに合わせた複数の見た目を表現することができるようになります。レスポンシブデザイン vs アダプティブデザインレスポンシブデザイン以外にWebサイトを様々なデバイス環境に対

ワイヤーフレームとは？ワイヤーフレームとは、Webサイトやモバイルアプリの画面ごとの構成要素を定めた設計図です。プロダクトの情報設計の段階でのチーム内での合意形成や、デザイナーへの指示書としての役割を持つことが多いです。近年のITサービス開発の現場では、具体的なデザインを作成する前にモックアップでのユーザーテストを行うことが増えたことから、プロトタイプとしての役割を持つことも多くなっています。ワイヤーフレームの３つの役割プロジェクトの内容やチーム構成によっても異なりますが、ワイヤーフレームの役割

情報設計とは？情報表示と動線情報設計（Information Architecture / IA）とは、デザインが適切にユーザーに情報を伝えられるような情報表示と動線の設計のことです。ジャンルを問わず、デザインには常に目的が与えられており、単にわかりやすいだけではなく、その目的を果たす上で有効な設計を行うことが情報設計の重要なポイントとなります。UIデザインと情報設計（IA）の違いIAと同じく情報表示や動線の設計を通して、ユーザーが目的を達成しやすいデザインを作るという意味合いで使われる言葉にU

Webデザインとは？Webデザインとは、ブラウザを使って表示されるWebサイトのデザインとその制作プロセスのことを意味します。Webサイトが以前と比べ、ビジネス的な目的を強く持つようになった現在では、見た目の良いサイトを作るだけではなく、戦略的に成果を上げるようなWebデザインを設計するためのデザイン技術が求められるようになってきています。UIデザインとの違いUIデザインとは、ユーザーがサービスをスムーズに使い、その価値を最大限に享受できるようにプロダクトの設計をすることを意味します。こちらは、