ウェブデザインのつくり方、インターフェイスデザインの考え方。

「ウェブデザインのつくり方、インターフェイスデザインの考え方。」という本を読んだら、blogのデザインを弄りたくなったので、少し手を加えてみた。モバイル対応を目>的とした作業だったんだけど、結局モバイル対応はしてない。

本書を読めばデザインの基本的なレイアウトの話とか色の選択とか一通り押さえられるのでオススメですね。内容も図が豊富でわかりやすいし。

僕は、レスポンシブwebデザインに興味があったので、media-queryのあたりを読むために購入。

レスポンシブ・ウェブデザインってのは結局media-queryなんかを利用して

Media queriesはコンテンツを表示したブラウザの幅サイズを取得し、そのサイズに応じてCSSのプロパティを取捨選択するために使うプロパティです

というわけで、結局

さまざまな表示環境で同じHTMLをリソースとして活用できるようになります

とあるように、HTMLを使いまわす技法の一つということか。

一通り読んだあとで、じゃぁ、自分のブログシステムをレスポンシブ・ウェブデザインにしてみようとしたんだが、1カラムなんで別にフロートにする必要もないしサイドバー的なモノも用意してないから、特にやることがなかった。

色々検討していて、気がついたのはmedia-queryでCSSで切り替えるっていうのは結局CSSをいじることであってテンプレートをいじるのとは違うなぁと。例えば、モバイルデバイス向けにアドセンスを切り替えたりとか文書構造替えたりってのはテンプレートいじったほうが早いし、スマートだよなぁと。

結局WAFをいじくっているのであればそっちのテンプレートでゴニョゴニョと調整したほうが楽だよなぁと、自分はUserAgentみてWAFのテンプレート切り替えるほうが好きだわという結論に至り、レスポンシブ・ウェブデザインへの興味が急速に(指数関数のオーダーで)薄れたのであった。

とはいえ、スマホ判定したら別のURLにリダイレクトってのは好きじゃないかなぁ、意味論的に気持ち悪い気がする。それともlink rel="alternate"みたいな感じでどうにかできるのかな?

ここらへんがよくわかっていない。

ちなみにスマートフォンサイトを作るというテーマに絞るならば、以下の本が丁寧に説明してあって良いですね。

ProductName iPhone+Android スマートフォンサイト制作入門 (WEB PROFESSIONAL)
たにぐちまこと
アスキー・メディアワークス / 2499円 ( 2011-02-19 )


資本主義からの脱却

(株主)資本主義が行き過ぎだというのは同意するところで、じゃぁ次の世代はどうなんの?っていうあたりに興味がある。

個人のライフスタイルだと、幾つかの仕事を分散して持つっていう半農半Xとか、ニッチな仕事を束ねるような月三万円ビジネスとかね。これは、リスク分散として個人が取れる戦略のひとつじゃないかなと。

じゃぁ、社会はどういう方向に向かうのかね?

本書の主張は

経済システムの中心に生協的精神を設定して、最大利潤主義を除外すること

ProductName 資本主義からの脱却
エルヴェ ケンプ
緑風出版 / 2310円 ( 2011-03 )


金持ちに課税するのは当然だっていうスタンスで、巨万の富の遺産から税を徴収するべきというアイデアを再考すべきと述べている。

というような、アイデアが国連の一機関から1995年に既に提起されていたらしい。

Flaskでhamlish-jinjaを使う

Express+Jadeで幾つか書いていたらJadeの読みやすさに慣れてしまった。

FlaskでもHamlっぽい記法を使いたいなぁとググッてみたらhaml and flaskというエントリをみつけたので、この通りに入れてみた。

-extends "layout.html"

-block title
  Page Not Found

-block body
  %h1 << Page Not Found
  %p
    %a href="{{ url_for('show_entries') }}" << go somewhere nice

  %p << or find by tag
  %div.tags
  %script type="text/javascript"
    |$.getJSON('{{ url_for('show_jsontags') }}', null, 
    |  function(json){
    |    for (i in json.tags.sort()){
    |      $('div.tags').append("<a href=\"/tag/" + json.tags[i] + "\">" + json.tags[i] + "</a> ");
    |    }
    |  }
    |);

