HTML5タグの簡単な説明とRYBE流マークアップテンプレート

HTML5の追加されたarticleタグやsectionタグなども含めてタグの説明とテンプレートを作りました。 タグの解釈や使い方などがサイトの構成や人によってそれぞれ異なったり少し複雑な印象もありますが、より文書構造を明確にできるようになった分意識してマークアップしていくとユーザーにとっても読みやすいサイトが作れると思います。ただ単にSEO対策というだけではなく、コンテンツの構成を考えるためにも…

Read More

レスポンシブデザインでコーディングしてみよう

2カラムのレスポンシブデザイン responsive3.htmlとresponsive3.cssを開いてください。 パソコン表示は900px以上とします。 パソコン表示は2カラムで左にメイン(500px)、右にサイド(300px)です。それより小さいサイズの場合は2カラム表示せず、横幅いっぱいに広げます。 では、実際に2カラム表示のレイアウトをCSSでしてみましょう。 floatを使う場合 メイン…

Read More

レスポンシブデザインを始めよう!〜初級編〜

今ではパソコンだけでなくスマートフォンやタブレットと様々なデバイスがあり、最近ではデバイスに合わせて表示を最適化(モバイルフレンドリー)することが求められています。 その方法の1つとしてGoogleの推奨するレスポンシブデザインがあります。 スマートフォンが出始めた頃はそれぞれ別のファイルを用意して対応する「サーバーで振り分ける」方法が主流でしたが、CSS3の普及や通信速度や技術の向上により「CS…

Read More

Popular Posts