IT実践記事一覧
最近主流のPC用ディスプレイ解像度は？【過去10年間の推移】
Web開発や効率が良いブログ記事執筆の環境構築の参考に
フレッツ光を使っている人はウイルス対策ソフトを買う前に確認
【Google公認】reCAPTCHA v3のバッジ（ロゴ）をコピペで簡単に非表示
Adobe CS2の非認証版ダウンロードは公開終了した模様
VMware Workstation Player 仮想マシンの複製【簡単3ステップ】
WordPress用GMapを使わない地図表示プラグイン公開

トップ
ECサイト構築
ホームページ制作
プライバシーポリシー

メインメニュー

トップ
ECサイト構築
ホームページ制作
プライバシーポリシー

ブログメニュー

IT実践記事一覧
最近主流のPC用ディスプレイ解像度は？【過去10年間の推移】
Web開発や効率が良いブログ記事執筆の環境構築の参考に
フレッツ光を使っている人はウイルス対策ソフトを買う前に確認
【Google公認】reCAPTCHA v3のバッジ（ロゴ）をコピペで簡単に非表示
Adobe CS2の非認証版ダウンロードは公開終了した模様
VMware Workstation Player 仮想マシンの複製【簡単3ステップ】
WordPress用GMapを使わない地図表示プラグイン公開

ホーム /
小技 /
Amazonプライムデー開催中

小技

Amazonプライムデー開催中

2022.07.13
2022.07.12

by iisys
0

スマートスピーカーが70%オフ！

小技

関連記事

Google Ad Grantsで支払情報を求められてしまう
最近トレンドなフィッシングメールをピックアップ
WordPressの引っ越し・ドメイン変更ツール「Search Replace DB」日本語版配布
常時SSL証明書の更新エラー対処法
Google AdSenseで広告が表示されたりされなかったり
WordPress管理画面のユーザー一覧をソート可能な任意の項目にする
WordPressをお名前.comのレンタルサーバーRSプランに引っ越しをする際の注意点
Photoshopなんていらない！フォトショップを見据えた無料ペイントソフト
ある日を境にWEBサイトへアクセスできなくなった
無料の「Adobe Photoshop CS2」を「Windows 10」で使う
GIGAスクール端末のiPadをiOS18にアップデート
highlight.jsに「強調表示」を追加する拡張CSS

iisys

記事検索

ICT実践記事

最近主流のPC用ディスプレイ解像度は？【過去10年間の推移】

Webコンテンツの適正画像サイズをディスプレイ解像度の利用者統計データを元に検証します。ホームページに載せる適正画像サイズをデータで検証という記事から11年も経ってしまいましたので2018年版を載せました。（StatCounterによる統計データを元にしています。） 2018年版が確定したのでデータおよびグラフを修正しました。 2019年版も（確定版ではありませんが）掲載しました。 Webコンテンツに使用する画像サイズ結論掲載データが多くなってしまいましたので、結論を先に書いておきます。パソコンのモニター幅いっぱいの可変サイズの画像（ヘッダ等）を想定するのであれば、(w)2,000ピクセルは必要。これくらいあれば(w)2,560ピクセルで表示したとしても耐えられるクオリティ。10年前に比べると回線環境は良くなったとはいえ、画像サイズが大きくなれば読み込みに時間がかかり、またスマホユーザーに無駄なデータ通信量を消費させてしまう。記事に添える画像は300～800ピクセル程度のサムネイルを表示して、高解像度が必要であれば元画像にリンクを張る。レスポンシブデザインの場合、表示サイズと同等にリサイズされた画像が表示される工夫が必要。（CSSにwidthを書いても元画像が同じであればデータ量は変わらず、w320のスマホユーザーにw2,000の画像を送り付けるという事態に。） jQueryで端末サイズに応じて読み込む画像を振り分けるのが今のところ良さげ。下記のようなメディアクエリーを書いても読み込む画像が増えるだけで逆効果。 <img class=”w1920″ src=”../img_1920.png” /> <img class=”w480″ src=”../img_480.png” /> .w1920 { display: block !important; } .w480 { display: none !important; } @media only screen and (max-width: 480px) { .w1920 { display: none !important; } .w480 { display: block !important; } } 2018年ディスプレイ解像度利用者率Best10（世界） 1366 […]
緊急でリニューアルが必須なWebサイト

Webサイトが「スマホに対応していない」「SSLに対応していない」「Flashなどの古い技術を使用している」に該当していたら至急リニューアルを検討してください。
Google AdSenseで広告が表示されたりされなかったり

