ぶぶりん

未経験からWEBデザイナー・コーダー・フロントエンドエンジニアになるためのSEO・HTML・CSS・Javascript・jQueryについてお役立ち情報を掲載していきたいと思います。また、WordPress・Illustrator・Photoshopについても掲載していきたいと思います。

Google Mapsの埋め込み・小技まとめ

  javascript , , ,

google map タイトル

2回にわたって、会社やお店などの所在地を表すために多くのサイトで使用されているGoogle Mapsの埋め込みから使い方・オプション・小技を扱っていきたいと思います。第1回目はGoogle Mapsの埋め込み・オプションなどをご紹介したいと思います。

続きを読む

[HTML5] HTML5のarticle・sectionによるアウトライン

  HTML, SEO ,

HTML5 アイコン

HTML5を使用したサイトも多くなってきて、HTML5を用いて構築する方も多いと思います。そこで、前回ご紹介させていただいた「HTMLコーディングの基本のアウトラインとは」の続編になる、HTML5においてarticle・sectionを用いたアウトライン(階層構造)についてご紹介していきたいと思います。

続きを読む

[HTML] HTMLコーディングの基本のアウトラインとは

  HTML, SEO ,

html アウトライン

WEBサイトのコーディングをする際に、見やすさなどを考えた「ユーザーに対して」と、SEO対策を考えた「Googleなどの検索ロボット(クローラー)に対して」行うと思います。今回、HTMLのコーディングする際に重要である検索ロボット(クローラー)へのSEO対策となるアウトラインについてご紹介していきたいと思います。

続きを読む

[SEO] SEOで最重要項目!!title・h1・descriptionの設定方法まとめ

  HTML, SEO ,

seo h1 description

SEO対策する上で、「title」「description」「h1」は非常に重要です。
特に重要なtitleは、SEO対策キーワードが入っていなければ、SEO対策をしているとは言えないほど重要です。

そこで今回は、「title」「description」「h1」について基本をしっかりとまとめたのでご紹介していきたいと思います。

続きを読む

[CSS] floatの浮動化を解除するclearfix

  CSS ,

CSS float clearfix

WEBサイトをレイアウトする際に、よくfloatプロパティを用いると思います。
レスポンシブルデザインにおいても、各デバイス(パソコン・タブレット・スマートフォンなど)でデザインを変化させるために、とても重要であると言えます。
しかし、floatを使用すると浮動化されて「divなどの親の背景が表示されない」「下のレイアウトが崩れる」などの様々な問題が生じてきます。
そこで今回、floatの浮動化を解除するclearfixについてご紹介していきたいと思います。

続きを読む

[CSS] paddingとmarginの使用方法

  CSS ,

padding margin

WEBサイトをコーディングする際に、paddingとmarginをいつも各方向をいっぺんに設定する時に止まってしまうため、
確認・まとめの意味も込めて今回paddingとmarginについて書き込んでいきたいと思います。

続きを読む