タグ

htmlに関するmas-higaのブックマーク (16)

  • どうしてHTML5が廃止されたのか | フューチャー技術ブログ

    フロントエンド連載の5記事目です。 HTML5が2021年の1月に廃止されました。 Webエンジニアとしてバリバリ活躍されてる方やエグゼクティブテックリードのような肩書きを持つ方にとっては「何をいまさら」という話題かと思います。 しかしながら、今年も新人さん入ってきてくださったので、プログラミングを学習中にHTML5という文字列に悩まされないように、そもそもHTML5とは何かや、廃止された経緯をまとめてみます。 HTML5とはWebサイトを作るときに必ず書くことになるHTML。Webサイトのコンテンツ、つまり中身や構造を作るために使うマークアップ言語です。 そして、その最近版として10年ほど前に登場したHTML5。当時は Webニュースなどで盛んに特集が組まれていましたが、このHTML5がついこないだ、2021年1月28日に廃止されました。 広義のHTML5 / 狭義のHTML5HTML5

    どうしてHTML5が廃止されたのか | フューチャー技術ブログ
    mas-higa
    mas-higa 2021/06/22
    HTML に対する W3C の役割って何だったんかな。みんな WHATWG 実装してたんでしょ?
  • リンクを作る時の target="_blank" の危険性 - 隙あらば寝る

    html で リンクを新しいタブ(やウィンドウ)で開かせたい場合、target="_blank" を指定するが、 この使い方には落とし穴があるらしい。 www.jitbit.com リンクを開いた先の javascript から、開いた元のページを操作できてしまうとのこと。 気になったので確認してみた。 悪用のパターン insecure.html が最初に開くページで、ここに target="_blank" なリンクがある。 このリンクを押すと new_window.html を新しいタブで開く。 この new_window.htmljavascript が仕込まれており、元ページを操作されるという話。 具体的には window.opener.location="./evil.html" と実行すると、元タブは evil.html に遷移する。 実際試してみたのが ここ。 リンクを開

    リンクを作る時の target="_blank" の危険性 - 隙あらば寝る
    mas-higa
    mas-higa 2019/02/04
    target="_blank" するときは rel="noopener noreferrer"
  • JVNVU#95575473: OpenPGP および S/MIME メールクライアントにメッセージの取り扱いに関する脆弱性

    JVNVU#95575473 OpenPGP および S/MIME メールクライアントにメッセージの取り扱いに関する脆弱性 OpenPGP および S/MIME をサポートする電子メールクライアントには、攻撃者が細工したコンテンツを挿入した暗号化メールをユーザのメールクライアントで復号させることにより、平文を送信するためのチャネルを確立することが可能です。発見者はこの脆弱性を用いた攻撃を "CBC/CFB gadget attack" と呼んでいます。例えば HTML image タグを挿入させることにより、復号されたメッセージが HTTP リクエストの一部として送信されてしまう可能性があります。 CVE-2017-17688: OpenPGP CFB Attacks CVE-2017-17689: S/MIME CBC Attacks また、一部のメールクライアントでは、マルチパートの

    mas-higa
    mas-higa 2018/05/18
    イマイチどういった脅威なのか理解できない。
  • <a>か<button>か - hitode909の日記

    クリックできるものがあって,<a>にするか<button>にするか,という話をしていて,いろんな観点があるなと思ったのでメモ. 単なる画面遷移なら<a> 単にformを送信したいときは,<input type="submit">や<button> <button>はdisabled属性を使って無効状態にできるので,押せない場合もあるなら便利 リンクを<a>にしておくと,PCではホバーするとリンク先が見えるので,ユーザーにとっては何が起きるか予想できて便利 そう考えるとformは押してみるまでどこに飛ぶか分からないので怖い気がする リンクを<a>にしておくと,:visitedを使って訪問済のリンクの色を変えることができて便利 モーダルウィンドウを出すとき,ウェルカムメッセージを開くボタンを<a href="#welcome">として,/#welcomeのときにウェルカムメッセージを出す,とし

    <a>か<button>か - hitode909の日記
  • フロントエンドチェックリスト(日本語訳) - Qiita

    GitHubで公開されているフロントエンドチェックリストというドキュメントが、網羅されている内容が幅広く便利そうだったので、日語に翻訳しました。 日語版は、以下のGitHubリポジトリにあります。GitHub側と自動的に連携するようにしておりますので、誤訳や誤りなどがあれば GitHub のプルリクエストまたは Issue で報告していただけると幸いです。 https://github.com/miya0001/Front-End-Checklist 日語版への貢献方法 最終更新日時: 2017-11-19 03:50:47+09:00 (未翻訳) Front-End Checklist The Front-End Checklist is an exhaustive list of all elements you need to have / to test before lau

    フロントエンドチェックリスト(日本語訳) - Qiita
  • HTML2slim

    Convert HTML to Slim

    mas-higa
    mas-higa 2015/10/16
    便利すぎる
  • Haml

    Beautifully DRY, well-indented, clear markup: templating haiku. Download Haml Latest: 6.3.0 - What's New? .erb <section class="container"> <h1><%= post.title %></h1> <h2><%= post.subtitle %></h2> <div class="content"> <%= post.content %> </div> </section> What is it? Haml (HTML abstraction markup language) is based on one primary principle: markup should be beautiful. It’s not just beauty for beau

  • can I use... Support tables for HTML5, CSS3, etc

    Test a feature Our partnership with BrowserStack now lets you test your website for compatibility across 2,000+ real browsers and devices. Test on: Did you know? Next If a feature you're looking for is not available on the site, you can vote to have it included. Better yet, if you've done the research you can even submit it yourself! You can import usage data from your Google Analytics account and

  • HTML の a 要素に target=&#8221;_blank&#8221; をつけるのはもうやめよう

    HTML の a 要素に target 属性をつけて、リンク先の文書をどこで開くのかを指定できますね。 デフォルトは _self で、元のドキュメントと同じフレーム。無指定だとこれになるので、わざわざこれを書くことは少ないと思うけど。 一番よく使うのは target="_blank" じゃないでしょうか。リンク先のドキュメントを新しいタブやウィンドウで開くやつですね。 これ、以前はよくつかってました。ルールとして サイト内リンクは target 指定なし 外部サイトへのリンクは target="_blank" というのが多かったんじゃないかな。 でも最近、これはもうリンク先がどこであろうと指定しない方がいいんじゃないか、と思ってます。 もちろんサイトによってそれぞれ使いわけはあると思うんだけど、少なくともほとんどの手元のサイトの場合はいらない。 target="_blank" を使ってきた

    HTML の a 要素に target=&#8221;_blank&#8221; をつけるのはもうやめよう
    mas-higa
    mas-higa 2015/06/16
    内部だろうが PC だろうが、別にしたいときは自分でする。勝手にやるな。
  • 東急の電光掲示板がこういう仕組みなの初めて知ったわwwww : ぶる速-VIP

    東急の電光掲示板がこういう仕組みなの初めて知ったわwwww htmlなのかよ!? 東急さんフォント色設定間違ってますよ pic.twitter.com/8IMFFD1UyM— 鉃路野狐@れっつふるもっふ! (@railway_fox) 2014, 10月 6 これhtmlだったんだwwww pic.twitter.com/VD7oXhHZ5A— Caelum (@kerorin09) 2014, 10月 6 この良くある電光掲示板ってhtmlで書いてたんだ!! フォントカラーとかこれなら簡単に変えられるしいいんでしょうけど『red』じゃなくて『"red"』にしないとちゃんと表示されないし、タグが出てきちゃうんだなぁwww ネットの反応HTMLで入ってたのか、、 “@railway_fox: 東急さんフォント色設定間違ってますよ pic.twitter.com/btx9fuciRF”— pe

    東急の電光掲示板がこういう仕組みなの初めて知ったわwwww : ぶる速-VIP
    mas-higa
    mas-higa 2014/10/07
    marquee 使ってんの?
  • なぜ html の form は PUT / DELETE をサポートしないのか? - Block Rockin’ Codes

    注意 内容については一切保証しません。 ここでは、主に W3C ML での議論や各種仕様などに基づいて書いています。 ここに書かれていることが正しいかどうかは、自身で判断して下さい。 事実としておかしいところなどは、コメントでどんどん指摘して下さい。遠慮はいりません。 ただし、このエントリでは「form が PUT/DELETE をサポートするべきかどうか?」の議論はしません。 「REST の是非」や「PUT/DELETE の意義」についても議論する気はありません。 ここでやっているのは、あくまでもどういった議論の末現状があるのかの調査です。 そうした意見がある場合は、 W3C などに投稿するのが最も有益だと思います。 History 2014/03/29: 公開 2014/03/29: XForm と XHTML の関係を明確化(thanx koichik) 2014/03/29: HT

  • [HTML5 入門]HTML5の略された49タグの語源全てを調べた

    タグ名がそのままタグの意味になっているものは抜いてあります。ここにあるのは108つあるHTML5タグのうち49個。 付け加えておきますと、この表はタグの英語での意味ではなく、単純にタグの名前になった元の単語を示しただけです。それでもどうしても分かりにくそうなものは熟語として加えてあります。 一応分かりにくいものだけ補足 hrタグについて よく昔hairline(細い線)と説明されているのを見かけましたが、正しくは水平方向の罫線と言う意味です。 dlタグ、dtタグ、ddタグについて dlはdescription listです。HTML4まで、dlは定義リスト、つまりdefinition listという意味でした。しかしHTML5からしれっとdescription list、つまり記述リストと言う意味に変わっており、用途も単に定義の言葉とその対応を示すもの、というものからターム(専門語と言うよ

    [HTML5 入門]HTML5の略された49タグの語源全てを調べた
    mas-higa
    mas-higa 2012/10/12
    description description!
  • 文字をなめらかにした - hitode909の日記

    RetinaディスプレイのMacBook Proほしいけどお金がなさすぎて買えないからこのブログをRetinaディスプレイ化することにして,ブログ全体を小刻みに横に揺らして,文字の残像が見えるから解像度が高く見えるということにした.文字がなめらかになったと思う. はてなブログを小刻みに揺らす.js — Gist 追記 iPhoneとかで見るとたぶん揺れてないと思う.下にPC版っていうリンクがあるからそこから見れると思う. 追記 そろそろいいかと思って,この記事だけなめらかにすることにした.

    文字をなめらかにした - hitode909の日記
    mas-higa
    mas-higa 2012/08/10
    ゆれてる!
  • ウェブサイトに円記号を書くときは、どうかこれでお願いします

    わかってる人にはもう「何を今さら」という話かもしれませんけど、悲しい思いをすることが多いのでここであらためてお願いします。 ウェブサイトに金額を書くとき、円記号 (¥) を使う際には HTML に ¥ ではなくて &yen; と書いていただきたいのですお願いします。 日語環境の Windows 端末から入力した円記号は、日語環境の Windows で見ると円記号になってますけど、その他の多くの環境であれはバックスラッシュになります。 日語版の Windows でこう表示されていても その他の環境ではこうなります。 HTML 内に \ ではなく &yen; と書けば基的にはどの環境でも ¥ が表示されるはずなので、円で金額を書く時にはぜひ &yen; にしていただきたいのですお願いします。 こいうことが起きている事情はこのあたりで。 日語用文字コードにおける円記号 – Wikipe

    ウェブサイトに円記号を書くときは、どうかこれでお願いします
    mas-higa
    mas-higa 2012/03/10
    ¥ が \ になってても脳内で勝手に補正される。
  • HTMLとスタイルシート(CSS)の業務スキルレベル 判別表 (5段階) - 主に言語とシステム開発に関して

    スキルチェックの目次へ HTMLおよびスタイルシート(CSS)を利用したWebページ制作の,簡易スキルチェックのための調査表。印刷用。 マークアップ・エンジニアとしてのレベルを測定する。 これは,「Webページをコーディングして作る人」全般に当てはまる。 レベルは,0から4までの5段階。 (0) 非エンジニア (1) 初学者(入門書を学習してゆく段階) (2) ノーマル(基礎的な知識があり,ある程度の画面を作れるようになった段階) (3) 中級者(Webアプリの開発プロジェクトで1人月としてカウントできる水準) (4) 上級者(メインPG/デザイナとして,Web UIの主担当を任せられる水準) Webアプリのプロジェクト開始時に作業振り分けをするにあたって,新規メンバ全員にこれを渡して回答してもらうという用途を想定。 なお,システム開発上のスキルをチェックする事が主眼なので,アーティスト(

    HTMLとスタイルシート(CSS)の業務スキルレベル 判別表 (5段階) - 主に言語とシステム開発に関して
    mas-higa
    mas-higa 2011/07/04
    PHP と JSP の所で挫折した。
  • &nbsp; は半角スペースではないというお話 (フェンリル | デベロッパーズブログ)

    いかがでしょう? WEBブラウザにもよりますが、結構実際の見た目も違うように思います。 で、冒頭の「半角スペースと &nbsp;」の件ですが、ちゃんと意識しておかないと「あれ?」と思うことがあります。 「&nbsp; を半角スペース (0x20) に置き換える」プログラムがあるように、「&nbsp; を半角スペースに置き換えず、nbsp (0xC2A0) に置き換える」プログラムもありますから、WEB ブラウザのように 0xC2A0 を表示できる場合はいいですけど、表示できないプログラムだと困りますよね。 冒頭の画像は、わが愛するテキステエディタ Emacs だとこんな感じになります、というサンプルでした おまけとして、&nbsp; を 0xC2A0 に置き換える例を。雰囲気をお楽しみください。 use HTML::Entities; use Encode; use Data::Dumpe

    &nbsp; は半角スペースではないというお話 (フェンリル | デベロッパーズブログ)
  • 1