ページ内に複数の広告がある場合には、広告コードの1行目にある<script>～</script>は1回で良いそうです。ページ上に複数の広告コードがある場合、各広告ユニットに <script async src=”//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js”></script> を含める必要がありますか？非同期タグでしたので何も考えずに最後の方（</body>直前）に書いたのですが、どうやらそれが原因で広告が表示されたりされなかったりしていました。プラグイン等の外部ファイルにAdSense表示部分が書かれている場合には、非同期での読み込みが間に合って表示されるようで、インラインで書かれている場合だけが不安定でした。 Nginx（Webサーバ）のFastCGI（キャッシュ）も影響していたようで、気が付くまでに時間がかかってしまいました。 <head>～</head>の間に記述して安定しました。 <head> ・・・ <script src=”https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js”></script> <script async src=”//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js”></script> </head> ・・・ <ins class=”adsbygoogle” data-ad-client=”ca-pub-XXXXXXXXXXXXXXXX” data-ad-slot=”XXXXXXXXXX”></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script>
WordPress管理画面のユーザー一覧をソート可能な任意の項目にする

WordPress管理画面のユーザー一覧から不要な項目を削除・オリジナル項目を追加し、並び替えができるように設定する方法をコピペ可能なソースで紹介。
無観客で行われる小学校の運動会を複数カメラでライブ配信したい

無観客で開催されることになってしまった小学校の運動会。一所懸命な姿を家族に見てもらうために複数カメラを使ってライブ配信できないか、多くの制約の中で試行錯誤しています。
Webの文字サイズはvwでシルバーファーストに

Webコンテンツをシルバーファーストで Web制作において「パソコンで表示する文字サイズはvwを使ってmax-widthは1920pxまで対応するべき」という話。最近は年配の方でも自宅でネットを楽しんでいますが、小さい文字が読みにくいためブラウザを最大化にしている姿をよく見かけます。残念なことに、有名どころを含めてほぼすべてのサイトで文字は大きくならずに、左右の空白が増えるのみ。「Ctrlを押しながらマウスホイールで拡大」すれば大抵のブラウザでは拡大されますが、そんな技を使っている一般高齢者を見たことがありません。パソコンのディスプレイサイズは昔と比べて大きくなりましたが、それと共にディスプレイの高精細化も進んできたため、「目が悪くなってきたから大きなディスプレイを買うかのう」は期待を裏切られる結果となってしまいます。一般的にWeb制作の現場では、幅1920px以上で見る人向けに作ってしまうと、小さいディスプレイ（解像度の低い）を使っている人や、ブラウザを最大化しないで使用している人には表示がはみでてしまうため、幅1000～1200pxで見た時に最適になるように制作されています。少し前まではタブレットやスマホはこれよりも画素数が少ないものが多かったため、レスポンシブデザインという表示サイズによって可変のデザインが主流になりました。しかし可変とは言っても通常はモバイル対応がメインです。画素数の大きい端末での全画面表示は基本的にあまり考慮されず、大きすぎる端末から見た場合にデザインが崩れるのを嫌がり、上述のように幅1000～1200pxを超えた場合は、それ以上には広がらずに左右の余白だけが広がるというのが現状です。高齢化時代のWebスタンダートに max-width は最低でも1920px、4Kが主流になることを考えると4000px程度までは欲しいです。メニューやヘッダ・フッタ等以外のコンテンツ部分のフォントサイズは、vwで指定。これでサイトを作ってみたところ閲覧が非常に楽でした。椅子にふんぞり返ったままでも、ブラウザを最大化すれば楽に文字が読めます。あいにく当サイトはまだ着手できていませんので下記サイトをご覧ください。ブラウザを最大化もしくは幅を広げると、デザインが崩れない範囲で文字も大きくなります。現在主流のディスプレイ解像度を考慮して […]
3分でメールサーバー環境（qmail+VPopMail+SMTP AUTH他）を構築【for FreeBSD】

全自動「3分」で実用的なバーチャルドメイン対応のメールサーバーを構築できるQMAIL2020を配布しています。cdb+tcpserver+qmail+SMTP AUTH+VPopMailと諸々のパッチ自動化 for FreeBSD
WordPressのTheme（テーマ）選びは大切

