タグ

ブックマーク / hyper-text.org (23)

  • Windows で游ゴシックが細字になってしまう件は誰が悪いのかについて CSS 仕様から考えてみる

    Windows で 「游ゴシック」 フォントを使用すると細字で表示されちゃって困るという問題について、CSS の仕様を基に考えてみたいと思います。 Windows で 「游ゴシック」 フォントを使用すると細字で表示されちゃって困るという話、なんか Twitter で下記の記事が回ってきたので、あぁそういえばそんな問題がありましたよねと思い出したのですが、ちょっと気が向いたのでこれを CSS の仕様を基に考えてみたいと思います。 Windowsで游ゴシックが汚いのは、どう考えてもWebデザイナーが悪い! : Cherry Pie Web 要するに上記の記事の方が言うように制作者サイドの問題なのか、それとも Windows のレンダリングが悪いのかという話ですが、結論から言えば Windows が悪いってことでいいんじゃないかと思います。あと気になって自分の環境で調べてみたら、少なくとも Wi

    Windows で游ゴシックが細字になってしまう件は誰が悪いのかについて CSS 仕様から考えてみる
    uch
    uch 2016/06/30
  • Firefox 36 が unicode-range デスクリプタをサポート、文字コード範囲を指定してフォントを適用可能に

    現在、Firefox Nightly としてリリースされている、Firefox 36 で、unicode-range デスクリプタがサポートされました。unicode-range は @font-face デスクリプタで、読み込んだフォントの適応範囲を指定します。 例えば、ある要素内のテキストのうち、特定の文字のみ、あるいは特定の文字コード範囲に含まれる文字のみを、別のフォントで置き換えたい場合などに、unicode-range でその文字や文字コード範囲を指定することができます。 4.5 Character range: the unicode-range descriptor - CSS Fonts Module Level 3 Editor's Draft 27 October 2014 unicode-range デスクリプタの使い方 こういう指定が妥当というか実用的かは別として、

    Firefox 36 が unicode-range デスクリプタをサポート、文字コード範囲を指定してフォントを適用可能に
  • jQuery 公式 Blog 「jquery-latest.js を使用するのをやめろ」

    jQuery 公式 Blog は、「Don't Use jquery-latest.js」 と題された記事内で、今後、jquery-latest.js のバージョンを 1.11.1 で固定することと、番環境で jquery-latest.js を読み込むのをやめてくれというアナウンスを行っています。 jQuery 公式 Blog は、7月 3日付けで投稿された 「Don't Use jquery-latest.js (jquery-latest.js を使うな)」 と題された記事内で、今後、jquery-latest.js のバージョンを 1.11.1 で固定することと、番環境 (公開している Web サイト) で jquery-latest.js を読み込むのをやめてくれというアナウンスを行っています。 Don't Use jquery-latest.js : Official jQ

    jQuery 公式 Blog 「jquery-latest.js を使用するのをやめろ」
    uch
    uch 2014/07/04
  • Firefox Nightly が input type="color" に対応

    現在、Firefox Nightly としてリリースされている、Firefox 28 で、input 要素の type 属性値として 「color」 がサポートされました。「color」 は HTML5 から追加された type 属性値です。 現在、Firefox Nightly としてリリースされている、Firefox 28 で、HTML5 から追加された input 要素における type 属性値、「color」 がサポートされました。 input type="color" が指定された入力コントロールは、RGB カラーの入力欄となります。対応するブラウザでは、多くの場合、色を選択するためのユーザインタフェースが表示され、それを操作することで数値 (16進数カラーコード) を入力できます。HTML5 仕様書の該当箇所は下記。 4.10.7.1 States of the type at

    Firefox Nightly が input type="color" に対応
  • 5分でわかる Snaptee の使い方。Tシャツデザインの作成から購入方法まで

    5分でわかるシリーズ、Snaptee 編。Snaptee を使った Tシャツデザインの作り方から、実際にそれを購入する方法までを初めての人でもわかるように解説してみます。 Snaptee は、iPhone 向けに公開されている Tシャツデザインアプリで、iPhone 上で Tシャツデザインを簡単に作れて、世界中に向けて販売もできるサービス。 Snaptee : T-shirt design is easy, get Snaptee from AppStore! Snaptee : iTunes App Store その Snaptee を少し前から使ってるんで、ここらで毎度恒例の、5分でわかるシリーズ、Snaptee 編を書いてみたいと思います。Snaptee を使った Tシャツデザインの作り方から、実際にそれを購入する方法まで。また、最後に、家の FAQ から一部を翻訳して紹介していま

    5分でわかる Snaptee の使い方。Tシャツデザインの作成から購入方法まで
  • Twitter カード 7タイプの使い方をカード種別ごとに解説するよ

    Twitter カード 7タイプの仕様を Twitter の公式ドキュメントから翻訳して解説します。公式ドキュメントから抜粋して日語で書き直していますので完全な翻訳ではありません。 Twitter Cards (Twitter カード)、この Blog でもかなり前から指定して使っていますが、7種類のカードから選択できたり、それぞれに指定できる値が異なってたりしてわかりにくいっていう声を聞きましたので (公式な日語ドキュメントも今のところないし)、簡単に各カード種類別の仕様をまとめてみました。 Twitter Cards は、Facebook や Google+ などが採用している、OGP (Open Graph Protocol) を利用して、ウォールやタイムラインにリンクを投稿する際の表示内容を指定するのと同じ。それの Twitter 版です。タイムラインに URL が投稿されたと

    Twitter カード 7タイプの使い方をカード種別ごとに解説するよ
    uch
    uch 2013/06/01
  • W3C が HTML5 仕様策定完了を発表

    時間では昨日の深夜でしたが、W3C が HTML5 (および、Canvas 2D) に関する仕様策定完了を発表いたしました。両仕様とも、勧告候補 (Candidate Recommendation) となり、実装、運用テストによる検証段階に入ります。 また、同時に HTML 5.1、HTML Canvas 2D Context, Level 2 の草稿も公開され、次バージョンの仕様策定がスタートします。この辺は以前から発表されていた予定 (こっちも参照) に則っています。 W3CがHTML5仕様策定完了を発表、相互運用性テストおよびパフォーマンス向上へ : W3C プレスリリース なお、勧告候補になっても、以前から続いている、例えば hgroup 要素どうすんの?的な議論は継続していますが、こういう個々の機能の話が全体の仕様策定を遅延させないように、仕様をモジュール化する、拡張仕様 (

    W3C が HTML5 仕様策定完了を発表
    uch
    uch 2012/12/18
  • Webkit に最適化されたサイトを IE10 に適応させるためのガイド

    スラッシュドットで 「Microsoft、「WebKitはWeb標準を破壊している」と主張」 なんてストーリーが上がってて、なんぞやと思って大の記事を見に行ったんですけど、そしたらそれが 「Webkit しか対象にしてない Web サイトを IE10 でもきちんと動作させるためにやっといた方がいいことガイド」 っていうお役立ちコンテンツだったってことで、がんばって最後まで読んだ手前、ついでなので翻訳して掲載してみようかなと思います。 Microsoft、「WebKitはWeb標準を破壊している」と主張 : スラッシュドット・ジャパン ちなみに翻訳元の記事は 「Windows Phone Developer Blog」 で書かれた内容なので、「Windows Phone 8 で動作する IE10」 っていう書き方になっている部分や、すべて Webkit と対比して書かれているなど、モバイル

    Webkit に最適化されたサイトを IE10 に適応させるためのガイド
  • 改行削除するくらいなら gzip したらいいじゃない

    CSSJavaScript ファイルなどを gzip 圧縮して転送量の削減や Web サイト表示速度の向上を実現する方法を解説。既存 Web サイトのソースには一切手を加えない方法でまとめています。おまけでキャッシュ関連の記述もあり。 いや、1バイトの無駄もゆるせねぇんだよとか、難読化したいとかなら別にやればいいんですけど、CSSJavaScript ファイルの改行やスペースを削除しただけでファイル容量圧縮、読み込み速ーい的なこという人がいるので今さらですが書いてみます。すでに色々なところで書かれてるのでかぶるのは承知の上で。 改行や無駄なスペースなどを削除すること自体が悪いと言ってるわけではありませんのでその辺は誤解ないようにお願いします。ただ、gzip 使って圧縮するのに比べたら、改行削除して削れるファイルサイズなんて微々たるものです。もちろん、両方やれば最大限ファイルサイ

    改行削除するくらいなら gzip したらいいじゃない
  • 充電機能付きのタブレットスタンド自作してみた

    増え続けるタブレットを収納しつつ充電できるスタンドを探していたんですが、なかなかイメージ通りのがなかったんで、じゃあ作ろってことで、アフター5 DIY。「まな板スタンド」 をベースに改造したものですが、折角なので公開します。 自作といっても 「まな板スタンド」 をベースに改造しただけなんですけどね。 現在、我が家には初代の iPad と、第3世代 iPad、あと日での発売開始と同時に勢いで買っちゃった Nexus 7 の3枚のタブレットがあるんですが、Kindle Paperwhite も小説を出先で読むのにいいなぁとか、iPad mini とかもね (注文してないけど)… で、増え続けるタブレットを収納しとく場所として、あと充電も一緒にできるような方法はないかなと考えていたんですが、なかなかイメージ通りのがなかったんで、じゃあ作ろってことで、アフター5 DIY。折角なので公開します。

    充電機能付きのタブレットスタンド自作してみた
  • Adobe のフォント 「Source Code Pro」 試してみた

    Adobe さんがソースコードを見やすく表示するためのフォントとして、その名も 「Source Code Pro」 というフォントを発表したとのことで、早速ですがこのブログでも使ってみました。Google Web Fonts からの使用方法を簡単に解説。 Publickey さん経由で知ったんですが、Adobe さんがソースコードを見やすく表示するためのフォントとして、その名も 「Source Code Pro」 というフォントを発表したとのこと。 そこで、早速ですがこの Blog でも使ってみました。Google Web Fonts 等でも使用できるようになっていますので、試すのは簡単です。 実際にこの記事のソースコード部分も 「Source Code Pro」 で表示されていると思いますので確認してみてください。確かに見やすいかも。 [速報]ソースコードを表示するためのフォント「Sou

    Adobe のフォント 「Source Code Pro」 試してみた
  • HTML5 開発者向け iPhone 5 / iOS 6 での変更点等まとめ

    iPhone 5 / iOS 6 における変更点などを、開発者向けにまとめた海外記事がありましたので、簡単にですが日語にしてご紹介。対訳ではなくて、内容だけ伝わるようにかなり変更していたり、省略もしていますので、詳しくは原文をご確認ください。 iOS 6 がリリースされましたがアップデートされましたか?私はマップアプリをよく使うのですが、早速アップデートした方々の、マップがぁぁという叫びにびびってまだアップデートできておりません… で、まだ私の手元の iPhone 4S では iOS 5 が元気に動いている今日この頃ですが、iPhone 5 / iOS 6 における変更点などを、開発者向けにまとめた海外記事がありましたので、簡単にですが日語にしてご紹介。対訳ではなくて、内容だけ伝わるようにかなり変更していたり、省略もしていますので、詳しくは原文をご確認ください。 原文 iPhone 5

    HTML5 開発者向け iPhone 5 / iOS 6 での変更点等まとめ
  • iframe 要素の seamless 属性を試してみた

    WebKit Nightly Buildsが iframe 要素に追加された seamless 属性に対応したとのことなので、早速どんな感じになるのか確認してみました。 Last week in WebKit: Inspector's sources panel and private names : Surfin' Safari Add seamless layout code (and pass most of the remaining seamless tests) : Changeset 118291 WebKit 現在公開されている WebKit Nightly Builds の最新版、及び Google Chrome も、開発者向けビルド (Dev channel) の最新版 「21.0.1155.2」 で動作しているのが確認できました。インストール済みの方は下記にデモページ

    iframe 要素の seamless 属性を試してみた
  • HTML5 でやりがちな間違い

    HTML5 Doctor で 「Avoiding common HTML5 mistakes」 という記事が上がっていましたので稚拙ではありますが翻訳など。HTML5 でマークアップする際にやりがちな間違いをいくつか挙げて、さらに正しいマークアップ例も紹介くれていますので、参考にしてみてはいかがでしょうか。 HTML5 Doctor で 「Avoiding common HTML5 mistakes」 という記事が上がっていましたので稚拙ではありますが翻訳など。HTML5 でマークアップする際にやりがちな間違いをいくつか挙げて、さらに正しいマークアップ例も紹介くれていますので、参考にしてみてはいかがでしょうか。 Avoiding common HTML5 mistakes : HTML5 Doctor 翻訳といっても要約みたいな感じですので、書いてあることをそのまま日語にしたものではあり

    HTML5 でやりがちな間違い
    uch
    uch 2011/07/27
  • HTML5 におけるアウトラインに関して簡単解説

    HTML5 におけるアウトラインに関して簡単解説 HTML5 で重要なアウトラインに関して、なるべくわかりやすく簡単に解説してみます。 最近、ヨモツネットさんで 「HTML5 でのセクションの誤用にご注意」 なんて記事が出てたり、ちょうど HTML5 Doctor でも 「Document Outlines」 と題してアウトラインの解説記事が上がってたりするので、この 「アウトライン」 について簡単にまとめてみようと思います。解説って言うほど偉そうなものではありませんがなるべくわかりやすく書いてみようかと。 アウトラインを理解することは、HTML5 でマークアップする際にとても重要になりますので覚えておくとよいと思いますよ。 アウトラインとは? アウトラインとは見出し、フォームタイトル、テーブルタイトル、その他ラベル付けされた要素によって生成される文書構造のこと…なんて書くととても難しそう

    HTML5 におけるアウトラインに関して簡単解説
    uch
    uch 2011/07/13
  • 個人的お気に入り iPad App 30選 (1/3)

    iPad の日発売開始から週も空けて、お祭り騒ぎもひと段落しましたね。iPad が手元に届いてからぼちぼち色々な App を試してみたりしていたのですが、iPad を使い始めて 5日間でひとまず定着した App を紹介してみます。 ただ、まだ iPad 用の App は数が少ないので、他で紹介されている App とかぶりますね。目新しい物はないかもしれませんが気にせず行きます。 現在のホーム画面はこんな感じ。まだまだ App は少ないのでホーム画面 3枚で収まってます。(画像クリックで拡大します) その中から、特にいいなと思った App を 30個ピックアップして簡単な使い方といっしょに紹介してみます。ちょっと数が多いですので、3回に記事を分けて更新します。まずは最初の 10個。 1. Evernote iPhone / iPad 両対応 (無料) iPhone の方でも使っていますが、

    個人的お気に入り iPad App 30選 (1/3)
  • iPad ファーストインプレッション

    今日は iPad の日での発売日ということで、朝から iPad 関連の話題でもちきりしたが、Apple Store で Wi-Fi モデルを予約注文していた私のところにも、今日の昼過ぎに無事届きました。開封の儀だの、iPad のパッケージ写真だのは、色々なところで上がっていて見飽きてると思いますので、とりあえず iPad が届いて最初に入れてみた App や壁紙とか設定して遊んでたのでその辺を中心に、ファーストインプレッションをまとめてみたいと思います。 今日は iPad の日での発売日ということで、朝から iPad 関連の話題でもちきりしたが、Apple Store で Wi-Fi モデルを予約注文していた私のところにも、今日の昼過ぎに無事届きました。 開封の儀だの、iPad のパッケージ写真だのは、色々なところで上がっていて見飽きてると思いますので、とりあえず iPad が届いて最

    iPad ファーストインプレッション
  • HTML5 を学ぶための情報源まとめ

    ちょっと更新サボりすぎでしたが、最近 HTML5 関連の話もとっても増えてきましたので、ここらで HTML5 に関する情報を集めるときに情報源として有益なサイトをまとめてみたいと思います。やはり、英語での情報が多くなってしまうので、英語能力が残念な私なんかは結構厳しいんですが、いくつか日語での情報源も挙げてみましたので、併せて見ておくといいと思います。 ちょっと更新サボりすぎでしたが、最近 HTML5 関連の話もとっても増えてきましたので、ここらで HTML5 に関する情報を集めるときに情報源として有益なサイトをまとめてみたいと思います。 やはり、英語での情報が多くなってしまうので、英語能力が残念な私なんかは結構厳しいんですが、いくつか日語での情報源も挙げてみましたので、併せて見ておくといいと思います。 ちなみに、XHTML 好きな私としては、XHTML5 で次のサイトリニューアルとか

    HTML5 を学ぶための情報源まとめ
  • 常用中 Firefox 3 アドオンのまとめ

    1年に 1回は書いているこのネタ、懲りずに私が個人的に日常利用している Firefox アドオン(+ Greasemonkey ユーザースクリプト)を挙げてみました。Firefox 3 対応のアドオンのみを集めています。 1年に 1回は書いているこのネタ、懲りずに私が個人的に日常利用している Firefox アドオン(+ Greasemonkey ユーザースクリプト)を挙げてみました。Firefox 3 対応のアドオンのみを集めています。 アドオンはあんまり数多くインストールすると結構重くなるので注意してくださいね。その場合は、インストールしても、使うとき以外は無効にしておくなど工夫しましょう。メモリてんこ盛り PC ならあまり気にならないと思いますが。 今回は数が多いので大まかにグループ分けして紹介してみます。あと、特定のアドオンに依存しているものもありますので、その辺はまとめています。

    常用中 Firefox 3 アドオンのまとめ
  • 5分でわかる Tumblr の始め方

    すでに使っている人には今更なんですが、これから始めるって人向けに簡単なまとめ。 Tumblr といってもその用途は人それぞれ。自分の Blog として使う人もいるでしょうし、情報(ネタ)収集のツールとして使いたい人もいるでしょう。今回は情報収集 & クリッピングツールとしての使い方に主眼を置いて紹介してみようと思います。 アカウントを取得する とりあえず他の人をフォローしまくる ダッシュボードをしばらく眺めてみよう Reblog と Like Tumblr をもっと便利に使う Firefox を使え アドオン : Tombloo と Greasemonkey を入れる ユーザースクリプト : AutoPagerize, LDRize (+ Minibuffer), ReblogCommand, play on tumblr を入れる マイページなんて飾りです iPhone と Tumblr

    5分でわかる Tumblr の始め方