-
ホームページの絞り込み機能とは?その場で切り替わる一覧を動画で解説
ホームページの施工事例やメニューが増えてきて、お客様が探しにくくなっていませんか? はい、キッチンの事例だけ見たいのに、全部並んでいると言われました。絞り込み機能というのを付ければよいのでしょうか。 そうです。「キッチン」「浴室」などのボ... -
デザインの意図を汲み取るコーダーが意識する「余白」と「タイポグラフィ」
仕上がったページを見て「カンプ通りなのに、なんか違う」と感じたことはありませんか。 あります。原因はタイポグラフィにあると言われたのですが、それってどういう意味ですか? 文字の大きさや行間、字と字の間隔といった「文字の組み方」のことです。... -
制作会社のディレクターが喜ぶコンポーネント設計の5つの条件
公開したあと、「ここの文言を変えたい」という依頼が来るたびに、コーダーへ見積もりを取っていませんか。 はい、まさにそれで困っています。小さな修正なのに毎回やり取りが発生して、クライアントにも待ってもらう形になってしまって。 それは設計の段... -
Wixから静的HTMLサイトへ移行する手順5つ|速度と信頼感を両立
Wixで作ったサイトの表示が遅いというご相談、実はとても多いんです。スマートフォンで表示に3秒以上かかると、半数以上の方が閉じてしまうという調査結果もあります。 半数以上ですか…。うちのサイトも開くのに時間がかかっている気がします。Wixから他へ... -
納品後の修正費用はここで決まる。整理されたディレクトリ構造とは
「電話番号を1か所直すだけ」の修正見積もりが数万円だった、という経験はありませんか? まさに先日ありました。簡単な修正だと思っていたので、正直高いなと……。 実はその金額、作業の難しさではなく、納品データの「ディレクトリ構造」で決まっているこ... -
制作会社のディレクターが泣いて喜ぶ、気の利いたコンポーネント設計5選
「ボタンの色を変えるだけ」の修正依頼に、何日もかかった経験はありませんか? あります……。しかも後から直っていないページが見つかって、何度もやり取りすることになりました。 それはコーダーの腕というより「コンポーネント設計」の問題かもしれませ... -
アニメーションは最小限に。速度と使いやすさを両立する実装術
サイトに動きを付けたいというご相談、とても多いんです。ただ、動かしすぎるとページが重くなって、かえって印象が悪くなることがあります。 えっ、動きを付けると重くなるんですか?おしゃれにしたいだけなのですが……。 動きの種類によるんです。選び方... -
素のCSSという選択肢|フレームワーク不要でも戦える強みと活用シーン
最近「Tailwindを使いましょう」とよく聞きますが、実は全部のサイトに必要なわけではないんですよ。 そうなんですね。うちは小さなコーポレートサイトなのですが、それでも流行りのものを使ったほうがいいのでしょうか? 規模によっては、素のCSS——... -
デザインカンプからのコーディングでよくあるトラブルと解決策5選
「カンプ通りに作ったのに、なぜか崩れる」というご相談、本当に多いんです。 そうなんです。デザインはきれいなのに、文字を入れ替えたら一気に崩れてしまって。 それ、ほとんどが「決まったパターン」で起きています。原因さえ分かれば、ほぼ防げますよ... -
「崩れない」は設計でつくる|堅牢なHTML/CSS設計の裏側
以前のサイト、スマホで見ると一部が崩れていた、とおっしゃっていましたね。 そうなんです。パソコンではきれいなのに、スマホだと文字が枠からはみ出していて。あれって、作る人の腕で防げるものなのでしょうか? はい、防げます。崩れるか崩れないかは... -
納期遅延を防ぐ!優秀な外部コーダーを見極める3つの質問
外部のコーダーさんに発注するとき、いちばん怖いのは何だと思いますか? やっぱり、納期に間に合わないことでしょうか。以前、連絡が取れなくなってしまった方がいて……。 そうなんです。実は、その「音信不通」や「遅延」のほとんどは、発注前のたった3つ... -
セマンティックHTMLの重要性と書き方|アクセシビリティ向上の第一歩
最近、納品物のチェックでよく「セマンティックHTMLになっていない」って指摘を受けることがあるんですよね。 セマンティックHTMLって、普通のHTMLと何が違うんですか? ひとことで言うと、「タグに意味を持たせて使う書き方」のことです。たとえば見出し...
12