ウェブデザインと開発の主要なテーマに関するコース(随時追加予定)をご確認ください。Chrome チームのメンバーの支援を受け、業界のエキスパートが各コースを作成しました。モジュールを順番に受講するか、最も興味のあるトピックを受講してください。
ウェブデザインと開発の主要なテーマに関するコース(随時追加予定)をご確認ください。Chrome チームのメンバーの支援を受け、業界のエキスパートが各コースを作成しました。モジュールを順番に受講するか、最も興味のあるトピックを受講してください。
はじめに 最近のCSSのアップデートは目覚ましいものがありますが、 みなさんは、CSSの値と単位がここ1年くらいで大きく変わっていることはご存知ですか? Dynamic viewport が追加されたり、math 関数が追加されたりなどの大きな変更は、ご存知かもしれないですが、calc()で ネイピア数 e や 円周率 πなどが使えるようになったり、 フォントに相対的な長さ単位が追加されていたりと細かい変更も多くあります。 そのため、この記事では、CSS Values and Units Module Level 3 から CSS Values and Units Module Level 4の変更点を中心に紹介しようと思います。 Viewport単位 CSS Values and Units Module Level 3 から CSS Values and Units Module Le
Web アプリケーションエンジニアのためのウェブアクセシビリティの基礎 2023.02.18 ウェブアプリケーションエンジニアを対象に、アクセシビリティの対応について解説した記事。アクセシビリティを向上させるためには、正しいHTMLの書き方が必要である。HTML要素には、アクセシビリティに関する機能が元々備わっているため、適切なHTMLを選択し使用することが大切だ。複雑なUIの場合はWAI-ARIAを使用し、ARIA Authoring Practices Guideに基づき適切に実装する必要がある。UIライブラリ選びの際には、WAI-ARIAに従った実装を行っているかが基準の1つとなる。 この記事は、ウェブアプリケーションエンジニアとして仕事をされているほうを対象に書かれています。日々のウェブフロントエンドの開発の中で意識しておきたい基礎的な内容をメインに記載しています。 そのため、ここ
はじめに 最近Denoをよく触っており、DenoのSSRフレームワークであるFreshのミドルウェア・キャッシュについて調べている際にブラウザキャッシュのEtagヘッダが使用されており、気になったのでブラウザキャッシュの仕組みについて調べてみました。 Etagの正体 Etagとは、ブラウザキャッシュの仕組みの中で使用されるHTTPレスポンスヘッダーでリソースの特定のバージョンに関する識別子のことです。 Etagがあることでウェブサーバーは、コンテンツが変更されていない場合はレスポンス全体を再送する必要がないので、キャッシュがより効率的になる。 ブラウザキャッシュの設定について ブラウザキャッシュを設定する際に必要なHTTPレスポンスヘッダーはEtagを含めて以下の通りです。 Expiresヘッダー Cache-Controlヘッダー Last-Modifiedヘッダー Etagヘッダー そ
そもそもなぜSteamで公開するのか この記事ではSteamにフォーカスしましたが、実際はこのゲームはWeb上から直接遊べるし、WebViewでラッピングしてGooglePlayにも公開しています。 SteamとGooglePlayに出した最初の理由は、大きなプラットフォームの力を借りて集客するためです。 LPだけオープンして待っていたとこで誰も遊びに来てはくれないわけです。 なので正直、「Webブラウザで遊べるのに、集客のためだけにわざわざダウンロードしてもらうなんてアホくさいな」、と思っていました。 しかし今となっては、むしろSteam経由で遊んでもらいたい思いのほうが強いです。 Steamのストアに並ぶことは思っていたよりも嬉しくて、 例えるなら、小説を書いたとして、今まではコピー用紙に印刷してホチキスで止めたものを皆に配っていましたが、 今回はちゃんと本になって、カバーがついて、書
どうも、まさとらん(@0310lan)です! 今回は、直感的な操作で高度なWebデザインを誰でも実現できるサービスをご紹介します。 Webサイトを構成するインタラクティブなコンテンツが豊富に用意されており、それらを組み合わせるだけで最適なWebサイトを誰でも簡単に構築できます。 また、提供されていないコンテンツや機能などは、JavaScriptで好きなように拡張できる設計になっているので無限の可能性も秘めています。Webサイトの作成にご興味ある方はぜひ参考にしてください。 【 Vev 】 ■「Vev」の使い方 それでは、「Vev」をどのように使えばいいのか詳しく見ていきましょう! まずはトップページの黄色いボタンから無料のユーザー登録を済ませておきます。 利用可能なメールアドレスを入力してエンターキーを押してください。 すると登録したメールアドレス宛に、ログイン用のリンクが送付されるのでク
画像出典: https://www.ipa.go.jp/files/000017316.pdf こんにちは。株式会社Flatt Security セキュリティエンジニアの奥山です。 本稿では、独立行政法人 情報処理推進機構(以下、IPA)が公開している資料「安全なウェブサイトの作り方」を紹介します。 「安全なウェブサイトの作り方」は、無料で公開されているにも関わらず、Webセキュリティを学ぶ上で非常に有用な資料です。これからWeb開発やセキュリティを勉強したいと考えている方はもちろん、まだ読んだことのない開発者の方々にも、ぜひ一度目を通していただけたらと思います。 一方、「安全なウェブサイトの作り方」では、一部にモダンなアプリケーションには最適化されていない情報や対象としていない範囲が存在します。それらについても本記事で一部、触れていきたいと考えていますので、資料を読む際の参考にしていただ
えふしんさんに何の恨みも無いのだけれど わからないことを偉そうに書いて怒られて進化したいという芸風なので書いてみました。 Web3というテロリズム|えふしん #note https://t.co/84SoYtIzDC — えふしん (@fshin2000) 2022年2月17日 というのだから技術的に正確なツッコミを入れて欲しいという事だと信じて書く。まさか後釣り宣言など来ないだろう。 Web3という言葉は、既存の権力構造に対する宣戦布告と考えれば、割と素直に受け入れられる。 ここは本当にその通りで「下剋上」の雰囲気感だけで業界が振り回されているのは見るに耐えない。権力構造を敵対視するあまり、本当に味方に付けるべきエンドユーザーの事がなおざりになっているとすら感じている。市場経済で世の中が動く中、エンドユーザーは確かな利益が無ければ動かないし、利益無しで人やお金を動かさせたら詐欺である。こ
「デザインが分からない」 時折、エンジニアからこうしたセリフを聞くことがある。 たいてい、このセリフが意味するのは「自分には絵心やセンスがないから」という単純な理由なのだが、本当に絵心やセンスがないとデザインは理解できないものなのだろうか? この連載では、デザインの本質的なロジックやデザイナーの思考法を、毎回著名サービスにかかわるデザイナーに語ってもらう。 連載2回目となる今回は、クラウド会計アプリ『freee』のUXディレクター、関口聡介氏だ。 freee株式会社 UXディレクター 関口聡介氏 1974年生まれ。25歳で映像制作とWeb UXのコンサルティング会社を設立。サン・マイクロシステムズと契約しWebマーケティングを担当。その後Googleに正式入社し、検索トップページ(日本版)のリニューアルやdocomo向けGoogle iウィジェット、初期のGoogle日本語入力のUX担当。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く