' sandbox="allow-same-origin" class="iframe__style--small-card" data-v-2fcdfb78> シンプルなフラットボタン
See-SS
' sandbox="allow-same-origin" class="iframe__style--small-card" data-v-2fcdfb78> シンプルなフラットボタン
HTMLとCSSの実務レベルの作業フローや思考プロセスがていねいに解説された、Web制作に真剣に取り組みたい人にお勧めの本 -教科書では教えてくれないHTML＆CSS
HTMLもCSSも一通り勉強した、でも実際にWebページを実装しようとするとどこから手をつければよいか悩んでしまう。そんな人にお勧めしたい、実装の作業フローと思考プロセスをくわしく解説した良書を紹介します。 本書は通常の解説書とは一線を画すもので、現場レベルの作業や考え方を基礎からていねいに解説したものです。実装のテクニックもたくさん解説されており、さまざまなプロジェクトで役立ちます。 本書は「HTML5&CSS3デザインレシピ集（紹介記事）」「WordPressデザインレシピ集（紹介記事）」などでお馴染み、狩野 祐東氏の新刊です。 「教科書では教えてくれない」とあるように、入門書や講座では学べない現場レベルの実装を基礎からていねいに解説しています。自分のブログをちょっとつくってみたいという人向きではなく、仕事としてWeb制作に携わりたい人向けの解説書です。
どうしてHTML5が廃止されたのか | フューチャー技術ブログ
フロントエンド連載の5記事目です。 HTML5が2021年の1月に廃止されました。 Webエンジニアとしてバリバリ活躍されてる方やエグゼクティブテックリードのような肩書きを持つ方にとっては「何をいまさら」という話題かと思います。 しかしながら、今年も新人さん入ってきてくださったので、プログラミングを学習中にHTML5という文字列に悩まされないように、そもそもHTML5とは何かや、廃止された経緯をまとめてみます。 HTML5とはWebサイトを作るときに必ず書くことになるHTML。Webサイトのコンテンツ、つまり中身や構造を作るために使うマークアップ言語です。 そして、その最近版として10年ほど前に登場したHTML5。当時は Webニュースなどで盛んに特集が組まれていましたが、このHTML5がついこないだ、2021年1月28日に廃止されました。 広義のHTML5 / 狭義のHTML5HTML5
W3C発行のHTMLがすべて廃止された日 | フロントエンドBlog | ミツエーリンクス
あくまで有効日数はW3C仕様の名目上のステータスであり、参考情報にしか過ぎないわけですが、HTML5とそれよりも前に策定された(X)HTML仕様は、2018年3月に一斉に廃止され、HTML Review Draftと入れ替わるタイミングでHTML 5.1とHTML 5.2が同時に廃止されました。Second Editionを含んでいますが、HTML5シリーズがいずれも勧告から3年で廃止されているのは何とも興味深いところではあります。 また、古い話ですが、当時HTML5のEditorを務めていたHixieことIan Hickson氏が2008年に「HTML5の完成は2022年ごろになる」と発言していたことがありました（HTML5の完成は2022年！？ | Web標準Blog | ミツエーリンクス）。2012年にW3CとWHATWGのHTMLが分裂[1]し、結局今年になってWHATWG HTM
【html5】AMP HTML（Accelerated Mobile Pages HTML）作ってみた – atomicbox
2015年10月にGoogle公式で発表された、モバイルWEB高速化の新しい技術、The Accelerated Mobile Pages（AMP）について色々と調べてみました。 Official Google Blog: Introducing the Accelerated Mobile Pages Project, for a faster, open mobile web モバイルからのアクセスに対して、予めキャッシュしておいたページデータをプロキシサーバーから応答させることで、まるで読み込み時間がゼロであるかのようにWEBページが閲覧できる、という感じの技術です。 今回はそのAMP HTMLを実際に使ってみた感じをレポートします。 概要については、こちらの記事 モバイルウェブが爆速に！ GoogleがAMP (Accelerated Mobile Pages) を立ち上げ | 海
AMP(Accelerated Mobile Pages) HTMLしてみたという話 / masuP.net
Googleさんが発表したモバイル端末での表示高速化のAMP HTMLに対応してみたよ、という話です。 Introducing the Accelerated Mobile Pages Project, for a faster, open mobile web 概要などは上記見てもらえれば感じはつかめると思いますし、日本語で紹介してる記事だとKenichi Suzukiさんの紹介記事を見ると分かるかと思います。 なぜやってみようかと思ったかというと、「javascriptが無い静的なHTMLとCSSのページは爆速で表示したるで！」というGoogleさんの粋な計らいかと勘違いし、ほとんどが静的なページであるこのブログもサクーっと対応できたりするんじゃね、と思ったからですが、ちょっと苦労しました。 なおブログを完全に対応させたのではなく、記事ページのみ別にAMP HTML用の記事を出力してい
HTMLReaderというフレームワークがすごい - まさたか日記
HTMLをクライアント側でちょっとパースする要件にてiOSで使えるHTMLパーサを調べると、いくつかあるのですが、HTMLReaderというのがたまたま目につきました。 // Bridge-Headerにて、HTMLDocument.hとHTMLSelector.hをインクルードしてる import UIKit import Alamofire class ViewController: UIViewController { @IBOutlet weak var textView: UITextView! override func viewDidLoad() { super.viewDidLoad() let req = request(.GET, "http://number.bunshun.jp/articles/-/821939") req.responseString { (_,
電話番号リンク2種類のスキーム：貴女は「tel:」派？ 「callto:」派？
Redmine上でユーザーの電話番号カスタムフィールドからリンクを張りたいと思い、カスタムフィールド定義の「値に設定するリンクURL」フィールドでtel:%value%と記述しましたが、なんとなく恐れていたとおり、パソコンでこれをクリックしてもSkypeが起動しませんでした。 この問題について書かれたページです： Geek alert … tel: or callto:? 電話番号リンクのスキームは、公式には「tel:」と定められていますが、一方でSkype（ひいてはMicrosoft）は、独自に「callto:」を用いているのはご存知のとおりです。 スマホではtel:が効くことが多いようですが、パソコンではtel:は効かないようです。 より個別のスキーム対応について書かれたページです： How to mark-up phone numbers? PHPコードにより環境を判別していずれかの
入力フォームのプレースホルダーを使ってはいけない
入力フォームのプレースホルダーテキストは、入力欄にどんな情報を入れたのかをユーザーが思い出すことや、エラーのチェック・修正を難しくしてしまう。また、視覚や認知機能に障害のあるユーザーにはさらなる負担となる。 Placeholders in Form Fields Are Harmful by Katie Sherwin on May 11, 2014 日本語版2014年6月17日公開 コンテクストに沿った説明やヒントは、入力フォームのそれぞれに何が入るかを明確にするのに役立つ。その結果、入力が促進され、コンバージョンレートは向上する。ヒントの提供方法はいろいろとある。実装として一般的なのは、入力フォーム内に説明を入れるやり方だ。しかし、残念ながら、入力フォーム内のプレースホルダーはユーザビリティに役立つよりも損なうことのほうが多いことがユーザビリティテストでは繰り返し示されている。 ラベル
ブラウザにやさしいHTML/CSS
1. HTML/CSS 〜 「お・も・て・な・し」をブラウザにも 〜 TAKEHARU IGARI Front-end Engineer / Evangelist ブラウザにやさしい <html5j パフォーマンス部 第⼀回勉強会 /> 2. プロフィール • TAKEHARU IGARI 猪狩 丈治 - 所属 • 株式会社 Lei Hauʼoli フロントエンドエンジニア - 略歴 • 表⽰速度、保守性、ブランディング、SEOを考慮したフロントエンドエンジニアリングを得意とし、 現在、各ナショナルクライアントのプロジェクトや、株式会社リクルートの主要サービスのフロント エンド開発に携わり、⾼速化コンサルティングも⾏う。 - 執筆 • 技術評論社「WEB+DB PRESS」 • Vol.66 〜我流コードからの卒業HTML構造化指南 • Vol.59 〜「Webサイト超⾼速化実況中継 ──
connpassのHTML編集がクソすぎる
とある理由で、connpass.comでHTML編集を行ったが、これがクソすぎる。 まず、connpassはHTMLしか編集できない。CSSを記述することは出来ない。したがって、fontのようなクソみたいなタグが乱立する。font要素は、HTML5では廃止されている要素である。にわかに1990年代のインターネットに戻ってしまった。 しかし、HTML5では、style要素にscoped attributeをつけることで、style要素の任意のflow contentの先頭に書くことができるのだ。 <div> <style scoped="scoped"> p { color : red ;} </style> <p> This is red. </p> </div> <p> This is probably not red. </p> まだHTML5がwhatwgによって策定されていた当時は
「blinkタグ」の開発者が明かすテキスト点滅タグが生まれた知られざる理由とは？
By Steven Martin 「blinkタグ」とはテキストを点滅させる効果を持つHTMLコマンドの1つで、多くの人々に最も嫌われるタグの1つとして知られています。Netscape Navigator 2.0に独自に実装されていたものですが、IEはもともとサポートしておらず、2013年にFifefoxがblinkタグのサポート廃止したこともあり、近頃は見かけることもなくなっています。そんなBlinkタグの発明者自らが、「なぜblinkタグを開発したのか？」というおもしろおかしな開発秘話を語っています。 the origin of the tag - www http://www.montulli.org/theoriginofthe%3Cblink%3Etag 1994年当時、ルーさんはNetscapeを設立したエンジニアの１人であり、現在のポピュラーなブラウザの先駆けとなったテキスト
p15.jp
iTunes アフィリエイトプログラムのリンク表示エリア、毎回同じ形式で、かつ公式ツールで吐き出されるものではなくカスタマイズしたものを使いたい！と探して見つけた AppHtmlブックマークレット・メーカーを愛用させていただいております。ブックマークレットなので記事編集画面から移動せずにサクッと使えていいかんじ。 検索対象（Mac アプリ、iPhone アプリ等）や、吐出されたコードの表示方式（ポップアップや各種エディタで便利に使えるかんじのやつ等）の設定ができ、設定の保存もできます。予約語（テンプレートタグみたいなやつ）と HTML・CSS を駆使したら、工夫次第でどんな表示方式にもできそうです。 アプリ紹介によるユーザー同士、開発者とユーザー等々、色々な繋がりを生み出すことが出来るツールを目指し、これからも進化させていけるようオープンソース化しました。ツールのバージョンupや修正の議論
p15.jp
favicon といえば 16 x 16 のちっこい画像、という時代もありましたが、今は様々なブラウザや機能に対応するために複数のサイズやフォーマットを用意するのがよいようです。 ファビコンのサイズや形式についての読むと頭が痛くなる偏執的なカンニング・ペーパーです。 ファビコン・カンニング・ペーパー あちこちに書かれている（古いかもしれない）情報を見るよりも、ここをチェックするのがいいんじゃないかと思いました。 audreyr/favicon-cheat-sheet hail2u/favicon-cheat-sheet favicon.ico の作成は X-Icon Editor が便利すぎます。
なぜ 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
jQueryにおけるフォーム値の取得と設定 : JavaScript好き
スポンサードリンク 概要 フォーム(form)の値を取得する場合、jQueryではval()メソッドやprop()メソッドを使う。 ただし、inputの種類によって癖があるので、各typeにおける｢値取得｣｢値設定｣などをメモする。 また、prop()を利用するのでjQueryのバージョンには注意が必要。 このコードを試したときのバージョンは｢1.10.1｣。 テキスト val()メソッドを使だけ。未入力の場合は、｢""｣(空文字)なので安全。 HTML <input type="text" name="animalText"> 値取得 var newText = 'トラ';$(':text[name="animalText"]').val(newText); 値設定 var animal = $(':text[name="animalText"]').val(); ラジオ val()メソ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Brackets - Web デザインを認識する最新のオープンソースコードエディター
Windows RT 版 Office の開発 - Microsoft Office 製品マーケティングブログ - TechNet Blogs
Which browsers support <script async="async" />?
なぜ html の form は PUT / DELETE をサポートしないのか？