かなり読みやすくなった。入れ子をインデントで表現するのでPythonistaにはありがたいですね。ちなみにこっちがもとのjinjaのテンプレート。

{% extends "layout.html" %}
{% block title %}Page Not Found{% endblock %}
{% block body %}
  <h1>Page Not Found</h1>
  <p><a href="{{ url_for('show_entries') }}">go somewhere nice</a></p>
  <h1>or find by tag</h1>
  <div class=tags></div>
<script type="text/javascript">
$.getJSON('{{ url_for('show_jsontags') }}', null, 
function(json){
  for (i in json.tags.sort()){
   $('div.tags').append("<a href=\"/tag/" + json.tags[i] + "\">" + json.tags[i] + "</a> ");
  }
}
);
</script>
{% endblock %}

pipとかeasy_installで0.1を入れるとdiv#idとかdiv.classという記法が使えないので、GitHubの最新版を入れたほうがよいです。


ところで、HTML5においてセマンティクスが重視されると、デザインまわりはCSSに集約されていきHTMLタグとデザインっていうのは分離されていくと思うんですね(rdfとか昔っからあるし)。

セマンティクスってデザイナーというよりはプログラマー側が考えることだろうから、マークアップエンジニアとか呼ばれているヒト達はCSSエンジニアとかそういう名称になっていくの?

よくわからんので、今度誰かに聞いてみよう

ProductName HTML5&CSS3実践入門 最新Web標準を使いこなす (The Pragmatic Programmers)
ブライアンP.ホーガン
インプレスジャパン / 2940円 ( 2011-07-08 )


静岡(東部のあたり)ではHTML5の入門書の読書会をしています(宣伝)

Flask-Cacheを使ってみた

自作のブログシステムのなかにデータベースに頻繁にアクセスしすぎて困るAPIがあるので、Flask-Cacheを使ってキャッシュするようにした。

設定を読ませてからcacheの設定をしないといけない(まぁ当たり前か)のだけどapp.config.from_objectで読ませる前にCacheしてたらキャッシュが効かなくてちょっとはまった。

CACHE_TYPE = 'simple'

app = Flask(__name__)
app.config.from_object(__name__)
cache = Cache(app) # 設定読ませたあとに

ソースは読んでたらキャッシュのタイプはwerkzeugに任せているらしいので、そっちのドキュメントを読めば大丈夫な感じですね。

お金とつきあう7つの原則

まぁ、普通のことが書いてあるけど、普通のことを淡々と実践するのは意外に難しいよね。

ProductName お金とつきあう7つの原則
山崎 元
ベストセラーズ / 1365円 ( 2010-03-26 )


  1. 小さな節約をしない
  2. 「人的資本」に投資する
  3. お金の計算は安全な方に間違える
  4. お金はなるべく貸し借りしない
  5. 国内外の株式に分散投資する
  6. 買値ではなく未来を考える
  7. 怖いのは市場リスクより人間

将来の不安を喚起しておいて、それに対するかいけつさくがあるかのようにモノを売るというのは、特に利幅の大きい怪しいものを売るときには、よく使われるセールスのテクニックだ。

保険とかですね。これはそのうち考えないといけないなぁ(うちは保険料かけ過ぎじゃないかなぁと思っているので)

社債をわざわざ個人向けに売るということは、その発行者の債権をその条件では機関投資家が買わないからだと考えていい

個人向け社債はよく見えても避けたほうがいいということか。

投資内容の例

TOPIXに50%(日本株) MSCI-KOKUSAIに35%(先進国外国株) MSCI-EMに15%(新興国外国株)

いまだと、日本株と先進国外国株の割合を減らして新興国外国株の比率を上げてもいいんじゃなかろうか?

HTML5 CANVAS 10,11

phonegapを使おうっていう章だったんだけど。

ProductName HTML5 Canvas: Native Interactivity and Animation for the Web
Steve Fulton
Oreilly & Associates Inc / 2922円 ( 2011-05-13 )


今のバージョンがos10.5には対応してないらしいので、流し読みしつつandroid SDKのバージョンを上げてみた

android4.0

自分の中ではiPhoneよりはandroidかなぁ。iPadはいいと思うけど。

