いも帳

nav 要素は、いわゆる“ナビ”以外にも、なにげに使われている件【初心者向け】

nav 要素は、サイトやページを案内するためのリンクを囲う要素です。サイト全体の構造を案内する「グローバルナビ」はもちろん、「パンくずリスト」や「関連記事リンク」、「ページネーション（前/次ページリンク）」なども nav 要素で囲ったりする使い方ができます。

2025/05/17 06:57

nav 要素は、いわゆる“ナビ”以外にも、なにげに使われている件【初心者向け】

nav 要素は、サイトやページを案内するためのリンクを囲う要素です。サイト全体の構造を案内する「グローバルナビ」はもちろん、「パンくずリスト」や「関連記事リンク」、「ページネーション（前/次ページリンク）」なども nav 要素で囲ったりする使い方ができます。

2025/05/17 06:57

article 要素について調べてみた【初心者向け】

article 要素は、自己完結したコンテンツで使います。例えば1本の記事や投稿などが該当します。また、各記事へのリンクボタン、レビューやコメントなど、さまざまな独立して意味を持つコンテンツにもよく使われます。

2025/05/05 12:28

aside 要素についてまとめてみた【初心者向け】

aside 要素は、サイドバーや、広告といったメインのコンテンツから明確に独立した情報を囲うために使われます。

2025/05/03 02:14

main 要素について調べてみた【初心者向け】

main 要素は、主要なコンテンツ部分を囲う要素です。HTML ドキュメントに『main 要素は1つだけ』、hidden 属性で非表示にしている main 要素であれば、複数記述しても問題ありません。

2025/04/30 00:15

足元をおろそかにすることなかれ！footer 要素についてまとめてみた。【初心者向け】

footer 要素は、「セクショニングコンテンツ」内にある場合はそのセクションのフッターとして、「body 要素」が footer 要素に一番近い先祖なのであれば、Web ページ全体の“フッター”として扱われます。

2025/04/25 19:10

足元をおろそかにすることなかれ！footer 要素についてまとめてみた。【初心者向け】

footer 要素は、「セクショニングコンテンツ」内にある場合はそのセクションのフッターとして、「body 要素」が footer 要素に一番近い先祖なのであれば、Web ページ全体の“フッター”として扱われます。

2025/04/25 19:10

セクショニングコンテンツについて調べてみた

セクショニングコンテンツとは、HTML におけるコンテンツモデルのカテゴリのうちの一つで、header 要素および footer 要素の範囲を定義するコンテンツです。

2025/04/08 14:37

header 要素は、実はセクションではない件。

Web ページを作りはじめるときに、ヘッダー部分を header 要素で“セクショニング”してようやっと『さて作るぞ！！』ってな感じで気持ちが入りますよね！そんなヘッダー部分の大枠を担う header 要素、私は『ヘッダーである』ということ

2025/04/05 05:04

画像は figure 要素で囲え！figure 要素を使えばちょっと賢くなった気になれる件【初心者向け】

画像を囲う figure 要素についてまとめました。 figure 要素は写真や図、グラフなど、意味のある構造として表現する図を適切にマークアップするのに最適です。

2024/12/17 21:53

head 要素の基本形テンプレをまとめてみた【初心者向け】

head 要素には、ドキュメントのメタデータを記述します。SEO や UI/UX、シェアリングにおいて重要な設定なので丁寧な記述を心がけましょう！

2024/12/13 11:48

メタという言葉のニュアンスを調べてみたら、哲学的な話で、意識が次元を超えそうになった件。

「メタ発言」や「メタデータ」などいろいろなメタがありますが、いずれの“メタ”も「別次元から物事を見る」という本質は同じ。「神さまの視点」に近いものだと言えます。

2024/12/08 13:51

いつもコピペだった「メタタグ」とちゃんと向き合ってまとめてみた。【初心者向け】

meta 要素は、Web ページの概要や特性を伝えるための情報、「メタデータ」を設定することができる要素です。title / base / link / style / script 要素では表現できない部分を担当します。

2024/12/05 08:34

Photoshop の生成 AI 「AI フォトエディター」で遊んでみた。

Photoshop の生成 AI「AI フォト エディター」を使って、テキストだけで、ゼロからの画像生成を体験してみました！

2024/11/30 15:07

link 要素を何気なく使っていたので、ちゃんと向き合ってみた。

link 要素って、rel 属性を入れればいいの？href 属性？type 属性って入れるんだっけ？media 属性は？コピペをずっと使いまわして、何となく使ってませんか？今こそ、link 要素と向き合い正しい知識で使えるようになりましょう！

