コーディングTips

今日はサイトの細かいUI・UXを見直した話

今日は新しい記事を書く代わりに、サイトを見返しながら細かいUI・UXの調整をいくつもやっていました。1つ1つは小さな修正なんですが、まとめて振り返ってみると「地味だけど効く」系のパターンが多かったので、備忘録がてら書いておきます。見出しの前...

FLOCSSのcomponent/project、線引きで迷ったときに立ち返っているルール

改めて自分の記事を読み返してみたら、なんだか説明書みたいで硬いなと思ったので、今日からちょっとトーンを変えてみます。もっと自分がしゃべってるときの感じに近づけたいので、これからはこのくらいゆるっとした感じで書いていくつもりです。というわけで...

Gitのコンフリクト解消、実務でよくあるパターン

このブログの運用でもGitを使い始めましたが、複数人での案件ではもっと頻繁にコンフリクト(競合)に遭遇します。今回は、実務でよく出くわすコンフリクトのパターンと、解消するときに意識していることをまとめます。そもそもコンフリクトはなぜ起きるか...

reCAPTCHAを特定ページだけに読み込ませる方法

お問い合わせフォームにスパム対策としてreCAPTCHA v3を導入したのですが、初期状態だとサイトの全ページでバッジとスクリプトが読み込まれてしまうことに気づきました。フォームがあるのはお問い合わせページだけなのに、他のページにも同じ読み...

Cocoonの目次(TOC)デザインをカスタマイズしたら、CSSの詳細度沼にハマった話

このブログはCocoonというWordPressテーマをベースにしているのですが、標準の目次(TOC)デザインがどうも今ひとつだったので、CSSでカスタマイズしました。見た目自体はシンプルに直せると思っていたのですが、実際にはCSSの詳細度...

flexboxで高さが揃わないときに確認する3つのポイント

flexboxでレイアウトを組んでいるとき、「隣り合う要素の高さが揃わない」という現象にぶつかったことがある人は多いと思います。原因はだいたいパターンが決まっているので、よくあるものをまとめておきます。そもそも高さは自動で揃うのが基本fle...