Webサイトを作るとき、「動くこと」はできても、細かい部分でつまずいて時間を取られることって多いですよね。
フォントの表示が一瞬乱れたり、フォームがスマホで押しにくかったり…。
私も最初のころは「どう直せばいいのか分からない小さな不具合」に悩まされていました。
でも少しずつ実務で使える工夫を覚えていくと、作業が驚くほどスムーズになったんです。
ここでは、現場でよく使う実務TIPSや改善の工夫をまとめました。
「ちょっと便利」「効率的にできた」と思えるヒントを集めているので、日々の制作で活用してみてくださいね。
CONTENTS
画像・フォント関連
- フォントのちらつきをできるだけ改善する
- 特殊フォントをアウトライン化してSVG画像として使う
- 画像の圧縮ツールの紹介と理由
- 画像の縮小（リサイズ）でも画質を保つテク
UI・操作性改善
- メニューボタンなどのクリック・ホバー範囲を使いやすくする
- フォームのチェックボックスをスマホで押しやすくする
- ページ内リンクをスムーススクロールにする
- メニューが開いているときに裏のスクロールを止める
外部リンク・Web基本設定
- 外部リンクを別タブで開くようにする
- 電話番号・メールアドレスのリンク化
- OGPの情報を忘れずに設定
- Google Analyticsタグの管理方法
- preloadでファーストビューを速くする
ツール・習慣・設計
- Web制作でよく使うツール・サイト集（神ブクマ集）
- category-wrapって何？使った場面の記録
- クラス名の命名ルール（BEMっぽい実務習慣）
おわりに
小さな工夫や習慣が積み重なると、制作のスピードも仕上がりのクオリティも大きく変わります。
「作業効率を上げたい」「もっと現場っぽく整えたい」と思ったときに、ぜひ見返してくださいね。