🔰はじめての方へ

maple

CSS

【CSS】「:target」 使い方メモ/アンカーリンク先の表示

:target とは:target疑似クラスは、ターゲットとなるアンカーリンク先の要素を表します。アンカーリンクは、同じページにある項目や、別のページにうつるものです。「URLのフラグメント」URLの「」のように、URLの最後につく「#」に...
CSS

【CSS】「counter-increment」使い方メモ/番号を付ける

counter-increment とは複数ある要素に番号を付けたいときに使用します。様よりお借りしました使い方疑似要素に「content: counter();」も指定します。文章の先頭に数字を入れたいとき、 li { counter-i...
CSS

【リセットCSS】概要とNormalize.cssの使い方

リセットCSSとは「Google Chrome」「Safari」「Microsoft Edge」など、それぞれ異なるブラウザでもすべて同じように、サイトが表示されるためのCSSのことです。リセットCSSを使用するのは一般的になっています。ブ...
プログラム

正規表現について簡単にまとめた

正規表現とは沢山ある文章の中から、簡単に目的の文字列を検索できる表現のことです。文字や文字列を指定して、一致する文字列を検索したり、置換したりすることができます。メタ文字の種類正規表現にはメタ文字を使用します。メタ文字は半角で表記します。....
Figma

【Figma】サイト制作の基本的な操作を簡単に説明

Figmaについてや始め方については、別の記事で紹介しているので説明を省きます。ここでは基本的な操作方法について説明していきます。日本語にする翻訳機能を使っていましたが、翻訳が大変なことになったので、検索すると日本語に変換機能がありました!...
Figma

【Figma】コンポーネント機能の使い方

Figmaについて勉強したての、独学Web初心者です。Figmaについては、別の記事でご紹介しているのでご参照ください!Figmaの概要:Figmaの基礎的な機能:今回はコンポーネント機能についてお話します。コンポーネント機能とはコンポーネ...
サイト作成

サイト制作/各パーツの名前を知っておく

Web初心者なのですが、独学でやっているため、サイトのそれぞれの要素の名前がわからず、なんとなく制作していました。チームでやる際に、これでは私しかわからない!と思い、簡単にまとめてみました!ホームページ と サイトよく聞く「ホームページ」似...
Figma

ページがださい!素敵なサイトのデザインを作るFigmaの始め方

Web初心者なのですが、自分でなにも考えずに「あこれもいれたい!」「これも!」ってやっていたら、統一感のないページだったり、デザイン無知のため質素なページになってしまいます。私の成長日記もかねて、記録していこうかなと思います!一から作った初...
サイト作成

面白い!Googleサーチコンソールの設定方法

Googleサーチコンソールとは無料で使用できる、Google検索でのサイトのパフォーマンスを分析できるツールのことです。検索順位やクリック数、表示回数などがわかります。また、検索ページに掲載されているか否かもわかり、掲載されていない場合は...
サイト作成

FTPの使い方/WinSCP

FTPとはFTPとは、ファイルを転送するためのもので、サーバーにアップされたファイルの一覧を見たり、ファイルをサーバーにアップロードしたりできます。私は「WinSCP」を使用しているのでその方法について説明します。「WinSCP」とはWin...
Wordpress

【WordPress】はじめに設定したいこと 14選!

Wordpressにてサイト作成まずはWordpressでサイト作成をします。サイトの作成方法は別の記事で紹介しているのでご参照ください。① サイトタイトルの設定サイトタイトルは、サイトの一番上に表示される大切なものです。30文字以内が目安...
Wordpress

見やすいサイト制作のポイント!サイズの目安/リンクの開き方

ここでは、初心者の私が知らなかった、サイト制作のポイントをまとめてみました!エンジニアの先生が教えてくれたものを含めご紹介します!フォントフォントには、「Webフォント」と「デフォルトフォント」があります。「Webフォント」ex)有名なもの...
サイト作成

ファビコン(サイトアイコン)の設定/WordPress

ファビコンとはファビコンとは、サイトのアイコンのことで、スマホのホーム画面に出るアイコンや、パソコンでGooglechromeを使用した際に上に出るタブに表示されるアイコンを指します。自分のサイトがブランドとなるようなもので、目印となるもの...
Wordpress

【WordPress】ページ読み込み速度が遅いときにやったこと

モバイルページの読み込みが遅かったので、ページ読み込み改善のためいろいろ試行錯誤してみました。他の記事でも紹介していますが、とても見にくくなってしまったのでまとめてみました。ページの読み込み速度は、SEOにも関係するため、知っておきたいとこ...
CSS

【WordPress】モバイルボタンの表示が遅い!苦戦!!

私は、Wordpress のテーマ「cocoon」を使用しています。スキンの変更や、モバイルボタンの変更をしていたら、モバイルボタンの表示が遅いことに気が付きました。2秒程度待つと出てくるか、スクロールをすると出てくるようになっています。そ...
CSS

【CSS】アニメーションを付けられる「transition」の意味、使い方

transitionについて学習します。transitionとは「transition」は、ページにCSSでアニメーションをつけることができます。「transition-duration:3s」は、3秒かけて表示していくアニメーションになり...
CSS

トップページ(固定ページ)のタイトルがどうしても消えない

私は、Wordpressテーマ「cocoon」を使用しています。トップページを固定ページにしている場合、タイトルをCSSで簡単に消すことができます。固定ページ編集画面の「カスタムCSS」に記述する場合h1 {display: none;}c...
CSS

CSSが反映しない!CSSの読み込み優先順位

CSSについて学習中なのですが、記述したCSSが反映されないことがありました。CSSを記述する際には優先順位について理解しておく必要があります。CSSについて簡単に振り返りCSSはスタイルシートとよばれ、ページの装飾をするのに使用します。H...
CSS

CSSの基礎文法学習!

CSSの基礎文法CSSは、セレクタ・プロパティ・値の3つからなります。書き方のポイントプロパティと値は、「{}」で囲みます。プロパティと値の間は「:(コロン)」複数プロパティを指定するときは、終わりに「;(セミコロン)」を忘れずに!コメント...
サイト作成

【Googleアドセンス】1か月で合格!ポイント/4つの初期設定

Wordpressにてブログをはじめて1か月。なんとなく申請したアドセンスに合格しました!通った時の記事は45記事程度です。皆様の参考になれば幸いです!GoogleアドセンスとはGoogleが提供する広告プログラムのことです。広告が自動で表...