Windows 10 May 2019 Update(バージョン 1903、19H1)がリリースされて1ヶ月程が経ちました。 Windowsの大型アップデートでは毎回トラブルに見舞われるのですが、今回は個人的には良いOS […]
May 2019 Update
記事検索
ICT実践記事
- 偽サイトに嵌って防衛手段を検証する
公開しているメールアドレスは、最近トレンドなフィッシングメールをピックアップで紹介したように、フィッシングメールが毎日山ほど届きます。せっかくなので訪問してみました。 フィッシングサイトに嵌ってみました 最近のブラウザはデフォルト設定で注意喚起してくれます。 Chromeの場合 Firefoxの場合 Firefoxのほうがキッパリと言い切っていてかっこいいですね。 どのブラウザも、うっかり誤クリックで進んでしまわないように「無視して進む」というボタンが無いインターフェイスになってますが、頑張って先に進んでみました。 仮想PC・ブラウザをプライベートモード・LAN切り離し・IPアドレス変更等を行ったうえでの検証です。アクセスするだけで様々な情報を抜かれる恐れがありますので、安易に先に進むようなことはしないようにしてください。 APPLEっぽいサイトが表示されました。 一見APPLE公式のように見えますが、中央の入力フォーム以外はリンクすらされていない張りぼてです。 ですが疑いの目を持って見ない限り、偽サイトだということに気づかないと思います。 フィッシングサイトの見抜き方 騙されないためにはアドレスバーに表示されているURLをよく見てください。まずこの習慣をつけましょう。 見るのは最初に現れるスラッシュ「/」よりも左側です。それよりも後(右側)は一切気にしないで大丈夫です。 http://cert-protection-account-appleid-apple.com ブラウザによっては cert-protection-account-appleid-apple.com とhttp://(またはhttps://)が省略されて表示されます。 以下のような場合にはさらに注意が必要です。 apple.example.com/rmd_nid_vcss… google.example.com/rmd_nid_vcss… ドメイン名「example.com」の前にドット「.」が入っている場合、それより左側はドメインの保有者が自由に好きな文字を設定できるサブドメインと呼ばれます。 一番最初に知っている名前が入っているからといって絶対に信用してはいけません。 itunes.apple.com これはitunesがサブドメインですが、その右側を見るとドメイン名がapple. […]
- 最近トレンドなフィッシングメールをピックアップ
JALがフィッシングメールで騙され3億8000万円を失ったというニュースは記憶に新しいところです。 プレスリリースを送信すると、連絡先メールアドレスが複数のWebサイトに載ったままになるわけですが、あえてそのアドレスを削除せずにスパムメール収集に使っています。(未読が数万件に達していますが放置しています) その中でうっかり開いてしまいそうな要注意メールタイトルを紹介します。 メールアプリの設定でHTMLメール表示にしている方は、本物と区別がつきにくいので特に注意してください。またHTML表示の場合、開くだけでもトラブルに巻き込まれるものも存在しますので、できれば表示設定でテキスト形式にしておくことをお勧めします。 件名:Apple IDアカウントの情報を完成してください。 差出人:Apple ID <apple_support@0-99.com> Appleをご利用いただきありがとうございます。お客様のApple ID情報の一部分は不足、あるいは正しくないです。お客様のアカウント情報を保護するために、検証する必要があります。 <http://retrying-cloud-id.com/>リカバリアカウント 私たちは24時間以内にあなたからの応答を受信しない場合、アカウントがロックされます。 今後ともよろしくお願い致します。 Apple サポートセンター <http://retrying-cloud-id.com/>Apple ID | <http://retrying-cloud-id.com/>サポート | <http://retrying-cloud-id.com/>プライバシーポリシー Copyright 2017 Apple Distribution International, Hollyhill Industrial Estate, Hollyhill, Cork, Ireland. すべての権利を保有しております。 件名:警告!!パスワードの入力は数回間違いました。 差出人:Amazon Security <amazon_noreply@0-99.com> お客様はウェブサイトでAmazon IDにログインした時にパスワードの入力は数回間違いました。 日付と時間:2019年5月8 […]
- Apache 2.4でバーチャルホストを実際に運用する際の参考記事
Apache 2.4でバーチャルホスト設定をすると403 Forbinddedが表示される原因はディレクティブを見直してみましょう。実際に運用していくうえでディレクティブに毎回記述しないで良いための設定方法。
- 緊急でリニューアルが必須なWebサイト
Webサイトが「スマホに対応していない」「SSLに対応していない」「Flashなどの古い技術を使用している」に該当していたら至急リニューアルを検討してください。
- Webの文字サイズはvwでシルバーファーストに
Webコンテンツをシルバーファーストで Web制作において「パソコンで表示する文字サイズはvwを使ってmax-widthは1920pxまで対応するべき」という話。 最近は年配の方でも自宅でネットを楽しんでいますが、小さい文字が読みにくいためブラウザを最大化にしている姿をよく見かけます。 残念なことに、有名どころを含めてほぼすべてのサイトで文字は大きくならずに、左右の空白が増えるのみ。 「Ctrlを押しながらマウスホイールで拡大」すれば大抵のブラウザでは拡大されますが、そんな技を使っている一般高齢者を見たことがありません。 パソコンのディスプレイサイズは昔と比べて大きくなりましたが、それと共にディスプレイの高精細化も進んできたため、「目が悪くなってきたから大きなディスプレイを買うかのう」は期待を裏切られる結果となってしまいます。 一般的にWeb制作の現場では、幅1920px以上で見る人向けに作ってしまうと、小さいディスプレイ(解像度の低い)を使っている人や、ブラウザを最大化しないで使用している人には表示がはみでてしまうため、幅1000~1200pxで見た時に最適になるように制作されています。 少し前まではタブレットやスマホはこれよりも画素数が少ないものが多かったため、レスポンシブデザインという表示サイズによって可変のデザインが主流になりました。 しかし可変とは言っても通常はモバイル対応がメインです。画素数の大きい端末での全画面表示は基本的にあまり考慮されず、大きすぎる端末から見た場合にデザインが崩れるのを嫌がり、上述のように幅1000~1200pxを超えた場合は、それ以上には広がらずに左右の余白だけが広がるというのが現状です。 高齢化時代のWebスタンダートに max-width は最低でも1920px、4Kが主流になることを考えると4000px程度までは欲しいです。 メニューやヘッダ・フッタ等以外のコンテンツ部分のフォントサイズは、vwで指定。 これでサイトを作ってみたところ閲覧が非常に楽でした。 椅子にふんぞり返ったままでも、ブラウザを最大化すれば楽に文字が読めます。 あいにく当サイトはまだ着手できていませんので下記サイトをご覧ください。 ブラウザを最大化もしくは幅を広げると、デザインが崩れない範囲で文字も大きくなります。 現在主流のディスプレイ解像度を考慮して […]
- 【Google公認】reCAPTCHA v3のバッジ(ロゴ)をコピペで簡単に非表示
WordPressのContact Form 7に対応しているreCAPTCHAがv3になってから、バッジ(ロゴ)が邪魔な場所に表示されてしまうようになりました。 これはContact Form 7の問題ではなく、Googleが出力しています。 Googleにしてみれば謙虚に右下を選んだのかもしれませんが、右下は多くのサイトで「トップに戻る」アイコンが表示される大事な場所です。 (もっともGoogleがそれを知らないはずもないので、注目させたかったのでしょうか。) スタイルシートのposition: absolute; をJavaScriptで追加すれば好きな位置に移動できますが、親要素を変えられないのであまり実用的ではありません。 JavaScriptでgrecaptcha-badgeクラスをappendChildしてみたりしましたが、トークンの発行がうまくいかなくなったり不安定でしたので断念しました。 ネットで検索すると、海外でも多くの議論がされていました。 display: hidden; で非表示にしてしまうとスパム防止が効かなくなるそうです。 reCAPTCHA v3のバッジをGoogle公認の方法で非表示にする よく探せばGoogleのFAQにありました。 以下の表示をすればバッジを非表示にしても構わない This site is protected by reCAPTCHA and the Google <a href=”https://policies.google.com/privacy”>Privacy Policy</a> and <a href=”https://policies.google.com/terms”>Terms of Service</a> apply. コンタクトフォームを表示させるページごとに入れるのも面倒ですし、のちのち別のページにフォームを追加することになった時にはきっと忘れてしまっているので、コンタクトフォームの送信ボタン下に1行で書き込みました。 <p class=”recaptcha_policy”>This site is protected by reCAPTCHA and the Google<a href=”https://policie […]
- GIGAスクール端末のiPadをiOS18にアップデート
GIGAスクール構想で32GBのiPadを導入した自治体が直面しているiOS18へのアップデート空き容量の確保問題について
- WordPressのCSSカスタマイズ実践例
WordPressでCSSが反映されないという疑問について、テンプレートLightningを例にWEB制作現場で実際に行っているデベロッパーツールの活用方法をご紹介します。
- Windows 10 (1709)、KB4103727による死亡フラグからの生還
Windows 10 April 2018 Update (Windows 10 Version 1803)への大型アップデートが始まり、巷では不具合報告合戦が続いているようです。 私も参戦しようと思ったのですが、どうやら1803に辿り着く前のアップデートKB4103727にやられてしまったようで瀕死になりました。 スタートボタンが偶数回クリックしないと反応しない。 エクスプローラーにドライブ(C含む)が表示されない。 シャットダウンも再起動もできない。 ほぼ全てのアプリケーションが起動はするがすぐにフリーズする。 情報を調べようにもブラウザ(ChromeとFirefox)がすぐにフリーズ。 なぜかEdgeだけは機能しました。 普段使わないEdgeですが今回は役に立ちました。(ひょっとしてこれが狙い?) 更新プログラムを削除しようにも、フリーズして一覧表示されないので、思い切ってWindows 10 Version 1803へアップデートしてみることにしました。 最初のうちはサクサクと進むのに、途中から1%進むのに10分以上かかるという利用者の事を考えていなさすぎな仕様。 Microsoftに限ったことではありませんが、プログレスバーの表示は「全体の完了時間を予測してその割合」を表示するようにそろそろ改善してくれませんかね。 確か昔のWindowsインストーラは目安時間が表示されてましたが(40分とか表示されつつも平気で3時間とかかかってましたが)今の技術を使えばもっと正確な表示ができると思うのですが。 これが終わらなければ他に何もできない状況ですし、数字見ながらジーっと待ってると、もうね、詐欺にあった気分。 タバコ一箱無くなりましたがな。 ウサギと亀のウサギですか~っ! 大きな企業が大勢の人を使ってUIがどうのこうのと改善しやすい部分に時間割いて突き詰めるよりも、まずここをお願いします。 話が脱線してしましたが、画面の表示変わりました。 「以前のバージョンのWindowsを復元しています」 ( ゚ρ゚) まあ、、、システムファイルに不具合があったりすると正常にアップデートできないようなので無理もないですね。 暫く待つと、もとどおり瀕死のWindows 10 Version 1709が復元しました。 今度はセーフモードで起動してみました。 Windows 10はセ […]
- Google Ad Grantsで支払情報を求められてしまう
NPO活動が停滞していましたが、Googleのサポートプログラムにより兆しが見えました。 Google Adwords(オンライン広告)を毎月1万USドル(約100万円分)まで無料で利用できるというものですが、登録時に一箇所問題が生じました。 Ad Grantsアカウントで広告設定をすると「お支払情報の確認」ページに「設定の必要がない」旨表示されるはずなのですが、何度やっても支払情報を求められてしまう。 うっかり入力してしまうと、毎月100万円程度の支払いが発生してしまうそうなので、初めてGoogleサポートに電話をしてみましたが、解決に至らず。(待たされることもなく、とても温かみのある人間的な対応でビックリしました) その後、いろいろいじってみて分かったことが、 複数のGoogleアカウントを利用している事 が原因でした。 恐らくブラウザのキャッシュが原因だと思うのですが、アカウントを切り替えても他のGoogleアカウント情報があるとダメでした。 Chromeでは複数のGoogleアカウントが登録されてしまっていたので、Googleアカウントが何も登録されていないfirefoxを使ってみたところ一発でOKでした。 以下追記 数時間待っても広告が配信されず、Adwords管理画面を確認すると「アカウントは有効ではありません」の文字が。 あれこれいじってみましたが、毎月100万円の請求が来る可能性もある部分ですので、再度Googleへ電話してみました。(相変わらず1分も待たされませんでした) アカウントの現在の状況を確認していただき、ワンステップずつ丁寧に教えていただき無事解決に至った内容です。 Google非営利団体向けプログラムを開いて、ログインされていなければログインする。 こんな画面が表示されます。Google Ad Grantsに「登録」ボタンが表示されている状態では、まだ申請が終わっていません。 指示に従ってAdwordsのIDを入力するとこのようになります。 10営業日ほど待ちます。(今ここです。) Adwordsで広告登録をしたあとに 「おめでとうございます!新しい広告の掲載が始まります。」 というメールが届き安心していたのですが、手動でAd GrantsとAdwordsを結び付けなければいけなかったようです。 Googleのこのプログラムは、システ […]
- FreeBSDのディスク容量を拡張する(ConoHa VPS)
ConoHa VPSでサーバーOSにFreeBSDを使っている場合のパーティション拡張方法です。
- 最近主流の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 […]
- WordPressでメディアをアップロードできない
「画像の後処理に失敗しました。このファイルが写真もしくは大きい画像であれば、2500ピクセルに縮小してから再度アップロードしてください。」というWordPress 5.3のエラーについて。
- 無料の「Adobe Photoshop CS2」を「Windows 10」で使う
CS2用ライセンス認証サーバの停止に伴って、Photoshop・Illustrator・Premiere等をシリアルナンバーと共に無料でダウンロードできるようになっていますが、Windows 10では「動作を停止しました」とエラーになってしまう事が多いようです。 ※あくまでも正規ライセンスを所持している方が対象です。 ネットで検索をすると、この対策として「言語設定」の「アプリウインドウごとに異なる入力方式を設定する」にチェックを入れると良いという情報が多くヒットします。 しかし残念ながら、Windows 10 October 2018 Update (1809)以降ではこの手法は使えなくなってしまったようで、「デバイス」→「入力」→「キーボードの詳細設定」から「アプリウインドウごとに異なる入力方式を設定する」にチェックを入れてもPhotoshop等は起動しなくなってしまいました。 Windows 10 October 2018 (1809) 以降でAdobe CS2を起動する応急処置 以下の方法で2回に1回程度の確率で起動できます。 Photoshop等のアイコンを右クリックして「その他」→「タスクバーにピン留めをする」 タスクバーにできたアイコンをクリックする 「アプリウインドウごとに異なる入力方式を設定する」は関係なさそうなのでデフォルト(チェックなし)に戻しておく スタートにピン留めやデスクトップにショートカットを作って試してみましたが、なぜかタスクバーだけが起動確率が非常に高いです。 もっと確実な方法がありましたら教えてください。 2019年5月追記 Adobe CS2の公開ダウンロードは終了したようです。 https://www.ii-sys.jp/notes/1324 https://www.ii-sys.jp/notes/1900
- 無観客で行われる小学校の運動会を複数カメラでライブ配信したい
無観客で開催されることになってしまった小学校の運動会。一所懸命な姿を家族に見てもらうために複数カメラを使ってライブ配信できないか、多くの制約の中で試行錯誤しています。

