現状HTML5やCSS3が一番活躍しやすい場所ということで、スマートフォンなどのスマートデバイス（モバイルデバイス）があげられると思います。
スマートデバイスwebページを制作するのにHTML5やCSS3を使わなくてはならないということではないですが、モバイル向けページのコーディングをする上で気を付けたいことをあげていきます。
スマートデバイスは種類によって、（物理的に）画面の大きさが異なります。
metaタグのname属性でviewportの設定をすることで、画面の幅に合わせて自動的に拡大・縮小させるか、スマートデバイスでピンチによる拡大・縮小ができるのかどうかを指定します。
PC向けとモバイル向けでhtmlファイルを分けている場合はPC向けの方には不要ですが、一つのhtmlファイルでPCでもモバイルでも見せたい場合は、viewportの設定が今後必要になってくると思います（→モバイルフレンドリー）。
また、viewportはCSSでも設定できます（ただし、サポートされているブラウザの範囲が不明瞭）。
将来的にはmetaタグではなくCSSで指定するようになるとの噂ですが、現在W3Cの方でも草案段階のようなので、CSSで指定する際は互換性維持のためにmetaタグの方でも指定してください。
なお、レスポンシブwebデザインについては別ページに説明があるので、そちらを参照してください。
フォントサイズはPCの感覚で想定していると、意外と小さく、読みにくいと思います。
少し大きめ、行間も多めに取っておくと良いと思います。特に文章中にテキストリンクがあるなら、行間はタップしやすいように若干多めにとるのが良いでしょう。
ターゲットユーザにもよりますが、一般に14（～16）pxが標準サイズのようです。
補足的なテキストとして小さめサイズを指定したい場合は（8～）10px程度を限度としましょう。それより小さくなると判読しづらくなります（googleのモバイルフレンドリーテストではじかれる可能性もあります）。
行間は140%～160%が一般的なようです。
もちろん、デザインやコンテンツ、ターゲットユーザによって最適なフォントサイズ・行間を設定してください。
場合によっては、ある程度ユーザがフォントサイズを選択できるようにしておくのも良いでしょう。
さて、上記まではフォントサイズをpx（絶対指定）で説明しましたが、実はスマートデバイス向けのページの場合は別の単位を使うべき・・・らしいです。
このあたりは好みや考え方にもよるのですが、PC向けとスマートデバイス向けを同一htmlファイルで表示させる場合はとくに、相対指定の単位を使った方がデバイスによって文字サイズを変更したいときなどに便利です。
相対指定としては%やemが見慣れた単位だと思いますが、CSS3から新しい単位remが使えるようになりました。
remのrはrootを意味します。
remは常にルート（html要素）に相対的となります。
%やemの場合は親要素のフォントサイズを基準として相対的になるので入れ子構造になっていたりすると、複利計算されて想定していたよりとんでもないサイズになったりしますが、remの基準はルート（html要素）なのでその問題はありません。
ただし、CSS3からの単位なので、oldIEではサポートされていなかったりします。
html { font-size: 62.5%; } /*rootになるhtml要素にデフォルトサイズを10px相当にする値を指定*/
body { font-size: 14px; font-size: 1.4rem; } /* =14px */
h1 { font-size: 24px; font-size: 2.4rem; } /* =24px */
※黒い部分をダブルクリックするとソースを選択できるので、コピーして使ってください。
まずは、rootになるhtml要素（bodyではない）に基準となるサイズを指定します（デフォルトのフォントサイズを62.5%にすると10px相当になり、これが1remになる・・・ユーザーが変更していない限りだけども）。
ページ全体の基本サイズを14px（相当）にしたい場合は、bodyタグに1.4remを指定します。
上記の例では、rem単位の指定をする前にpx単位の指定をしていますが、これはremをサポートしていないブラウザ対策です。もし、cssメディアクエリなどを使って、画面サイズごとにcssを振り分けていたりすれば、不要の場合もあります。
chromeでおかしくなる時は以下のようにbodyタグの単位だけemにしてください（もしくは下記リンクリストの上から5番目にのリンク先にあるjsコードを試してみてください）。
html { font-size: 62.5%; } /*rootになるhtml要素にデフォルトサイズを10px相当にする値を指定*/
body { font-size: 14px; font-size: 1.4em; } /* =14px */
h1 { font-size: 24px; font-size: 2.4rem; } /* =24px */
※黒い部分をダブルクリックするとソースを選択できるので、コピーして使ってください。
フォントサイズの話にやや絡むのですが、一部のwebページの原稿を書く人たちは、本来改行すべきではない部分（読点のあとなど）で改行する癖があるようです。
読みやすさを狙ってのことだと思うのですが（原稿製作者の自己満足？）、webページは紙媒体と違うので、単語の途中で改行したくないという理由で文章的に無意味な部分で改行するのは本来あまり良くないことです。
例えば、とある1文の無意味な箇所で改行されていると音声読み上げブラウザは、その無意味な箇所を1文の終わりとみなします。結果、音声読み上げブラウザを使わざるを得ないユーザーに伝えたい内容が伝わらなくなる可能性があります。
また、ユーザーがブラウザの機能を使って拡大・縮小した際に、原稿を書いた人が意図していなかった部分で折り返しが発生し、見苦しいwebページになる可能性もあります。
さらにスマートフォンなど物理的な画面幅がまちまちなスマートデバイスの場合、無意味な箇所での改行＋まちまちな部分での折り返しで、かなり見苦しく読みにくい文章になります。
原稿製作者の美的感覚としては意味のある箇所なのかもしれませんが、文章的に無意味な箇所での改行を行わないようにすべきです。
どうしても特定の単語の箇所では折り返しを発生させたくない場合は、その単語にwhite-space: nowrapを指定するなどして、対処しましょう。
スマートデバイス向けのwebページで注意すべきことは、他にもいろいろあるのですが、あとは以下のリンクリストを参照したりgoogle先生に訊いてみてください。
OSやブラウザのバージョンアップなどで状況も変わるので、以下のリンクの情報が古い場合もありますから、注意してください。
iPhoneの日本語フォント（システムフォント）は「ヒラギノ角ゴPro W3」と「ヒラギノ角ゴPro W6」の2つです。基本的には「ヒラギノ角ゴPro W3」を指定してください。
Androidに標準インストールされているフォントは「Droid Sans Japanese」です。こちらは太字対応していません。
まぁfont-familyをsans-serifにしておけば、勝手にゴシック体で表示してくれると思いますが、たまにフォントダウンロードして設定しているユーザーがいるので、明確に指定しておいた方がいいかもしれません。
Androidユーザを考慮した上で太字表現を使うようにしましょう（strongタグにcssで色を付けてみたり、text-shadowなどを利用すると良いかと思います）。
ちなみに、この「コーダー日誌」では基本windowsパソコンで見ることが前提なのでメイリオとsans-serifのみを指定していますが、なぜか私のandroid端末（2.3.3）では太字が表示されます（sharp製だからという噂あり）。
iOSにしろ、Androidにしろ、バージョンによって標準フォントが異なります。
なお、Androidで日本語は太字に対応していませんでしたが、いまは対応しているようです（デフォルトで太字フォントがインストールされているかどうかは機種によるのかもしれません）。
もし、太字対応していない端末も考慮に入れるのであれば、strongタグにcssで色を付けてみたり、text-shadowなどを利用するといった工夫が必要です。
なお、text-shadowもスマートデバイス向けOS・ブラウザのバージョンによっては表示しないので、過信しないでください。
フォントの種類や太字、text-shadowの問題は、スマートデバイスのOS（およびそのバージョン）や機種によってまちまちです。お勤めの企業やクライアントの方針にもよりますが、ユーザーの環境などわかる資料があるならばそれを参考にしつつ、どの程度まで古いOSや機種を対象とするかなどによって、太字等を使うか、使うにしても太字等の表現ができない場合の対策をどうするか、検討しましょう。
画像やcss装飾で表現したボタンの場合、タップしやすいサイズを意識してください。
デザイン段階でそのあたりは気を付けられていると思いますが、実装してみたら小さかったといった場合はボタンの周りの空間を多めにあけてあげるとタップしやすくなったりします。
また、PCでおなじみのマウスオーバーの表現は作っても、ほとんどの場合、スマートデバイスでは視認できないと思うので、デザイン段階で「これタップしてほしい！」という感じのものにしてもらうか、邪魔にならない程度にアニメーションを付けてみるとかしてみるといいかもしれません。
テキストリンクの場合はタップしにくかったり、リンクと気づいてもらえないことがあるので、行間をあけたり、背景色を付けたり、工夫が必要です。
このページからしてスマートフォンなどでみるととても長いと思うので、偉そうに言えないのですが、スクロールが長すぎるとユーザは疲れます。
かといって、スクロールを減らすためにタイトルをクリックすると詳細な文章を読めるように（アコーディオン）していると、いちいちタップさせられてユーザーは疲れます。
複数ページに分けるという方法もありますが、目的の情報が得られるまでに何度もリンクをタップさせられても飽きてくるでしょう。
入力フォームもスマートフォンなどでは複雑な操作を何回もさせられて、ストレスになることが多いです。
これらの問題はデザイン云々よりもコンテンツそのものが整理されていないことが多いです。
情報を精査して適切で簡潔な文章にしたり、画像を有効に使ったり、うまく誘導するように設計したり、本当にすべての情報を入力してもらう必要があるかなど整理しましょう（と仕様や原稿を作る人に言いたい）。
ラジオボタンやチェックボタンなどもうまく使って、ユーザーの文字入力の負担を減らしたり、タップしやすいサイズにしたり、工夫が必要です。
Retinaディスプレイを考慮して、画像を大きめに作って、CSSなどでwidht・heightを調整して小さく表示することがありますが、たいてい元の画像の1/2サイズにすると思います。
元の画像が偶数でないと半分にできません（小数点以下はブラウザによって切り上げたり切り捨てたり扱いがまちまちです）。50%指定したとしてもなんとなく画像がぼやけたり荒れたりするので、注意してください。
また、ファイスサイズが大きくなると、表示に時間がかかる可能性もあることも考慮に入れておいてください。
フォントサイズを指定するremが上の方に出てきましたが、他にもいろいろ新しい単位があるようです。
例によって、OSやブラウザのバージョンやその組み合わせによって、使えたり使えなかったりいろいろあるのですが、使いこなすと便利な単位もあるようなので、適宜情報を入手して使えそうだったら使ってみてください。