Web開発およびITの世界からの興味深い資料のダイジェスト、先週第203号（2016年3月14〜20日）

役立つリソース、興味深い資料、ITニュースへのリンクを含むセレクションをご紹介します

ウェブ開発

CSS

Javascript

ブラウザ

設計

ニュース

おもしろい

ウェブ開発

• ポッドキャストWeb標準、問題7
• 12月のモスクワWeb標準日会議の22本のビデオ
• 3つの主要なブラウザが低レベルのバイナリ形式WebAssemblyのサポートを追加しました
• オフラインのWebアプリケーション。 ServiceWorkerとCacheStorage
• Google：サイトの技術的側面を操作するだけでは、トップに達するには不十分です
• 私は頭が良くありません 。 あなたよりも長く座っただけです-グラハム・フルトンの物語 。
• SVGでプロフェッショナルなアニメーションを作成するための可能な方法 （ SVGでプロフェッショナルなアニメーションを作成するための可能な方法は次のとおりです）
• Chrome DevToolsエコシステムの素晴らしいツールとリソース
• Addy Osmani Issue Digest先週： Service Workerのデバッグ、3GでのRAIL、オフライン分析、プログレッシブWebアプリ、ロールアップなど
• いくつかの質問に対するGoogle開発者の反応：Paul Lewis：「 パフォーマンスに関する質問への回答 」、Matt Gaunt： Web開発はバランスのとれた行為です
• パフォーマンスの最適化：
  
  • モバイルデバイスのパフォーマンス最適化の管理（モバイルパフォーマンス最適化の管理）
  • YSlowスコアを改善する方法
  • link rel = 'preload'を使用してリソースに優先順位を付けます
  
  
• Webコンポーネントについて
• レスポンシブWebコンポーネントを今すぐ使用する方法
• 静的サイトジェネレーターを使用する7つの理由（静的サイトジェネレーターを使用する7つの理由）
• 静的サイトジェネレーターを使用しない7つの理由
• rel = noopenerについて（ rel = noopenerについて）
• how2：ターミナルのスタックオーバーフロー （how2：ターミナルからのスタックオーバーフロー）
• GoogleによるMaterial Design Liteの実用的な紹介
• 最新のMarkoテンプレートエンジンからの新しいアイテム （Marko v3の新機能）
• WebStorm 2016.1の新機能のビデオレビュー ：ECMAScript 6およびTypeScriptのサポートの改善、CSSカスタムプロパティ、Angular 2、非同期クライアント側のデバッグ、JSONスキーマなど
• 壮大なウェブ：
  
  • CSS / SVG / JS＃29の美しいエフェクトの毎週の編集
  • CSS / SVGを使用した入力フィールドのアクティブな強調表示のフローの概念
  • ブーム、ワム、パウ！ SVGフィルターを使用したコミックの感情的なタイポグラフィの作成
  • SVGでアニメーションインタラクティブドラムキットを作成する方法
  • WebGLおよびThree.jsで3Dエンジンを使用したレコードボックスの印象的な実装。
  
  

CSS

• CSS変数：なぜ必要なのですか？ 。 CSS変数：なぜ気にする必要があるのですか？ frontender.infoで
• アンロードされたイメージを設計します 。 css-live.ruの 壊れた画像のスタイリングの記事の翻訳
• Jonathan Snookのブログでのwill-changeプロパティと現在のブラウザーサポートのCSSの説明
• 2016年のレスポンシブグリッドの作成 （ 2016年のレスポンシブグリッドの設計）
• フォント：
  
  • Webフォントのアンチパターン：データURI 。 Webフォントアンチパターンの翻訳：データURIの記事
  • 擬似要素とアイコンフォントを使用したアイコン合字（擬似要素とアイコンフォントによる合字アイコン）
  • Webタイポグラフィが壊れています。 そして、ここにそれを修正する方法があります。 （Webタイポグラフィが壊れています。修正方法は次のとおりです）
  • Zeplinでのテキストスタイルの定義（Zeplinでのテキストスタイルの定義）
  
  
