言語

言語 カテゴリー記事(更新日順)

  1. Youtube 動画の埋め込みで遅いページの高速化
    Youtube 動画の埋め込みで遅いページの高速化
    カテゴリ: CSS, JavaScript, ホームページ
    更新日:
    Youtube の複数の動画を埋め込むとページ自体が非常に遅くなる(重い)時の高速化(軽量化)の方法. 原因は iframe で各動画を読み込みに行くため. 「youtube 複数 埋め込み 高速化」「youtube 複 […]
  2. 「オフスクリーン画像の遅延読み込み」への対策
    「オフスクリーン画像の遅延読み込み」への対策
    カテゴリ: HTML, ホームページ
    更新日:
    PageSpeed Insights の「改善できる項目」の中の「オフスクリーン画像の遅延読み込み」で 「オフスクリーンの非表示の画像は、重要なリソースをすべて読み込んだ後に遅れて読み込むようにして、操作可能になるまでの […]
  3. CLS (Cumulative Layout Shift) の改善
    CLS (Cumulative Layout Shift) の改善
    カテゴリ: HTML, ホームページ
    更新日:
    PageSpeed Insights 対策の一環. CLSとは(累積レイアウト変更とは) PageSpeed Insights に出てくる Cumulative Layout Shift 解説ページである Web Vit […]
  4. PHPでExcelを読み書きできるPhpSpreadsheetのインストールと簡単な使い方
    カテゴリ: php
    更新日:
    PhpSpreadsheetとは PhpSpreadsheetとは、ExcelやLibreOfficeCalcなどのスプレッドシートファイルを簡単に読み書き操作できる、PHPのフリーのライブラリです。 これとは別に PH […]
  5. 開発者ツールで要素を書き換える方法
    開発者ツールで要素を書き換える方法
    カテゴリ: CSS, HTML, 知識, 言語
    更新日:
    Chromeの開発者ツールで書き換える方法 Chrome のデベロッパーツールで HTML を一時的に書き換える方法をご紹介します。HTML ファイルを直接書き換える前に、ブラウザ上で変更の実装前確認、変更箇所の特定を行 […]
  6. 【WordPress】投稿の一覧ページにリセットされない連番を振る方法
    【WordPress】投稿の一覧ページにリセットされない連番を振る方法
    カテゴリ: CSS, php
    更新日:
    アーカイブページで連番を振る方法 wordpressで検索結果一覧を表示したいときや、人気度に応じてランキング形式で表示したいときなど、投稿タイトルの先頭に連番を振りたい場面があると思います。 しかし、1ページ目は問題な […]
  7. 【Safari】iPhone で 電話番号にリンクが自動挿入される問題
    【Safari】iPhone で 電話番号にリンクが自動挿入される問題
    カテゴリ: HTML, 知識
    更新日:
    iPhone の Safari で電話番号にリンクが自動挿入されてしまう問題 ホームページ制作時、電話番号をページのフッターに常に配置してスマートフォンで閲覧した際にタップで電話がかけられるデザインを作成しました。問題な […]
  8. PHPでExcelを読み書きできるPhpSpreadsheetの使い方・サンプルコード
    カテゴリ: php
    更新日:
    前回はPHPでExcelを読み書きできるPhpSpreadsheetのインストールと簡単な使い方を説明しました。 今回はより詳しい使い方を説明します。 Excelファイルをインポートする 既存のExcelファイルを読み込 […]
  9. レスポンシブな多階層ハンバーガーメニューの作り方【CSSのみ】
    レスポンシブな多階層ハンバーガーメニューの作り方【CSSのみ】
    カテゴリ: CSS, HTML, ホームページ
    更新日:
    スマホで現れるハンバーガーメニューとは スマホでホームページを見ていると右上に「三」のようなマークを見ることが多いと思う. これを見かけがハンバーガーのようだからハンバーガーメニューと呼ぶようだ. 恐らく,箇条書きのメニ […]
  10. 【CSS】ボタンクリックでパスワード(テキスト)の表示・非表示を切り替える
    【CSS】ボタンクリックでパスワード(テキスト)の表示・非表示を切り替える
    カテゴリ: CSS, HTML, 知識
    更新日:
    【CSS】ボタンクリックでパスワード(テキスト)の表示・非表示を切り替える ログイン画面で、パスワード表示ボタンをクリックするとパスワードが表示されるという機能は、現在では当たり前になっています。 ですが、もしパスワード […]
  11. 【CSS】文字に下線(アンダーライン)を引く方法【HTML】
    【CSS】文字に下線(アンダーライン)を引く方法【HTML】
    カテゴリ: CSS, HTML
    更新日:
    CSS で 文字に下線(アンダーライン)を引く方法 本文中のテキストや見出しに CSS で下線を付けたり下線の位置を調整したいときがあると思います。アンダーラインは text-decoration や border を利 […]
  12. アンケートフォーム
    アンケートフォーム
    カテゴリ: HTML, JavaScript, システム, ホームページ, マーケティング
    更新日:
    問い合わせやアンケートを自由に簡単に作成したい! アンケートフォームとは 資料請求やお問い合わせなど引き合いを出したい時に必要な情報だけを記入して,ボタンを押すだけでそのホームページを持っている会社や人宛にメッセージを送 […]
  13. メールフォーム作成方法について
    カテゴリ: HTML, JavaScript, php, python, ホームページ, 知識, 言語
    更新日:
    メールフォームとは ホームページにあるお問い合わせ用のメールフォームは企業にとっての受付窓口です. どのような受付窓口であるかは引き合いの数や質を左右する重要な要素です. 実店舗でも入りやすい入り口,入りにくい入り口があ […]
  14. 【WordPress】リッチリザルト対応の自動パンくずリスト生成
    【WordPress】リッチリザルト対応の自動パンくずリスト生成
    カテゴリ: HTML, php, 知識
    更新日:
    このところ,リッチリザルトの投稿が続いている. そこで今更ではあるが「パンくずリスト」についても書いてみる. 折角なので WordPress を使っている場合に自動でパンくずリストを生成する方法を書いてみよう. プラグイ […]
  15. Using ${var} in strings is deprecated, use {$var} instead
    Using ${var} in strings is deprecated, use {$var} instead
    カテゴリ: php
    更新日:
    php8.2 へのバージョンアップで陥る問題の一つ. まだ DEPRECATED で非推奨だと言っているだけだが PHP を使い続けるなら,早めに考えておいた方が良い. PHP 8.2.x で推奨されなくなる機能 解説元 […]
  16. Automatic fetching of PostgreSQL connection is deprecated
    Automatic fetching of PostgreSQL connection is deprecated
    カテゴリ: php
    更新日:
    php8.1 へのバージョンアップで陥る問題の一つ. まだ DEPRECATED で非推奨だと言っているだけだが PHP を使い続けるなら,早めに考えておいた方が良い. 解説元ページ pg_escape_string の […]
  17. Uncaught Exception: Connect to DB failed
    Uncaught Exception: Connect to DB failed
    カテゴリ: php
    更新日:
    php8.1 へのバージョンアップで陥る問題の一つ. PostgreSQL を使っている場合,これがこのバージョンアップで最も面食らう仕様変更ではないか? pg_connect の返り値がリソースから PgSql\Con […]
  18. Passing null to parameter #n ($string) of type string is deprecated
    Passing null to parameter #n ($string) of type string is deprecated
    カテゴリ: php
    更新日:
    php8.1 へのバージョンアップで陥る問題の一つ. まだ DEPRECATED で非推奨だと言っているだけだが PHP を使い続けるなら,そろそろ直したほうがいいだろう. 解説元ページ Passing null to […]
  19. 【WordPress】新着情報で2週間以内の投稿記事に new をつける方法
    【WordPress】新着情報で2週間以内の投稿記事に new をつける方法
    カテゴリ: CSS, HTML, php, ホームページ
    更新日:
    WordPress を使っている企業のホームページなどでは新着記事に new というマーク(アイコン)をつけて目立たせたいと思う方もいるだろう. しかし,プラグインはいろいろ面倒なので入れたくない. そういう場合にコピペ […]
  20. 【HTML】アコーディオン表示をやめたほうがいい理由
    【HTML】アコーディオン表示をやめたほうがいい理由
    カテゴリ: CSS, HTML, ホームページ
    更新日:
    ウェブにおけるアコーディオン表示とは HTML 界でのアコーディオン表示とは呼んで字のごとく,楽器のアコーディオンのように折り畳みが出来るような表示の仕方を表す. (CSSだけでアコーディオン表示をするHTMLの書き方は […]
  21. 「ページ上で視認性の高い動画は検出されませんでした」の解決方法
    「ページ上で視認性の高い動画は検出されませんでした」の解決方法
    カテゴリ: HTML, ホームページ
    更新日:
    「ページ上で視認性の高い動画は検出されませんでした」はサーチコンソールで左側メニューの 動画ページ ↓ 動画ページのインデックス登録 を表示した時に インデックス登録された動画はありません と警告をいわれる場合の理由とし […]
  22. 「適切なサイズの画像」の警告を受けたとき
    「適切なサイズの画像」の警告を受けたとき
    カテゴリ: HTML, ホームページ
    更新日:
    PageSpeed Insights の警告の中でも最もよく受けると言っても過言ではない「適切なサイズの画像」の警告に関して,ここで対策を書いてみる. どうもよく勘違いされる方がいるが「適切なサイズ」とはファイルサイズの […]
  23. CSS のみでアコーディオン表示する
    CSS のみでアコーディオン表示する
    カテゴリ: CSS, HTML, システム
    更新日:
    ウェブページでアコーディオン表示を使う場合は気をつけましょうというページを書いておいてどうなのかということだが,一応,javascript (jQuery) を使わない「アコーディオン表示」の書き方を説明する. アコーデ […]
  24. Lightbox のような高級感を CSS のみで実現
    Lightbox のような高級感を CSS のみで実現
    カテゴリ: CSS, HTML, ホームページ
    更新日:
    lightbox 風な動作を CSS のみで実現してみた.(javascript や jQuery を使わないで) ライトボックスは画像の拡大表示で手軽に高級感を醸し出せるので使っているサイトは結構あると思う. 前回書い […]
  25. 【CSS】入れ子のリストを複数列に並べる
    【CSS】入れ子のリストを複数列に並べる
    カテゴリ: CSS, HTML
    更新日:
    入れ子のリストを複数列に並べる 下記のようなリストを画面幅に応じて複数列に並べます。 column-count で複数列に並べることもできますが、何列に並べるか指定する必要があり、画面幅に応じた列数に並べることはできませ […]
  26. 【JavaScript】目のマークでパスワードの表示を切り替える実装方法
    【JavaScript】目のマークでパスワードの表示を切り替える実装方法
    カテゴリ: HTML, JavaScript
    更新日:
    目のマークでパスワードの表示非表示の切り替え実装 以前、表示・非表示ボタンでパスワードの表示を切り替える方法をご紹介しましたが、今回は目のマークを使用したパスワード表示非表示の実装方法をご紹介します。 javascrip […]
  27. 【WordPress】サイトマップ生成をプラグインなしで実装
    【WordPress】サイトマップ生成をプラグインなしで実装
    カテゴリ: php, ホームページ
    更新日:
    ふと,サイトマップのファイルを見てみたら,制御文字(タブとか)が XML の中に紛れ込んでいることに気が付いた. WordPress のプラグインで,最近 Google XML Sitemaps の更新があったな,と設定 […]
  28. VIDEO タグの動画で大きな再生ボタンを配置する方法
    VIDEO タグの動画で大きな再生ボタンを配置する方法
    カテゴリ: HTML, JavaScript
    更新日:
    動画をホームページに置きたい場合,Youtube を利用するのが手軽ではあるが,自分のサイトにファイルを置きたい場合の方法を書く. 再生ボタンを中心に配置した VIDEO タグでの動画表示 Chrome で video […]
  29. CORS エラーが出たときの対処法
    CORS エラーが出たときの対処法
    カテゴリ: CSS, 知識
    更新日:
    No 'Access-Control-Allow-Origin' header is present on the requested resource. が出たときの対処法 font-awesome の呼び出し時、上記 […]
  30. 【レスポンシブ対応】メガメニューの簡単な作り方【CSSのみ】
    【レスポンシブ対応】メガメニューの簡単な作り方【CSSのみ】
    カテゴリ: CSS, HTML
    更新日:
    【レスポンシブ対応】CSSのみでのドロップダウンメニューを作成 のページに「メガメニュー」で検索して辿り着く人がいるので,メガメニューという名前がついているドロップダウンメニューの作り方も合わせて記事にする. (2020 […]
Pagetop