紺屋の白袴とでもいいましょうか、いろいろと問題の多いOneToneというWordPressテーマを当コンテンツでは使用しています。一般的なサイトでの使用はおすすめしません。私がOneToneを選んだ主な理由このテーマを使う以前は、ホームページ全面にFlashを多用したコンテンツとなっていて、早急な改善の必要性に迫られていた。海外のWordPressテーマサイトで上位にランキングされていた。 OneToneのインパクトが強く一目惚れしてしまった。 SEOで検索結果上位を狙う気はあまりなかった。コンテンツ移行に（サーバー移行も含めて）1時間程度しか掛けたくなかった。また自社サイトでしかできない、お客様には提案できないような（爆弾を抱えた）テーマを試してみたかったという部分も大きいです。悪い点独自に作りこまれているためカスタマイズがしにくい。プラグインも必要となり、ページ読み込み速度が遅い。ランディングページ向きに設計されていて、WordPressのページという概念がほとんどない。タグが微妙（h2タグがフッタータイトル等）でSEOに弱い。英文フォント仕様なので、スタイルシートの変更が結構必要。トップ動画等に一部不具合あり。良い点見た目のカッコよさ。基本的に1カラムのレスポンシブなので、PCとスマホで同じイメージを提供できる。 jQuery盛りだくさんで、昔ホームページビルダーで「アニメーションgifで画像が動く」「音楽が流れる」というコンテンツを好んで作られていた方には受けが良いかもしれません。時代に逆行している感は否めませんが、もうしばらくOneToneを少しずつカスタマイズして使ってみようと思います。まずはフッター周りですね。「関連サービス」「リリース」「障害情報」で検索エンジンに働きかけても意味ないですし。
自社・自宅サーバーをVPSに移行するための有力候補3サービス

ConoHa VPSがリニューアルされました。自社サーバーの移設先として使えそうなVPSサービスを実際に契約して試した結果を独自の視点から検証しました。
Adobe CS2の非認証版ダウンロードは公開終了した模様

2013年から提供されていたAdobeのPhotoshop Illustrator Premiereなどの CS2製品公開ダウンロードは事実上終了したようです。 CS2のリリースが2005年4月ですから、今も使っている方もそれほど多くは無いと思いますが「当時CS2を購入して、最近インストールし直した（サポート対象OSに）けど認証に失敗する」という方は、Adobeヘルプセンター経由で連絡を入れると対応してくれるようです。 https://www.ii-sys.jp/notes/1900 ちなみにPhotoshop CS2はWindows 10では動作保証対象外ですが、問題なく動作はしました。 https://www.ii-sys.jp/notes/1040
Google reCAPTCHA v3をコピペで簡単に導入

PukiWikiのコメントスパム対策にGoogle reCAPTCHA v3を導入してみようと思ったのですが、検索してもWordPress前提の記事ばかりでしたので、具体的なソースコードを公開しておきます。プラグインをわざわざ導入しないでもPHPで書かれたシステムであれば流用できます。 WordPress上のContact Form 7に表示される「reCAPTCHA v3バッジを非表示にする方法」は下記の別記事をご覧ください。 https://www.ii-sys.jp/notes/1511 Google reCAPTCHAにサイトを登録するまずGoogle reCAPTCHAでドメインを追加してreCAPTCHAのキーを2種類（サイトキーとシークレットキー）取得しておきます。送信フォームを修整する【1】フォームを表示する部分にJavaScriptを追加インプットフォームが設置してあるページに以下を加えます。挿入する場所は<head>と</head>の間が一般的ですが、ページ表示速度を考えると</body>直前が良い等いろいろありますが、そのあたりは今回触れません。私の場合は、<form>と</form>の間に挿入しました。手書きのHTMLならまだしも、最近はほとんどのコンテンツがPHPによる出力になっていますので、ヘッダ出力部分に追記するだけですと他の全てのページにまで挿入されてしまい、表示速度に悪影響を与えてしまいます。ですのでヘッダ出力部分に「インプットフォームがある場合にのみ挿入」という振り分け処理を入れる必要があるのですが、将来的にインプットフォームの表示ページ名等に変更があった際に、ヘッダ部分の書き換えを覚えている自信もないので、<form>～</form>にまとめたという次第です。 <script src=”https://www.google.com/recaptcha/api.js?render=ここにサイトキーを入れる”></script> <script> grecaptcha.ready(function() { grecaptcha.execute(‘ここにサイトキーを入れる’, {action […]
WP-PageNaviで2ページ目以降が404エラー【解決】

最近すっかりWordPressから離れていたんですが、良くも悪くも情報量が豊富ですね。 WordPressは10年以上前（WordPress MEの頃）からいじってますが、どんどん複雑化してきて最近はhome.phpやらfront-page.phpやらindex.phpやらと、テンプレート構造を理解するのさえ大変です。時間があったので何年か前に構築したサイトを手直ししていたところ、トップページのページネーションが効かなくなってしまいました。 100個近いカスタムフィールド・300超えのカテゴリ・function長すぎなコンテンツで、どのタイミングで表示されなくなったのか不明なまま、ネット上の情報を頼りにあれこれ試して半日が過ぎ、ようやく解決しました。固定ページ用WP-PageNavi対策コード function.php function pagenavi_home($wp_query) { if (!is_admin() && $wp_query->is_main_query() && $wp_query->is_home()) { $wp_query->set(‘cat’, 5); $wp_query->set(‘post_type’, ‘iisys’); $wp_query->set(‘posts_per_page’, 12); } } add_action(‘pre_get_posts’, ‘pagenavi_home’); 3行目のcatはカテゴリーID5を指しています。不要であれば行ごと削除。 4行目のpost_typeはカスタム投稿タイプを指定。iisysは一例で、通常の投稿であればpostになります。両方を指定したい場合には配列にします。 $wp_query->set(‘post_type’, array(‘post’, ‘iisys’)); 5行目のposts_per_pageは表示件数。記事数よりも多い数にするとページネーションは表示されません。上記を書いたうえで、該当テンプレート（私の場合はindex.php）のquery_posts等を消してください。以下は私の環境では効果ありませんでした。管理画面の表示設定にある「1ページに表示する最大投稿数」を1件にする pa […]
Apache 2.4でバーチャルホストを実際に運用する際の参考記事

