Recent searches
Search options
自己紹介の体裁を調整しました（一枚目が現状、二枚目は更新前）。 #mofu_kemo_no
(1) 表示領域の横幅が充分に広ければ、「補足情報」の見出しと内容が横並びになるようにしました。
(2) 自己紹介文はタイムライン内の投稿本文と同じ大きさにしました。（カスタム絵文字が使えるみたいですよ。）
自己紹介と「ディレクトリ」について、半透明のグラデーションを使ってヘッダー画像の表示領域を広く取るオシャレスタイルにしてみました。画像の内容に左右されるし、やり過ぎると読みにくくなるけど、これぐらいなら大丈夫かな…。 #mofu_kemo_no #Mastodon
個人ページはできるだけそれぞれの自分らしさを出せる場にしたいんだ。均質なサービスの一員ではなく。でも今やれるのはこれぐらい。
ヘッダー画像の内容は人それぞれで、下端が真っ白だと意味不明になる場合があり得るので、下端までうっすら見えるように透明度を少し変更しました。
ヘッダー画像をクリックまたはタップで押し続けている間、重なっている文字などが下へ退避して、ヘッダーを鑑賞できるようにしてみました。（それなら元から重ねないでおけばいいのでは、という感もなくはないけど…。）
「どかせるんだったら、かぶせても大丈夫」という判断で、もっと大胆に本文と重ねてみました。駄目かな…。読みにくかったらまた調整します。あとメモ欄は後方へ移動しました。 #mofu_kemo_no #Mastodon
表示領域の横幅が狭い場合を別途考えた方がいいかも。ヘッダーは原則的に横長という事になってるので、根本的に馴染んでない。（そもそもボタン類の表示が窮屈という問題もあるけど…。）
横幅が狭い場合は、あまりヘッダー領域を縦に伸ばさないようにしました。
ヘッダー画像の見せ方をこんなに勝手に変えていいのか、とも思うけど、そもそも ActivityPub でやり取りされる色んな情報は相手側で想定通りに表示される保証がないからなあ。プロフィール画像すら正方形なのか円なのか不定だし。ヘッダーについてはツイッターでの表示も変遷したし。一般論としてヘッダーは外周が切り落とされる可能性が高いから、見せたい被写体を中央に寄せて、周りの余白を大きく取った画像がいいと思います。
マストドンのプロフィール設定画面は縦横比 1:3 の画像を期待している雰囲気だけど、連合タイムラインの人々のヘッダーを見てみると全然そうなってない（そこまで細長いのを用意してる人は少ない）。寸法について何も前提を置けないので、大雑把に敷くしかない。
Mastodon v4.1 の初期状態では、表示領域が広い場合のヘッダー画像は「縦 145、横 578」の寸法で表示されてる。つまり約 1:4 なので元々一貫してない。
ヘッダーが背景に敷かれる領域に「backdrop-filter」で曇りガラスの効果を掛けました。画像の内容が騒々しくても読みにくさを抑えられたと思います。（最近の CSS は便利だなあ。）
「背景向きのヘッダーはなるべく色を生かせるように」「それでいて細かい文字とかを含むヘッダーを敷いても自己紹介が読みにくくなり過ぎないように」とグラデーションの具合をチマチマ弄ってる。