令和のHTML / CSS / JavaScriptの書き方50選
Web制作の技術は日々進化しており、会社やプロジェクトによっては昨今の環境に適さない書き方をしているケースも時折見受けられます。 そこで今回は「2024年のWeb制作ではこのようにコードを書いてほしい！」という内容をまとめました。 質より量で、まずは「こんな書き方があるんだ」をこの記事で伝えたかったので、コードの詳細はあまり解説していません。なので、具体的な仕様などを確認したい方は参考記事を読んだりご自身で調べていただけると幸いです。 1. HTML 画像周りはサイトパフォーマンスに直結するので、まずはそこだけでも取り入れていただきたいです。また、コアウェブバイタルやアクセシビリティも併せて理解しておきたい内容です。 Lazy loading <img>にloading="lazy"属性を付けると画像が遅延読み込みになり、サイトの読み込み時間が早くなります。
「昔のインターネット」の精神を取り戻す、HTMLエネルギー運動
今日のWebは商取引などの目的に最適化され、少数の企業によって所有されている。個人に力を与え、自己表現を促すかつてのWebの魅力を取り戻す「HTMLエネルギー（HTMLエナジー）」というムーブメントが密かに盛り上がりつつある。 by Tiffany Ng2024.01.08 363 9 Webサイトは、常に洗練されたデジタル体験だったわけではない。 かつて、ネットサーフィンをするには、自分の意に反して音楽が再生されるタブを開いたり、色つきの背景にタイムズ・ニュー・ローマン書体の文字がびっしり詰まったページを読んだりする必要があった。スクエアスペース（Squarespace、Webページ作成サービス）やソーシャルメディアが登場する以前の2000年代、Webサイトは個性を表現するものであり、コードの知識とインターネット上に存在したいという願望を持ったユーザーが、HTMLを使ってゼロから作るもの
最後に、日本ソフトバンクに出版事業部があった時代について話そう
この連載コラムもこれが最終回となるので、社内では現役最年長の編集者として、自分が経験してきたコンピュータ雑誌について語ろうと思う。 筆者はこの9月で63歳。1967年のビートルズのアルバム「Sgt. Peppers Lonely Hearts Club Band」でポール・マッカートニーが歌った曲の年齢まであと1年だ。ヴィーラ、チャック、デイブという名前ではないが、孫も2人生まれた。 「人生が二度あれば」の欠けた湯呑み茶碗を使っている父親の年齢まで2年。60歳から定年後再雇用で編集部に所属しているが、それも8月いっぱいで終わり。次の道へ進む予定だ。仕事を終わらせるめどがついたので、週末に2人目の孫に会いに自転車で25km走ってきた。 アイティメディアに限らず業界全体を見ても、筆者より年上のコンピュータ雑誌／メディアの編集者はほとんどが引退しており、同年代でも現役は数えるほどしかいない。記憶
HTTP/3 の特徴 HTTP/2とQUICの違い | REDBOX Labo
今回は改めてHTTP/3とはどのようなもので、QUICとは何か、HTTP/2時代からの改善点と我々はHTTP/3の波に乗るべきなのかチェックしていきたいと思います。時がたち次世代Web通信プロトコル「HTTP/3」の標準化プロセスが完了し、2022年6月に「RFC 9114」となりました。既に基盤となる「QUICプロトコル」の標準化プロセスも完了し、RFC9000としてRFCとなりました。もうHTTP/3は無視出来ないところまできています。 HTTP/3の誕生と歴史HTTP/3とは、HTTP/1.1 HTTP/2に続く新しいバージョンの約束事です。HTTP/1.1からHTTP/2は様々な点で劇的な進化を遂げましたが、HTTP/3はHTTP/2の根本的な課題をTCP・TLSの融合という形で解決し問題点を補うよう進化してきました。 1991年：HTTP/0.9（HTTPの始まりGETメソッドし
商用利用OKの音素材、600種以上無料公開 バトルの攻撃音も……「Springin’ Sound Stock」
プログラミングアプリ「Springin'」（スプリンギン）などを提供するしくみデザインは6月23日、商用利用OKの無償音楽素材サイト「Springin’ Sound Stock」を公開した。戦闘ゲームの攻撃音や、8bitサウンドの効果音、システム音、乗り物の音など、600点以上をそろえた。 過去のプログラミングコンテスト使用音源など、同社のサウンドデザイナーが手掛けた音源を中心に提供。「つくる楽しさを知り、誰でもクリエイターになってほしいという願い」から公開したという。 誰でも無料で使うことができ、スプリンギンでの利用だけでなく、動画制作やイベントなどの商用利用も可能だ。 関連記事 タップやフリックなどのシステム操作音のフリー素材、電通が公開 商用利用も可能 電通は、タップやフリック、文字入力などの操作を想定したオリジナルのシステム操作音をフリー素材として公開した。「SND」と名付けられた
Googleフォントを使うと犯罪になる - Qiita
<link href="https://fonts.googleapis.com">って書くと罰金取られます。 以下はGerman Court Rules Websites Embedding Google Fonts Violates GDPRというニュースの紹介です。 German Court Rules Websites Embedding Google Fonts Violates GDPR ドイツのミュンヘン地方裁判所は、あるWebサイトの運営者が、ユーザの個人情報を本人の同意なしにフォントライブラリを経由してGoogleに提供したとして、100ユーロの賠償を命じました。 Webサイトが原告のIPアドレスをGoogleに無断で提供したことは、ユーザのプライバシー権の侵害に当たると判断しました。 さらに、Webサイトの運営者は収集した情報をその他のデータと突き合わせることで『IPア
「ターゲティング広告」規制導入へ ネット利用者を保護 総務省 | NHKニュース
インターネットサイトの閲覧履歴をもとに広告を表示するいわゆる「ターゲティング広告」について、総務省は利用者を保護するため、ウェブサイトの運営会社などが、データを提供することを事前に利用者に通知するなど新たな規制を導入することになりました。 「ターゲティング広告」は、インターネットサイトで特定の商品を閲覧すると閲覧履歴が広告業者などに渡り、このデータをもとに商品に関連する広告が繰り返し表示されるようになる仕組みです。 総務省の有識者会議が14日示した取りまとめの案では、インターネットの利用者を保護し、安心して使える環境を整備する必要があるとして、規制するための具体策が盛り込まれました。 具体的には、ウェブサイトやアプリの運営会社が、利用者の閲覧履歴を広告業者などに提供する場合は、事前に利用者に▽通知したり、ウェブサイトやアプリ内に明記したりすることや、▽同意を得る手続きなどを義務づけるとして
【注意喚起】寄生サイトの恐怖 サイト貸しの営業に注意 - Web > SEO 辻正浩のブログ
中堅～大手サイトに「お金を払うので私のコンテンツをあなたのサイトに置きたい」という営業が広範囲に行われています。 指定されるコンテンツを置くだけで毎月固定額の報酬の他、そのコンテンツから発生したアフィリエイト収入の数割を払うという好条件が提示されていて、検討する会社も多くあるようです。これは2019年頃からごく一部の大手サイトで見られましたが、最近ではその営業を行う会社も増え、地方のメディアや地場企業などにも同様の営業が増え、拡大を続けています。 わたしはこの試みを、それぞれのサイトに寄生して価値を吸い取ろうとする「寄生サイト」と呼んでいます。 これは寄生される側に大きなリスクを伴います。自社サイトが大きなダメージを受ける可能性が高いため、検索流入が必要な場合この営業は絶対に受けてはなりません。 この記事では「寄生サイト」がどういう経緯で生まれたのか、そしてそのリスクについて説明します。
2021年企業動向を23万件の企業発表から振り返る PR TIMESプレスリリースキーワードランキングを発表！
2021年企業動向を23万件の企業発表から振り返る PR TIMESプレスリリースキーワードランキングを発表！-「DX」が年間1位に。コロナ前との変化を19年～21年で比較。22年注目ワードも！ - 【報道関係の皆様へ】下記以外にも業界別データ等お気軽にお問合せください。 【企業の皆様へ】2021年広報振り返りと今後の発表の参考にご活用ください。 【読者の皆様へ】全体傾向と共に今後も各プレスリリースを情報源にお楽しみください。 2021年を通して情報の発信と収集にPR TIMESをご活用いただいた全ての皆様へ改めて感謝申し上げます。 株式会社PR TIMES（本社：東京都港区、代表取締役：山口 拓己、東証一部：3922）は、運営するプレスリリース配信サービス「PR TIMES」において2021年1月1日～10月31日に企業から配信いただいたプレスリリース総計23万990件（10カ月間）を対
コンテンツへの平均支出金額、2020年は「67,201円」で前年から2,629円も上昇【博報堂DYMP調べ】 | Web担当者Forum
博報堂DYメディアパートナーズと博報堂の共同研究プロジェクト「コンテンツビジネスラボ」は、「コンテンツファン消費行動調査」2021年版を発表した。最新の全11カテゴリ・計1000以上のコンテンツに関する「リーチ力・支出喚起力ランキング」を算出している。 「リーチ力」はそのコンテンツが一年間に到達できる人数を表す指標、「支出喚起力」はコアファンによる年間の関連市場規模の指標となっている（コンテンツビジネスラボが独自開発）。調査対象カテゴリは「ドラマ・バラエティ」「アニメ・特撮」「マンガ・ライトノベル」「小説」「映画」「音楽」「ゲーム」「美術展・博覧会」「スポーツ」「レジャー施設・イベント」「特定のタレント・人物」の11種。 コロナ禍でコンテンツの平均支出金額が上昇、一方で顧客接点を増やしたコンテンツが伸長まず2020年1年間における「生活者のコンテンツへの平均支出金額」（全カテゴリ）は、コロ
【活動報告】オンラインセミナー「サイト表示速度改善とSEOへの影響 基本から事例まで」｜2021/9/14(火) - 活動報告 - アナリティクス アソシエーション
2021年9月14日に、オンラインセミナー「サイト表示速度改善とSEOへの影響 基本から事例まで」を開催いたしました。ご参加いただいた皆様、ありがとうございました。 レポート執筆 株式会社Sprocket 西 倫英 2021年6月、GoogleはコアウェブバイタルによるWebサイトの評価をスタートしました。コアウェブバイタルとは、Webサイトの表示速度や触り心地などのUXを評価する新しい指標です。 セミナー「サイト表示速度改善とSEOへの影響 基本から事例まで」では、株式会社ドーモの占部 雅一氏と種村 和豊氏が、Webサイトにおける表示速度の重要性や、具体的な改善ステップの考え方について解説しました。 第一部 表示スピード改善はキラーソリューション コアウェブバイタルの基礎と事例 占部 雅一 氏（株式会社ドーモ） 占部氏は冒頭で「表示速度は、意外と知られていないキラーソリューション」と示し
Webサイトに訪れた2つの変化とは？コンバージョン改善のプロセスをアップデートせよ
『MarkeZine』が主催するマーケティング・イベント『MarkeZine Day』『MarkeZine Academy』『MarkeZine プレミアムセミナー』の 最新情報をはじめ、様々なイベント情報をまとめてご紹介します。 MarkeZine Day
どうしてHTML5が廃止されたのか | フューチャー技術ブログ
フロントエンド連載の5記事目です。 HTML5が2021年の1月に廃止されました。 Webエンジニアとしてバリバリ活躍されてる方やエグゼクティブテックリードのような肩書きを持つ方にとっては「何をいまさら」という話題かと思います。 しかしながら、今年も新人さん入ってきてくださったので、プログラミングを学習中にHTML5という文字列に悩まされないように、そもそもHTML5とは何かや、廃止された経緯をまとめてみます。 HTML5とはWebサイトを作るときに必ず書くことになるHTML。Webサイトのコンテンツ、つまり中身や構造を作るために使うマークアップ言語です。 そして、その最近版として10年ほど前に登場したHTML5。当時は Webニュースなどで盛んに特集が組まれていましたが、このHTML5がついこないだ、2021年1月28日に廃止されました。 広義のHTML5 / 狭義のHTML5HTML5
CRO（コンバージョン率最適化） | 本当は怖いポップアップ | Sprocket（スプロケット）｜CX改善プラットフォーム
コンバージョン率最適化（CRO）とは、ウェブサイトに訪れたより多くのユーザーをコンバージョンさせるためのデジタルマーケティングの施策を指します。集客も大事ですが、訪れたユーザーへの対策にこそ勝機があると言えるでしょう。 自社に必要なツールを選定・比較する際にご活用いただける、『Web接客ツールカオスマップ』をご用意しました。 →ダウンロードはこちらから CRO（コンバージョン率最適化）とは CROとは、Conversion Rate Optimization の略で、読み方はシーアールオー、コンバージョン率最適化とも言います。ウェブサイトに訪問したユーザーの、コンバージョン率を高めるために、「施策」や「ツール」で最適化を図ることを指します（「施策」や「ツール」は後述）。 ウェブサイト（の目的）によって「コンバージョン行動」の定義は変わってくると思いますが、ECサイトであれば「注文」、資料請
成功法則が詰まったBtoBサイトの標準ワイヤーフレームを無料配布します | knowledge / baigie
約1年前、BtoB企業における顧客獲得型サイトの勝ちパターンをまとめた『BtoBサイト・チェックリスト』を、ベイジ、才流さん、WACULさんの3社連名で発表し、大きな反響をいただきました。 このチェックリストはブログで公開しただけではなく、私たちのウェブ制作の現場でもフル活用されています。この1年間に手掛けた多くのBtoBサイトが、このチェックリストを満たすように設計され、多くのBtoBサイトでコンバージョン数/率やフォーム誘導数/率の向上など、ポジティブな変化が生まれました。 このような活動の中から、『BtoBサイト・チェックリスト』の内容を満たした『BtoBサイト・ワイヤーフレーム』なるものが誕生しました。これを今回、皆さんにご提供します。リード情報なども一切取らず、そのまま丸ごとお渡しします。 BtoBサイト標準ワイヤーフレームXD版（770KB） BtoBサイト標準ワイヤーフレーム
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
オウンドメディアも対象になるって本当ですか!?／改正電気通信事業法について、弁護士の結城東輝さんに聞いてきた | Webのコト、教えてホシイの！
無料 BGM・効果音のフリー音源素材 | Springin’ Sound Stock
cakes（ケイクス）
ECの課題は「売上拡大」「新規獲得」。効果が高いと感じるSNSは「YouTube」 | ネットショップ担当者フォーラム
Icons - Material Design
