Webエンジニアのブログ

Webページの表示において、様々なデバイスの幅でのコンテンツの文章の折り返し位置は、見やすさや読みやすさを保つために調整したいところですが、CSSのword-breakプロパティの値を「auto-phrase」とすることで、日本語のテキスト...
続きを読む>>

BlueskyにもX Pro（旧TweetDeck）に似たWebクライアント「deck.blue」が公開されており、アプリ使いに情報収集がしやすくなります。ポストや検索はもちろん、ハッシュタグが対応していたり、どのようなカラムを追加するのか...
続きを読む>>

X（旧Twitter）の代替SNSとして注目されているBluesky（ブルースカイ）。Xとデザインが似ておりそれなりの機能も備わっていますので、とても使いやすいSNSです。アカウントの設定や投稿時のリンクカードの表示方法、タイムラインの設定...
続きを読む>>

Zoom Clipsは、カメラやPC画面を短時間の高品質な動画として手軽に録画でき、簡単な編集や共有ができる機能になります。PCの画面を使って情報共有する際に便利に活用できるでしょう。ここでは、Zoom Clipsの利用方法や細かな設定につ...
続きを読む>>

Webデザインの配色は、サイトのイメージや与える印象、そして情報の見やすさなど様々な要素が関係してきますので、ユーザーが利用する環境にも合わせる必要があります。ここでは、CSSのlight-dark()関数を使ってライトモードとダークモ...
続きを読む>>

Webで利用する画像データの形式は様々で、ロゴやアイコンそして見出しなどで使うテキストデータは、可変しても劣化しないベクターデータのSVG形式で扱っていくこともあります。ここでは書き出す際の設定も含めて、FigmaでのSVG形式の書き出し方...
続きを読む>>

Webページにアクセスした時に、コンテンツが綺麗に表示されるまでの時間が長いとユーザーにストレスを与えてしまいますが、ストレスを軽減するのにローディングアニメーションは非常に効果的です。ここでは、リソースが読み込まれるまでのローディングアニ...
続きを読む>>

Google AnalyticsはGA4から、ページビュー数の項目が表示回数という名称に変更になり、ページビュー数（PV数）の確認に少し戸惑う方も多いでしょう。ここではGoogle Analytics 4でのページビュー数の確認について、標...
続きを読む>>

無料で手軽に利用することができるデジタルホワイトボードのFigJam。iPadで利用できるFigJamアプリを活用すると、Apple Pencilなどのタッチペンが使えるので快適に作業ができます。...
続きを読む>>

Googleアナリティクス4（GA4）では、これまでの標準レポートとは別に、細かな設定でサイトを分析することができるデータ探索ツールがありますが、デフォルトの設定ではデータの保持期間が2ヶ月となっています。このデータの保持期間はGoogle...
続きを読む>>