Web制作の技術は日々進化しており、会社やプロジェクトによっては昨今の環境に適さない書き方をしているケースも時折見受けられます。 そこで今回は「2024年のWeb制作ではこのようにコードを書いてほしい！」という内容をまとめました。 質より量で、まずは「こんな書き方があるんだ」をこの記事で伝えたかったので、コードの詳細はあまり解説していません。なので、具体的な仕様などを確認したい方は参考記事を読んだりご自身で調べていただけると幸いです。 1. HTML 画像周りはサイトパフォーマンスに直結するので、まずはそこだけでも取り入れていただきたいです。また、コアウェブバイタルやアクセシビリティも併せて理解しておきたい内容です。 Lazy loading <img>にloading="lazy"属性を付けると画像が遅延読み込みになり、サイトの読み込み時間が早くなります。

こんにちは、長山一石 (ながやま・かずし) と申します。今年はじめに米国の Google LLC を退職し、最近は JADE という会社を立ち上げて活動しています。今回は、Google Discover について少しお話しようと思います。 0. Discover はいいぞ Google Discover というプロダクトを知っていますか。昨年ひっそりと旧名 Google Feeds から名前を変えてローンチした、個人に最適化したニュースを届けるサービスです。 Pixel ならばホーム画面から左にスワイプすれば、スムーズに記事のレコメンデーションが始まるような仕組みになっているし、他のスマートフォンでもChrome や Google アプリを利用していれば、いたるところにおすすめ記事の一覧が出るように改変が進んでいます。 ある日のわたしの Discover。プログラミングやガジェット関連の情

連載： Webの未来を語ろう 2018 (1)HTML5 Experts.jp 副編集長兼エキスパートの吉川です。昨年好評だった「Webの未来を語ろう」企画を2018年もやります！ 今回はパネルディスカッション形式で、HTML5 Experts.jp 編集長の白石が、ブラウザベンダーのGoogleのデベロッパーアドボケイトのえーじさん、 Microsoftのエバンジェリスト物江さんをお迎えして、興味深いお話を多数お聞きしました。 会場も交えたトークは、今後のWeb業界の動向を追いかける上で、重要な内容となっているので、ぜひ読んでみてください！ 2017年のWebで印象に残ったことは？ 白石: まずは簡単な自己紹介と、2017年のWebで印象に残ったことを教えてください。 えーじ: えーじです。Googleでデベロッパーアドボケイトをしています。もともとは、Google Chromeのアドボ

Htacces rewrite engine testing tool to test your apache htaccess apache. A free product built by madewithlove.

TIMEMAPとは TIMEMAPは、時間軸に着目した新方式の検索エンジンです。情報の新しい探し方や見方を提供します。 アーカイブ内の記事が時系列に整理された年表が作成でき、また連想検索による関連記事の閲覧も可能です。 詳しくはこちら→

Webサーバーがレスポンスを発行する際に、HTTPレスポンスヘッダーに付けるとセキュリティレベルの向上につながるヘッダーフィールドを紹介します。 囲み内は推奨する設定の一例です。ブラウザによっては対応していないヘッダーフィールドやオプションなどもありますので、クライアントの環境によっては機能しないこともあります。 X-Frame-Options ブラウザが frame または iframe で指定したフレーム内にページを表示することを制御するためのヘッダーフィールドです。主にクリックジャッキングという攻撃を防ぐために用いられます。 X-Frame-Options: SAMEORIGIN DENY フレーム内にページを表示することを禁止（同じサイト内であっても禁止です） SAMEORIGIN 自分自身と生成元が同じフレームの場合にページを表示することを許可（他のサイトに禁止したい場合は主にこ

How browsers work Stay organized with collections Save and categorize content based on your preferences. Preface This comprehensive primer on the internal operations of WebKit and Gecko is the result of much research done by Israeli developer Tali Garsiel. Over a few years, she reviewed all the published data about browser internals and spent a lot of time reading web browser source code. She wrot

2013年1月16日、はてなダイアリーは誕生から10周年を迎えました。2003年1月16日に50人ほどのベータ版サービスとして開始したはてなダイアリーも、現在では多くの方に利用いただくブログサービスに成長しました。10周年を迎えることができたのも、ご利用いただいているユーザーの皆さまのおかげです。ありがとうございます！ 感謝の気持ちを込めて、抽選で30名様に「はてなグッズ福袋」が当たるプレゼントキャンペーンを実施いたします。下記 キャンペーン応募要項 に従い、はてなダイアリーに、はてなダイアリーでの思い出や、今後のブログサービスへの思いなどを投稿してください 本文に応募キーワード「はてなダイアリー10周年おめでとう！」を忘れずに！（キーワードがないとエントリーされません） はてなダイアリー、はてなブログ、どちらでも応募できます ※両方から応募すると当選確率が2倍に！ ブックマークでも参加で

