カテゴリ「日記メモ104件]3ページ目)

【サイト更新】本日の更新

本日のテーマ:
Lighthouseに注意されたところを出来る限り改善

・全体
Webフォント、アイコンのセルフホスティング中止
<head>内のjavascriptにdefer追加

・トップ
トップ画像のloading=lazy削除
ページ下部バナーにloading=lazy追加
iframeにtitle追加

・てがろぐ
上部メニュー整理
HOME ボタンを追加

セルフホスティング、Lighthouseでチェックしてみたところ転送容量が明らかにデカくて遅かったので中止

本日時点でのローカル上の総容量19MB👍️
普通にサービスを利用した方が早いしデータ量も少なくすむ

javascriptはasyncがベターだと思ってたんですが、サイトの構成に大きく関わってないのでdeferの方が早くページ表示されるかなと思って変更してみました

これ以上容量がんばるとなると……
html/cssのminify(圧縮・軽量化)
雑に圧縮したjpgファイルをwebpに(元ファイルを探してきて、キレイなpng画像→webp圧縮)

いま思ったのだけど、jpg/pngよりwebpの方が無断転載対策になりそう
webpはまだ対応してないサービスとかブログとかソフトもある
ひと手間かけさせるのってアリかも

#個人サイト #てがろぐ #更新履歴
イベントビューアーとタスクマネージャーの使い方を覚えた

  • 管理イベント
ここから『エラー』『警告』など重要なログだけ見られる

大抵の場合、ソース、イベントID、ログの1行目などで検索すると似たような症例が見つかる。

  • 詳細タブ > System > Execution > ProcessID
タスクマネージャー > 詳細/サービス > PID

ProccessID = PID
この数字で原因となっているソフトウェアを特定できる

何のプログラムかわからないときは右クリックで検索
Bing検索で大抵の場合は解決する

イベントID一覧|Microsoft公式

#PC
「ローマ字入力1文字目だけ強制的に半角英数字になる」問題

文字列をコピーor切り取りすると問題が発生するっぽい
頻度高すぎて笑うしかないんだわ……

文字列をコピーした直後の入力が強制的に半角になる|Microsoft コミュニティ
Google日本語入力で、文字列をコピーした直後の入力が強制的に半角になる|Gboard コミュニティ

原因あるかも?と思ってイベントビューアー見てみた
エラーがいくつかあったので修復を試みる

sfc /scannow:3つ修復された!
BthA2dp.sys
BthHfEnum.sys
bthmodem.sys
どうやらBluetooth ドライバー関係のファイルが壊れてたっぽい

Cドライブのエラーチェック:エラーなし

DISM /Online /Cleanup-Image /CheckHealth
DISM /Online /Cleanup-Image /ScanHealth
:エラーなし

再起動後にしばらくイベントビューアー監視してみたけど、特にエラーは発生せず

しかし、強制的に半角英数字問題は…未解決…

#PC
【サイト更新】ここ数日の更新

・全体
Webフォント、アイコンのセルフホスティング成功
スマホ版でのデザイン崩れを修正
ノート風罫線をpng画像からCSSに変更
FontAwesomeのCSSを @import から link に変更
HoYoLABへのリンクを追加
自己紹介欄に作業環境を追加

・イラスト
ゲムすきクリップ、ふぁぼすきクリップへのリンクを追加
過去ギャラリー入口に注意書きを追加

・てがろぐ
メニューのリンク修正、追加

本日時点でのローカル上の総容量24MB👍️
GoogleFontsに加えてFontAwesomeなどもセルフホスティングしてみましたが、そこまで容量使わないっぽいので安心しました。

あと、サーチエンジンへのリンクバナー追加しました。
まだ登録してないので、今月中には?登録できたらいいな
バナーを新しくしたい気持ちもある

#個人サイト #てがろぐ #更新履歴
【サイト更新】最近の更新

