ホームページの基礎知識

ホームページを作っていると、 ・文字だけで読みにくい・枠線を付けたらダサくなった・背景色と枠線のバランスが分からない このような悩みを持つこともありますよね？ そこでこの記事では、CSS初心者でも使いやすい背景色・枠線の基本と、きれいに見せる...

ホームページを作っていると、 ・昨日まで問題なかったのに、急に崩れた・どこを直せばよいのか分からない・スマホだけおかしくなる このようなトラブルはよく起きますよね。 そこでこの記事では、初心者でも順番に確認すれば直せるように、レイアウトが崩...

ホームページを作っていると、 ・画像が大きすぎて画面からはみ出る・スマホで見るとレイアウトが崩れる・パソコンでは問題ないのに、スマホだけおかしい こんな悩みを持たれることもあると思います。 そこでこの記事では、初心者でもすぐ使えるCSSで画像...

ホームページを作っていると、 ・横にスクロールバーが出てしまう・画面いっぱいに表示したいのに、左右に余白が残る・スマホだけレイアウトが崩れる こうした悩みはとても多いです。 そこでこの記事では、CSS初心者でも分かるように、横幅を画面いっぱい...

ホームページを作っていると、 ・中央にしたいのに、左に寄ったまま・文字はできたけど、画像ができない・いろいろな書き方があって混乱する こんな悩みを持つこともありますよね。 そこでこの記事では、文字・画像・ブロック要素ごとに、正しい中央寄せの...

ホームページを作っていると、 ・文字や画像がくっついて見える・間隔がバラバラで見た目が悪い・marginとpaddingの違いがよく分からない こうした悩みはとても多いと思います。 そこでこの記事では、CSS初心者でも分かるように、marginとpaddingの基本と...

ホームページを見ていて、 ・文字が詰まりすぎて読みにくい・行間が広すぎて、間のびして見える・どこを直せばよいかわからない このように思われることもありますよね。 そこで、この記事では、CSSで行間を整える基本と詰まりすぎ・広すぎを直すコツを分...

ホームページを作っていると、 ・文字が小さくて読みにくい・パソコンではよいけど、スマホだと文字が小さい・どこで文字サイズを変えればよいかわからない こうした悩みはとても多いです。 そこでこの記事では、初心者でもすぐできる文字サイズの変更方法...

ホームページを作っていると、ある日突然、 ・表示がぐちゃぐちゃになった・スマホでだけ崩れた・どこを直せばいいかわからない こんなトラブルはとてもよく起こります。 そこでこの記事では、HTMLでレイアウトが崩れる原因と基本的な直し方について、初心...

ホームページを作っていると、 ・画像をクリックしたら別ページへ移動させたい・バナーのように使いたい・文字リンクだけだと目立たない このようなときもありますよね？ そこでこの記事では、初心者でもすぐできるHTMLでリンク画像を作る方法をわかりやす...

ホームページやブログで情報をまとめたいとき、リスト（箇条書き）を使うだけで一気に読みやすくなります。 ただ、、、 ・改行だけで並べていて読みにくい・どうやって箇条書きにするかわからない・見た目がそろわない こんな悩みを持つ人はとても多いです...

ホームページを作っていると、 ・文字が目立たなくて読みにくい・背景が白すぎてさみしい・少しおしゃれにしたい こんなときに役立つのが、文字色と背景色の変更です。 そこでこの記事では、初心者でもすぐできる色の変更方法をわかりやすく解説します。 ...

ホームページで複数の画像を並べたいとき、 ・縦に並んでしまう・パソコンではよいのにスマホで崩れる・きれいにそろわない こんな悩みはとても多いです。 そこでこの記事では、初心者でもすぐできる方法と、スマホでも崩れないコツをわかりやすく解説しま...

ホームページを作っていると、 ・文字と文字の間が詰まって読みにくい・画像と文章がくっついて見える・全体的にごちゃごちゃした印象になる こんな悩みはとても多いです。 そこでこの記事では、HTML初心者でもすぐできる余白の整え方をわかりやすく解説し...

ホームページで料金表やスケジュールなどを表示したいとき、表（テーブル） はとても便利です。 ただ、、、 ・表を作ったらレイアウトがぐちゃぐちゃになった・スマホで横にはみ出した・どう書けばいいかわからない こんな経験をしている人はとても多いで...

