FBのLikeBoxを新しいのにしてみる。

書こうと思ってずいぶん、日がたってしまった。。。 既に5月笑

developers.facebook.com

他のサイトで、詳しい事はかなり書かれているので。特に再度書く事もないかとおもうのだけど。

ちょっと困った事とか、あれあれ、ってとこだけ。実際解決していないのもあるから、解決したら修正します。(多分)

  • 友達の顔写真が乗るところ、今までは複数行でてたのに1行になっちゃった?
  • という事は、高さを指定しても結局はかわらない?

コードの生成と埋め込み自体は全然難しくなくて。ただ、この2点はなやんだ。

結局1行になってるみたいだね。今のところ。

同じPJの人でまだ分かる人がいなくていなくて。

参考:SAKULIFEさん お世話になりました。

ちなみに、6月23日に使えなくなるとか書かれてはいるので!

viewsonicのディスプレイを購入してみた。

こんにちは。 最近HipHopの歌詞の深さに感動して、はまってます。

今使ってるのが、MBAの11インチという小さい画面の結構低スペックの子で。 そろそろ4年くらい使ってるので新しいのに、、、、

とおもったんですが、ちょっとまだ手が出ず。。

ディスプレイを購入してみました。 購入したのがこちら!

viewsonic

本当は27インチくらいでも良いかな、とかEIZOが良いかなとか色々悩んだのですが。

  • IPSである事
  • ノングレア(光沢がない)であること
  • 欲しいEIZOの画素数と一緒だった事
  • EIZOより1万以上もお安かった事
  • フリッカーフリーである事

まあ購入に至った動機はこの辺りです。

実際スピーカーもそれほど音が言い訳じゃないけどついてるし。

やっぱりデザイナーにとってはこのくらいのディスプレイが欲しい。

viewsonicって、日本ではあんまりみないけど、 アメリカの評価はよいようで。

LGは壊れやすいし、色んなサイトでWEBデザインやるなら!見たいな評価を調べて。

AOCとかBenQだっけな?そんなのもあったけど、ネットでの販売ばかりで見れなかったので。

何かもっと良いのがあれば、しりたいな。

scrollTopを使用するにあたってUXを考えてみたの

今日も相変わらずJS様と、戦う日々で。

何が書きたいかというと、今日はUX(そんな大げさな事じゃないかも)を
考える事があって。
スマホサイトでね。

ディレクターs「ここのページトップへのボタンタップしたら、ふんわりTOPまでもどってほしいんだけど、、、できる?」

まあ、要望としてきたのはこれくらい。
確かに、ビュン!ってトップまでいっちゃうのもなんかなとは、おもってて。

そこで、まずscrollTopのanimationで秒数指定してみたの。
まあ、一応ゆっくりにはなる。

でも、ここで考えたんだけどそもそもページトップに戻るボタンの意味を。
最初は単なるちょっとおしゃれにーみたいなかんじで考えて、
一応それでも、OKは出たんだけどなんか、雰囲気みたいなのが嫌で。

調べましたよ。
キーワードは スマホ 速度 スクロール UX こんなかんじで組み合わせて。
海外のサイトが多くて、cllickよりスクロールをさせる方が良いとか、やっぱりスクロールは滑らかにとか。
でも、ピントくる物がいまいち見当たらず。

私的には、戻る時にも多少は中のコンテンツ見てもらった方が良いのかな?
とかおもってみたけど。

大きな収穫はなかったけど、渡された課題を噛み砕いてより良い物にするってことは
重要だよなっと。

このサイトがよさげ。
[UI](uxmovement.com
)

結局、作るサービスにはゴールがあってどれだけそれを良い物にできるかだよね。

それにしてもJSはまだまだ難しい。

sanitize.css ってのがあるらしいよ

sanitize.css

最近使ってる、nomalize.cssの次みたいだね。

最初はriset.cssしか知らなくて、それで良いとおもってたけど、 nomalizeを知って、うわー便利ってなりました。