2024/11/28 16:08

title 要素についてまとめてみた。【初心者向け】

HTML でとても大切な要素の1つ、 title 要素！どんな役割があるのか、どんなルールなのか、などなど初心に帰ってまとめてみました。

2024/11/26 15:55

body 要素についてまとめてみた。【初心者向け】

HTML コーディングするときに、あたりまえのように使う body 要素について、初心に帰ってまとめてみました。 body 要素のルール body 要素のルールはシンプルです。『1つの HTML ドキュメント（HTML ファイル）に1つだけ

2024/11/25 20:27

img 要素についてまとめてみた【初心者向け】

img 要素は、src 属性と alt 属性をつけて記述します。基本形はの3点セットで覚えておきましょう。サイズは、CSS で指定するのが個人的にはオススメ！

2024/11/20 14:52

パス指定の記述を忘れたときに見る記事【初心者向け】

「絶対パス」、「ルートパス」、「相対パス」の記述方法をよく混乱して、間違えるのでまとめました。特に相対パスは図を用いて解説しています。

2024/11/18 11:37

Photoshop で Web 用画像の書き出し方2種類をまとめてみた！

「Adobe Photoshop」で Web ページ用に画像を作成したら“書き出し”をします。その方法を初心に帰ってまとめてみました。 この記事でわかること「Web 用に保存（従来）」での画像の書き出し方法「書き出し形式」と「アートボード」

2024/11/15 20:25

テキストの折り返しについて【CSS】

Web ページのテキストの折り返し（ワードラップ）をコントロールするには柔軟に使えるoverflow-wrap: anywhare;の使用をオススメします。

2024/11/13 09:27

広告少なめでシンプルで使いやすかったブログを見るアプリ「ブログみる」【レビュー】

ブログを見るアプリ「ブログみる」は、インターフェースがシンプルで広告も控えめ！とても使いやすいです。スマホでブログを見るのにとてもオススメです！

2024/11/10 21:09

CSSだけで背景を固定するパララックス風スタイル【iPhone 対応】

Web ページで背景画像を固定するデザインを作りたいですか？ See the Pen parallax by MATSUDAI (@matsudai) on CodePen. ↑こんな感じ！イケてる感ありますよね！ この記事でわかることiO

2024/11/08 22:07

dl 要素についてまとめてみた【初心者向け】

HTMLの「dl 要素」、「dt 要素」、「dd 要素」のそれぞれの基本的な使い方や用語や意味についてまとめてみました。

2024/11/03 14:47

実質1円という売り文句の iPhone 15 を契約してみた。【レビュー】

SoftBankの実質24円のiPhone15を契約してきましたので、ブログやSNS用途を含めた普段使いという視点でレビューをまとめました。写真のクオリティや契約のコストをまとめましたので参考になれば幸いです。

2024/11/02 14:37

めんどくさいのは嫌！スマホの写真の取り込み！

スマホの写真をパソコンに取り込むのに“めんどくさくない”方法として「iCloud」と「Google ドライブ」のオススメなポイントを紹介します。

2024/10/30 03:29

【Web デザイン】ブログ記事の行間はどれくらいがいいの？【二分四分】

ブログをせっせと書きなぐり『よしできたぞ！』と読み返してみたら、なんだか読みづらいさにガッカリなんてことは日常茶飯事。（内容はさておき……。）そんな感じで読みやすさってなんだろうと考えてみたら、「行間」ということばがおぼろげながら頭に浮かん…

2024/10/20 12:07

【Web デザイン】ブログ記事の見出しについて考える

ブログ記事の「見出し」のデザインって、ブログの見やすさに直結する大切な要素だと思いませんか？大きい文字にしたり、下線を引いたり、帯を引いたり、一風変わったデザインでブログのイメージを引き立てたり。今回はそんな「見出し」のデザインについてまと…

2024/10/18 07:27

【初心者向け】span 要素について調べてみた【HTML】

span 要素のこと、ちゃんと理解して使えてますか？！私は、span 要素があまり好きではありませんでした。なぜなら、どうしようもなくなったときに苦し紛れで召喚する最後の手段みたいなイメージがあったからです。あと語呂があまり好きじゃないです…

2024/10/13 00:00

【デザイン探索】秋を探しに散歩してきました。

2024年10月11日、まだ少しだけ暑いですね。最近、ブログで写真をよく使うので、せっかくなので、秋を探しに家の周りを探索してきました。この記事を読んで、秋のデザインのヒントになれば幸いです。さて、ちかごろ雨の日が続いていましたが、今日は陽…

2024/10/11 20:46