Responsive web design basics | Articles | web.dev
Responsive web design basics Stay organized with collections Save and categorize content based on your preferences. As the number of mobile phone users on the internet increases, it has become more and more important for web designers to lay out content in ways that work well for a variety of screen sizes. Responsive web design, originally defined by Ethan Marcotte in A List Apart, is a design str
MongoDBの様なNoSQLに勢いがあるのは何故ですか？SQLと比べてどんな利点や欠点がありますか？ - Quora
回答 (3件中の1件目) ハイプサイクルという概念をGartnerグループが提唱してまして、様々な流行りスタリのサイクルを分析する標準的な方法となっています。 ハイプとは過度な期待や熱狂を意味する言葉です。一発屋芸人の人気のカーブみたいなもので、テツandトモみたいに安定する場合と、消えていくものがあります。芸人ではありませんがDA PUMPは一茶の人間性もありまして、次は厳しいけど定着すると思っています。 なんだかのトリガーで評価が上がり始め、ピークを迎える。その後評価が下がっていき、底を打つと少し上がって定着するという経過をたどるとしています。これと同じモデルで、流行りのハイテク...
線形代数の知識ゼロから始めて行列式「だけ」理解する - アジマティクス
この記事は、線形代数において重要な「行列式」の概念だけを、予備知識ゼロから最短距離で理解したい人のための都合のいい記事です。 そのため、わかっている人から見れば「大雑把すぎじゃね？」「アレの話するんだったらアレの話もしないとおかしくね？」という部分が少なくないかもですが、趣旨をご理解いただいた上でお付き合いください。明らかな間違いに関しては、ご指摘いただけますと助かります。 線形変換 ↑座標です。 座標を変形することを考えます。つまり、座標変換です。 座標変換にもいろいろあって、以下のようにグニュッと曲げたやつ も座標変換には違いありませんが、今回ここで考えるのは線形変換だけにします。線形変換とは大雑把に言えば「すべての直線を直線に保つ」「原点を動かさない」という条件を満たす変換です。 そういう変換には例として、伸ばしたり縮めたりの拡大・縮小（scale）、原点中心に回す回転（rotate
リレーショナルデータベースの仕組み (1/3) | POSTD
リレーショナルデータベースが話題に挙がるとき、私は何かが足りないと思わずにはいられません。データベースはあらゆるところで使われており、その種類も、小規模で便利なSQLiteからパワフルなTeradataまで様々です。しかし、それがどういう仕組みで機能しているかを説明したものとなると、その数はごくわずかではないでしょうか。例えば「リレーショナルデータベース 仕組み」などで検索してみてください。ヒット数の少なさを実感できると思います。さらにそれらの記事は短いものがほとんどです。逆に、近年流行している技術（ビッグデータ、NoSQL、JavaScriptなど）を検索した場合、それらの機能を詳しく説明した記事はたくさん見つかると思います。 リレーショナルデータベースは、もはや大学の授業や研究論文、専門書などでしか扱われないような古くて退屈な技術なのでしょうか？ 私は開発者として、理解していないものを
システムで「性別」の情報を扱う前に知っておくべきこと - Qiita
0は性別に関する情報が得られない場合に使います。性別に関する情報はあるのだけど1とも2とも言えない場合は9を使います。要は「0でもなくて1でも2でもなければ9」です。 これを知っていればMだとかFだとかを議論をせずに済みますね。 国際規格に従うべき理由 国際規格に従うことは色々と利点があります。まず、どうしてそういうコード体系にしたのかを説明しやすいです。また多言語対応する際も規格通りに書けば伝わるはずなので迷わずに済みます。別システムへのデータの移行や、異なるシステム間でのデータの統合もコード体系が同じならラクラクです。もしかしたら別のプロジェクトで書いたコードをそのまま使いまわせるかもしれません。技術者に対するトレーニングも不要です。 対して、わざわざ国際規格に反する実装をする場合は上記のメリットがそのままひっくり返ってデメリットになりはしますが、もちろん、それなりの理由があれば規格と
文字列アルゴリズムの学びかた - Hatena Developer Blog
こんにちは！はてなアプリケーションエンジニアの id:takuya-a です。 みなさんは、このような疑問をもったことはありませんか？ grep はどのように文字列を検索しているのか？ MeCab はどうやって辞書を高速にルックアップしているのか？ パーサやコンパイラを作りたいけど、何から始めればいいのか？ 本稿では、「文字列アルゴリズムとはどんなものなのか？」「なぜ重要なのか？」「何を知っておくべきか？」「どうやって勉強すればいいのか？」といった疑問にお答えしていこうと思います。 文字列アルゴリズムの意外な応用や、モチベーションを保ちやすい勉強のしかた、文字列アルゴリズムを勉強するために行った社内での取り組み、実装するときのコツといったトピックについても触れています。 このエントリは、はてなエンジニアアドベントカレンダー2016の22日目の記事です。昨日は id:syou6162 さんに
CSS3アニメーションでつくるインターフェイス表現 記事一覧 | gihyo.jp
運営元のロゴ Copyright © 2007-2024 All Rights Reserved by Gijutsu-Hyoron Co., Ltd. ページ内容の全部あるいは一部を無断で利用することを禁止します。個別にライセンスが設定されている記事等はそのライセンスに従います。
MITライセンスを1行1行読んでいく | POSTD
全てのプログラマが理解すべき171語の文章 MITライセンス は、最も有名なオープンソースソフトウェアのライセンスです。この記事では、その内容を一行一行読んでいきます。 ライセンスを読む オープンソースソフトウェアを利用しているものの、これまでライセンス全文（原文：171語）を読む機会がなかった方は、大した量ではないので、今すぐ読んでください。あなたにとってライセンスが身近なものでないなら尚更です。理解できない箇所などがあれば、その部分は心に留めておき、明確にするようにしてください。これから背景や解説とともに、全文を分割して順番に紹介していきますが、大事なことは全容を頭に入れておくことです。 MITライセンス（MIT） Copyright (c) <年> <著作権保持者> 本ソフトウェアおよび関連文書ファイル（以下「ソフトウェア」）のコピーを入手する全ての人に対し、それらに関する無償のライ
大量接続に耐えるWebSocketアプリケーションサーバ構築のコツ - pixiv inside [archive]
WebSocketの扱うサービスでは、長時間のコネクション、再接続処理、プロキシ、ロードバランサなど、インフラの面で多くの問題を抱えがちです。弊社のサービス「pixiv」の9周年企画でも、この問題に直面しました。 実際にそこで構築したインフラの事例をもとに、本運用に使えるWebSocketサーバの構成について、pixivインフラ部の南川からご紹介します。 * 9周年企画 “黒歴史”をロケットで宇宙に飛ばす pixiv黒歴史 そもそも WebSocket とは？ WebSocketはTCP上で動く双方向通信のための通信規格です。 Webページの読み込みで行われているような、クライアントがサーバにデータを要求し、サーバはクライアントにレスポンスを返すというHTTPの通信ルールとは違います。サーバと長時間コネクションを確立し、Socketのようにデータのやり取りを行います。そして、コネクションを
![大量接続に耐えるWebSocketアプリケーションサーバ構築のコツ - pixiv inside [archive]](https://cdn-ak-scissors.b.st-hatena.com/image/square/95f08ea3414673bb0131022fbc9dc354bb7483ba/height=288;version=1;width=512/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fd%2Fdevpixiv%2F20161129%2F20161129204837.png)
するするさせたい：サイボウズ採用情報のアニメーション（その1） - fragmentary
サイボウズの採用情報ページを見ていた。 サイボウズ | 採用情報（新卒・キャリア） といっても受けるとかではなく、ただ性格悪いことを思っていただけなんだけど。 Kintoneのセクションでアプリっぽいアイコンたちが右から左へと流れているんだけど、それがガタガタとしている。するするしていない。するするさせたい。 というわけで、何が起こっているのかを調べてみようかと。何回かにわけて書くよ。 その1 ― 何が起こっているのか調べる その2 ― 調べながら直しながらするするさせる その3 ― ちょっとしたことや他のブラウザでもするするさせる アニメーションの実装を調べる あとのことを考えて、Chrome DevToolsを使う。 まず、該当の流れるアイコンのところで右クリックしてinspectする。Elementsパネルで、<div class="icon"> という要素がハイライトされる。div
How to work with SVG icons
There are many ways to use SVG icons in HTML and CSS, and I haven’t tried them all. This is how we do it in our small front-end team at Kaliop. It works well for our needs, which include: Content and communication websites, often based on big CMSes, rather than full-JS web apps. Icons which are often simple, single-color icons (each potentially used in several different colors depending on context
Infinite scroll search-friendly recommendations
accessibility 10 advanced 195 AMP 13 Android 2 API 7 apps 7 autocomplete 2 beginner 173 CAPTCHA 1 Chrome 2 cms 1 crawling and indexing 158 encryption 3 events 51 feedback and communication 83 forums 5 general tips 90 geotargeting 1 Google Assistant 3 Google I/O 3 Google Images 3 Google News 2 hacked sites 12 hangout 2 hreflang 3 https 5 images 12 intermediate 205 interstitials 1 javascript 8 job s
シンプルなHTMLとCSSコピペで実装できるタイトル（見出し）のデザインサンプル 50 | NxWorld
画像は使用せずにCSSだけでスタイリングしたタイトル（見出し）のデザインサンプルで、似たようなものやちょっとCSS追記した程度のものも多いですが全50種類です。 全体的にすごく手間がかかっているようなものはないのですが、似たようなタイトルデザインを使う場合はCSSコピペで実装できると思います。 また、一部複数行に向かないものもありますが、基本的には複数行のタイトルでも見栄えが崩れない感じのものになっており、余白やカラーなどを調整することでデザインを変更するのも容易です。 以下で紹介している内容は一部異なるものもありますが、基本的に下記のようなシンプルなHTMLを使用しています。 ただ、一部異なるものといってもいずれもspan要素を1つ追記する程度です。
AMP HTML Specification
AMP HTML is a subset of HTML for authoring content pages such as news articles in a way that guarantees certain baseline performance characteristics. Being a subset of HTML, it puts some restrictions on the full set of tags and functionality available through HTML but it does not require the development of new rendering engines: existing user agents can render AMP HTML just like all other HTML. If
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
The home of good stories
PageSpeed Insights
https://developers.google.com/web/tools/setup/workspace/setup-devtools