css/コーディング【PageSpeed insights】サイト速度改善のためにしたこと
せっかくサイトを作ったのに、サイトスピードが激重くんだったら・・・ ということで、googleのPageSpeed Insightsの結果をもとにサイト速度改善に取り組んでみました。SEO対策と...
css/コーディング
Wordpressfont-family指定の覚書
完全なる自分のための覚書です。 フォント指定って、悩ましいですよね。 どのデバイスでの指定したフォントで出て欲しい。。。 ※注意※字詰めができないフォント Noto Serif JP、...
css/コーディング.htaccess覚書
どうも苦手だけど、避けて通れない.htaccessファイル・・・ その場しのぎじゃなくてちゃんと意味を理解してかかなきゃなぁ。 ということで少しづつ勉強していってます。 その覚書なの...
css/コーディング文字ブロックに優しい処理
フォントに対する指定ってサイズとか色とか行間とか・・・そんな程度しか 知らなかったのですが、人様のコードなどを拝見していると 「それいいね！」っていう処理が施してあったりして、勉強になりま...
css/コーディング擬似要素で作る三角矢印２つ
擬似要素でちょっとした三角部分を作りたいとき、 rotateの角度とか考えるのが面倒なのでストックとして。 タイトルタグのデザイン的な三角 See the Pen 左右向き矢印 by h...
css/コーディングiziModalでsafariだけ表示がちらつく
自分のポートフォリオをsafariで見てみたら、モーダルを開いた時にチラツキが出ているのを発見。 モーダルの実装にはプラグインのiziModalを使用しています。 こんな感じ ...
css/コーディングjQueryでアコーディオンメニュー
ワードプレスのスマホメニュー実装時、クリックでぱかっと上下に開くアコーディオンメニューについて色々悩んだのでメモ。 ワードプレスのアコーディオンメニュー 子メニューがある親要素のみ、"＞"...
css/コーディングiframeの設定おぼえ書き
地図の埋め込みなどで使うiframeのcssについてメモ。 基本 iframe { max-width: 100%; max-height: 600px; } @media scr...
css/コーディングコーディング後、ブラウザごとに違う表示を修正する
コーディング中は基本的にchromeでしか表示確認していません。 「コーディング終わった！別ブラウザでもチェックだ！」と見てみると、まさかの表示崩れが・・・ みたいなことありますよね。 ...
css/コーディング【flex 】ヘッダーの高さをロゴ(可変)の高さに合わせてレスポンシブしたい
ヘッダーのコンテンツをフレックスで横並び。よくあるパターンですよね。 今回、そのよくあるパターンだと思ってたヘッダーでかなりハマってしまったので、備忘録として。 ヘッダーロゴ画像のサイズに合わ...