進まなくなると、ついつい tumblr を開いて Dashboard にダイブしている今日このごろです。
こないだ、フォローする数増やして、今 300 くらい。
自分のリブログしたやつから、notes とってきて、そっからユーザー名抽出&カウント。
んで、数の多い人をフォローってやりました。
tumblr は、何がでてくるかわかんないとこがいいなと。
あと、twitter と違って、写真とか、youtube とか、その場で表示できるんで好き。
うちの tumblr。
http://layer13.tumblr.com/
ってか、サイトで見ると見辛いな〜。
直したいけど、だいたい見るのって dashboard やもんなぁ。
やっぱし自分の使いやすいツールを探すなり、作るなりせんとダメかもしれん。
何か考えよう。
Web アプリ作る練習〜みたいな感じで作ってみっかなぁ。
と、File の drag & drop を試してみようとしたんだけど、
うちの Firefox のバージョンがまだ 3.5系なので試せず。
(Mac と Win には入ってるんだけど)
Chrome はまだなのかな？撃沈
あとまわしにして、UI考えよう。
いやー、釣られまくってるよ最近。
「うそをうそと見抜けない(ry」であるので、
ネット使うのやめたほうがいいんじゃないかと思ったり思わなかったり。
いや、他のメディアも同じなんだけど。
直接かかわらない、どーでもいい情報については、
断片的な情報だけで判断するのはやめようとしてる。
なかなか難しいけど。
区切りがどこなのかわかんないし、
そもそも追ってく気も無いし、
そこにある記事で へーっ ってなって終わる。
運良く続報が目に入ったらいいけど、
入ってないことのほうが明らかに多いであろうと。
反射でリブログする以外は何も言う気もないんだけどねー。
こういう環境へどうやって対応していくかだなー。
どうしたもんか。
うちの先生の本にも書いてあることだけど、大事だ。うんうん。
書類で落ちること
仕事ができないこと
このふたつは別！
ついつい、一緒に考えてしまって精神的にやばくなってくることがあるので(^^;
ま、書類ヘボイのはたしかだし、
いきなりフリーでやるなんて無茶もしたし、
30 になって NZ 行くし。
過去に悪いことしてるかというと、
全くそんなことはないと思っているんで、
勉強してやっていくしかないよねー。
というわけで、HTML とか JavaScript とか、
Webのフロントエンドの就職先を探してます。
突発で仕事が入ったり、考え事をしたり、トップページが没ったりした関係で、2日くらいさぼりました。
NZサイト更新ログだらけになりそうだから、何か書こう(^^;;
あたしゃ別にポジティブ教でもなんでもないのだけど、
マイナスの話ってのは悪く伝染するので、
書いてる途中でふっと当事者じゃない視点がでてきて、
消しちゃう(^^;
ま、それくらいちっぽけなことといえばそれまでか。
今はあんまりよくない話でも、
将来、笑い話にでもなればいいや〜っと思っていられるような
大人にたいなー。
bygones
それはおいといて、
新版の指輪物語読んでます。
NZ でいたるところで LotR の上映会・・・というか、宿のテレビで見てるだけですけど、
があったのですが、当然字幕なんか無いので、ようわからんorz
ずっと前から持ってた図書カードもあったし、せっかくだから小説読んでみようかと。
実は小説は、学校で読まされたものを除いて、
ほっとんど読んだことがないのであります。
前に読んだのは、何年も前に、 palm で青空文庫で少し読んだっきり。
井伏先生が放屁なされた、 とか、子供の頃から損ばかりしている とか。
というわけで、
例によって、技術書やビジネス書は、例によって大量に見てはいたけど、
小説ってあんまり読んだことないんですよねー。
んで、ちと前に買ってみたよ LotR。 将来は英語で読みたいけど、まず日本語で。
が、旅の仲間 上1を眺めた時点で、英語版はかなり先になることが容易に判断できたw。
上巻1,2を読みおわったので、今日下巻1,2を買ってきた。
あと、靴下を返してもらった。取りに来んかったら捨てるでー言われちまったでなw。
そして、NZサイトのトップページの最初の案がださくてボツったので、どうしよう。
やっぱ中サイズのサムネイルも作らんとダメかなぁ。
細かいところではメニューの順番を入れかえたのと、hr タグを消去したのと、git で更新するようにしたくらい。
そろそろトップページのデザインをマトモにしたいと考えている今日このごろです。
マップからは、地図上で見れます。場所のアタリがつかないものは出ませんが・・・。
まだワナカしか上げてませんが、パノラマ表示ができるようになりました。
360度パノラマは、ワナカとネルソン(ニュージーランドの中心)くらいしか無いけど、
Sign of Takahe からの夜景など、複数つなげられるのは繋げてアップする予定です。
焦らずじっくりと更新できれば良いかなぁと。
あー、NZ行きたい。が、金が無い!
NZ写真サイトに載せるべく、パノラマ表示機能を作ってます。
とりあえず、サイトの表示部分の javascript と css。
更新フローについてはまだ考えていないので、これから。
javascript で一つはまったのが、img の onload。
Opera だと img.src、 img.onload の順に指定すると onload が呼ばれないそうです。
img.onload, img.src の順にするように変えたらなんとかなった。
あと、console.log のかわりに goog.debug を使ってみたよ。
Opera とか IE(まだやってないけど)で見るのによさそう。
あとは、画像のサイズをどうすっかだよなぁ…。
テキトーに360度のを縦 500px でつくってみたら、幅が 6782px だった。
いつも載せてる横向き16:9の縦幅が 536px なので、それに合わたほうがいいんだろうなぁ。
ちなみに、952×536 という妙なサイズがベース(例外あり)なのは、幅960 からシャドウ分を引いて、かつ8でわりきれる数。高さは16:9でのナリユキだけど、こいつも8でわりきれる。
JPEG って 8の倍数にしておくといいんだったよね確か？
っと思ったら、横は16のほうがいいのかな・・・。
(http://www001.upp.so-net.ne.jp/landscape/paper/imgproc005.htm)
えーっと、
The hr element represents a paragraph-level thematic break.
(http://dev.w3.org/html5/markup/hr.html)
The “paragraph-level” bit means between blocks of text, so it can’t be used to separate sections of a site.
(http://html5doctor.com/small-hr-element/)
って、まじですか・・・。
セクション区切りには使えないとな？
テキストブラウザで見たときに hr 無いと見辛いという強引な理由付け(実際見りゃわかるけどスタイル無い状態で、区切無しで垂れ流しは見辛いよ。)で hr を使い、ついでに clear: both をつけて逃げてきた身としては、けっこう困るなぁ。
しょーもないメモメモ。
module Rack
class LessCss
def initialize(app)
@app = app
end
def call(env)
status, headers, body = @app.call(env)
req = Rack::Request.new(env)
if req.fullpath == '/css/main.css' then
lessfile = 'less_template/main.less' ＃ less file
if ::File.exists?(lessfile) then
cssstr = Less::Engine.new(::File.new(lessfile)).to_css
body = [cssstr]
headers['Content-Type'] = 'text/css'
headers.delete('Content-Length') # Rack::ContentLength に任せる
status = 200
end
end
[status, headers, body]
end
end
end
PATHが、ウルトラハードコーディングだけど今は気にしない(汗。
んで、main.less には、以下のように import を書いています。
@import 'html5-reset-1.4.css'; @import 'core.less'; @import 'header.less'; @import 'footer.less'; . . .
書くときは分割して、読み込むときは1つのファイルですむと。
キャッシュなどは全く考えてないので、制作のためのものです。
# 実際 main.css にまとめて css にしてから上げてるし。
http://nz.layer13.com/
ぼちぼち更新しています。現在73枚。
(メモってないのでヌケがあるかも)
一度見た写真は、サムネイルの左上がカケているはずなので、わかるんじゃないかと思いますが、わかりづらかったらすみません。
リアルタイムな更新情報はtwitterに書いてますので、そちらを見てください。
来週もがしがし更新しますよー。就職まだ決まんないしヒマなんで(涙
NZサイト を作ったときの css コーディングの覚え書きというか、メモというか。
ちと、今回は、セレクタの階層をなるべく浅くやってみようというポリシーで作ってます。なので、ほとんどクラス名のみ。
このやり方で書くのは正直めんどくさい。 自分のサイトだからやってみたけど、仕事ではしないと思います。
ul.hoge > li とかやったほうが絶対楽なのはわかってんですけど、パフォーマンスに影響する とか、yahoo どっかで見た気がして、やってみようかと。
(とか思ったら、そんなに効果は無いっぽい？ CSSセレクタのパフォーマンスへの影響)
クラス名のみでやってると、当然ながら html のタグが変わっても多少粘れるっていうのはあるかも。
ま、div と span とっかえて、display 指定が無かった場合なんかは壊れますが。
あと、class 名のつけかた。相変わらずいきあたりばったりでつけているので、一貫性が無い。これはなんとかしたい。
やっぱり最後に整理しないといかん。
今回は less を使いました。コーディング時はファイルを分割して書き、プレビューするときに 1 つの css にまとめて表示させるようにしています。手動じゃやってられんので当然自動で。
今のところ、ちと気になる点が2つほどあって、
・less ファイル(cssも?)のプロパティの値を改行するとパースエラーになっちゃって、グラデーションの指定をするときに見辛くて大変困る。
・複数セレクタを指定しているとき、セレクタに疑似クラスが入っていると、レンダリング時に分割されてしまう。同じ指定がいくつもあるので無駄。
でも、 変数が使えたり計算できたりするのはかなり便利。-moz-hogehoge と -webkit-hogehoge をまとめたりするときに重宝してます。
デザインが落ち着いて、整理し始めたら、プロパティ別整理法っぽいこともやっています。
font-size とかフォント色・背景色とか。
/* font-size 12px がデフォ */
/* font-size: 9px */
.photo_info_title,
.exif_key
{
font-size: 9px;
}
/* font-size 10px */
.header_navi,
.no_map,
.index_top_navi_item_ja,
.nogps,
.photo_section_title
{
font-size: 10px;
}
/* font-size 18px */
.page_title,
.photo_title
{
font-size: 18px;
}
これで、新しいクラスのフォントサイズを 10px にしたいなーって時には、10px んとこにクラス名を追加すると。制作も後のほうになってくると、他のクラスとの整合性なんかが気になってくるので、個人的にはこっちが好きです。が、プロパティ別なものと、クラス別なもの両方あったりするので、自分しか理解不能ってのはあるかも。そんなときの Firebug でw。
あと、同じ見た目にしたいけど、クラス名は同じにならんよなぁ〜っていう時にもこの方法でやってます。
class="hogehoge shadow1"
class=”shadow1″ なんて class=”red” と同じじゃん って感じなんで、やりたくない。けど、同じ影のプロパティつけたいし、後で変更するかもしれないし・・・ ってとき。
/* ボタン用シャドウ */
.footer_pagetop_link:hover,
.index_top_navi_item_link:hover,
.photo_prev_footer_link:hover,
.photo_next_footer_link:hover
{
.box-shadow(0, 1px, 5px, rgba(0,0,0,0.3)); // .box-shadow を別のところで定義してます。
}
とか。
コメントを書いとかないと、何やってんだかわかんなくなるので、この部分に関してはなるべくコメント書くようにしてます。
ちょっとめんどくさいのは、セレクタの一番下のものにコンマをつけるとエラーになる （ま、そうですな) ので、一番したのものを消すときに行削除だけじゃすまないこと。 たまに忘れるんです。上の行のコンマ消すの。
公開しました。やっと。
自分のサイト作ったのって何年ぶりだよって感じなんですけど(汗。
できました・・・と書こうとしたけどやっぱりやめたのは、
まだやってないことも、やりたいこと山のようにあるんで。
一応 html5 + css3 をメインで作ってるので、Chrome が一番まともに見える気がします。
Firefox 3.6 だと、transition 効かないし。
Safari は、なぜか transition がマズいのか transform がマズいのか、twitter ウィジェットとの相性が悪い。
Mac の Chrome でも、デフォルト表示を transition かけて表示してくれちゃったりする。
IE は見えるけど、色々としょぼい。
今日はこれで一息ついて、明日からまたちまちま修正と変更です。
http://lisastown.com/inspirationwall/2010/02/11/a-new-zealand-train-station-gets-carpeted-in-green/
さすが NZ 。
そういや、うちがいたころも、 Wellington の駅で羊つかって撮影やってたっけ?