Apache 2.4でバーチャルホスト設定をすると403 Forbinddedが表示される原因はディレクティブを見直してみましょう。実際に運用していくうえでディレクティブに毎回記述しないで良いための設定方法。
常時SSL化（https）後に旧サイトのアクセスが減らない

最近SSL化したサイトで旧サイト（http）へのアクセスが一向に減らないという現象が発生しました。 httpへのアクセスを301リダイレクトでhttpsへ遷移。 Google Search Consoleのプロパティにhttpsサイトを追加。旧サイトも削除せずに監視。これで安心してしまっていたのですが、1ヶ月経っても、Google Search Consoleで旧サイト（http）の表示回数が減らない。（一時的に減少しましたが、盛り返してきている）平均掲載順位に至っては上昇している。どうもおかしいと思い調べたところ、もともとHTTPヘッダとしてcanonical属性を出力していたのですが、スキンをカスタマイズした際に書き出されなくなってしまっていたようです。これはChromeのデベロッパーツールを使って以下のように確認しました。 HTTPレスポンスヘッダ・リクエストヘッダの確認方法 Chromeを開き[F12]を押してデベロッパーツールを開く。 Networkタブを選択しておく。 HTTPヘッダを確認したいページを開く。 Nameの一番上（AdSense等がある場合は2番目以降になっている場合があります）にある該当ページをクリックする。 Headersタブをクリックするとレスポンスヘッダやリクエストヘッダが確認できます。全てのページで<link rel=”canonical” href=”ページURL”>を<head>～</head>内に出力するように修正して完了です。 ※ページURLには各ページのURLを正確に書きます。
小中学校「1人1台タブレット」いよいよ導入【豊後高田市】

大分県豊後高田市の小中学生に、1人1台導入されるタブレットについて概要を独自にまとめました。

≫ 記事一覧を表示

関連サービス

無料ショップAllShop
ショッピングモール田舎ん市場
予約システムRSVY
コムクラブ
Web秘書
The豊後高田

リリース

「豊後高田市教育委員会後援」小学生向けプログラミング体験会開催
「ＩＣＴ駆け込み寺」拠点オープンのお知らせ
「優良WEB」に掲載していただきました
ドメイン・サーバー価格改定のお知らせ
合資会社イーシス、「IT導入補助金2021」の支援事業者に採択

「技術」と「品質」にこだわる「匠」の精神で、お客様の信頼に応え、成長し続けてまいります。

メインメニュー

トップ
ECサイト構築
ホームページ制作
プライバシーポリシー

運営会社

会社名　：　合資会社イーシス

関連団体：　NPO法人ICT活用グループ

所在地　：　大分県豊後高田市玉津467-5

代表番号：　0978-24-0707

創　立　：　2002年10月

ブログメニュー

IT実践記事一覧
最近主流のPC用ディスプレイ解像度は？【過去10年間の推移】
Web開発や効率が良いブログ記事執筆の環境構築の参考に
フレッツ光を使っている人はウイルス対策ソフトを買う前に確認
【Google公認】reCAPTCHA v3のバッジ（ロゴ）をコピペで簡単に非表示
Adobe CS2の非認証版ダウンロードは公開終了した模様
VMware Workstation Player 仮想マシンの複製【簡単3ステップ】
WordPress用GMapを使わない地図表示プラグイン公開

リリース一覧

「豊後高田市教育委員会後援」小学生向けプログラミング体験会開催
「ＩＣＴ駆け込み寺」拠点オープンのお知らせ
「優良WEB」に掲載していただきました
ドメイン・サーバー価格改定のお知らせ
合資会社イーシス、「IT導入補助金2021」の支援事業者に採択

障害・メンテナンス情報

2026年05月15日01時現在、障害は発生しておりません。

2023年01月04日～2023年01月31日、サーバー移転に伴うメンテナンス作業実施のため一部のWebサーバーでレスポンスが悪くなる場合がございます。

© Copyright 2026 豊後高田イーシス - ホームページ・ネットショップ制作会社. All rights reserved.