• CSS Flexboxは完全に論理的です（ほぼ））
• CSSメソドロジとクラスバインディングの世界における、上品な世界でのユーザー生成コンテンツ
• Jen Simmons Experimental Lab ：CSSレイアウトを使用したクールなデモ
• CSSの除外とグリッドレイアウト
• メディアクエリの管理のヒント
• PX、EM、またはREMメディアクエリ？
• あなたが本当に聞いたことがないかもしれない高度なCSSセレクター-そしてもし持っているなら、あなたはそれらを使用していないかもしれません）
• 嫌がらないCSSの 8つのヒント（嫌がらないCSSを書くための8つのヒント）
• About：not and Specificity （オン：not and Specificity）
• HTML5検証でフローティング入力ラベルを作成する方法
• 表現力豊かなCSSによるコンテンツと表示パターン
• 純粋なCSSテクスチャを持つグラデーション （ 純粋なCSSのテクスチャグラデーション）
• Aleut.css - SEMの静的フレームワーク、BEM、OOCSSのアイデア、およびパフォーマンスとスケーリングに焦点を当てたもの
• grd - Flexbox上のコンパクトなCSSグリッドフレームワーク
• CSSの結果（究極のCSS調査の結果）

Javascript

• タイプスクリプトのデコレータ：複雑さに対する武器または無用のwhi？
• RadioJsポッドキャスト、問題37： semver、node.jsの魅力の秘密、フロントエンドがビジネススーツに合うかどうか、WebKitに参入するためにカスタムエレメントが行った5つの衝撃的なアクションなど
• Javascript Javascript疲労の深い根
• 純粋なJavaScriptでモジュールを書く理由（プレーンなJavaScriptモジュールを書く理由）
• JavaScriptは機能不全のプログラミング言語です
• React、ES6およびES7のJavaScriptで JavaScriptのthisキーワードをバインドする6つの方法
• JavaScriptで文字列を逆にする3つの方法
• Ebay開発者ブログ注：JavaScriptへの道Next
• Hacker NewsのJavaScriptコードスニペットの解析 （The Hacker NewsのJavaScriptの単一部分）
• jQueryの遅延オブジェクトの紹介
• クイックヒント：nvmを使用してNode.jsの複数のバージョンをインストールする
• 未来のテストランナーエンジン （ava-未来のテストランナー）
• すべてのJSライブラリはTypeScriptで作成する必要があります
• 新しいSeifプロジェクトに関するDouglas Crockford （Douglas Crockford：The Seif Project）
• Netflix UIエンジニアリングチャンネルの新しいビデオ： TVインターフェイス用のReact.js 、 Netflix JavaScriptトーク-RxJSバージョン5
• ES6 / 7：
  
  • 矢印関数とバインド（）
  • es6features.com：ES6の主な機能の調査 （上位ES6機能の調査 ）
  • 提案されているJavaScript機能のES7としての参照を停止してください
  
  
• フレームワーク
  
  • Reactを使用したSVGアイコンシステムの作成（Reactを使用したSVGアイコンシステムの作成）
  • バックボーンエコシステムの悲しい状態 （ バックボーンエコシステムの悲しい状態 ）
  • Reactでレベルアップ：React Router
  • 実稼働環境でのReact RouterおよびWebpack
  • 新しいNPMはReact JavaScriptの開発を簡素化します
  • React、Redux、およびd3を使用したアニメーション（ React、Redux、およびd3を使用したアニメーション）
  • Angular 2とHTML5アプリの未来
  • 見て 、サーバーなし：Angular 2 MockBackendでアプリを開発する
  • FirebaseおよびAngularで非同期データを操作する方法 （ FirebaseおよびAngularで非同期データをマスターする-Firecasts＃5）
  
  
• プラグイン
  
  • Force.js-バニラJSでのスムーズなスクロールとページアニメーション（ただしjQueryのサポート付き）
  • JsSpeechRecognizer-単語を認識するためのライブラリ
  • calendar-heatmap -GitHubコミットの形式のデータで期間を表すヒートマップを作成します
  • Substance -WYSIWYG Webコンテンツ編集ライブラリ
  
  

ブラウザ

