タグ

HTMLとwebデザインに関するnekonyantaroのブックマーク (3)

  • 令和のHTML / CSS / JavaScriptの書き方50選

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

    令和のHTML / CSS / JavaScriptの書き方50選
    nekonyantaro
    nekonyantaro 2024/05/14
    後学のためブクマ。
  • 【CSS】borderを使って、三角形作るのはやめませんか? - Qiita

    はじめに みなさんは、CSSで三角形をつくる時どのように作っていますか? borderを使って作っていませんか? この記事では、CSSで三角形をつくるベストプラクティスを紹介します。 今までの三角形の作り方 See the Pen CSS Masking - Fade out UI by でぐぅー | Qiita (@sp_degu) on CodePen. 今までは、三角形を↑このようにborderを駆使して作成していました。 どうしてこうなるかは、省略しますが、来のプロパティとは違う使い方でうつくしくないですよね! この方法のいけてないポイントは以下の通りです。 1. 指定の大きさの三角形をつくるのに、border-widthを使うところ 来、border-widthは、要素の境界の幅を指定するプロパティで、要素の大きさを指定するプロパティではありません。 理想は、widht と

    【CSS】borderを使って、三角形作るのはやめませんか? - Qiita
    nekonyantaro
    nekonyantaro 2023/06/19
    clip-pathですか。存在すら知らなかった。
  • クソ酷いウェブサイト

    他に何がほしいってんだ、クソ野郎 お前はウェブサイトを作ってその糞サイトを最高だと思ってるんだろ? お前は13MBに及ぶパララックスエフェクト付きのクソ重いページがアホらしいグッドデザイン賞をとるとでも思ってるんだろ? お前は20kgあるjQueryファイルと83個のpolyfilがIE7をまともに動作させると思ってるんだろ? どアホ、お前は間違っている。俺様が俺の考える最強のウェブページを教えてやる。 クソ軽量でクソ速いページ 全てのデバイス幅に対応できる どんなうんこブラウザでも見た目が一緒 お前のサイトに訪れるどんな糞野郎でもアクセス可能 読みやすく伝えたいことが明確(もっともお前が5MBサイズのシャレオツなコーヒー写真ではなくて伝えたいことがあればの話だがな) よく聞け、糞野郎ども お前らはハッキリ言ってオーバー・デザインだ。この史上最強のウェブサイトを見てみやがれ。俺がごみコンテ

    nekonyantaro
    nekonyantaro 2017/06/01
    HTML Lint通すといくつかエラーが出る。くたばれweb標準(藁
  • 1