ホームページを作っていると、 ・文字を中央にそろえたい・見出しを真ん中にしたい・うまく中央にならず困った このようなことはもありますよね？ そこでこの記事では、初心者の方でもすぐできる方法と、よくある失敗の直し方をわかりやすく解説します。 ...

ホームページを作っていると、 ・文字をクリックしたら別のページに移動させたい・外部サイトへリンクを貼りたい・新しいタブで開きたい このような場面はとても多いです。 そこでこの記事では、初心者の方でもすぐ使えるリンクの貼り方を、順番にわかりや...

HTMLで画像を表示したときに、 ・画像が大きすぎてレイアウトが崩れる・スマホで画像がはみ出して横スクロールが出る・サイズをどう直せばいいかわからない このような経験はとても多いです。 そこでこの記事では、初心者の方でもすぐできる画像サイズの直...

レスポンシブ対応を始めようと思ったとき、 「何から設定すればいいの？」「いろいろあってよく分からない…」 と迷う方はとても多いです。 そこでこの記事では、初心者の方がまず設定しておくべきレスポンシブ対応の基本を、わかりやすくまとめました。 レ...

ホームページをスマホ対応しようと調べていると、 「スマホ対応」「レスポンシブ対応」 という言葉が出てきて、「これって何が違うの？」と迷う方はとても多いです。 そこでこの記事では、初心者の方でもすぐ理解できるように、スマホ対応とレスポンシブの...

スマホでホームページを見たときに、左右にスライドできてしまうことはありませんか？ この横スクロールが出ている状態は、レイアウトが画面幅をはみ出しているサインです。これは見づらくなるだけでなく、ユーザーの離脱にもつながりやすくなります。 そ...

「パソコンでは読みやすい文字サイズなのに、スマホで見るととても小さく表示されてしまう。」 このような悩みを持っている方はとても多いです。 実際に、文字が小さいホームページは、読みにくく離脱されやすくなります。 そこで、この記事では、スマホで...

レスポンシブ対応をしようと思ったとき、 「CSSって何を書けばいいの？」「いろいろあって難しそう…」 と感じる方はとても多いです。 そこで、この記事では、初心者の方でもすぐ使えるレスポンシブCSSの基本設定をわかりやすくまとめました。 よく使う基本...

パソコンでは問題なく表示されている表（テーブル）が、スマホで見ると画面からはみ出してしまうことはとても多いです。 実際に、横スクロールが出てしまい、読みにくくなってしまうケースも少なくありません。 そこで、この記事では、スマホで表が崩れる...

パソコンではきれいに表示されているのに、スマホで見ると画像が大きすぎたり、途中で切れてしまったりすることはよくあります。 実際に、画像が原因で横スクロールが出てしまうケースも少なくありません。 そこで、この記事では、スマホで画像が崩れる原...

レスポンシブ対応をしようと思ったとき、 「ブレークポイントはどこに設定すればいいの？」 と悩む方はとても多いです。 実際に、ネットで調べると、 ・600px・768px・1024px など、いろいろな数字が出てきて余計に迷ってしまいますよね。 そこで、この記...

ホームページを作ったあと、 「ちゃんとスマホ対応できているのか不安…」 と感じたことはありませんか？ パソコンではきれいに見えていても、スマホで見ると文字が小さかったり、横スクロールが出ていたりするケースはとても多いです。 そこで、この記事で...

「パソコンではキレイに表示されているのに、　スマホで見るとレイアウトが崩れてしまう。」 このような悩みを持っている方はとても多いです。 でも、スマホでのレイアウト崩れは、よくある原因さえ知っていればほとんど簡単に直せます。 そこで、この記事...

ホームページをスマホ対応したつもりでも、 「本当にきれいに表示されているかな？」「どこか崩れていないかな？」 と不安になることはありませんか？ パソコンでは問題なく見えていても、スマホでは意外と崩れているケースはとても多いです。 そこで、こ...

スマホでお問い合わせフォームを使っていると、 「入力しづらい」「文字が小さくて見えにくい」「ボタンが押しにくい」「途中でやめてしまった」 こんな経験をした人はとても多いです。 実際に、フォームが使いにくいと、せっかく興味を持ってくれた人が離...