• Firefox 46-betaおよびFirefox Developer Edition 47のテスト
• Developer Edition 47-ユーザーエージェントエミュレーション、ポップアップデバッグなど
• Chromium 49およびOpera 36の新機能
• Chrome for Androidのタブはデフォルトで再構築されました
• V8バージョン5.0 （V8リリース5.0）
• Mozillaは、新世代のブラウザエンジンServoの立ち上げを準備しています
• Microsoft Edgeブラウザ用に最初の3つの拡張機能が登場しました

興味深いデザインと機能を備えたサイト

• 宇宙探査でのインタラクティブなWebインストール。
• printbysomerset.com- 「段ボールデザイン」とフォト​​リアリスティックなスプライトアニメーションを備えたコンセプトサイト
• nuuneoi.com-古い8ビットゲームのスタイルで実装されたクールなポートフォリオ
• 高品質の視差効果を備えた垂直スクロールサイト
• thedabney.com-ミニマルなデザインと興味深い遷移効果を備えたスクロールサイト
• Webデザイン代理店の印象的なWebサイト （40 Impressive Design Agency Websites）

設計

• Githubを使用して設計でコラボレーションする方法
• Lebedev Studioは、完璧にループした牛のあるジュエリー工場のワークフローを示しています
• Bootstrapeの各サイトのデザイン （Hey Look、It's Every Bootstrap Website Ever）
• 均質設計の防衛
• デザイナーとして学んだ8つの非直感的なレッスン （ デザイナーになるための8つの非直感的なレッスン ）
• 子供たちがあなたのアイデアを提示したらどうなりますか？ （子供たちがあなたのアイデアを提示したらどうなりますか？）
• デザインにおけるゲーミフィケーションの6つの刺激的な例
• ラテン文字と数字のグラフィック解釈のコレクション （レターキット）
• Mackey Saturday-Instagramロゴを作成したデザイナー （Mackey Saturday）
• ツールとグラフィックエディター：
  
  • Sketchの10の非常に特別で便利なトリック
  • 最高のデザイナーツールのコレクション
  • Silver Flowsによるプロトタイプ作成機能のスケッチ
  • ロシア語の初心者および専門家向けの6つの必須Photoshopブック
  • Sketchのグローバルカラー置換（ Sketchのグローバルカラー置換）
  • フレーマーとスケッチ：カスタマイズされたプロセス （フレーマーとスケッチ：意図的なワークフロー）
  • サイトとWebデザイナーのポートフォリオを再起動するメイデイリロード
  • AdobeがExperience Design CCをリリース （AdobeはExperience Design CCを開始）
  • Adobe Experience Design CC（Project Comet）のプレビューリリース
  • Adobe Experience Designの第一印象
  • Adobe XD（または「Comet Project」）とは何ですか、なぜそれが必要なのですか？ （Adobe XD（または「プロジェクト彗星」）とは何ですか？そして、気をつけるべきですか？）
  • Affinity for Windows （AffinityはWindowsに近づいています）は近日公開予定
  
  
• タイポグラフィ：
  
  • クールなキネティックタイポグラフィ
  • システムフォントは美しくなります。 Webフォントは、素晴らしいタイポグラフィの要件ではありません。
  
  
• UX / UI：
  
  • すべてのUXエキスパートのメインツール
  • UXの用語 （ユーザーエクスペリエンスデザインおよび研究用語 ）
  • UXDおよび専門用語研究 （ユーザーエクスペリエンスデザインおよび研究専門用語 ）
  • UIデザインの明暗。 選択の質問 （UIデザインの光と闇。選択の問題。）
  • WebサイトのUXを測定する7つの方法
  
  
• 教訓：
  
  • SketchのiOSアプリ設計に関する詳細なチュートリアル：パート3/3
  • SketchのCraftでテキストを塗りつぶす
  • Adobe Photoshopでの肌の色の調整
  • Adobe Photoshopでの表示を改善する新しい空
  • Adobe Illustratorの明るいプラスチックテキスト
  • Adobe Illustratorで灯台を作成（ Adobe Illustratorで灯台を作成）
  • Adobe Photoshopでリアルなスキンをペイントする方法
  • Adobe IllustratorとPhotoshopでビンテージ旅行ポスターをデザインする方法
  
  

