もう、SP用のWebデザインを倍の解像度で作るのをやめよう
デザイナーがコーディングできるべきかという議論がSNS上で白熱していますが個人的にはあまり興味がなく、コーディング経験の有無に関係なくWebに適したデザインデータを作ってもらえたらあとはフロントエンドの領分であると思っています。 とはいえ、Webに適したデザインデータをつくれないデザイナーが多いのでああいった議論が白熱するのではないかとも思っています。 Webに適していないデザインデータとはどういったものかというと、古くから言われているものではPhotoshopの『乗算』を使うとCSSで表現できないためダメというものがあったりします。 CSSでもmix-blend-modeという機能で対応できるけどブラウザの対応状況を鑑みるに、よほどの理由がないかぎりPhotoshopの『乗算』を使っていはいけないのが今の現実です。 参考：mix-blend-mode - CSS: カスケーディングスタイ
【マスクテクニック】あなたもコレを見てデキるデザイナーに！CSS、SVG/Canvasを使った見事なマスクデモ10選！
SVGのマスクテクニックを使えばなかなかたいしたことができることをご存じでしょうか。このやり方はここ数年に広まったものですが、最近になるまでWeb開発のメインストリームに入ってきませんでした。 本記事では、Webを捜して集めたクリッピングマスク・SVG/canvasを使ったマスクのデモを紹介しています。これらの例を見れば、Webにおいてマスクがどれほど活用できるものか、それらが開発者に何を与えてくれるかを実感してもらえると思います。 （画像をクリックするとCodepenに飛びます。） １．テキスト・マスキング 動くテキスト・マスキングの見事な例です。HTMLのページ・テキストを使用しており、テキスト部分を所望のものに変えるだけでどんなものにも応用できます。 この仕掛けの種は、CSSのバックグラウンド・クリップ（background-clip）のようなプロパティにあります。クリアーな背景の使
IE9を超えてパワフル！──「Internet Explorer 10」の本気を動画で見る
IE9を超えてパワフル！──「Internet Explorer 10」の本気を動画で見る：MIX11 Internet Explorer 9の日本語版が4月26日から配布を開始。が！ 米国ではその次期バージョンがサクサクと動いているという。その“速さ”を動画でチェック。 米Microsoftは、米国ネバダ州ラスベガスで開催中のWeb開発者イベント「MIX11」において「Internet Explorer 10 Platform Preview 1」（IE10 PP1）を公開した。IE10 PPは、開発者がレンダリング処理などの挙動を把握するために配布されるもので、UIなどのスキン要素は含まれない。だが、MIX11で公開されたデモの数々は、IE10で向上した高速動作とHTML5標準準拠を示した。ここでは、デモで紹介されたIE10 PPの動作を動画で紹介する。なお、IE10 PP1は、こちら
日記 | ヨモツネット
blog移行しました。新しいblogで更新を続けています。 XMLェ… text ja 2012-07-08 http://www.yomotsu.net/wp/?p=603 XMLェ… 日々の出来事2012年7月8日日曜日 ブログ作りなおそうかなーと思って、この Webサイト をみなおしてたら、Web ページのメタ情報としてダブリンコア (RDF) を混在させていたことを思い出した。バリデーターにかければ、グラフも取り出せて みたいな感じになる。でも結局あまり意味なかったです多分。いまは OGP とかありますしね。 Web ページは XHTML にしてたけど、ブログのコメントで参照先のない数値参照とか混ぜられると XML パースエラーになるし、XML だから他の語彙混在できるけど、RDF くらいしか混ぜてなかったし、XHTML 意味なかったです多分。いまは HTML に SVG 混在でき
第1回 SVGの基礎知識 | gihyo.jp
SVGは比較的古くからある仕様の1つですが、2010年3月にマイクロソフトがInternet Explorer 9でのサポートを表明してから一気に注目が高まりました。そんな古くて新しいSVGを今から使える情報と、将来の展望を全4回の集中連載で解説します。 SVGとは SVG（Scalable Vector Graphics）は、XMLベースのベクターグラフィック言語もしくは画像フォーマットです。W3Cによってその仕様が定義されており、画像フォーマットとして用いる場合は拡張子.svgが使用され、MIME形式はimage/svg+xmlが用いられます。 SVGの現状 Firefox、Safari、Google Chrome、Operaなどのブラウザが既にサポートしており、Internet Explorerもそのバージョン9、具体的にはInternet Explorer 9: Platform
日記 | ヨモツネット
blog移行しました。新しいblogで更新を続けています。 XMLェ… text ja 2012-07-08 http://www.yomotsu.net/wp/?p=603 XMLェ… 日々の出来事2012年7月8日日曜日 ブログ作りなおそうかなーと思って、この Webサイト をみなおしてたら、Web ページのメタ情報としてダブリンコア (RDF) を混在させていたことを思い出した。バリデーターにかければ、グラフも取り出せて みたいな感じになる。でも結局あまり意味なかったです多分。いまは OGP とかありますしね。 Web ページは XHTML にしてたけど、ブログのコメントで参照先のない数値参照とか混ぜられると XML パースエラーになるし、XML だから他の語彙混在できるけど、RDF くらいしか混ぜてなかったし、XHTML 意味なかったです多分。いまは HTML に SVG 混在でき
Google Docs の新機能「drawing」は完全 SVG ベース、現行 IE はすべて要 Chrome Frame に！ - WebOS Goodies
WebOS Goodies へようこそ！ WebOS はインターネットの未来形。あらゆる Web サイトが繋がり、共有し、協力して創り上げる、ひとつの巨大な情報システムです。そこでは、あらゆる情報がネットワーク上に蓄積され、我々はいつでも、どこからでも、多彩なデバイスを使ってそれらにアクセスできます。 WebOS Goodies は、さまざまな情報提供やツール開発を通して、そんな世界の実現に少しでも貢献するべく活動していきます。 先日 Google Docs が刷新され、これまで他のアプリの付加機能だった作図機能が drawing として独立しました。機能的にはこれまでの作図機能と大差ないようですが、他のユーザーとの同時編集が可能になったのは大きな進歩です。 しかし、 Web 開発者的にはもうひとつ注目すべき点があります。それは Google Docs drawing が完全に SVG ベ
Internet Explorer 9 Preview と HTML5 « HTML5.JP ブログ
ラスベガスで開催されている Microsoft の MIX10 で、日本時間の今朝、Internet Explorer の次期バージョンとなる Internet Explorer 9 が紹介されました。すでに、ブログやメディアで MIX10 のレポートが出てきていますので、ご存じの方も多いことでしょう。あわせて、IE9 Preview 版が公開されました。 ここでは、Internet Explorer 9 の HTML5 やその他 W3C 標準のサポートについて見ていきましょう。詳細は、Internet Explorer 9: Testing Center や IE9 プレビュー・ガイド に詳しく公開されています。 SVG 今回の Preview 版で最も大きな目玉は、SVG 対応でしょう。SVG といえば、これまで IE 以外のメジャー・ブラウザーではすでにサポートされていたため、大きな
IE9のSVGサポート、固い路線 | エンタープライズ | マイコミジャーナル
Windows Internet Explorer 9 Microsoft、Senior Program Manager、Patrick Dengler氏がIEBlog : MIX - Microsoft, W3C and SVGにおいて3月15日から17日(米国時間)に開催されるMicrosoft MIX10で、SVGに関する発表をSVG: The Past, Present and Future of Vector Graphics for the Web :: Sessions :: Microsoft MIX10として実施すると伝えている。 Microsoftは1月5日(米国時間)、W3C SVGワーキンググループに参加の旨を申し込んだと発表。同社はどのバージョンのIEでSVGをサポートするのか、そもそもIEでSVGをサポートするのかどうかという明言をしていないものの、含みのある行
CSS3 「gradient」と「@font-face」
CSS3 「gradient」と 「ウェブフォント（@font-face）」 このページは背景画像を一切使用していません。 背景のストライプ模様はCSS3のbackground-image:gradient、フォントはCSS3の@font-faceでサーバー上に置いたフォントを読み込んで表示しています。これによって、閲覧者のパソコンにインストールされていないフォントも表示する事が出来ます。また、画像文字ではないのでコピーする事も可能。 SEOの一環としても有効です。 2010年1月現在、InternetExplorerとOperaではまだgradientに対応していない為、これらのブラウザでは背景は単色になります。フォントファイルはうっかり領収書５部ダメにできる筆圧を誇るふいさんの作った「まきばフォント」をお借りしています。 フォントの為のスタイル指定 @font-face { font
Is SVG support coming to Internet Explorer? | 456 Berea Street
In a post to the IEBlog, Patrick Dengler, Senior Program Manager of the Internet Explorer Team, announced that Microsoft Joins W3C SVG Working Group. He goes on to say that We’re excited to take part in ensuring future versions of the SVG spec will meet the needs of developers and end users. There is no specific mention of when—or even if—Internet Explorer will support SVG, but it seems strange to
SVGがWebに適している9つの理由 | エンタープライズ | マイコミジャーナル
SitePoint: New Articles, Fresh Thinking for Web Developers and Designers ベクターグラフィックを記述するための言語であるSVG 1.0は2001年にはすでにW3C勧告として公開されている。SVG 1.1も2003年にはW3C勧告になっている。SVGにはWebプラットフォームで利用するにあたってさまざまな利点があるが、最大シェアを確保しているIEがサポートしていないため、これまでそのポテンシャルほどにはWebブラウザからは活用されてこなかった。 しかし、この状況は大きく変わろうとしている。これまでSVGをサポートしてこなかったMicrosoftがSVGワーキンググループへの参加を発表。IE9でSVGがサポートされる公算が大きくなった。こうした状況を受けCraig Buckler氏がSitePointにおいて9 Reaso
iPhone 2.1のSafari、何が変わった？ - builder by ZDNet Japan
クラウドネイティブの実現 モダンインフラの構築・運用の課題解決へ コンテナの可能性を広げるVMware Tanzu ビジネスの推進には必須！ ZDNet×マイクロソフトが贈る特別企画 今、必要な戦略的セキュリティとガバナンス データ活用は次のステージへ トラディショナルからモダンへ進化するBI 未来への挑戦の成功はデータとともにある ものづくり現場の情報セキュリティ インダストリー4.0は製造業の変革期 工場のデジタル化によるリスクへの対応 ビジネスのためのデータ基盤構築 DX時代の企業成長はデータ活用が鍵 新たな展開を後押しするSQL Server活用 単純なインフラ製品の販売ではない DX、コンテナプラットフォームの実証など 自社の取り組みで得られた知見を顧客に提案 高まるゼロトラストの気運 妥協のない安全のために適材適所で組合せ トップ4社によるゼロトラストセキュリティ 特集：セキュ
Firefox 3をきっかけにHTMLの進化が再開する--私たちのFirefox 3 - builder by ZDNet Japan
ITインフラ運用からの解放 HCI＋JP1による統合運用による負荷激減で 次世代IT部門への役割変革へ一歩前進 データ活用は次のステージへ トラディショナルからモダンへ進化するBI 未来への挑戦の成功はデータとともにある サーバースペシャリストへの道 PCサポートとサーバ管理の共通項 ひとり情シスのためのスキル向上のコツ 特集：セキュリティトレンド-秋- つながる世界で問われる対応 サプライチェーンセキュリティを考える アプリケーションモダナイズ 求められている背景にあるビジネスの今 そして、成功の鍵を握るDevOpsの真の意味 激変するビジネス環境の中でのDX モダンアプリケーション戦略への取り組みが 市場の競争力の源泉となる EDRトップランナー対談：後編 セキュリティ戦略を転換せざる得ない背景と EDRのような手法が必要な理由に迫る 高まるゼロトラストの気運 妥協のない安全のために適
GoogleMapsが SVGをサポート？: Recently Ajax
コメント( 0 ) | トラックバック( 0 ) Googleグループによると、Googleマップは次のバージョンで、FirefoxやOpera向けに SVG画像を使った地図を提供するかもしれないとのことです。 SVG（Scalable Vector Graphics）というのは、Adobeなどが中心となって制定した画像フォーマットで、XMLを利用して画像を作ることができるという画期的な技術です。Flashのように拡大してもきれいな「ベクターグラフィック」で構成され、JavaScriptなどを使って画像をリアルタイムに編集することができます。これが実現すれば、非常に美しい地図を自由な縮尺で拡大縮小をすることもできるようになりますし、さまざまな加工を画像自体に施すこともできます。これは、実現すると非常に可能性が広がる話題で、わくわくしてきます。是非実現して欲しいですね。Scalable Ve
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
SVG LAYERS for Photoshop | Open SVG files as Editable Vector Layers
Tumblr
Tumblr
HugeDomains.com
Nissan LEAF Electric Car