Webエンジニアのブログ

WordPressで運用しているWebサイトでは、バグの修正や機能の追加、セキュリティ向上のため頻繁にWordPressのバージョンの更新を行なっていきます。 Webサイトを管理するなかでバージョンを最新に更新した際に、エラーなどの問題に直...
続きを読む>>

Webで使える画像のフォーマットは、JPEGやPNG、GIFなど多くのフォーマットがありますが、「WebP（ウェッピー）」という画像フォーマットの登場で画像の軽量化して、Webサイトの表示速度を改善することもできるようになりました。ここでは...
続きを読む>>

PHPプログラムに間違いがあればエラーとなりますが、MAMP（マンプ）やXAMPP（ザンプ）などのローカル開発環境のデフォルトの設定ではエラーの内容が表示されません。PHPの設定ファイル（php.ini）で表示/非表示の設定をする必要があり...
続きを読む>>

CSS3から追加されたFlexboxは、PCからタブレット端末、スマートフォン端末に対応したレスポンシブWebデザインのレイアウト構築に優れています。要素の横並びから要素の高さを揃えたり、また上下左右中央寄せなども手軽に実装することができま...
続きを読む>>

Webデザインでwebフォントを利用してデザインを構築していくことがよくありますが、そこで使えるのがCSSの@font-face規則です。ここでは、CSSの@font-face規則の使い方をGoogle Fontsのwebフォントを利用する...
続きを読む>>

Webページの表示を現在の日付と比較して、過去日・未来日で表示を変更するようなプログラムを組むことができたらすごく便利でしょう。ここではWordPressのプラグインを使わずに標準のカスタムフィールドを使って、日付をもとに過去日・未来日で...
続きを読む>>

Webサイトの引っ越しやリニューアル、Webページ単体でコンテンツ改修・デザイン変更を行ったりする時に、URLを変更することがありますが、その時にやっておきたいのが301リダイレクト設定です。ここでは、WebサイトのドメインやページURLを...
続きを読む>>

Webサイトでアニメーションを実装する中で、JavaScriptなどのプログラミングではなくCSSのみでデザインできることも増えてきました。Variable Font（可変フォント）を利用すれば、CSSのfont-variation-set...
続きを読む>>

WindowsやMacといったOSからアプリケーション、webサイトなどなどダークモード対応が進んできています。ここではCSS3のメディアクエリの特性「prefers-color-scheme」を利用して、端末のダークモード設定を判断し、w...
続きを読む>>

WordPressで構築しているwebサイトで固定ページで設定しているページにパスワードをかけるには、パスワード保護の設定をしますが、テンプレートを利用するとパスワード保護が有効になりません。ここでは固定ページにテンプレートを使用した時にパ...
続きを読む>>