タグ

コーディングとWEB制作に関するmatuixのブックマーク (3)

  • userAgentでブラウザ&デバイス判別 2017年版 - Qiita

    ブラウザのUserAgentを調べて、ユーザーのブラウザ名・バージョン・デバイスの種類を判定するJavaScriptライブラリをアップデートしました。CSSでの場合分けに使えるように、Modernizrっぽく <html> タグのクラス名に判定結果が追加されるようにしてみました。 よりよい方法やバグ等ございましたら、アドバイスいただけると光栄です。 ソースコード ちなみにおいらのコードはとても汚いです。 Githubにも置いておきますね → Github - UserAgentChecker.js // ------------------------------------------------------------------------------- // User Agent Checker // ----------------------------------------

    userAgentでブラウザ&デバイス判別 2017年版 - Qiita
  • イラレでWebデザインをされる方にお願いしたい7つのこと。

    普段はDTPをメインにやっていて、たまにWebのデザインもするというデザイナーさんは、 IllustratorでWeb用のデザインカンプを作ることが多いと思います。 別にIllustratorからでもコーディングはできるのですが、後工程の人を困らせないために、 ちょっとだけ気に留めておいて欲しいことがあります。 1.色モードはRGBで。 普段DTPをやっているとついCMYKモードのままで作ってしまうことがあるかもしれません。 でもWebはRGBの世界です。変換すると意図した色にならなかったりしますので、 最初からRGBで作ってください。埋め込む画像も同じです。 2.どこがデバイスフォントなのか分かるように指示を。 紙の世界では文字は文字でしかありませんが、Webの世界では「テキストデータ」にするのか 「画像」にするのか決めなければなりません。文は原則「テキストデータ」ですが、 判断に困る

  • スマホサイトの作り方で、あんまり書かれてないことを書いてみた - Kaleidoscope

    【スマホ対応サイト制作のより詳しい記事はこちら】 1.メニュー編 2.HTMLCSSで画像を操る編(前編) 2.HTMLCSSで画像を操る編(後編) スマホサイトの作り方関連のブログとかを見てて、viewport周りの基的な設定は書かれているのですが、 個人的に重要だと思うポイントが、なかなかどなたも書いてらっしゃらないような気がするので、まとめてみました。 それは、 とにかく内側のHTML要素をハミ出さないように作る どうしてか? ふつうは、スマホサイトというのは縦スクロールしかさせたくないですよね。 例えば、iPhoneで言うPortrait(縦)表示のとき、横幅320pxを超えたページ構成になると、 おかしな横スクロールが発生してしまいます。 viewportで拡大とかの禁止をおこなっていても、そうなります。 (まぁ、拡大とは意味が違うので当然なのですが。。。) 具体的にどうい

    スマホサイトの作り方で、あんまり書かれてないことを書いてみた - Kaleidoscope
  • 1