JavaScript スクロールに合わせて背景色を計算して変える方法
Webサイトを作成していると背景にちょっとした工夫を入れたくなることありますよね。今回はgsapなどを使用せず、スクロールに合わせて背景色を変える方法をいくつか作成してみました！基本形まずは基本形です。スクロールに合わせてbodyに指定され...
Ayane
JavaScript 
WordPress ACFでショートコードを埋め込む方法
WordPressのカスタマイズをしているとフォームやSNSの埋め込みなど、カスタムフィールドに入力した内容を表示させたいと思うこともあると思います。専用のテキストエリアを作成し、その内容を通常の記述で呼び出し…とすると、ショートコードのテ...
WordPress All In One SEOを使うときカテゴリーにOGP画像を設定する方法
WordPressでサイトを作るとき、SEOまわりの設定でAll In One SEO（AIO SEO）をよく使用しています。AIO SEOの無料版ではカテゴリーやタグ、タクソノミーの一覧ページにタイトルとディスクリプションの設定はできても...
HTML pictureタグとfigureタグの使い分け方とは？
HTMLで画像を使用する際に役立つタグに、<picture>と<figure>があります。どちらも画像に関連したタグですが、用途や意味合いが異なるため、適切に使い分けることが大切です。今回はそれぞれのタグの特徴と、正しい使い分け方について解...
その他 SSLとは—Webサイトのセキュリティを高めるための基本知識
インターネット上でデータの安全を確保するため、WebサイトのSSL化は今や不可欠なものとなっています。SSL化することで、ユーザーとの通信が暗号化され、セキュリティが向上します。今回はSSLとは何か、導入のメリット、導入手順について詳しく解...
HTML HTMLのpictureタグとは？使い方と使う時の注意事項
HTML5から追加された<picture>タグ。<picture>タグは、異なるデバイスや画面サイズに応じて最適な画像を表示するために使用する、画像をグルーピングするためのタグです。このタグをちゃんと使うことで、ブラウザの条件に合わせて適切...
HTML ul、ol、dlタグの特徴と使い分けのポイント
HTMLでリストを表現するタグには、<ul>、<ol>、および<dl>の3種類があります。それぞれ異なる意味と使い方を持ち、適切に使用することがHTML上のルールやSEO対策としても良しとされています。今回は各リストタグの特徴と具体的な使い...
CSS iOSのセーフエリアとは？CSSでのセーフエリア対策方法
iPhoneやiPadなどのApple製デバイスでは、画面の下部に「セーフエリア」と呼ばれるものが存在しています。適切な対策を行わずに下部に追従させるコンテンツなどを作成すると、ボタンやリンクを押せなくなってしまう場合もあります。そのため、...
その他 現役Webコーダーがよく使うWebツールまとめ
以前、コーダーなら入れておきたいGoogle拡張機能についてをまとめたのですが、仕事をする上でよく使うWebツールもいくつかあります。今回はそのツールについてをまとめて紹介します！↓Google拡張機能の記事はこちら作業開始時に使うツールP...
その他 GitHub初心者が最初に覚えておきたい用語まとめ
Web制作を仕事として行なっていると、切っても切り離せない存在の「GitHub」。今でこそ慣れてきたので問題ないのですが、Git Hub独自の用語や概念って最初は詰まってしまいますよね…。（最近、他のメンバーにレクチャーしている時にそれを感...