・全体
サイト内の画像(一部)をwebp形式に変更
名義間違ってたとこ修正
CSSファイル内の不要な記述を削除
使ってないcssファイルへのリンクを削除

・ゲームとか
歌ってみた動画を追加

・過去ギャラリー
未圧縮pngイラストをjpgに変換&圧縮

・index
同盟へのリンクを追加

2月18日の日記で、サイトのローカル上で総容量33MB
と発言していましたが、22MBまで圧縮に成功した✌😉✌

drawrっていうブラウザで絵が描ける投稿サイトで描いてた絵がぜんぶ無圧縮pngだったっぽくて、jpgにしたほうが容量詰められそうな絵はぜんぶ圧縮してきました。
サイト内画像の透過pngもwebpの方が軽く出来たし、まだ舞える!

透過png→webp
透過なしpng→jpg

次はウェブフォント完全ローカル化やりたい
一部GoogleFonts使ってるんだけど、ローカルのほうが速度出る?よね?

速度といえば、今回のサイト改装では”なるべく速度を求めること”を念頭に置いて、JavaScriptを使わずにいい感じのサイトを作りました。
(もちろんテンプレートのパワーありき!)
前にトップページの画像をランダム表示しようと思ってJSファイル置いたら激遅になって学んだ、というのもある。実装の仕方が悪かっただけかもしれないけど。

#個人サイト #更新履歴
あんスタプロセカコラボの効果で守沢千秋ファンアート大量供給されて倒れそうみんなありがとう私は嬉し泣きしてる😭🙏
毎日新しい推しの姿が見られるの、ほんっっっと嬉しい!
普段守沢千秋を描かない人の守沢千秋めっちゃ嬉しいかなり嬉しい!供給感謝!

#あんスタ
ウワーッ勘違いしてた!

BIGLOBEのサーバー容量500MBだと思ってたんだけど
なんか多い気がして仕様見に行ったら100MBだった
いや、思ってたより少な…!!

とりあえず、過去の絵も含めてpngファイルをjpg圧縮して、出来る限り抵抗してくか~!!
優良な無料広告なしサービスだから文句は強く言えない…!ビッグローブさんいつもありがとうございます!

#個人サイト
昔のブログとか、終了したサービスのバックアップファイルとか、そういうところから過去の日記を引っ張り出してきてるんだけども。
ヤバイ。
過去の私、フツーにめっちゃ恥ずかしい。

もうアレです。
過去のブログはそっとしておくべきでは?

まともそうなところだけ掬い上げて、残りはバックアップ取るだけ取って、化石になってもらったほうが精神衛生上良いのかもしれない……

#個人サイト
【サイト更新】本日の更新

・サイト
アクセス解析タグ位置を変更

・てがろぐ
Webフォント記述修正
絵文字フォント指定追加
ロゴ上文字色を変更
アーカイブ日付リストを階層構造風にデザイン修正、flex化
罫線マージン修正
引用のデザイン修正

・てがろぐ(スマホ)
タイトルロゴが画面を突き抜ける問題を修正
フォントサイズを大きく
ロゴ上文字を小さく
ヘッダーメニュー内容を修正

かなりがんばった!!
とりあえずこれで完成ってことで。
いやほんと、やればやるだけ要望が出てくる😂

#個人サイト #てがろぐ #更新履歴
【サイト更新】本日の更新
ほぼ完成だぞ…!

・トップ:てがろぐiframe追加
・まとめ:ほぼ完成
・ゲーム:ほぼ完成
┗ コメント追加
・イラスト:ページ開通
┣ 過去ギャラリー追加
┗ 同人活動まとめ
・未使用画像をサーバーから削除

あと、Webフォントが上手く適用できてなかったり、構文エラーとか記述が怪しいところをチェックして仮終了かも!
終りが見えてよかった…!

ちなみにウチのサイト、ローカル上で総容量33MB。
てがろぐの分を併せても50MB以下。
しばらくは心配ない👍️

#個人サイト #更新履歴
1 2 3 4 5 6 7 8 9 10 11