タグ: 気

代わりがいない状態が続くフリーランス。

病気になったりしてしまうと仕事が止まり収入も止まるので極力ならないように実践していることをいくつか

食事は内容を選ぶ

端的に言うと生ものはなるべく避け、加熱したものを選ぶ。初めてのお店では慎重に選ぶ。

理由はいろいろあるのですが、概ね、煮る、焼くなどするとウイルスや雑菌などは死滅するので感染のリスクが減ります。また刺身や生のお肉は消化にかなり負担がかかるため、おいしいですが、忙しいときは避けます。疲労がたまっているときはなるべく新しい店や商品は避け、知っているものを摂るように心がけています。

水分は多めに取り、代謝を促す

自分の目安は冬場は午前(6~12)・午後(12~18)で500mlずつ。夏場は1lずつを目安にしています。

コーヒーやお茶はカフェインが排出を促してしまうので気になるときは水など選ぶようにしています。

冬場はマスク＋α

人ごみは避け、電車など交通機関を利用するときは必ずマスク。口や気道が乾燥したり冷えたりすると免疫も低下してしまうのでなるべくつけるようにしています。

最近ドラッグストアにある、二酸化塩素を使ったアイテムをいくつか使っているのですが、
実際効果があるようでのどがいがいがしたりといったことがなくなりました。

効果覿面のようです。

スマホサイトを作るときに気をつけているところをまとめてみました。

片手、親指だけで操作できるナビゲーション配置

ボタンやタブのサイズは狭すぎず、細すぎず、リンクとリンクの間にマージンを設定して誤操作を防ぐといった配慮をしてレイアウトしたい。横に並べる数は３〜５が理想的。それ以上は押しづらい。

ヘッダーには要素を並べすぎないようにする

たまに目にするアクセスすると画面の3/4がヘッダー＋メニューのサイト。コンテンツが増えるとヘッダーのメニューが増えるといったことは避け、ページへアクセスした際にヘッダーで画面が埋まるといったことのないようにしたい。ナビゲーションメニューはプルダウンやダッシュボード化などで数が増えても対応できるようにするのが望ましい。

ページ遷移はできるだけ階層を深くしない

スマートフォン向けサイトはできる限りシンプルな遷移を意識して2,3クリックで目的のページへいけるような構成を心がける。「自分はどのページにいるのか？」「自分は何処のページを見たいのか？」ユーザーが意識して動けるようなナビゲーションリンクの配置にすることで離脱されないようにする。できればブラウザーの戻るボタンを押さずに完結できるようにしたい。

高解像度ディスプレイ×リキッドレイアウトを意識したデザインを行う

スマートフォンは回転すると横幅が変わるため、それを見越したデザインをする。たとえば、iPhone4は幅は320×480が基本ではあるが解像度は300dpi以上なので普通に画像をおいただけでは滲んだりして見えてしまう。画像は高解像度のdpiでもきれいに見えるサイズで用意して縮小させてレイアウトしたり、CSS3でアイコンの角丸やグラデーションを作る。縦横でも対応できるようにオブジェクトの配置は％指定やinline-blockを活用して不意なレイアウト崩れがおこらないようにする。などPC向けよりも気遣いが必要になる場面が多い。

Viewportを活用する

使いこなせるとかなり便利なViewport。デフォルト幅が320pxのブラウザーで480pxサイズのサイトを見せる際の設定などはviewportで行う。また、zoomを設定するとフォームのテキストエリアを選択したときに拡大表示されたりするといった動作があるのでその辺りも加味してデザインを行うとより、使いやすいナビゲーションに結びつけられる。タブレット端末では「initial-scale」が有効にならない場合があるのでターゲットとする場合は実機での検証が必須。

jQueryとCSSで気をつけたいこと

スマートフォンサイトでjQueryを使う際に気をつけたいのはliveがiOSで有効にならない点。clickやタグないに入れるonclickなどで代替できる場合は代替。できない場合はほかの方法を模索することになる。またCSSのfixedの挙動がiOSではまだ不完全なところが多いので使うことをさけた方がよいかもしれない。

制作時に参考になるサイト

ここでまとめた内容のより細かいところなどが掲載されていたので、より詳しいことは下記サイトを。。。
スマートフォン向けサイトの作り方｜ユージック
スマートフォンサイトをデザインする上で知っておくべき10のTIPS[to-R]