Introducing Content Security Policy - MDC Doc Center
HTTP ガイド リソースと URI ウェブ上のリソースの識別 データ URL MIME タイプ入門 よくある MIME タイプ www 付きと www なしの URL の選択 HTTP ガイド HTTP の基本 HTTP の概要 HTTP の進化 HTTP メッセージ 典型的な HTTP セッション HTTP/1.x のコネクション管理 プロトコルのアップグレードの仕組み HTTP セキュリティ Content Security Policy (CSP) HTTP Strict Transport Security (HSTS) X-Content-Type-Options X-Frame-Options X-XSS-Protection サイトの安全化 HTTP Observatory HTTP アクセス制御 (CORS) HTTP 認証 HTTP キャッシュ HTTP の圧縮 HTT
「Socket.IO は必要か?」または「WebSocket は通るのか?」問題について 2016 年版 | blog.jxck.io
Intro 「Socket.IO 使ったほうがいいですか?」 という主旨の質問をもらった。 これは、 WebSocket が繋がらない環境に向けて、フォールバック機能を有する Socket.IO にしておいた方が良いのかという意味である。 WebSocket が出てきた当初と比べて、 Web を取り巻く状況は変わったが、変わってないところもある。 念のためと Socket.IO を使うのもよいが、「本当に必要なのか」を問うのは重要である。 Rails も ActionCable で WebSocket に対応し、ユーザも増えるかもしれないことも踏まえ、 ここで、もう一度現状について、把握している範囲で解説しておく。 "繋がらない" とは 最初に、なぜ 繋がらない ことがあるのかを、きちんと把握したい。 まず WebSocket の有史全体をみれば、繋がらないとして語られていた現象は、大きく
業務でWebサービス開発をする際に気をつけたいこと（新卒向け） - Qiita
趣味でも業務でも日々Webサービスを開発しているzaruです。こんにちは。ついにアドベントカレンダーも最終日です。まだサンタとしての仕事が残っています。さて今回は仕事としてWebサービスを開発するときに気をつけたいポイントを紹介します。まぁ仕事に限った話じゃないですが…参考になれば幸いです。特に新卒プログラマあたりに読んでもらえればと思います😀 なお僕の業務上インフラ周りはAWSが多いです。 RASISという指標 RASISという指標があります。コンピュータシステムの評価指標5つの頭文字を取ったものです。 Reliability（信頼性） Availability（可用性） Serviceability（保守性） Integrity（保全性） Security（機密性） 今回はこの5つの指標に沿ってポイントを紹介していきます。RASIS自体については色々なところで解説されていると思うので
そのデザインには理由がある！デザインの原則をWebデザインにどのように取り入れるのかのチュートリアル
デザインの原則をWebデザインにどのように取り入れるのか、それを言葉に表すのはなかなか難しいことです。デザインの原則を理解して手を動かす、またクライアントにデザインの説明を行うといったこともあるでしょう。 デザインにはなぜそうなるのかという理由があります。 実際のWebページのデザインを元に、デザインで大切な原則とそれらをWebデザインにどのように取り入れるのかを紹介します。 7 Undeniable Design Principles You Can't Ignore 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。 photoshopvip.netというブログにも同記事の翻訳がありますが、あちらは無断翻訳・画像の使用も無断であると、元記事の作者から連絡を受けています。 使用するデザイン 1. Hierarchy -階層 2. Rep
Webアプリをあっという間にカッコよく！ BootstrapによるレスポンシブWebレイアウト
筆者は、このような画面を頻繁に目にします。なぜなら、デザインに疎い筆者自身がWebアプリを開発すると、このようなシンプルな画面がたくさん出来上がるからです。 そもそも業務アプリケーションでは、業務で取り扱う数多くの情報を、データベースや他システムなどから取得し、アプリケーション内でそれらの情報を、安全かつ正確に処理するためのコーディングを行う必要があります。開発規模が大きくなれば、再利用性の高い設計になるようさまざまな知恵を使う必要がありますし、取り扱う情報には機密性の高いものも含まれるため、セキュリティなどにも細心の注意を払う必要があります。そのため、どうしてもビジネスロジックの開発に注力しがちで、画面デザインやレイアウトなどのフロントエンド開発は、ついつい後回しになってしまいます。 しかしながら、Webアプリの操作性は、システムの顧客満足度を左右する重要なポイントになります。また、パソ
コミュニティサービスの本質ってどこにある？――はてな・元CTO伊藤直也氏がゲストの「ゲーマーはもっと経営者を目指すべき！」第8回
コミュニティサービスの本質ってどこにある？――はてな・元CTO伊藤直也氏がゲストの「ゲーマーはもっと経営者を目指すべき！」第8回 副編集長：TAITAI カメラマン：田井中純平 1234→ 連載第8回めとなる，ドワンゴ・川上量生氏との対談企画「ゲーマーはもっと経営者を目指すべき！」。今回は，はてな・元CTO（最高技術責任者）の伊藤直也氏がゲストとして登場。最近，氏が廃人と呼べるほどハマっているという「ドラゴンクエストX 目覚めし五つの種族 オンライン」についてや，成功するWebサービスの話などを，いつも通りの座談会形式でお送りします。 伊藤直也氏と言えば，niftyの「ココログ」やはてなの「はてなブックマーク」など，国内有数のCGMサービスを手かげてきた人物。今年の3月にグリーを退職し，現在はフリーとなっている伊藤氏ですが，氏の視点から見る日本のIT業界，氏の考える「コミュニティサービスの
モバイル対応Webアプリケーションのキャッシュ戦略
近年、モバイルブラウザ上でアプリケーションを作るにあたり、JavaScriptでも不安定な回線上で動作する設計が求められるようになってきました。 ここでは、「オフラインファースト」をはじめとする、モバイルなどの回線が不安定な状況を想定したWebアプリケーション設計に関して、キャッシュ方法やよく使われるAPIなどを紹介したいと思います。 「オフラインファースト」とは2012年ごろから提唱されていた、「回線がオフラインになることを前提にアプリケーションの設計を行う思想」のことで、オフライン前提に設計することにより回線状況によらないサービス提供や、効率的な通信をベースにした高速な動作を目指すものです。 それではここからはキャッシュ方法とそれぞれ向いているコンテンツの紹介を行います。 読み込みデータのキャッシュ ApplicationCacheやlocalStorage、オンメモリキャッシュなどを
WebページをRetina対応させるテクニック～実践編
WebページをRetina対応させるテクニック～実践編：jQuery×HTML5×CSS3を真面目に勉強（5）（1/3 ページ） 前回のWebにおけるピクセルの基本的な話を踏まえ、今回はRetinaディスプレイをはじめとした高精細ディスプレイにWebページを対応させるテクニックを紹介する。 前回（WebページをRetina対応させるテクニック～基礎知識編）はWebにおけるピクセルの基本的な話をしました。今回はそれを踏まえた上で、Retinaディスプレイをはじめとした高精細ディスプレイにWebページを対応させるテクニックを紹介します。 CSS Spriteで複数の解像度に対応 最も原始的な対応方法です。一般的なPCディスプレイと同じ要領で作成した画像をRetinaディスプレイに使用すると、にじんだように表示されてしまいます。デバイス上では同じサイズでも、使われているピクセル数のタテ・ヨコが2
ウェブデザインで大切な空白スペースの効果的な5つの使い方
空白スペース（ホワイトスペース）が、ウェブサイトのユーザエクスペリエンスに与える5つの重要な効果を紹介します。 5 Ways How Whitespace Affects The User Experience 下記は各ポイントを意訳したものです。 はじめに：空白スペースの基礎知識 1. 空白スペースがデザインに使いやすさを加える 2. 空白スペースがコンテンツに読みやすさを加える 3. 空白スペースがビジターに休憩を与える 4. 空白スペースがデザインをモダンに見せる 5. 空白スペースがあなたのデザインに感動を与える はじめに：空白スペースの基礎知識 空白スペース（ホワイトスペース）は、ウェブデザインにおいて非常に人気の高いデザイン要素です。この空白スペースは元々は印刷デザインからのもので、「テキストとグラフィックの欠如」を現します。と同時に空白スペースは「空きスペース」以上の役割を果
Webデザイン作成に必須のツール＆効率化できるサイトまとめ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
デザインを行う上では、ツールを使うのが必須です。有名なものだとPhotoshopやIllustratorがありますが、「まずは無料で気軽にWebデザインをしてみたい」という人もいますよね。 そこで今回は、Webデザインに使える無料のツールやWebデザインを効率化できるサイトをまとめて紹介します。 今回紹介する無料のWebデザインツール・ソフト ワイヤーフレーム・モックアップ・プロトタイプ作成ツール グラフィックデザイン作成ツール（写真加工・イラスト作成） テキストエディタ（HTML・CSSのコーディング） 配色選びに使える無料オンラインサービス Webサイトが制作できるオンラインサービス （編集部注：この記事は2013年08月29日に公開された記事を再編集したものです。） ワイヤーフレーム・モックアップ・プロトタイプ作成ツール ※ワイヤーフレーム・モックアップ・プロトタイプとは？ ワイヤー
あなたのサービスが落ちた時にユーザーになんと言うべきでしょうか？
Translation of: What should you tell your users when your service is down? by David McKenney つい最近、私達は多くの有名なサービスが完全に停止するという状況に遭遇しました。この出来事は、こういった何か不具合が起きた時にユーザーとどうコミュニケーションをとるかについて学ぶ良い機会なのではないかと思います。あの時InstagramとAirbnb、IFTTT、Vineがユーザーに送った通知は以下のようなものでした: これらから何を学べるのでしょうか？ これらすべてのツイートは、何か不具合が起きた時のコミュニケーション方法として一般的なパターンを採用しています: 技術的な専門用語を避け、ユーザーに簡潔に、そしてフレンドリーに伝えること みなさんの多くが不具合に遭遇していることを確認しました。 問題に気づいた
FINDJOB!終了のお知らせ | FINDJOB!
FINDJOB! 終了のお知らせ 2023年9月29日にFINDJOB!を終了いたしました。 これまでFINDJOB!をご利用いただいた企業様、求職者様、様々なご関係者様。 大変長らくFINDJOB!をご愛顧いただき、誠にありがとうございました。 IT/Web系の仕事や求人がまだ広く普及していない頃にFind Job!をリリースしてから 約26年間、多くの方々に支えていただき、運営を続けてまいりました。 転職成功のお声、採用成功のお声など、嬉しい言葉もたくさんいただきました。 またFINDJOB!経由で入社された方が人事担当になり、 FINDJOB!を通じて、新たな人材に出会うことができたなど、 たくさんのご縁をつくることができたのではないかと思っております。 2023年9月29日をもって、FINDJOB!はその歴史の幕を下ろすこととなりましたが、 今後も、IT/Web業界やクリエイティブ
PR：伊藤直也×まつもとゆきひろ。ポストPC時代のモバイル開発を語る
エンタープライズとコンシューマが逆転した、ポストPCの時代 伊藤 僕はいまBtoBの開発のコンサルをすることがあって、そこで何を期待されているかというと、BtoCで成功している方法論や開発プロセスなどをBtoBでもやりたいと。 以前はサーバOSやデータベースなどの面で先進的な技術が使われていたBtoB、エンタープライズ系の開発は、いまや先進性ではクラウドやモバイルデバイスを使ったコンシューマに逆転されてしまっています。 まつもと 最近、スマートフォンとかタブレットとか、PCじゃないところが主戦場になってきて、PCより小さなデバイス、少し前なら「組み込み」と言われていたものの重要性が高まってくるのではないかなと思っています。いまホットなデバイスはスマートフォンだったりしますが、もっと先に進むとコンピュータは環境に組み込まれてどんどん見えなくなっていくのではないかと思います。 でも、例えば多く
HTML5Experts.jp
進化するWeb ～Progressive Web Appsの実装と応用～(de:code2018より) 物江 修 2018年5月に開催された日本マイクロソフト主催のイベントde:code 2018で「進化するWeb ～Progressive Web Appsの実装と応用～」というセッションを担当しました。 イベントに参加できなかった...
デザイナーは文字詰めに命をかけよう ～和文と欧文のフォーマットの違いから考える～｜株式会社アクトゼロ｜クリエイティブブログ
こんにちは。梅雨入りしたのかしてないのか曖昧な天気が続きますが、体調は崩してませんか？比較的嫌われやすい時期ではありますが、私は雨は好きなほうです。「小夜時雨」「涙雨」「白雨」等、雨を含んだ日本語は美しいですよね。 さて、先週は明朝体とゴシック体について書きましたが、今週は和文書体と欧文書体について書こうと思います。 フォントには日本語の漢字、ひらがな、カタカナで構成された「和文書体」と、アルファベットで構成された「欧文書体」があります。二つの書体は、文字の形状の違いから文字のフォーマットも違います。 それぞれのフォーマットから、文字間隔の詰め方について考えてみましょう。 和文書体のフォーマット 和文書体は【仮想ボディ】という正方形のフォーマット内で文字が収まるようにデザインされています。実際は仮想ボディの枠いっぱいではなく、ひとまわり小さい枠（字面枠）の中に文字が作られます。 仮想ボディ
Webサイト高速化対策の現状
はじめに はじめまして、こんにちは。クラスメソッド株式会社でWebを担当している野中です。 この度、「これから身につけるWebサイト高速化テクニック」と題して記事を連載させていただくこととなりました。 本連載ではWeb担当者やWebデザイナー、コーダーの方々に向けて高速化に関する手法や技術について調べ、身につけたテクニックを細かな解説を加えて紹介していきます。中には少し難しいテクニックも含まれますが、できる限り分かりやすく、すぐに実践できるよう紹介していきたいと思います。とても長い連載ですが、よろしくお願いいたします。 なお、本連載はクラスメソッド開発ブログで連載されている「身につけておきたいWebサイト高速化テクニック」の増補改訂版です。 本連載の流れ 本連載はできるだけ多くの方に興味を持っていただけるように、最初に高速化対策の全体像と必要な知識を紹介します。その後、具体的な高速化対策と
「Meteor」で来れ、1億総Webアプリ開発者の時代（1/2） － ＠IT
ものになるモノ、ならないモノ（47） 脅威のフレームワーク「Meteor」で 来れ、1億総Webアプリ開発者の時代 山崎潤一郎 2012/5/16 文系で印象派人間の筆者でも「これならWebアプリ開発、できるかも」と思わせてくれるフレームワークが登場した。技術的な視点からの開設は他所に任せ、ここでは、非プログラマの視点から、Meteorがどんな可能性を切り開いてくれるかを予想したい。 「1億総Webアプリ開発の時代到来か」「これなら印象派人間の俺にも開発できるかも」「『リーンスタートアップ』しちゃおうかな」……。 いま、「Meteor」という名のWebアプリケーション用フレームワークがエンジニアの間で話題になっている。この新しいフレームワークのサイトやそこで紹介されているビデオを見て、脳内ヘビロテ状態でグルグルとループ再生されたのが、冒頭のフレーズだ。 簡単でスピーディな開発を可能にした脅
1分でWebアプリを作れて、3分で公開できた！オールJavaScriptでWebアプリを開発できるMeteorを触ってみた - IT-Walker on hatena
もうJavaもRubyも要らない？–JavaScriptオンリーの未来派WebアプリフレームワークMeteorがデビューという記事で知った、新しいフレームワークMeteor。 ちょっと気になったので、軽く触ってみました。すごすぎるフレームワークの登場です！！ 正確に言うと、実行環境＆フレームワーク＆クラウドPaaS＆パッケージマネージャーといったところでしょうか。Node.jsとHerokuとnpmが一緒になったようなもんだと思えば、イメージがわくと思いますが、実態はそれらを上回っています（パッケージ数はnpmの比じゃありませんが・・・使い勝手という意味で）。 インストール ターミナルをたちあげて、以下のコマンドを実行するだけ。 （行頭の$はターミナルであることを表してるだけで、コマンドの一部じゃありません） $ curl install.meteor.com | sh これで /usr/
Webサービスにおける利用規約の作り方 | PLUS
利用規約は、運用者と利用者がスムーズに利用するために必要なものですが、実際にどんなポイントを抑えて作るべきなのか、参考になる記事と実際の利用規約を見て調べてみましたので情報を共有します。WebサービスやWebサイトの利用規約作成に役立つと嬉しいです。 利用規約を作る際に参考になる記事 サイト利用規約の作成の仕方｜井藤行政書士事務所 ・サイト利用規約とは、利用条件や取引条件を示すもので、その掲載の有無は任意なもの ・契約書としての法的拘束力を確実に持たせたい場合は後者の「承諾」クリック式が有効 インターネット情報提供サービスの利用規約作成のポイント｜MBR Consulting ・利用規約の書き方の解説が丁寧でわかりやすい エンジニアも避けては通れない「安全な利用規約」の作り方 ・話題になった利用規約のケーススタディ スクウェア・エニックス、Google、Instagramなど
Web屋なら絶対参考にしたい！Web制作で役立つサイトとtwiterアカウント | らふらく ^^
Web業界にいると、常に新しい情報や技術が生まれるため、 必要な知識の移り変わりが速いです。 そこで、最新技術に乗り遅れず、知識を吸収するためにも フォローしておくと便利なtwitterアカウントとWebサイトを紹介したいと思います。 ①Webクリエイターボックス Webクリエイターボックス Web制作のテクニックやコード集を記事にしてくれています。 分量もちょうど良く、さくさく読み進める事が出来ます。 twiterアカウントはこちら。 @webcreatorbox ②Webデザインレシピ Webデザインレシピ 美人デザイナー「のりさん」が運営するサイト。 CSSやらデザイン系のTipsを中心にWebデザインのテクニックをわかりやすく解説してくれてます。 個人的に非常に助かったのはこちらの記事。 CSSは分かるけど jQuery は苦手 … という人が jQuery
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
