note
制作ノート
制作の現場で使ってきた知識や実装、ツールのことをまとめています。
最新記事一覧
-
発注・ディレクション
デザイン制作のイメージ共有で使うキーワード43個
ロゴやウェブページのデザインを検討する際、「どんな雰囲気にしたいのか」や「どんな印象を与えたいのか」を明確に言葉で示すのは、思った以上に難しいものです。依頼する側と制作する側が、頭の中にあるイメージを共通認識として持つた…
-
発注・ディレクション
ロゴ制作のときに聞きたいヒアリング項目
ロゴデザインを依頼する際に大切なのは、デザイナーにあなたの事業について情報を伝えること。そのために欠かせないのが「ヒアリング」です。
-
SEO・サイト運用
Webデザイナーが施す9つのSEO対策
フリーランスWebデザイナーである私が施しているSEO対策について紹介します。
-
デザイン・参考
デザインの参考になるギャラリーサイト
デザインの参考になるギャラリーサイト私が実際に活用しているデザインギャラリーサイトを厳選して8つご紹介します。
-
CSS・実装
見出しに使えるfit-contentを解説してみる
コンテンツの幅に合わせたサイズを指定できるfit-content。無駄なタグを省くことができて、便利に使えるこのコードを私は見出しデザインで使用しています。今回はfit-contentについて実例つきで紹介していきます。
-
発注・ディレクション
ロゴデザイン制作料金の違いについて
ロゴは、企業やブランドの顔となる重要な要素です。そのため、多くの方が慎重にデザインを選び、制作を依頼されています。
CSS・実装
現場で使ってきたCSSや実装の工夫、コーディングのメモです。
-
CSS・実装
見出しに使えるfit-contentを解説してみる
コンテンツの幅に合わせたサイズを指定できるfit-content。無駄なタグを省くことができて、便利に使えるこのコードを私は見出しデザインで使用しています。今回はfit-contentについて実例つきで紹介していきます。
-
CSS・実装
CSSのみでカルーセルスライダーを実装する
画像を横にスライドさせて一箇所で複数の画像を見せることができるカルーセルスライダー。複雑な機能を実装するにはjQueryが必要ですがシンプルなものであればCSSだけで実装することができます。
-
CSS・実装
円グラフをCSSのみで表現する
円グラフをCSSで実装する方法です。画像より優れているのは後ほど編集する際CSSの値を偏光するだけと手間が省ける点です。運用の手間を考慮するならCSSでの円グラフをおすすめします。
Web制作ツール
制作を助けてくれるツールやサービス、拡張機能の紹介です。
-
Web制作ツール
Web制作の現場で使える無料のWebサービス13選
CSSコーディングに役立つサービスやWebサイト運用で役立つSEO関連のツールなど、Web制作の現場で使えるWebサービスを13個紹介します。ワンクリックで取得できるコードや、ドラッグ&ドロップだけで完結するものなど、直…
-
Web制作ツール
配色ツール。配色難民のためのウェブツール8選
デザイン作成時に悩みがちな色選びを助けてくれる配色ツールを8つ紹介します。単なる色の組み合わせだけでなく、ウェブサイトやイラスト、モックアップなどのデザインにも適用して確認できるツールもあります。デザイナーに限らず、さま…
-
Web制作ツール
ダウンロードコンテンツ販売に便利！無料のBASE Apps 28選+1
BASEは、月額費用無料で、販売手数料のみで運営可能なネットショップ作成サービスです。コストをできる限り抑えたい、スモールスタートを目指すクリエイターに最適なサービスと言えます。
デザイン・参考
デザインの参考サイトや、フォント・素材・表現のことをまとめています。
-
デザイン・参考
デザインの参考になるギャラリーサイト
デザインの参考になるギャラリーサイト私が実際に活用しているデザインギャラリーサイトを厳選して8つご紹介します。
-
デザイン・参考
デザインとして動画を設置する際に気をつけている7つのポイント
Webサイト上にデザインとして動画を活用する例は多くなってきました。クライアントからメインビジュアルや主要セクションに動画の設置を希望されることが増えてきて、需要があることは実感しています。
-
デザイン・参考
Figmaプラグイン17選。Webデザイナーが使い続けているプラグインを紹介
Figmaをデザイン作成のメインアプリに変えてから数ヶ月経過し、Figmaプラグインの見直しをおこないました。新たに発見したもの含め、私が使い続けているプラグインを17個紹介します。
発注・ディレクション
サイトやロゴを発注する前に知っておきたい準備や考え方のこと。
-
発注・ディレクション
デザイン制作のイメージ共有で使うキーワード43個
ロゴやウェブページのデザインを検討する際、「どんな雰囲気にしたいのか」や「どんな印象を与えたいのか」を明確に言葉で示すのは、思った以上に難しいものです。依頼する側と制作する側が、頭の中にあるイメージを共通認識として持つた…
-
発注・ディレクション
ロゴ制作のときに聞きたいヒアリング項目
ロゴデザインを依頼する際に大切なのは、デザイナーにあなたの事業について情報を伝えること。そのために欠かせないのが「ヒアリング」です。
-
発注・ディレクション
ロゴデザイン制作料金の違いについて
ロゴは、企業やブランドの顔となる重要な要素です。そのため、多くの方が慎重にデザインを選び、制作を依頼されています。
SEO・サイト運用
検索やサイト運用まわりで押さえておきたいことを整理しています。
-
SEO・サイト運用
Webデザイナーが施す9つのSEO対策
フリーランスWebデザイナーである私が施しているSEO対策について紹介します。
-
SEO・サイト運用
WordPressサイトのセキュリティ対策 – 最低限設定しておきたい5つ
WordPressで最低限おこなっておきたいセキュリティ対策について紹介します。難しい設定はなくWordPress初心者向きの内容です。ただ、かならず対応しておきたいものばかりなので、WordPress実装の際にチェック…
-
SEO・サイト運用
headに設定しておきたいHTMLメタデータやOGP、構造化データ
<head>内で最低限設定しておきたいHTMLタグを紹介します。