第10回 Sugamo.cssまとめ

/web/sugamo_css

Note: この記事は、3年以上前に書かれています。Webの進化は速い！情報の正確性は自己責任で判断してください。

おひさしぶりです。11/07に行った第10回 Sugamo.cssのレポートをお届けします。第9回？ 写真を撮り忘れたので(ry

さて、今回は15名で募集して18人の申し込みがありました。場所には余裕があるので、いちお簡易椅子を用意しましたが... けっきょく使いませんでしたね。来れなかった人も居るし、遅刻者と途中退場者がちょーど釣り合った感じでありました。主催者からして遅刻魔なものですから、そのへん非常に緩い集まりです、Sugamo。

  1. Sig.
  2. 高津戸さん
  3. kyosukeさん
  4. jaxk9danielさん
  5. redmountainさん
  6. neotagさん
  7. 小山田さん
  8. すとさん
  9. Seckyさん
  10. コバさん
  11. 自称OLさん
  12. うえさま
  13. 仕様書の人
  14. LinearNS
  15. kotarokさん

Sugamo.cssはフロントエンド技術者の集まりってことになっているので、参加者は基本的にコーダなのですが、なんか最近は「コーディングの感覚を知りたいエンジニア」の参加が増えてきた気がします。肩書きがコーダ/MEでも、システムの話が判る人が多いです。まあ、そーはいってもline-heightの話題で1時間は軽く話せるノリがデフォなんですが。

エディタ選手権

  1. DreamWeaver (5)
  2. EmEditor (4)
  3. Emacs, Vim, 秀丸 (2)
  4. Eclipse, Textmate, Jedit, Notepad++, xyzzy, Komodo Edit (1)

前回から「参加者のエディタを聞いてみよー」企画を開始してます。使用エディタの話題は、いつ投下しても必ず盛り上がる定番の話題ですね。便利なマクロやプラグイン、簡単なTipsのレクチャ...etc

前回は@hokaccha効果でVimが一番多かったんですが、今回はDWに負けました。もっともVim勉強中の人も居て、潜在的にはなかなかバカにできません。コーダのVim使いは着々と増えておりますぜ。HA-HA-HA！

Sugamo.cssではVim使いの意見交換に、毎回一定の時間を割いております。

Webタイポな話題

今回Sig.が持ち寄ったネタが、Webタイポな話題でありました。そこから派生して、しばらく行間やフォント等に関するアツイ展開に...残念ながら議論中に僕のMacBookがダウンして議事録が吹っ飛んでしまったため、一部抜粋になります。だいたい以下のような話題。

段落間のマージン

p{margin-bottom: xxx } を相対指定(em)でする？ 絶対指定(px)で取る？ という話題。

参加者の評決はだいたい6:4といったところ。ケース・バイ・ケースではあるのですけどね。kotarokさんが指摘されたように、基本はデザイナとのコミュニケーションの問題です。

まあデザイナ側でも感覚で「なんとなく」空けてたりすることが多いわけですし、「何も言われなければ」一見して明らかに行間基準のデザインの場合、em等で指定します。たまに妙に細かい指定をしてくる人もいて、そーいった場合は空きの基準をベースラインで取るのか、ディセンダラインから測るのかといった面倒な問題になったりもする。

Georgiaは凄い
  • line-height, ディセンダ、アセンダとかのバランスがきっちり計算されている
  • 1.5倍とか1.25倍とかって指定で綺麗に揃うため、相対指定との相性が非常に良い。
  • マシュー・カーター氏がデザイン。Times New Romanに似てる。
  • 特徴的なg、高めのx-height、オールドスタイル数字。
  • 最初からスクリーンでの表示を前提として設計されている。
  • サンセリフとしてはVerdanaとか。
font-familyの悩ましい関係
  • 総称ファミリ指定だけでutf-8の場合、ieで...
  • ie6は和欧混植で問題あり
  • a要素とかでレイヤー(z-index)が違うと...
CSS指定での小数点切り上げの話
  • 何桁まで書く？
  • 下3桁までは確実にカウントしてるよね。
  • 2.333333333em とか書いちゃうぜ (QuickSilverで計算 →コピペ)

今回のVimネタ

  • 「"=8/11」→「p」とかで計算結果(整数値)が出るんだぜ！
  • 「set listchars=tab:>-」などとするとタブ文字が判りやすくなるんだぜ！
  • 「:retab!」とか「:retab」とするとタブ/スペースの一括変換ができるんだぜ！
  • HTML/CSS/JavaScriptのアウトライン解析ツールはある？ (自分で造った模様)

zudobot作成計画

@Takazudoの名言・迷言を凝縮したTwitter-Bot、略して@zudobot。Sugamo SE-Teamで酒飲みながらネタ出しし、jxk9danielが5分で造りました。ネタとしては、以下のようなもの。

  • 時報機能「6時です。エイジャーーーックス！」
  • zudobot_a 「ファーーンクションッ」zudobot_b「エイジャーーーックス！」
  • 発言内容に重み付け（時報用）
  • 発言に反応「ajaxをjqueryで...」「エイジャーーーックス！」

将来的にはPython/Ruby/Perlでジェット○トリームアタックを(ry

Follow‐up

次回の話

第11回Sugamo.cssは、12/05(土)開催。12月のSugamoは、Sugamo.css成立の切欠となったマークアッパな忘年会から1周年ということで、@kyosukeさん主催の優雅な会と二次会で合流いたしまっす。

Note: スパム対策が面倒なので、コメント投稿を廃止しました。以前のコメントは残します。
ご意見・ご要望はtwitter@sigwygかはてブコメントにて。