masuPのブックマーク / 2012年5月20日

masuP id:masuP

2012年5月20日のブックマーク (4件)

[css] contentプロパティで挿入できるコンテンツ – WebTecNote
clearFixでお馴染みなCSSの擬似セレクタ::beforeと::afterではcontentプロパティというものが使えるわけですが、 ::beforeと::afterがIE7以下未対応ということもあって使ってない人は未だ多かろうと思います。しかしながらレガシーなIEで表示されないから使わないというのは非常に勿体無いので、今一度contentプロパティで挿入出来る内容についてまとめておこうと思います。 ※2019年現在は全ブラウザ対応しています。挿入出来るモノ大きく分けると３つです。テキストプロパティの値画像 content:”テキスト” 半角英数や半角の記号ならそのままでOK。ただしクォーテーションなどのメタ文字は\でエスケープしないと表示されない。日本語などの2バイト文字も書いたまま表示されるけど、数値文字参照の値で書いた方が無難です。例：タイトルの前に★マークを
masuP 2012/05/20
css
リンク
引き算のデザイン vs ごちゃごちゃしたデザイン
定期的に出る、「エレガントなデザイン」より「ごちゃごちゃしたデザイン」の方が売れるという話がある。よく楽天市場のショップを揶揄する言葉として使われるが、最近は、eBayにもこんな話が出て、どうやら世界共通に通じることらしい。 eBay でヒドいデザインの方がコンバージョン率が高かった、という話ただ、何故ごちゃごちゃ情報を掲載した方が売れるのか？！ということに関しては、あまり具体性がある記事を見た事が無い。自分が思うところを書いてみたいと思うが、ある掃除機を売ると仮定して、「引き算の商品説明」と、「ごちゃごちゃしたい商品説明」考える。 ■引き算の商品説明この方法で説明を考える時は、その商品の良さを徹底的に絞り込んで、できる限り一つのメッセージに落としたいと考える。その結果が、例えば「吸引力の落ちない掃除機です」という説明にして売る。何個かメリットがある場合は、情報に強弱をつけ
masuP 2012/05/20
リンク
口臭・歯垢・歯肉炎予防のために「リステリン」「コアグレッシュ」「コンクールF」を比較してみた
舌や歯ぐき、口くう粘膜など口全体をケアして歯磨きの補助的な役割を担う洗口液を使えば、歯ブラシでは届かない歯の隙間など口内のすみずみまで成分が行き渡るため、虫歯や歯周病などの予防・対策にもつながり、また口臭も防いでくれる、とのこと。なので、いろいろと市販のものを使ってきたのですが、どれもこれも言うほど効果があるように感じられなかったため、改めていろいろと調べてみた結果、「リステリントータルケア」「コアグレッシュ」「コンクールF」の3つがどうやらなかなか効果的らしい……とのことなので、実際に入手して効果がどれほどのものなのか試してみることにしました。 6つの効果を1本に！進化したマウスウォッシュリステリントータルケアカテキンの力が、口腔内の汚れを固めて除去！Coagresh（コアグレッシュ）ムシ歯・歯肉炎・歯槽膿漏・口臭の原因と対策コンクールF 左から順に「リステリントータルケア
masuP 2012/05/20
リンク
ブレークポイント
このWebサイトのスタイルではブレークポイントがレイアウト向けに3つ、フォント・サイズ向けに4つ設定されている。なんと7段変速！　なんでそうなってるのかとかそういう話を書きたくなったので書く。レイアウト向け主にデザインが格納できるのか、バランスはどうかみたいな理由でブレークポイントを設定している。Mobile Firstで書いているのはパフォーマンス的な問題なので、本当はもっと理由駆動でMedia Queriesを書きたい。em単位を使っているためユーザーのズームやフォント設定などは考慮される。だいたい標準は16pxであることは既知だけどそれに依存しないのでマイナーな標準を採用しているブラウザーとか大きめのフォント・サイズを愛用している人のブラウザーとかでもおかしくならない(可能性が高い)。小さめのスクリーン On small screen グローバルなヘッダーとフッターがセンタリン
masuP 2012/05/20
design
リンク
- 2012年5月21日
- 2012年5月20日
- 2012年5月19日