カテゴリ「更新履歴」［12件］
サイト更新しました
トップ：
ご依頼の告知にリンク追加
ABOUTに注意書きを追加
SNSリンクにSKPORTを追加
イラスト：
過去の活動を追加（みすけっと、アンソロ）
ゲームとか：
歌ってみたご依頼絵を追加
更新してて思ったけど「ゲームとか」のページにご依頼絵を載せるのは分類間違ってるよね…！
普通に確実にイラストのページに載せるべきだよねコレ！今度覚えてたら直します
#個人サイト
トップ：
ご依頼の告知にリンク追加
ABOUTに注意書きを追加
SNSリンクにSKPORTを追加
イラスト：
過去の活動を追加（みすけっと、アンソロ）
ゲームとか：
歌ってみたご依頼絵を追加
更新してて思ったけど「ゲームとか」のページにご依頼絵を載せるのは分類間違ってるよね…！
普通に確実にイラストのページに載せるべきだよねコレ！今度覚えてたら直します
#個人サイト
サイト＆てがろぐ更新
・サイト
更新履歴上のイラストをマイナーチェンジ
サークル参加情報「みすけっと」追加
・てがろぐ
twemoji実装
てがろぐの方だけtwemojiを実装してみました。
フォント形式じゃなくて、svg/png形式なのでちょっと手間取りましたが、解説してくださってる記事のおかげで無事になんとかなった。
お世話になってるMisskey鯖と同じ絵文字が表示されるのほんと嬉しい～！！ 絵文字関係者の皆様に全方位感謝～！！
#個人サイト #てがろぐ
・サイト
更新履歴上のイラストをマイナーチェンジ
サークル参加情報「みすけっと」追加
・てがろぐ
twemoji実装
てがろぐの方だけtwemojiを実装してみました。
フォント形式じゃなくて、svg/png形式なのでちょっと手間取りましたが、解説してくださってる記事のおかげで無事になんとかなった。
お世話になってるMisskey鯖と同じ絵文字が表示されるのほんと嬉しい～！！ 絵文字関係者の皆様に全方位感謝～！！
Twitter絵文字ライブラリ(Twemoji)の使い方｜Let's EMOJI
Twitter絵文字API、Twemojiの仕様・使い方｜MEMORVA
#個人サイト #てがろぐ
【てがろぐ更新】Youtube埋め込みレスポンシブ化
できたぜ！！
思ったより簡単でよかった☺️💕
Spotifyは特に何もしなくても横幅可変なのでたすかる！
現在はてがろぐ超シンプルギャラリーモードの制作に取り掛かっています
そもそもウチのサイトは倉庫なのですが、イラストのページがあまりにも！初見バイバイだなって！もうちょっとユーザーに優しく出来るやろって！
トップページの更新履歴埋め込みみたいな感じで、てがろぐを埋め込んだら良いかなってひらめいたので、作り始めました。
基本の作りとしてギャラリーモードが良さそうだったので、初期スキンを改造して画像のみ表示されるようにすれば、イラストページのいちコンテンツになるかなと、思ったんですね。
NSFW画像も一覧に出ちゃうのでどうしようかな～とは思っておりますが、タイトルにCP名書けばギリいけるか…？
#個人サイト #てがろぐ
できたぜ！！
思ったより簡単でよかった☺️💕
Spotifyは特に何もしなくても横幅可変なのでたすかる！
現在はてがろぐ超シンプルギャラリーモードの制作に取り掛かっています
そもそもウチのサイトは倉庫なのですが、イラストのページがあまりにも！初見バイバイだなって！もうちょっとユーザーに優しく出来るやろって！
トップページの更新履歴埋め込みみたいな感じで、てがろぐを埋め込んだら良いかなってひらめいたので、作り始めました。
基本の作りとしてギャラリーモードが良さそうだったので、初期スキンを改造して画像のみ表示されるようにすれば、イラストページのいちコンテンツになるかなと、思ったんですね。
NSFW画像も一覧に出ちゃうのでどうしようかな～とは思っておりますが、タイトルにCP名書けばギリいけるか…？
YouTube 動画埋め込みのレスポンシブ対応方法 | Takumi Hirashima Artworks
#個人サイト #てがろぐ
【サイト更新】(∩´∀｀)∩
・サイト側
リンク追加(個人サイト様)
プライバシーポリシー短くしました
・てがろぐ
ブログカードっぽいデザインを作成
記事内のリンクにオンマウスで色変更
favicon設定（※忘れてた）
ブログカード風にリンクのデザインを変えられるようにしてみました。
OGP画像も追加できたらよかったんですけど、私の技術ではちょ～っと無理っぽかったので、画像は無しで。
てがろぐの「何でも簡単入力ボタン機能」でブログカード用のcssを出力して、文字列リンクでページタイトルとURLを入力。
結構それっぽくない？
ボタン全体を押せるようにした＆左上にラベルっぽいのも付けたので、WordPressで見る感じに仕上がったと思う
使うかわからないけど、自サイト版もあります
#個人サイト #てがろぐ
・サイト側
リンク追加(個人サイト様)
プライバシーポリシー短くしました
・てがろぐ
ブログカードっぽいデザインを作成
記事内のリンクにオンマウスで色変更
favicon設定（※忘れてた）
ブログカード風にリンクのデザインを変えられるようにしてみました。
OGP画像も追加できたらよかったんですけど、私の技術ではちょ～っと無理っぽかったので、画像は無しで。
てがろぐの「何でも簡単入力ボタン機能」でブログカード用のcssを出力して、文字列リンクでページタイトルとURLを入力。
[F:クラス名:[サイト名]URL]
👇️ CSSパワーでこうなる 👇️
結構それっぽくない？
ボタン全体を押せるようにした＆左上にラベルっぽいのも付けたので、WordPressで見る感じに仕上がったと思う
使うかわからないけど、自サイト版もあります
【WordPress】プラグインなしでブログカードを作る方法【コピペで完成】｜ぴょんなことから
CSSのwidth: 100%;のより良い代替手段として、stretchキーワードが実はかなり便利です｜コリス
#個人サイト #てがろぐ
【サイト更新】サイト更新したぞ！
・内容
SNSリンクにYoutubeとニコニコを追加
リンク追加(にしし ふぁくとりー、何らかの配布場）
検索エンジンに登録（COMPASSLINK、駄文同盟）
Faviconをバナー画像と同じデザインに変更
OGP画像を追加
プロフに代理ちゃんアイコンを追加
・デザインなど
メニューを追従式に変更
h2/h3のデザインを変更
コンテンツの区切り罫線登場
サイト側/てがろぐのロゴ画像色を変更
FontAwesomeのセルフホスティング再開
スマホ版のデザイン崩れ修正
html/css記述の気になるところ修正/変更
W3CとLighthouseに注意されたとこ修正
ヘッダーメニュー追従に憧れがあったので実装✌☺️✌
デカくて威圧感ある気がするけど……また気になったらサイズ感とか変わるかもしれない。
併せて、ロゴ画像の色を青っぽい黒→無彩色に変更しました。
前々からメニューとロゴの色味が微妙に違うせいで浮いてるのが気になって仕方なかったので、やっっっと変えられた！スッキリ！
h2/h3(見出し)のデザイン変更は、オレンジの★に視線めっちゃ吸われるなと思ったので変えてみた。
暫定的にぺけまーくにしてます。かわいい。
あとは、一部テンプレそのままで用途に合わない名前になってたidを変えたり、ロゴ部分など、とりあえあず <section> タグで囲ってたところを <header> <footer> に変えてみたり。
<hr /> 👈️ この書き方はXHTMLの書き方で、HTMLは<hr>で良いらしい
むしろ末尾の/が悪さをする場合があると…
ブログをいっぱい書いてた頃の知識と混ざってる気がする。
あのとき使ってたブログの言語がXHTMLだったから、
<hr /> 👈️ こういう書き方をしないといけなかった。
まあでもXHTMLの厳密な書き方を覚えたおかげで、今キレイな書き方ができてると思えばいい…のか…！
#個人サイト
・内容
SNSリンクにYoutubeとニコニコを追加
リンク追加(にしし ふぁくとりー、何らかの配布場）
検索エンジンに登録（COMPASSLINK、駄文同盟）
Faviconをバナー画像と同じデザインに変更
OGP画像を追加
プロフに代理ちゃんアイコンを追加
・デザインなど
メニューを追従式に変更
h2/h3のデザインを変更
コンテンツの区切り罫線登場
サイト側/てがろぐのロゴ画像色を変更
FontAwesomeのセルフホスティング再開
スマホ版のデザイン崩れ修正
html/css記述の気になるところ修正/変更
W3CとLighthouseに注意されたとこ修正
ヘッダーメニュー追従に憧れがあったので実装✌☺️✌
デカくて威圧感ある気がするけど……また気になったらサイズ感とか変わるかもしれない。
併せて、ロゴ画像の色を青っぽい黒→無彩色に変更しました。
前々からメニューとロゴの色味が微妙に違うせいで浮いてるのが気になって仕方なかったので、やっっっと変えられた！スッキリ！
h2/h3(見出し)のデザイン変更は、オレンジの★に視線めっちゃ吸われるなと思ったので変えてみた。
暫定的にぺけまーくにしてます。かわいい。
あとは、一部テンプレそのままで用途に合わない名前になってたidを変えたり、ロゴ部分など、とりあえあず <section> タグで囲ってたところを <header> <footer> に変えてみたり。
久しぶりにW3CとLighthouseに聞いてみれば「alt無いよ！」「終了タグが無いタグの末尾にスラッシュ付けないで！」とか色々と指摘してもらいまして。相変わらず勉強になる～
<hr /> 👈️ この書き方はXHTMLの書き方で、HTMLは<hr>で良いらしい
むしろ末尾の/が悪さをする場合があると…
ブログをいっぱい書いてた頃の知識と混ざってる気がする。
あのとき使ってたブログの言語がXHTMLだったから、
<hr /> 👈️ こういう書き方をしないといけなかった。
まあでもXHTMLの厳密な書き方を覚えたおかげで、今キレイな書き方ができてると思えばいい…のか…！
#個人サイト
【サイト更新】本日の更新
本日のテーマ：
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はまだ対応してないサービスとかブログとかソフトもある
ひと手間かけさせるのってアリかも
#個人サイト #てがろぐ
本日のテーマ：
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はまだ対応してないサービスとかブログとかソフトもある
ひと手間かけさせるのってアリかも
#個人サイト #てがろぐ
【サイト更新】ここ数日の更新
・全体
Webフォント、アイコンのセルフホスティング成功
スマホ版でのデザイン崩れを修正
ノート風罫線をpng画像からCSSに変更
FontAwesomeのCSSを @import から link に変更
HoYoLABへのリンクを追加
自己紹介欄に作業環境を追加
・イラスト
ゲムすきクリップ、ふぁぼすきクリップへのリンクを追加
過去ギャラリー入口に注意書きを追加
・てがろぐ
メニューのリンク修正、追加
本日時点でのローカル上の総容量24MB👍️
GoogleFontsに加えてFontAwesomeなどもセルフホスティングしてみましたが、そこまで容量使わないっぽいので安心しました。
あと、サーチエンジンへのリンクバナー追加しました。
まだ登録してないので、今月中には？登録できたらいいな
バナーを新しくしたい気持ちもある
#個人サイト #てがろぐ
・全体
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ファイル置いたら激遅になって学んだ、というのもある。実装の仕方が悪かっただけかもしれないけど。
#個人サイト
・全体
サイト内の画像(一部)をwebp形式に変更
名義間違ってたとこ修正
CSSファイル内の不要な記述を削除
使ってないcssファイルへのリンクを削除
・ゲームとか
歌ってみた動画を追加
・過去ギャラリー
未圧縮pngイラストをjpgに変換＆圧縮
・index
同盟へのリンクを追加
2月18日の日記で、サイトのローカル上で総容量33MB
と発言していましたが、22MBまで圧縮に成功した✌😉✌
drawrっていうブラウザで絵が描ける投稿サイトで描いてた絵がぜんぶ無圧縮pngだったっぽくて、jpgにしたほうが容量詰められそうな絵はぜんぶ圧縮してきました。
サイト内画像の透過pngもwebpの方が軽く出来たし、まだ舞える！
透過png→webp
透過なしpng→jpg
次はウェブフォント完全ローカル化やりたい
一部GoogleFonts使ってるんだけど、ローカルのほうが速度出る？よね？
速度といえば、今回のサイト改装では”なるべく速度を求めること”を念頭に置いて、JavaScriptを使わずにいい感じのサイトを作りました。
（もちろんテンプレートのパワーありき！）
前にトップページの画像をランダム表示しようと思ってJSファイル置いたら激遅になって学んだ、というのもある。実装の仕方が悪かっただけかもしれないけど。
#個人サイト
・全体
robots.txt を令和最新版に更新
llms.txt を導入
twi-emoji 実装
meta などheader記述を最適化
OGP画像をマイナーチェンジ
リセットCSS を新しいものにチェンジ
CSSの不要な記述を削除
画像のwebp化（※まだ途中）
・サイト
トップ：aboutの内容を整理
作ったもの：追加と移動
ゲームとか：リンク切れ対応
細部のデザイン変更
リストアップしたやりたいことの大半が終わった！偉業！！
検索避け関係はこちらにお世話になりました。
Parts & Tipsさんのrobots.txt生成ツールが最強です。
llms.txtはまだ無視されまくるらしいので、お守り程度ですね。
parts-tips.com/
yume-saku.net/blog/cat-site/ai...
リセットCSSはコリスさんの記事に大っ変お世話になりました。
シンプルでリセットしすぎない方向性が気に入ってます。
coliss.com/articles/build-webs...
4月中に進めていきたいのが画像のwebp変換。
BIGLOBE無料サービスの容量は＼100MB／
今後も長く使っていくには画像圧縮の道しかない…！
#個人サイト