個人開発の一環でWebデザインのモーションのアイデアを集めたサイトを作りました。掲載されているコードは自由にお使いいただけます。 このサイトのコンセプトやどのような作りになっているのか紹介します。 サイト概要 Webデザインにおける様々な動きに注目して、そのプリミティブな要素を紹介したサイトです。個々の作例には実装コードを掲載していて、コピペで利用することもできます。内容もよく紹介されているような基礎的なものは少なく、少し改造すれば使えるような実践的なものを紹介しています。そのためHTML・CSS・JavaScriptの基本を理解している前提のレベル感になっています。 そのほかWebの動きに関するコラムやTips的な読み物もあります。 使用技術 各使用技術についてそれぞれ説明していきます。 レンダリング戦略 サイトの性質として、そう頻繁な更新やリアルタイム性が求められるものではないのでSS
長い記事なので先に結論を書きます。 Spectre の登場で、ウェブサイトに必要とされるセキュリティ要件は増えました。具体的に必要な対策は下記の通りです。 すべてのリソースは Cross-Origin-Resource-Policy ヘッダーを使って cross-origin なドキュメントへの読み込みを制御する。 HTML ドキュメントには X-Frame-Options ヘッダーもしくは Content-Security-Policy (CSP) ヘッダーの frame-ancestors ディレクティブを追加して、cross-origin なページへの iframe による埋め込みを制御する。 HTML ドキュメントには Cross-Origin-Opener-Policy ヘッダーを追加して popup ウィンドウとして開かれた場合の cross-origin なページとのコミュニ
見ているサイト上に露出している機密情報(APIトークン、IPアドレスなど)を見つけるブラウザ拡張を作りました SecretlintというAPIトークンなどの機密情報がファイル内に含まれているかをチェックできるツールを書いています。 Secretlintはコマンドラインツールとして動くので、主にCIやGitのpre-commit hookを利用して、リポジトリに機密情報が入るのを防止できます。 SecretlintでAPIトークンや秘密鍵などのコミットを防止する | Web Scratch 一方で、実際のウェブサービスなどは機密情報がファイルにハードコードされているわけではなく(Secrelint自体がこういうハードコードを防ぐツールです)、環境変数やDatabaseに保存していると思います。 このような場合にも、コードのミスなどによって公開するべきではない情報(秘密鍵、APIトークン、Sl
コロナ禍への現状での最大の対抗策、ワクチン接種に関する誤解の広がりが大きな問題になっています｡ コロナウイルスやワクチンに関する誤解は、通常の人間関係での口コミなど様々な経路で伝わるでしょうが､ネットが主な経路というケースも少なくないでしょう。 どのような人々がワクチン接種をしたがらないか独立行政法人経済産業研究所が2021年4月に調査したデータがあります。 [PDF]どういう人々が新型コロナウイルスのワクチンを接種したがらないか：インターネット調査における検証 この調査によると「インターネットの検索エンジン」を新型コロナウイルスの情報源として最も重視している人はテレビの次に多く、そして比較的接種を忌避する傾向が強いことが明らかになっています。 実際に、様々なデータで、非常に多くのコロナ関連の検索が行われていることがわかります。 これはGoogle トレンドでの[コロナ][コロナウイルス]
Author: Andrey Sitnik, Author of PostCSS and Autoprefixer, Principal Frontend EngineerTopic: CSSPrefer SVG over PNG, trust browsers to downscale, drop obscure formats—the ultimate, exhaustive guide to favicons for modern web. Includes steps for static HTML and Webpack. It's time to rethink how we cook a set of favicons for modern browsers and stop the icon generator madness. Frontend developers cu
「Web系の最新情報を知りたいけど、日々業務が忙しくて追いかけられない」という方のために、1ヶ月のWeb系ニュースの中で「これだけは押さえておきたい」というものを1つの記事にまとめています。 Webデザイン なぜ優秀なデザイナーでも酷いデザインを生み出してしまうのか？ 事前に十分なインプットが得られていない、全体のUXよりも見た目のデザインを優先してしまう など、酷いデザインが生まれる原因について書かれています。 ウェブ制作に活かすユニバーサルデザインの視点 – PRESS.mjmj ふさわしい配色とアクセシビリティなどについて。 フォント・ロゴ・GUI・ハードウェアをトレースして学ぶ｜Seiji Miyazawa｜note ワーナーブラザーズのロゴ、ガイド左側が合ってないですし黄金比とは言えない気がしますが、黄金比と言わないと偉い人が納得しないのですかね…？ 文字のデザインが苦手なので、
プライバシーとセキュリティのシリーズ第五弾です。 今回のプライバシーとセキュリティシリーズでお話する内容は、まず真のVPNとは何か？について掘り下げ、ウェブプロキシやブラウザのVPNの匿名化について説明し、VPNサービスでは何を期待すべきなのかを解説します。 通常、ブラウザとウェブサイトの接続は、ブラウザからコンピュータを経由して、WiFiもしくはホームネットワーク(ある場合)へ通じ、さらにホームネットワークからISP(インターネットサービスプロバイダ)、ISPからお住まいの国の国内インターネット事業者へ、そこからウェブサイトのある国のインターネット事業者へ、そこからウェブサイトのホスティングプロバイダーへ、そしてそのウェブサイトへ… と言った具合に、沢山のステップがあります！実際に、あなたとウェブサイトの所在によっては、途中で他の国を通過することもあります。 安全でない接続では、プライバ
Reinvent the experience, not the wheel Today, we’re launching U.S. Web Design System 2.0 (USWDS 2.0), a new foundation for the future of our design system. This new version was designed to make it easier for any project to integrate USWDS and use it to support your mission and the needs of your audience. USWDS is a library of code, tools, and guidance to help government teams design and build fast
TwitterのタイムラインにW3C Strategic Highlights - October 2018へのリンクが流れてきて知ったのですが、このW3CのレポートのIntroductionに（strong要素で）、 we believe that having two distinct HTML and DOM specs claiming to be normative is generally harmful for the community. とあって、（周知のとおり）HTMLとDOMの仕様書がWHATWGとW3Cという2つの団体から別々に発行されているという状態は、有害であるとW3Cが明言するに至ったと。ここまで長かったですね…（ざっくり見た感じでは、May 2018バージョンのレポートでは、この文言は見当たらない）。 これに関連して、上記のW3Cレポートからリンクされている
まえがき W3C（とWHATWG）からの公式なアナウンスはまだ確認していませんが、何度目かに結成されるW3C HTML WorkingのDraft Charterと、このCharterから辿れるDRAFT Memorandum of Understanding Between W3C and WHATWG（Memorandumは日本語で覚書などと訳されるので、ここでも覚書と呼びます）がブログエントリーのタイトルのソースになります。もっとも、今確認できる覚書もドラフトですから、変更があるかもしれません。しかしながらURLで観測できるわけですから、大筋でW3CとWHATWGとの間で合意が取れているのではないかと推測します。あとは、覚書だけでなくCharterもドラフトということになっていますが、以下の文章では面倒なので省略します。最後にお約束ですが、このブログエントリーは「だいたいあってる」感
Shared content - Storj
In addition to building a great browser and dependable web platform for Windows, we’re passionate about empowering developers to build great websites. With that goal in mind, we launched modern.IE in 2013 featuring a static scan tool to detect optimizations for old versions of IE, outdated libraries, missing prefixes, and more. The web has moved on since then, and it’s time to update our tools acc
An official website of the United States government Here’s how you know The .gov means it’s official. Federal government websites often end in .gov or .mil. Before sharing sensitive information, make sure you’re on a federal government site. The site is secure. The https:// ensures that you are connecting to the official website and that any information you provide is encrypted and transmitted sec
さよならレガシーエンコーディング。 文字エンコーディング宣言が存在するかどうかにかかわらず、文書のエンコードに使用される実際の文字エンコーディングはUTF-8でなければならない。 4.2.5.5 文書の文字エンコーディングを指定する - HTML Standard 日本語訳 Require utf-8 when specifying character encoding by sideshowbarker · Pull Request #3091 · whatwg/htmlにより、HTMLで使用できるエンコーディングはUTF-8のみとなりました。これにより、古いHTMLでは許容されていた、Shift_JIS、ISO-2022-JP、EUC-JP、UTF16LEといった文字エンコーディングは適合するHTMLではなくなりました。すでにNu Html CheckerでUTF-8以外の文字エンコー
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
