CSS 【CSS・js】ヘッダーをスクロールに合わせて表示・非表示させる（jQueryなし）
header { position: fixed; top: 0; left: 0; z-index: 99; height: 5.5em; transition: transform 0.3s 0.1s; } /* スクロールするとヘッダ...
サイト作成
CSS CSS PNG形式の画像に影をつけたいけどうまくいかない！
PNG画像で、周囲の背景は透過しているとき、 「box-shadow」で影をつけると、透過しているところにも影がついてしまいました。 わかりにくいのですが、角丸なのに、四角として影がついており、白くなってしまいます。 この時に便利なのが、 ...
HTML 謎の空白「$#xfeff」
サイト作成をしていた際に、1つのページだけ謎の空白ができていました。 そこで、デベロッパーツールで調べてみると、そこの部分に「$#xfeff」というものが入っていることに気づきました。 スマホでも確認してみると、余白ではなく、改行がされてい...
HTML ファビコンが表示されない
表示されないことについて調べると、いろんなところで出てくるのがキャッシュを消せと。 キャッシュを消しても、ちゃんと載っているかわからない時、調べるサイトがありました。 これで確認すると、パスの誤りや、サーバーのアップロード先の誤りなどが見つ...
Figma 【Figma】サイト制作の基本的な操作を簡単に説明
Figmaについてや始め方については、別の記事で紹介しているので説明を省きます。 ここでは基本的な操作方法について説明していきます。 日本語にする 翻訳機能を使っていましたが、翻訳が大変なことになったので、検索すると日本語に変換機能がありま...
Figma 【Figma】コンポーネント機能の使い方
Figmaについて勉強したての、独学Web初心者です。 Figmaについては、別の記事でご紹介しているのでご参照ください！ Figmaの概要： Figmaの基礎的な機能： 今回はコンポーネント機能についてお話します。 コンポーネント機能とは...
サイト作成 サイト制作／各パーツの名前を知っておく
Web初心者なのですが、独学でやっているため、サイトのそれぞれの要素の名前がわからず、なんとなく制作していました。 チームでやる際に、これでは私しかわからない！と思い、簡単にまとめてみました！ ホームページ と サイト よく聞く「ホームペー...
Figma ページがださい！素敵なサイトのデザインを作るFigmaの始め方
Web初心者なのですが、自分でなにも考えずに「あこれもいれたい！」「これも！」ってやっていたら、統一感のないページだったり、デザイン無知のため質素なページになってしまいます。 私の成長日記もかねて、記録していこうかなと思います！ 一から作っ...
サイト作成 面白い！Googleサーチコンソールの設定方法
Googleサーチコンソールとは 無料で使用できる、Google検索でのサイトのパフォーマンスを分析できるツールのことです。 検索順位やクリック数、表示回数などがわかります。 また、検索ページに掲載されているか否かもわかり、掲載されていない...
サイト作成 FTPの使い方／WinSCP
FTPとは FTPとは、ファイルを転送するためのもので、サーバーにアップされたファイルの一覧を見たり、ファイルをサーバーにアップロードしたりできます。 私は「WinSCP」を使用しているのでその方法について説明します。 「WinSCP」とは...