モダンブラウザとか、スマホに対応しているらしい。 リセットじゃあ、全部スタイルなくなっちゃうから色々と不便で。 nomalizeよりもユーザビリティとか意識して作られてて、 いいね。

何か分かんなかった時は

Git こちらを参考にするのが一番かと!

まずは使ってみよう。

マークアップエンジニアとして、立ち振る舞いとか

久々になってしまいましたが。。。

 

最近は、マークアップエンジニアとして一サービスに関わってます。
関わってまだ2ヶ月。

最初は右も左も分からず本当に自信もなかったけど、
ある程度コード書いて、なやんでなやんで。
下っ端からリーダー的なポジションを任せてもらって。
まだまだ未熟だけど打ち合わせにでて、ディレクターさん、プロマネさんと意見交換して。開発からもちょっと変更がきたり笑

 

JSが苦手すぎて自分が嫌にもなるけどw

 

リリースまでは本当に悔いのないように精一杯やろ。
頑張ります。

 

IE7はもういりませんw

WAI-ARIA コーディングの際にアクセシビリティーも気をつけたい、気をつけるべき

コーディングWebアクセシビリティ - WAI-ARIAで実現するマルチデバイス環境のWebアプリケーション

コーディングWebアクセシビリティ - WAI-ARIAで実現するマルチデバイス環境のWebアプリケーション

  • 作者: ヘイドン・ピカリング,Heydon Pickering,伊原力也,太田良典,株式会社Bスプラウト
  • 出版社/メーカー: ボーンデジタル
  • 発売日: 2015/03/27
  • メディア: 単行本(ソフトカバー)
  • この商品を含むブログを見る

これを読んでる、途中。 途中でも、かなり学びは多かったと思うので箇条書きにしてみようと思います。

  • button要素に関して、まずは基礎の確認。button要素
    基本中の基本だけど、何気になんでもaタグを使いたくなってて。 このやり方が全部間違えではないけど、formのときはbuttonタグだし、value属性とテキストは必須で、これがなきゃ読み上げられないから、ダメなやつなんだって。 そして最近流行りのWEBフォントを使うときはまた別で、aria-labelというのを使うみたい。とか。

見た目だけに惑わされちゃいけません!
てな感じでね。

なーんか、当たり前のことすぎてちょっと中身がない。

そういえば、この本に書かれてるWAI-ARIAってなんなんだよ! っと思って、 waiで検索したらこんなサイトが。

そもそもこのサイトがちょっと見づらいきもしたけれど笑
力を入れてるんだろうなーって思った。

HTMLの備忘録てきな

本日3記事め。 書きたいことはいっぱいあるのに、どうも毎日書けないのはなぜだろう。

やっぱり、HTMLの構造ってすごく大事で。 正直、誰にでも書ける(私も数ヶ月前までは結構適当にかいちゃってたw)けど、 それだからこそ腕の見せ所といいますか。

綺麗に書くとSEOはもちろんいいけどコンポーネント化もしやすいし、修正もしやすいし。 css命名規則同様今、ちょー勉強に励んでいるところです。

そうだなあ、とはいえ大枠をdivでくくって。 まずはcssあてずに構造だけうまいことなってるか見て。 それでもうまくいってたら、cssあてるよね。

ここ、このタグ使う?みたいなのがあってはならん!
そんな時にはHTML5公式ドキュメント

いろんな人のブログとかがあって、かつ、最初ってどれが正しいんだよ!みたいになりがちだから公式なら安心。なんか文句言われても、たちむかえる笑

cssとかも公式だけど、日本語の理解に苦しむ場合があるからそんな時はみんなのブログを有効活用すべきだと思う。

インデントとか気をつけて、可読性アップに努めよう!

親子関係とか、変にdivで囲みすぎないようにとか大事だと思う。 いくらでもdivで囲めちゃう気がするしw

たくさんコード読んで、書いて、やり方体にしみつかせるのみw