というわけで、そのうちこれでも読んでみようかなぁと思っている(まだ買ってないけど)

ProductName Androidアプリケーション開発ガイド ―HTML+CSS+JavaScriptによる開発手法
Jonathan Stark
オライリージャパン / 1995円 ( 2011-02-24 )


先に読まなきゃいけないのは、既に積んであるジオモバイルプログラミングだなぁ

ProductName ジオモバイルプログラミング—iPhone&Androidで位置情報アプリを作ろう—
郷田まり子
ワークスコーポレーション / 3675円 ( 2011-01-27 )


ドリームプラザに行ってきた

11月は妻と息子と犬(と私)の誕生日が集中しているので、グリンパでも行くかっていう話になっていたのだけど雨が降ったので、ドリプラに行ってきた。

三階のリカちゃん人形とかプラレールとかで遊べるとこで1時間半ほど。

1320572362

富士宮のジャスコのプレイランドだと一時間500円で、体を動かす系のアイテムばかりで(そのうち見てて)飽きるのにたいして、こっちは3時間まで500円で、ブロックやレール等の大人が組み立てに夢中になる系のアイテムが多いので参加できていい。娘もリカちゃん人形の着替えをひたすらやってたし、まぁ飽きませんね。あと、あまり混んでないのでオススメかもしれないと思った。一階に豊盃とか扱ってる良い感じの酒屋もあるしね。

昼は勇喜寿司で。

1320572365 1320572369

なかなか美味しかった。

帰りに事前にtwitterでリサーチして皆さんにオススメされた草里でケーキを購入

1320572371 1320572373

うまし。

満足の遠出だった

福島の酒

右のほうはすっきりしすぎで印象に残らない。左は、まぁまぁ。

1320571791

HTML5 CANVAS 8,9章

1-7章の基礎をふまえて実際にゲームを作っていく。8章はpathベースで。9章で画像と音を付けていく。

8-12をcoffeesciptで書いていたんだけど、衝突判定の関数がラベルでbreakしまくりのコードで、coffeescriptではうまく書けなくて途中でやめた。その勢いで、9章は流し読み。

まぁ、1-7章まで丁寧に読んだので、流して読んでも大体理解できた。

ProductName HTML5 Canvas: Native Interactivity and Animation for the Web
Steve Fulton
Oreilly & Associates Inc / 2922円 ( 2011-05-13 )


ロウアーミドルの衝撃

ちょっと昔に出版された本を読んで、それが正しい未来(今だと現在)であるならば、その洞察はいま読んでも非常に役に立つわけです。

ProductName ロウアーミドルの衝撃
大前 研一
講談社 / 1680円 ( 2006-01-26 )


いまでもデフレが続いていると言われているが、2006年刊行の本書は

事の本質をボーダレス化とサイバー化による「価格の正常化プロセス」であると分かれば、いくら回復を待っていても価格下落の流れは止まらないし、ましてインフレターゲット論などはナンセンス極まりないことが理解できるはずだ

と述べている。で、現状はどうかというと、日本はデフレ脱却を目指しているとかそういう話じゃないだろうし、価格の安い製品が恒常的に輸入されているのが価格下落の原因だろうな。つまり本書の主張しているようにグローバルの価格に収斂していると見たほうがいいのだろう。

教育に関しても

人生の生き方を教えることは、学校の教師や塾の講師にはできない。学校の教師は、教員免許を取得して一旦採用されれば「一生食える」と思っている連中で、人生の生き方についておしえられるような社会経験はゼロに等しい

と手厳しい。

一方、農業に関しては、日本は補助金でジャブジャブという認識をされているが、他の国もジャブジャブだという話はみた。国家政策なので、今後どうするかは議論するのかもしれないけど、まぁどうすんのかね?

それから、土地は輸入できるという主張はちょっと目から鱗だった。そのコンテクストでもっていくならば輸出黒字も輸入できるという構図も成り立つのかなと。外国の株主資本比率の高い韓国の企業は輸出で儲けてるけど利益はいったいどこに消えてるんだろうかね(雇用に反映されてないと言われているし)。

後半は大して読んでないけど前半のパートは面白く読めた。