タグ

ブックマーク / hail2u.net (11)

  • ID使っても別に問題ない

    CSSでID使うの良くない……どころか、ID使うのはゴミクズカスみたいな風潮で辛い。その根拠はいくつかあり、それらはCSSだけをただそのまま書く場合には納得出来ないこともないかなーと思うので余計に辛い。特にOOCSSのようなアプローチではIDは混ぜるな危険。だからといってIDを使わないのがベスト・プラクティスなわけじゃない。 CSS Lintの利用が広まり、これがID使うなって怒るのも原因の一端な気がする。Disallow IDs in selectorsではIDの問題点として以下のようなものを取り上げている。 However, IDs have a downside: they are completely unique and therefore cannot be reused. つまりユニークなため再利用できないというマイナスの面がある、と。確かに再利用できない。でもこれはマイナス

    ID使っても別に問題ない
    t_a_o
    t_a_o 2013/09/14
  • HTMLにおけるimg要素のalt属性

    HTML Standardの4.8.1.1 Requirements for providing text to act as an alternative for imagesをざっと把握できるように日語で箇条書きにしただけのものです。最終的には原文をしっかりと読むべきでしょう。 基 必ず定義されるべきである その値は空であってはならない その画像に代わりになる最適な文字列である ページ上の全ての画像をそのalt属性の値で置き換えてもページの意味合いが変わってはならない 画像のキャプションや題名、銘とみなされるような補助的な説明を意味するものであってはならない 前後で解説されている情報の繰り返しであってはならない 画像以外に何も含まれていないリンクやボタンで使われる場合 リンクやボタンの目的を明確に伝える文字列を指定する わかりやすく説明するために文章ではなく画像のチャートやグラフを

    t_a_o
    t_a_o 2013/07/02
  • 翻訳は簡単だよ、本当に

    Translation of: Translation is easy, really 僕が最初に就職したのは大体7か月前で、T3とPC Gamer Indonesiaで記者として働き始めた。主な仕事はT3 UK Magazineの記事の翻訳だったけど、たまに今やってるゲームのこととかイベントの取材などの自分の記事も書かせてもらっている。 英語教育を専攻してたから自分が翻訳がうまいと言っては言い過ぎになる。なぜなら英語言語学と文学の両方を勉強していたけれど、翻訳に特化した学科をとっていたというわけじゃないからだ。きちんとした文章の翻訳の仕方なんてのも知らない。だから就職試験では雇われるかどうか少し不安だった。 でも一週間後、正式に雇用通知が来た。どうも他の応募者にうちの会社は満足できなかったようだね。最初の仕事はFoxconnでの労働問題を調査したT3 UKの記事を訳すことと、Risen

  • Amazonの画像を拡大してリサイズし切り抜く

    Amazonの商品画像は色々なパラメーターで加工できるのはよく知られている。大抵の場合はウェブサイトに合うようにサイズを変更したりとかが主なのでAA320やSX480とかを使うだけ。ただ非矩形な商品の画像の場合、余白がないことがあり白背景のウェブサイト以外ではサイズの変更だけでは上手くなじまない。それを拡大(SS)とリサイズ(AA)・切り抜き(CR)を組み合わせることにより適切に余白を追加してやろうというテクニック。頭悪そうなタイトル。 以下のデフォルトの画像では余白がなくキツキツでちょっとアレな画像を例にして説明する。 元の画像のサイズは500x221 https://m.media-amazon.com/images/I/31Eybjr97iL.jpg SSとAAというパラメーターによる画像サイズの変更は、元になる画像のサイズ(長辺が500pxのことが多い)を超えると余白が追加される。

    Amazonの画像を拡大してリサイズし切り抜く
  • Sass - チュートリアル

    この文書は古いSassウェブサイトに載っていたチュートリアルの訳で、2013年12月現在もう新しいウェブサイトには存在しません。新しいウェブサイトでのチュートリアルにあたるSassの基の日語訳を参照してください。 Translation of: Sass - Tutorial Ruby と Sass のインストール まず、Sass がちゃんと動作するようにします。OS X を使用しているのなら、既に Ruby がインストールされているでしょう。Windows ユーザーならば RubyWindows インストーラーで、Linux ユーザーならパッケージ・マネージャーでそれぞれ Ruby をインストールすることが出来ます。 Ruby のインストールが完了したら、以下のようにして Sass のインストールを行います: gem install sass 最初の Sass スタイルシート 非

    t_a_o
    t_a_o 2011/12/04
    Sass
  • Sass、そしてSassy CSS (SCSS)

    CSSを拡張したメタ言語であるSass、そしてその別文法として定義されたSCSSについて、960.gsなどのCSSフレームワークと絡めて、Sass (主にSCSS)の良さを解説する。 CSSフレームワーク Sass Sassy CSS aka SCSS SCSSCSSフレームワーク 2カラムレイアウトの作成 clearfixやReset CSSの組み込み カラム幅の変更 カラムの入れ替え SCSSで完結することの意義 まとめ 最後に CSSフレームワーク 960.gsやBlueprint、BlueTripなどCSSフレームワークと呼ばれるものは色々ある。フレームワークと名乗るだけのことはあって、それらの生産性はとても高い。テンプレートで適切にクラス名やIDを埋め込むだけなので、複雑怪奇なCSSコーディングを意識することなく誰でも簡潔にきれいなカラム・レイアウトを作成できる。 HTML 4

    t_a_o
    t_a_o 2011/12/04
    Sass
  • Sassで行こう!

    Translation of: Getting Started with Sass - A List Apart CSSの持つその簡明さは欠かせない特徴の一つで、それは最も歓迎されている点でした。CSSによるスタイルシートは、セレクターといくつかの適用したいスタイル情報を含むルールを羅列したものに過ぎません。しかし、WebサイトやWebアプリケーションが巨大に、そして複雑になり、様々なデバイスや画面サイズに対応せざるを得なくなった現在、この簡明さという特徴―fontタグやテーブル・レイアウトの淘汰に大いに役にたったもの―が大きな足かせになっています。 簡単な計算機能や変数を追加するなどといったCSSの修正案が過去に提示されましたが、どれもブラウザー・ベンダーには採用されませんでした。仮にこういった新しく素晴らしい拡張されたCSSがあるブラウザーに実装されたとしても、それが実用に耐える程度に

    t_a_o
    t_a_o 2011/12/01
    Sass
  • 余白の美

    Translation of: Whitespace - A List Apart 僕の最初のデザインの仕事はマンチェスターの小さな印刷系のデザイン事務所でのもので、そこでは様々なものをデザインしました。パッケージや出版、ノベルティ、そして…ダイレクトメール。中でも、大きく、太く、そしてゴミゴミさせることが常のダイレクトメールをデザインする時には、大学で習ったグラフィック・デザインの原則はわずかしか役に立ちませんでした。忘れもしませんが、クライアントの一人にこう言われたことがあります。「余白は無駄なスペースだ」と。 ダイレクトメールの依頼者は大衆向けにデザインすれば効果的なので、そうすることを望みます。しかしながらダイレクトメール以外においては、それはまったくの間違いです。 はじめまして、余白さん 「余白」または「間(ま)」とはあるデザインを構成する要素同士の間隔のことです。もっと細かく言

    t_a_o
    t_a_o 2011/10/20
  • Hashbang(#!)なURLの恐怖

    諸方面からお叱りの言葉しかいただけない#!なURLは様々な問題をはらんでいますが、来るべき未来(もうすぐですよ!)におけるメンテナンス性という問題についてAdactioで取り上げられていました。#!の表面的な凶悪さに思考停止していて、こういった質的な問題についてはまったく考えていなかった気がします。 その問題というのは、#!なURLからHistory APIなどを利用してクリーンなURLに乗り換えよう(戻そう)としても、古い#!なURLを有効なままにするためにはサーバー側の何か(単純なリダイレクトやmod_rewriteなど)ではどうしようもないので、クライアント側での(JavaScriptを利用した)リダイレクトを提供する機能を提供し続けなければならないというメンテナンス性の悪さです。 この#!なURLのメンテナンス性の悪さという問題は、URLの#以降はクライアント側の扱いなので、クラ

    Hashbang(#!)なURLの恐怖
    t_a_o
    t_a_o 2011/06/04
  • 結局どうすればいいの? - Dive Into HTML5

    Translation of: What Does It All Mean? - Dive Into HTML5 Diving In The Doctype The Root Element The <head> Element Character Encoding Friends & (Link) Relations rel = stylesheet rel = alternate Other Link Relations in HTML5 New Semantic Elements in HTML5 A long digression into how browsers handle unknown elements Headers Articles Dates and Times Navigation Footers Further Reading 訳注 Diving In この章で

  • Git Cheat Sheets JP

    設定 基ランチ リモート・リポジトリ git-stash git-svn 参考 修正履歴 設定 Git には様々なオプション設定がある。中には挙動を大きく変えるものもあるので注意が必要である。 設定をすべて表示する $ git config --list システム (/etc/gitconfig) の設定 $ git config --system --list や、ユーザーごと (~/.gitconfig) の設定 $ git config --global --list など表示する対象を絞ることもできる。 ユーザ名とメール・アドレスを設定する $ git config --global user.name "John Doe" $ git config --global user.email "john.doe@example.com" コミットする時に記録されるユーザー名とメ

    t_a_o
    t_a_o 2010/12/26
  • 1