オンページSEOとは、ウェブサイトの内部をユーザーと検索エンジンに最適化する施策です。ユーザーと検索エンジンの両方に対してわかりやすい構造を提供することのほか、ユーザーの検索意図を的確に満たすコンテンツを作成し管理するコンテンツSEOと、技術的な側面を最適化しサイトを検索エンジンに正しく理解・取得させるテクニカルSEOが含まれます。

平素は株式会社ライブドアのサービスを ご利用いただきありがとうございます。 提言型ニュースサイト「BLOGOS」は、 2022年5月31日をもちまして、 サービスの提供を終了いたしました。 一部のオリジナル記事につきましては、 livedoorニュース内の 「BLOGOSの記事一覧」からご覧いただけます。 長らくご利用いただき、ありがとうございました。 サービス終了に関するお問い合わせは、 下記までお願いいたします。 お問い合わせ

http://httpd.apache.org/docs/2.2/mod/mod_rewrite.html を見ながら。 URLが正規表現(A)にマッチし、かつ 文字列(B)が条件(C)を満たす場合に、 URLを(D)に書き換える。 というのが基本。 RewriteRule URLが(A)の正規表現にマッチしたら(D)で書き換える。 正規表現(A)は、リライトを実行するかどうかの条件(真偽値)であって、置換 url =~ s/(A)/(D)/ ということではない。たとえば、以下のような正規表現でリライトされる。 Google Code Search # 1文字マッチしたらリライト実行。空文字列でなければ実行する。 RewriteRule . index.php [L] Google Code Search # 先頭にマッチしたらリライト実行。常に実行する。 RewriteRule ^ -

連載インデックス 「HTML5“とか”アプリ開発入門」 JavaScriptのAPIやCSS3、SVGなどを含め、急速な広がりを見せつつある「HTML5」の基本を学べる入門連載です。「HTML5を使うと、何ができるのか」「それを実現するには、どのようなプログラムを書いたらいいのか」をお届けします。 Webの3つの問題を解決する「HTML5」とは何なのか HTML5“とか”アプリ開発入門（1）　最近よく目にする「HTML5」という言葉。JavaScirptのAPIやCSS3、SVGなどを含め、全体的な概要と、その意義をお伝えします

サイトやサービスを作ったらまずはこれを試してみるといいかもしれない。 GTmetrixはサイトのパフォーマンスをチェックし、どこを改善したら良いかを教えてくれるツールだ。 診断結果ではさまざまな施策を教えてくれるが、優先順位までつけてくれるのはなかなか便利だろう。 また会員登録することで、診断結果の履歴をとることも可能だ。時間をおってどのようにパフォーマンスが改善したか、報告するのに良さそうだ。 最近のサイトにおいては「速度は機能」というのは間違いない。こうしたツールをうまく使いこなしたいですな。

Webサイトを制作するとき、「パフォーマンス」を気にしたことがあるだろうか？　もしまったく気にしたことがないなら、気をつけた方がいい。閲覧に時間のかかる“遅いWebサイト”はユーザーにフラストレーションを与え、閲覧をやめさせてしまう恐れがある。 下記のグラフは、「Simple-Talk」という海外のオンラインメディアで発表されたユーザー調査の結果だ。アンケートページの表示にかかる時間を意図的にコントロールし、表示時間によってユーザーが感じるフラストレーションの違いを調べたものだ。 縦軸がフラストレーション（10段階）、横軸が表示までの時間を表している。1～5秒以内にページが表示された人に比べ、ページ表示までに5秒以上かかった人は2倍以上もフラストレーションを感じている。フラストレーションがあまりに高ければ、せっかく何らかの目的を持って訪れてきたユーザーも待ち切れずにブラウザーを閉じてしまう

はじめに 近年、Webアプリケーション開発で用いるプログラミング言語として、Lightweight Language（以降LL）と呼ばれるスクリプト言語が人気を博しています。本稿では、そのスクリプト言語の中からPythonとWebアプリケーションフレームワークのDjango（ジャンゴと読む）を紹介します。 Pythonの大きな特徴として、「言語仕様が小さくシンプルであり、簡潔で読みやすいアプリケーションを作れる」という点が挙げられます。DjangoはPythonの簡潔さをうまく活かし、シンプルかつ本格的な開発ができるWebアプリケーションフレームワークです。本稿ではこのDjangoによるアプリケーション開発の基本をチュートリアル形式で説明します。 対象読者 PythonによるWebアプリケーション開発に興味がある方 日頃、Perl、Ruby、PHP、Java、C#などPython以外のプロ