無料のデザイナーCookieのセレクション

• 動物についての設計のための無料ベクトル
• 名刺のデザインを示すためのモックアップ（130+無料の名刺モックアップPSDテンプレート）
• 最高のUIキット （145以上の最高の無料UIキット）
• クレジットカードアイコンのコレクション（クレジットカードアイコン（無料ベクトル）のコレクション）
• Adobe Illustrator用の彫刻ブラシのセット （ Adobe Illustrator用の 25の無料のLinocut＆Woodcut Brushes）
• イラストレーターブラシセット（20種類の高品質の無料イラストレーターブラシセット）
• 水彩画のプリント付きブラシセット（熟練したデジタルアーティスト向けの25の無料水彩ブラシセット）
• Avital Mobile UI Kit（Avital Mobile UI Kit）
• ハロゲン-サンセリフ産業用フォント （ハロゲン-無料の産業用フォントをダウンロード）
• 宇宙と天文学をテーマにしたアイコンのセット（AI、スケッチ、SVG、PNG） （景品：天文学と宇宙のアイコン（AI、スケッチ、SVG、PNG））
• ユーザーアバターのアイコンセット （ ユーザーアバターの 16の無料ベクトルアイコン）
• フラットライングラフィックデザインツールアイコンセットグラフィックデザインツールのテーマのフラットデザインアイコンの景品セット
• コーヒーアイコンのセット（EPS、PNG、SVG） （景品：バリスタとコーヒー愛好家のアイコンセット（50アイコン、EPS、PNG、SVG））
• あなたのデザインの新鮮な無料アイコン。

ニュース

• Twitter： アルゴリズムニュースフィードがデフォルトでアクティブになり 、Windows用TweetDeckアプリケーションが終了し 、 ツイートの文字数を増やす意図に反論
• YoutubeがAcceleratorを開始-キャッシュされたビデオを即座に表示する機能
• アルファベットは、ボストンダイナミクスが今後数年間で商用製品を作成できないため、ボストンダイナミクスを販売する予定です。
• Googleは100の最も人気のある安全なWebリソースを挙げました
• Googleがスマートフォン向けUserAgent検索ロボットの変更を発表
• スタンフォードの科学者は、あなたの表情を他の人に伝えるプログラムを作成しました
• 起こった！ MicrosoftはLumiaをWindows 10 Mobileに更新し始めました
• メディア：Uberはダイムラー10万メルセデスSクラスを注文しました
• SoundCloudは、世界最大の出版社であるSony Musicと提携しています
• 音声合成装置はウィキペディア用に開発されます

おもしろい

• BBC、KIA、および人工知能におけるユニリーバの経験
• 誰もが量子を行うことができます
• 副業界：セックス、ドラッグ、ロックンロールが新しいビッグテクノロジー企業を生み出す方法
• 悪いビットコイン、一言で言えば
• 3人の開発者のうち2人が独立してプログラミングを学んだ-Stack Overflowの調査
• ThemeForestに行ってWebサイトテンプレートで収益を上げた方法
• Windows 10バージョンについて-Threshold1、Threshold2、Redstoneとは
• コンピューターは「酔った」ツイートを計算することを学びました
• 誰がフィールドを押していない 。 フェルマーの大定理に関する10の楽しくて有益な物語
• Quantum ABC：「コンピューター」 。 量子コンピューターの強みは何ですか？通常のコンピューターに取って代わることができますか？
• キーパー：ガジェットはすでに私たちについて何を知っていますか？
• 最も野心的な「トリック」匿名
• Apple対FBI：報復2
• スティーブウォズニアックは、AppleのFBIとの対立について話しました
• 「ニューラルネットワークでは、ゲームのルールを説明できません。彼女自身がルールを学習します」人工知能「Yandex」の開発者とのインタビューAlexander Krainov
• Office Shackles：人々が本当に自分の仕事を嫌う理由
• Googleバニラメトロノーム

入力ミスやリンクの破損/重複をおaびします。 あなたが問題に気づいた場合-個人的なメールに書いてください、私たちはすぐにそれらを修正しようとします。

先週のダイジェスト 。
dersmollとalekskorovinが作成した資料。