Designing in the browser | Opinion | .net magazine
"1. We should spend design time working in the medium of HTML, CSS and JS. 2. Clients should be shown HTML and CSS mockups in place of static images as the final design deliverable where possible."
HTML5 adaptive images: end of round one | HTML5 Doctor
"But I don’t really care which syntax makes the spec, as long as it addresses the majority of use cases and it is usable by authors. I’m just glad we’re discussing the adaptive image problem at all."
"But let’s be clear: this is exactly how the WHATWG is supposed to work. Use-cases are evaluated and whatever Hixie thinks is best solution gets put in the spec, regardless of how popular or unpopular it is."
A List Apart: Articles: Responsive Images and Web Standards at the Turning Point
"When the WHATWG proposed a solution last week, many of the people involved in that discussion hadn’t participated in the RICG. In fact, some key decision makers hadn’t so much as heard of it."
ARIA-Group: a viable alternative for Fieldset / Legend?
"The roles “group” and “radiogroup” are well supported and may be used to group form controls in situations where one might use HTML’s fieldset – legend elements. It is advisable to include some visual cue via CSS to convey grouping too."
20 leading web designers' desks for your inspiration | Feature | .net magazine
皆さんオシャレだなぁ。早く広い書斎を手に入れたいです。
というか、実はほかの曲もOwl City by OwlCityOfficial on SoundCloud - Create, record and share your sounds for freeで聴けるようになっていることに今さっき気づきました......これSetの名前ミスってますね。まぁしかし無料でこれだけ（目下46曲）自身の楽曲をSoundCloudで聴けるようにしてるAdamはナイス過ぎる。
]]>BuildMobile | Creating a website for multiple screens
"Rather than the traditional flow where the designer designs first and then hands the PSDs over to the developer, more design iterations combined with development will be necessary as the site goes from conception to completion."
A non-responsive approach to building cross-device webapps - HTML5 Rocks
"As the UIs you build increase in complexity, and you gravitate toward single-page webapps, you’ll want to do more to customize UIs for each type of device. This article will teach you how to do these customizations with a minimal amount of effort."
Accessible Client-side Form Validation with HTML5 & WAI-ARIA
"All the screen readers I’ve tested only speak required once. Here aria-required is your fallback for browsers who do not support HTML5 like Internet Explorer."
Viewport Sized Typography | CSS-Tricks
"CSS3 has some new values for sizing things relative to the current viewport size: vw, vh, and vmin. It is relevant to bring up now, because it's shipping in Chrome 20 (canary at the time of this writing)."
The state of responsive advertising: the publishers' perspective | Feature | .net magazine
"This article has presented different issues and some solutions for the advertising and monetisation opportunity, specifically for publishers that are embracing responsive sites."
The top 8 web standards myths debunked | Feature | .net magazine
最後の"W3C = the CSS WG + some small insignificant WGs"てのはさすがにネタでしょうか。
うーむ、これは面白そう。幸い鳥コンとも日程がかぶらないし、仕事の状況が許せば現地まで見に行きたいところ。気になるのは、鳥コンが存在するがゆえに人力飛行機の設計/製作が盛んな日本ならともかく、ほかの国や地域でこの競技に参加できるだけの実力を備えたチームがどれだけあるのか？ということ。実際に参加するとなれば、現地までの機体の搬入やら搬出だけでそれなりのコストが発生するわけで、単に技術力とか人的リソースのみならず、資金力を問われることになりそう。まぁイギリス国外、ヨーロッパ圏外からは辛いだろうな。蓋を明けたら出場チームはSouthampton University Human Powered Aircraft: SUHPAだけだったりして......というか、同じイギリスだし仮に自分が10年以上前に見学させてもらったAirglowがちゃんと保存されているなら、あっさり同機の優勝じゃね？とも思ったんですけど......なななんと、Airglowは50周年だった昨年にLasham Airfieldを飛んでたんですね！これはひょっとして本当にAirglowの参戦もあり得るのではないかな。久しぶりにMcIntyreさんに連絡とってみようかしら（あちらはもう僕のこと忘れてるでしょうけど）。
]]>html5shiv and Serving Content From Code Repositories | Zoompf
Paul曰く："I 100% agree about not linking to Google Code. I mean, I'm not even convinced a proper CDN would be good either. I'll talk to Remy about changing the text on the html5shiv project page to recommend self-hosting."
Firefox 14: image long description via link using aria-describedby | The Paciello Group Blog
"When the image has focus the screen reader user can press enter to activate the link, because a link action showlongdesc is exposed on the image, it uses the URL from the link referenced via aria-describedby."
Which responsive images solution should you use? | CSS-Tricks
"There are a bunch of techniques going around for dealing with responsive images lately. That is, solutions to help us serve the right image for the occasion (e.g. size of screen and bandwidth available). They all do things a bit differently."
Bye, Bye Waterfall: 5 Steps to Implement Responsive Web Design
"An agile approach with responsive design considers these issues from the start, but will require more upfront wireframing, design and testing that are omitted in the waterfall process."
A separate mobile website: no forking way | Opinion | .net magazine
"The hype and the debates around responsive design are missing the real problem. The challenge for most organisations in the long run won't be maintaining multiple sets of frontend code for different templates. It will be maintaining variations of duplicate content."
宇宙開発の描き方が極めて硬派である点が、自分にとってプラネテスが魅力的に映る理由として大きいと思います。そもそも物語の舞台背景としてスペースデブリ、宇宙のゴミが重要な位置づけとなっている時点で、思いっきり硬派（というか地味？）なわけですが......硬派に感じる端的な例が、登場する宇宙服。コミック版で描かれる宇宙服とは明確に異なるものの、とにかく一見して「格好よくない」のです。どちらかといえば不格好で、一連のガンダムシリーズとか、同じく宇宙を舞台にした漫画『MOONLIGHT MILE』に出てくる宇宙服と比べれば、およそ洗練されているとは言い難い印象を受けます。しかし顔を覆う部分が、頭部を防御すると同時に種々の情報を映し出すディスプレイとしても機能するなど、実用的で「実際の」宇宙服の延長上にあるかの印象を受けます。そういうところが僕には硬派に映り、ひいては作品全体にリアリティを醸し出しているのかなと。
また、宇宙を舞台にしたSF作品ではありながらも、そこで扱われているテーマは多種多様で、最終的にはオーソドックスな人間讃歌に仕上がっている点も、魅力としては大きいかと。話が進むにつれ、さまざまな疑問が見ている側の心の内に喚起されます。会社って何だ。仕事って何だ。正社員って何だ。契約社員って何だ。上司って何だ。部下って何だ。男って何だ。女って何だ。人間って何だ。家族って何だ。親って何だ。子供って何だ。大人って何だ。宇宙って何だ。地球って何だ。宇宙開発って何だ。夢って何だ。我が儘って何だ。現実って何だ。生き甲斐って何だ。幸せって何だ。死って何だ。生って何だ。愛って何だ。で、木星往還船を作るほどに科学技術が発展しようとも、結局のところ人は人でしか無く、愚かでしかし素晴らしい存在であるとの理解に至るんですよね。ゆえに、宇宙とか宇宙開発に普段あまり興味を持たない層にも受け入れられる内容に仕上がっていると思うし、むしろそういう人にこそ見て欲しいアニメかと。そんなわけで、アニメ版プラネテス「も」コミック版と同じかそれ以上にオススメです。あーノノかわいくて辛い（謎
]]>Text masking -- The standards way | Lea Verou
"We have had a standards compliant alternative for this for the past 11 years and it's called SVG. It can also do much more than masking, if you give it a chance."
Accessible Client-side Form Validation with HTML5
"Connecting labels to inputs is easy! But what about required fields, error messages, and keyboard focus?"
"A11yBuzz is not a free-for-all. All submitted links must be approved by a human before they're displayed."
Data Points: How We Use Our Mobiles | Adweek
"Context is everything. Some mobile habits overlap, but there are significant differences in how consumers use their tablets and smartphones which marketers need to understand to effectively use the devices."
Stubbornella » Blog Archive » Cross-Browser Debugging CSS
"The most important thing to keep in mind is that error behavior is not defined in the spec."
Opera? Has the fat lady already sung about prefixes? - KevinjohnGallagher.com
"Out of the top 18000 websites, only 15 sites used both the Opera and Webkit vendor prefix, while a staggering 9129 websites only used the -webkit prefix. 66.01% of websites in the top 18000 won't display the same in both Opera and webkit even though both support the code to do so."
宇宙に夢や憧れを持っている20代は「宇宙に行きたい」と答え、またエンジニアとして経験を積んだ30代の多くは「独自の宇宙船を開発したい」という声がありました。40代以上では意見が分かれたものの、JAXA職員全体として78.5%の人が宇宙へ行きたいと答えました。
とあるけど、その横に並んでいるチャートに年代別のものはなく、また職員全体の傾向としては「様子見」が最大多数のように受け取れるのですが。本文だけからだと、日本独自の有人宇宙ミッションに前向きな印象を受けるわけで、これはいったいどういう理解すれば良いのでしょう？職員全体のチャートはそれはそれとして、年代別のものも見たいものです。そもそも「様子見」の円が、JAXA独自の有人宇宙船を打上げるべきかどうか、自分が宇宙に行きたいと思うかどうかの二軸のどちらに対してもポジティブな象限に位置しているのは理解し難い。「様子見」クラスタって、本質的には変化を望んでいない＝どちらかといえばネガティブ、少なくともポジティブには振り分けられないと思うのですが。そして二点目はp.78〜の毛利さんへのインタビュー記事で、
よく主要国首脳会議（G8）を国際宇宙ステーション（ISS）で開催すれば平和になるのではという話を聞きますが、とんでもない。各国の首脳が訓練して徹底的に苦労し、苦しい思いをしてから行けば変わると思いますが、ファーストクラスで楽に行ったとしても効果はない。宇宙へ行くということは、単に地球を外から見るだけではなく、地道でハードな訓練を積むという、そのプロセスが重要なのです。
というくだりには、敢えて異を唱えたい。無論、宇宙空間でのG8開催が即平和に繋がると思うほど楽観論者ではないけど、しかし人類の未来を左右し得るだけの立場にある人々が宇宙に出、地球を客観視する機会を得ることで、歴史をより良い方向へ動かせる可能性は高いと思っています（アポロ8号で撮影された「地球の出」の写真が、多くの人々に強烈なインパクトを与えたがごとく）。で、そういう可能性を生み出すためなら、別に各国首脳が「どう」宇宙へ出ようと構わないと思うのです。苦労して訓練を重ねる必要なんてないし、むしろそのほうが（ファーストクラスで楽に行ったほうが）良い。宇宙に行くという行為への自己満足で完結されては困るわけで、行って帰って来てからが為政者にとっての本領発揮なわけだから。
]]>WebKit is the most popular mobile browser in the... — WebKitbits
"Interesting to note, that, if my theory is correct (“Mini” being more popular than “Mobile”), the prefix alias solution that they are recommending will only fix the CSS3 UX issues for the minority of their users."
Make sure your HTML5 document outline is backwards compatible | 456 Berea Street
"The reason is simple. Browsers and assistive technology haven’t implemented the HTML5 outline algorithm yet (the only exception I’m aware of is JAWS, which gets it wrong, as Jason Kiss explains in JAWS, IE and Headings in HTML5)."
Why you should care about CSS page performance | Boagworld
"A website that performs quickly and smoothly feels high-quality and that feeling translates to the brand it represents."
Nielsen vs Clark – they're both wrong | Opinion | .net magazine
"If you find that your mobile users use the site in a significantly different way than desktop users, check out Nielsen's guidelines and see which apply to you. And if you find that your mobile users are accessing the same content as desktop users then consider a responsive design."
Adactio: Journal—Left to our own devices
"I think there’s a common misunderstanding that testing on many different devices means developing for many different devices. Nothing could be further from the truth."
Scalable Navigation Patterns in Responsive Web Design | Palantir.net
"Here are some of the lessons we’ve learned working on a recent real-life, large-scale RWD project. Specifically, this post focuses on how we chose to deal with deep navigation in the landscape of a templated environment."
新氏といえば、過去に名だたるグローバル企業で社長職を3回、副社長職を1回経験されてきたいわば経営のプロ中のプロ。『働き方の教科書』を読んだときにも、氏の言葉には説得力があるなぁと思ったのですが、それは本書でも同様。機会があれば、いちど講演を拝聴してみたいものですね（アカデミーヒルズで何度か講演していたみたい）。7つの章に分けて都合30に及ぶ経営の原理原則を取りまとめたのが本書。恐ろしいことに、会社をつぶす社長には、実はこの「経営の原理原則」を押さえていない、という共通的な特徴がある
とのことで、それだけに氏の主観だけに依存しない、普遍的な内容になっているのだと思います（だからこその「原理原則」なのでしょうが）。以下、印象的だったフレーズを：
結果を求めたければ、まずは理念に戻ること
情熱は正しい方向に向けられたもの、つまり、世の中をよくするためのもの、人を幸せにするためのものでなければならない
A man is a sum total of all the people he has met in his life.
経営者は小さなことを理解しながらも、つねに全体最適を考えることが求められる
走ることができる前には、歩けなければいけない（イギリスの諺）
めざすはビッグカンパニーか、グッドカンパニーか（※ビッグを目指す前にグッドであることが必要）
人を育てるための、最も効果的な方法は任せることである（ドラッカーの言葉）
「自分が何をいったか」より「相手にどう伝わったか」が重要
同じところにいると、いつまでも同じ問題に頭のなかを占領され、そこから脱却することが難しくなる。だから、意識的に環境を変える（......自分には年に一度は一人旅が必要かも）
地味にコツコツと継続された改善は、やがて限りなく改革に近い効果をもたらす
HTML5 Accessibility Chops: hidden and aria-hidden | The Paciello Group Blog
"If you want to hide content from all users, use the HTML5 hidden attribute (along with CSS display:none for browsers that do not yet support hidden) There is no need to use aria-hidden."
Opera Mobile Emulator build with experimental WebKit prefix support - Dev.Opera
"All browsers include mechanisms to deal with broken or unintended content. For example, IE6 invented DOCTYPE switching that assumed, from the lack of DOCTYPE that the developer wanted the erroneous IE5 box model. Opera and Firefox had to include bug compatibility with IE6, which is only being removed now."
Browser Wars II, on FarukAt.eş
"Is Opera's decision good or bad? The answer depends on who you are."
Official Google Webmaster Central Blog: Responsive design - harnessing the power of media queries
"With a mind towards maintainability we leant towards using the same pages for both, and started thinking about how we could fulfill the following guidelines:1. Our pages should render legibly at any screen resolution 2. We mark up one set of content, making it viewable on any device 3.We should never show a horizontal scrollbar, whatever the window size"
"There are two problems here: slow standardization and impending software monoculture."
デバイス固有のスクリーンサイズに対し、Webページのレイアウトやビジュアルデザインがフィットしているかどうか、一定の使いやすさを提供できているかという尺度で考えるなら、RWDという考え方、アプローチは専用化ではなく汎用化に近いのであって、特定のデバイスなりスクリーンサイズに最適化するためのものではありません。だいぶくどくなりますが、敢えて書き下すなら
と理解しています。ちなみに上記で使っている「対応」の二文字も「最適化」に負けず劣らず曖昧に受け取ることのできてしまう言葉ではあるのですが、ここでは既に書いたように、一定の使いやすさを実現するためのレイアウト/ビジュアルデザインを提供する、という意味合いで使っています。うーんそれでもやっぱり曖昧は曖昧か。しかし尺度や前提の明示されないままでのRWD＝最適化という論調は、あたかもRWDが「あらゆる面で最も適した状態を実現する」かの誤ったイメージを与えてしまう懸念があり、たとえば表示速度といったRWDの短所と言われる部分を包み隠してしまう可能性があるのではないかと。あらゆるメソッドなりソリューションには長所・短所がつきものであって、それが解決する課題もあれば解決しない課題もある（ある課題を解決する代償としてまったく別の新たな課題を生むことだってある）、という認識を読者の側がもってさえいれば、大した問題ではないかもしれませんけどね。
あまり関係ないけど、PCサイトをスマートフォン向けに自動的に変換（謎）するのを「最適化」という言葉とともに宣伝しているサービスがありますが、そういうのを目にして「うーむ」と唸ってしまうのと同じ感じです。オチはありません。
]]>"With JavaScript, you could measure the window width and shuffle things around in the DOM. That seems heavy to me, but the browser support would be good. I'd rather lean on CSS for this kind of thing."
"The idea here is to have the two supporting panels of navigation and sidebar content hidden just off-screen to the left and right for easy access on small/medium viewports. Off Canvas is a design pattern, not a plugin or framework."
"本書は発売と同時に、出版社のウェブサイトで全文が読めるようになっています。購入いただいた方は疑問に思われるかもしれませんが、書籍とウェブが共生することができるかどうかを知りたいと思い、実験的な試みとして無理を言って実現していただきました。"
Stop solving problems you don’t yet have | this is rachelandrew.co.uk
"However, despite us entering a seemingly golden age of browser consistency, what I am seeing is an increasing reliance on a whole slew of polyfills, CSS frameworks and boilerplate starting points."
"Sleep your Mac differently depending on the battery level."
"When questioned about any regrets they had or anything they would do differently, common themes surfaced again and again. Here are the most common five"
があり、また日常のマネジメントのなかでは
の4つのスキルが必要とのこと。以下、気になったフレーズのなかから4つを抜粋：
現場の人間が、より質の高い成果を上げるような仕組みをつくり、仕事をする環境を整備する
部下の非常識にイライラしていたら負け
上司からの信頼と部下からの信頼のどちらかしか選べないとしたら、部下からの信頼を選ぶ
部下の立場はあなたが考えているより、はるかに弱い
Eric's Archived Thoughts: Linear Gradient Keywords
"Linear gradients in CSS can lead to all kinds of wacky, wacky results--some of them, it sometimes seems, in the syntax itself."
Building with Content Choreography
"Also if a mobile browser can't recognise flexbox (IE9 Mobile is the only major one missing from the list so I'm assuming it can't), then it will simply fallback to the default document order which isn't the worst outcome."
Build a responsive site in a week: going further (part 5) | Tutorial | .net magazine
"Fragmentation around the Android platform makes it difficult to suggest one particular version you should test on, but if a site works on 2.1 (Eclair) then it will likely work on later versions. Be sure to install Opera Mini on these devices and test on this too."
Ethan Marcotte answers your responsive web design questions | Interview | .net magazine
"I'm a big fan of percentage-based measurements for horizontal margins and padding, and ems for their vertical equivalents."
The state of responsive images | Feature | .net magazine
"As a result of working closely with members of the Opera and Chrome developer relations teams throughout this process, the <picture> markup pattern has been presented to both teams by way of what I'm half-jokingly calling a "pseudospec"."
CSS3 Structural Pseudo-class Expressions Explained | Impressive Webs
"The expressions, on the other hand, are a little more complicated, but not too bad once you mess around with them a little."