2019年1月第5週号 1位は、ハンバーガーメニューでやりがちなコーディングミスと解決方法、気になるネタは、NetflixのiOS版アプリ、好きな番組を直接「Instagram Stories」で共有可能に | gihyo.jp
週刊Webテク通信 2019年1月第5週号1位は、ハンバーガーメニューでやりがちなコーディングミスと解決方法、気になるネタは、NetflixのiOS版アプリ、好きな番組を直接「Instagram Stories」で共有可能に ネットで見かけたWebテク（Webテクニック・Webテクノロジー）記事から、Webデザイナーの目で厳選したネタを週刊で紹介するこのコーナー。今回は、2019年1月21日～1月27日の間に見つけた記事のベスト5です。 1. The mistake developers make when coding a hamburger menuhttps://medium.freecodecamp.org/the-mistake-developers-make-when-coding-a-hamburger-menu-f46c7a3ff956 ハンバーガーメニューがスクロールする
2018年のWebアクセシビリティ | gihyo.jp
あけましておめでとうございます。株式会社ミツエーリンクスの黒澤剛志です。本稿では、昨年に引き続いて、2018年のWebアクセシビリティの短期的な予測を寄稿させていただきます。 Web Content Accessibility Guidelines (WCAG) 2.1 WCAG 2.0は2008年12月11日にW3C勧告（Recommendation）となりましたので、今年で10周年を迎えます。WCAG 2.0は国際的なガイドラインとして用いられていますが、W3CではWCAG 2.0以後のガイドラインの検討が進んでいます。 昨年もWCAG 2.0以後のガイドラインとしてWCAG 2.1を紹介しましたが、いよいよWCAG 2.1の標準化が大詰めを迎えています。本稿執筆段階での最新の草案（Working Draft）は2017年12月7日付のものですが、標準化を進めているAccessibil
第2回 Webセキュリティのおさらい その2 XSS | gihyo.jp
前回は、Webアプリケーションにおける受動的攻撃の代表例として、以下の4つを挙げました。 クロスサイトスクリプティング（XSS） クロスサイトリクエストフォージェリ（CSRF） オープンリダイレクト クリックジャッキング 今回は、これらのうち、XSSについてより掘り下げて解説していきます。 XSSはどのようにして引き起こされるのか XSSとは、動的にHTMLを生成するWebアプリケーションにおいて、データをエスケープせずに出力しているために、生成されるHTMLに攻撃者の作成したHTML断片やJavaScriptコードが埋め込まれてしまう脆弱性です。 たとえば、検索画面にてユーザーが「HTML5」という文字列を入力すると、http://example.jp/search?q=HTML5というURLで検索結果が表示されるWebアプリケーションがあったとしましょう。検索結果の画面では、ユーザーが
第8回 「気持ちいいUI」の追求に熱心になりすぎて、空回りしてませんか？ | gihyo.jp
前回は、気持ちいいUIを構築する方法を開発者の視点から捉え、「開発者が“面倒くさくて”やらなかったことが、利用者の“面倒くささ”の蓄積につながるのではないか」、そしてユーザーの面倒くささを解消してあげる方法の1つとして「ユーザーが何もしなくて良い状態を作る」ことがよいのではないか、という意見を提示しました。今回はその考察をさらに発展させ、技術者がついついやってしまいがちな「やりすぎ」について考えてみたいと思います。 チュニジアで痛感したGoogleマップの出来の良さ 筆者は8月末にチュニジアに行って来ました。チュニジアはアフリカ大陸の地中海沿岸に位置しており、アフリカの中では比較的発展を遂げている国です。フランス人などのリゾート地としても有名です。今回は家族を連れて、チュニジア人の元同僚を訪ねての旅だったのですが、筆者は基本リモートで仕事をしているため、仕事を完全にストップさ
第7回 「気持ちいいUI」って、どういうもの？ | gihyo.jp
前回は、「開発側にとって便利であるがためによく利用されているUIが本当に直感的にわかりやすのか、疑ってみよう」というお話でした。世の中でよく利用されているUIや、あなたやあなたのまわりにいる人たち、すなわちスマートフォンをすごくよく利用していてさまざまなUIに対する経験のある人たちであればすぐに理解できるUIが、実際にそのサイト、アプリケーションを使うユーザー層にとって理解しやすいかどうかはじつはわからないのです。 今回は、「理解しやすい」よりさらに発展した発想である（と筆者が思っている）「気持ちいい」UIと開発者の関係について考えてみたいと思います。 「気持ちいい」を要素分解すると見えてくる そもそも、「気持ちいいUI」とはどういうものなのでしょうか。まずはどういう状況が「気持ちいい」のかを要素分解をしてみましょう。 処理速度が速く、処理の際の待ち時間が少ない わかりやすく直感的
第4回 スマートフォンでも速度への配慮を忘れない | gihyo.jp
データ通信料が制限を超えて、アクセス規制にひっかかってしまい…… 先日筆者は、スマートフォンでのデータ通信量が3日で1GBを超えてしまい、ソフトバンクのアクセス規制にひっかかり、アクセスのほとんどが封じられる、という罰ゲームを受けました。筆者の料金プランはテザリングのできないプランで、1ヶ月7GBの制限はないのですが、3日で1GBという制限はあるのですね。まったく知りませんでした……。 そして規制を受けた結果、飲み会の場所を知るのに、Gmailのメールをアプリで開くだけで何分も待たされるは、Google Mapにはまったく地図が表示されず、ピンと自分の位置だけで地図がない状態でたどり着かなければならないわで、霧雨舞う渋谷を10分以上さまよい歩く目にあいました。 規制を受けたとはいえ、最大128KBの速度は出るはずです。128KBといえば、はるか古代、ISDNが登場した際には「ものすごく速い
第116回 2014年特別編 2013年の特徴、2014年の展望 | gihyo.jp
新年あけましておめでとうございます。 『Lançamento - Website, What a Wonderful World!』を運営しているLançamento（ランサメント）です。 『いま、見ておきたいウェブサイト』では、2013年も国内外のウェブサイト（ウェブサービス）をさまざまな方向から解説してきました。2014年の第1回目となる今回は「特別編」と題して、2013年に登場したウェブサイトとその特徴を振り返りながら、2014年への展望を語っていきたいと思います。 特徴その1 フラットデザインの広がりが意味するもの 2013年のウェブサイト、特にデザインという視点で振り返ると、"フラットデザイン"という言葉を外す事はできません。2013年にはウェブサイトのみならず、スマートフォンのアプリなどにも大きな影響を与えました。 フラットデザインは、ドロップシャドウやベベル・エンボスなどの立
2014年のWeb標準 | gihyo.jp
株式会社ミツエーリンクスの渡邉卓です。昨年の「2013年のWeb標準」と同様、2014年もWebコンテンツのフロントエンド設計および実装に関連した各種標準や、周辺領域の動きに関する短期的な予測を寄稿させていただきます。 2014年のWeb標準については「HTML5勧告予定年」「IE6の終焉」「CSSプロパティくりかえし問題」をキーワードとして取りあげます。 HTML5勧告予定年 HTML5にとって、2014年はとても重要な年になります。昨年の記事でも触れましたが、HTML5は2014年に「勧告」となる予定であるためです。HTML WGによる2014年の計画では、HTML5を勧告（Recommendation）にする目標が、2014年後半（第4クオーター）に設定されていることがわかります。 HTML5はすでに勧告候補（CR; Candidate Recommendation）であるため、
SwapSkills Build（Vol.34）「上手に進行するためのGitHub入門」イベントレポート | gihyo.jp
"SwapSkills" Information & Report SwapSkills Build（Vol.34）「上手に進行するためのGitHub入門」イベントレポート SwapSkills Buildの34回目となる「上手に進行するためのGitHub入門」が、2013年7月25日（水）、東京都中央区の「大槻社労士事務所」にて開催されました。本稿では本イベントのレポートをお届けします。 今回のイベントは、コマンドが打てない方向けのGitHub入門として開催されました。データのバージョン管理として有名なGitHubは、コマンドの記述が必要ですが、GUIツールの導入で記述を不要に出来ます。ハードルが高かったWebディレクターやWebデザイナーもこれを機に導入することが出来るのではないでしょうか？ データ管理の事故を防ぐためのGItHub。何時間もかけて書いたCSSを誤って消してしまった
第45回 CSSのコンポーネント化がもたらすメリット | gihyo.jp
同じ記述の繰り返しを防ぎメンテナンス性や柔軟性を向上 W3Cによって策定された仕様の1つで、HTML／XMLの要素の表示をコントロールするために生まれたのが「CSS」（Cascading Style Sheets）です。HTMLとこのCSSを組み合わせることによって、文書構造（HTML）と見た目の表現（CSS）を切り離すことが可能になるほか、HTMLだけでは実現できないデザインやレイアウトが可能になるといった大きなメリットがあることから、Webサイトの構築やWebアプリケーションの開発において欠かせない技術となっています。 このCSSで現在注目を集めつつあるのが「オブジェクト指向CSS」や「Scalable and Modular Architecture for CSS」（拡張性のあるモジュールアプローチ）といった考え方です。これらは、CSSで記述する内容を「コンポーネント化」するこ
2013年のWeb標準 | gihyo.jp
株式会社ミツエーリンクスの渡邉卓です。昨年の「2012年のWeb標準」と同様、2013年もWebコンテンツのフロントエンド設計および実装に関連した各種標準や、周辺領域の動きに関する短期的な予測を寄稿させていただきます。 2013年のWeb標準については「HTML5仕様の安定化」「タッチスクリーン環境の混沌」「ECMAScript 6」をキーワードとして取りあげます。 HTML5仕様の安定化 2012年12月17日、HTML5仕様は勧告候補（CR）に到達しました。同時にHTML Canvas 2D Contextも勧告候補（CR）になっています。よほどのことがない限り、HTML5は2014年中に勧告（Rec）予定です。W3CによるHTML5仕様は、一旦安定したといえるでしょう。 このリリースでW3Cは、「HTML5」としては大規模な仕様追加・削除・変更をこれ以上行わないと明言したことに
フロントエンドWeb戦略室 記事一覧 | gihyo.jp
第1回外部サイトに貼り付けるJavaScriptの作法―ポリシー、速度、セキュリティ、プライバシー（3） mala 2012-07-04 第1回外部サイトに貼り付けるJavaScriptの作法―ポリシー、速度、セキュリティ、プライバシー（2） mala 2012-07-03
第1回 Node.jsとは | gihyo.jp
はじめに 本連載では、注目を集めるNode.jsを使って、Webアプリケーションを様々なクラウド環境で動かすことを最終目的にしています。Node.jsに触れたことがないJavaやPHPなど普段サーバサイドで開発されている方を主な対象として、まずNode.jsの概要から紹介していきます。 Node.jsとは Node.jsとは、ブラウザGoogle Chrome用に開発されたJavaScriptエンジンV8がサーバ上でプログラムを実行できるように、ファイルやネットワークI/Oなど多くの機能を追加したものです。軽量で効率よく多くのリクエストを処理するネットワークアプリケーションの構築ができるプラットフォームになっています。いわゆるサーバサイドJavaScriptの代名詞として注目を集めています。 Node.jsでは“軽量で効率良く”というのを実現するために次の2つのモデルを採用しています。
「第27回 HTML5とか勉強会」活動報告 | gihyo.jp
第27回目となる本勉強会は、3月13日にニフティさんに会場をお借りして開催しました。 今回のテーマは「リッチクライアントをデザインする」。HTML5を用いたインタラクティブなウェブサイトのデザイン方法や、実際に行った経験のお話などを講演していただきました。 本稿では、今回のイベントについてレポートします。 HTML5インタラクティブデザイン - デザイナとデベロッパによる生対談 最初は、C.A.Mobileの白石俊平さんと、同じくC.A.Mobileの稲田真帆さんによる、実際にウェブサイトを開発したときの話を対談形式で講演していただきました。 そのウェブサイトは、マイクロソフトから依頼されたデブサミ2012に展示するものでした。依頼された内容は、Internet Explorer 10で追加されるHTML5のAPIを利用したサイトを構築するというものだったそうです。最終的には以下の3つ
第46回 セキュリティ対策を考える上で欠かせないコンテクスト | gihyo.jp
円滑なコミュニケーションには、共通の用語・概念が必要です。用語・概念が違うようではコミュニケーションは不可能です。 前回は「バリデーションがセキュリティ対策である」ことを主題として、セキュリティ対策に対する考え方の基本について解説しました。前回の記事でセキュリティ対策とは何か理解できた方も多いと思います。しかし、まだ理解できていない方も居るようなので、セキュリティ対策についてもう少し解説します。次になぜコンテクストが重要なのか解説します。 今回も「ISO/IEC TR 13335−1 ITセキュリティマネジメントのガイドライン - 第一部：ITセキュリティの概念及びモデル」の解説になります。ISO規格ではITセキュリティ関連規格は27000シリーズに集約されますが、ITセキュリティの概念はこちらのほうがわかりやすくまとまっています。ITセキュリティの概念としては、ISO/IEC 13335
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
特集：Firefox 3とFirebugで始めるJavaScript開発｜gihyo.jp … 技術評論社