HTML5におけるinput要素のpattern、type属性のおさらい - QiitaDeleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
現場のプロが教える、2015年 IE8対応のHTMLはこう書け 【HTML5】
By: slavik_V こんにちは。 最近、納期の迫った仕事がいくつかあって忙しかったせいで、ブログ更新が滞ってます。（言い訳） 本来は、前回の続きを書く予定だったんですが、間に合いませんでした。 ですから、以前まとめていたやつを急遽引っ張り出してきました。 今回は技術記事です。 興味ない方は華麗にスルーしてくださいね。 HTML5 勧告済み 2014年10月29日にW3C（ウェブで利用される技術の標準化をすすめる国際的な非営利団体)から正式にHTML5が勧告されました。 これはどういうことかというと、Webページ(HTMLファイル)はHTML5で書くことをオススメするということです。 皆さん、HTML5で書いてますか？ ちなみにcss3は？ モジュール群（機能ごとのグループ）で、勧告されているものとされていないものがあります。 つまり使えるものと使えないものがあるということです。 です
2015年 コーディングはHTML5で。IE8以下の対策も忘れずに
前回、「次回はHTMLの要素についてお話しさせていただきます」と申し上げましたが、急遽予定を変更してお送りします。 「2015年の今、HTMLはどのバージョンで書くべきか」という問題です。 去年（2014年）の10月29日にW3C（ウェブで利用される技術の標準化をすすめる国際的な非営利団体)から正式にHTML5が勧告されたので、もう答えは出てるようなものですが、これからHTMLを書こうという方の中には、 「結局どうすればいいの？」 と思われている方がいるかもしれませんので改めて取り上げようと思いました。 （HTMLを勉強中で基本をご存知ない方は、結論だけ読んで他は飛ばしてくださって結構です） いきなり結論：やっぱりHTML5 僕の意見はこうです。 これから作るサイトに関してはHTML5で記述すべきだと思います。 その理由は3つです。 1. HTML5以外でコーディングされた既存サイトは将来
Webフロントエンド表示速度、最速化手法まとめ - Qiita
やりすぎても無駄になることがあるので、必要十分なバランスを見極めて実施する。主に社内のプログラマ向けのまとめ資料。他にもあれば追記していく予定。 ページの状態を調べる まず対象のページが、どういった状態なのかを調べる。 Google PageSpeed Insights これを100点満点にする必要はないが、赤くなっている項目に関しては、なるべく対応したほうが良い。モバイルサイトにも対応しているので便利。 https://developers.google.com/speed/pagespeed/insights/?hl=ja pingdom 実際にページにアクセスしてスピードを計測できる。海外サーバなので、けっこう遅い…。最適化前と最適化後で比較するのに使うといい。 http://tools.pingdom.com/fpt/ Chromeデベロッパーツール コンテンツの読み込み順序／速度
Learn web development | web.dev
Stay organized with collections Save and categorize content based on your preferences. Explore our growing collection of courses on key web design and development subjects. An industry expert has written each course, helped by members of the Chrome team. Follow the modules sequentially, or dip into the topics you most want to learn about.
[Web] スマートフォンとHTML5のCanvasを用いたお絵描きを実装してみた - YoheiM .NET
HTML5のCanvasというグラフィックを描ける機能と、スマートフォンを掛け合わせて、 スマホで絵を書くWebアプリのサンプルを作成してみました。 サンプルアプリを紹介しつつ、 Canvasで絵を描く実装、タップイベントとの連携、スマホ対応のためのmetaタグなどの 実装内容を記載します(*´∇｀*) サンプル内容 Canvasを用いたお絵描きアプリを、iPhoneに最適化してみました。 Canvas上を指でなぞると線を書くことが出来て、 色の変更と線の太さの変更を行うことができます。 また、ホーム画面に保存としてから、作成されたホーム画面アイコンから起動すると、 検索バーなどの無いアプリ風な画面で立ち上がります。 ぜひお試してみて頂けると幸いです。 http://www.yoheim.net/labo/html5/canvas/canvasForTouch.html お絵描き機能の実装
![[Web] スマートフォンとHTML5のCanvasを用いたお絵描きを実装してみた - YoheiM .NET](https://cdn-ak-scissors.b.st-hatena.com/image/square/0dc58f26cebb68beec9cb28a7d6a919c6d1425b5/height=288;version=1;width=512/https%3A%2F%2Fwww.yoheim.net%2Fimage%2F041.png)
[HTML5] Canvasの内容をLocalStorageで保存／読み込み - YoheiM .NET
HTML5のCanvasを用いて、絵を描くWebアプリケーションを前に作りました。 そのお絵描きWebアプリケーションに、HTML5のLocalStorageを利用した 一時保存機能を追加しました。 今回はその実現方法をブログに残しておきたいと思います。 http://www.yoheim.net/labo/html5/canvas/freeHandWrite2.html Canvasの内容をLocalStorageに保存する Canvasでは、内容をbase64エンコーディングすることで、文字列をして取得出来ます。 それで取得した文字列をLocalStorageに保存する。 // Canvasからbase64エンコーディングされた画像データを取得する var canvas = document.getElementById("myCanvas"); var base64 = canvas
HTML5のlocalStorageの使い方のまとめ
HTML5のlocalStorageの使い方のまとめです。 ここではlocalStorageを使った文字列の保存・取得方法に加え、オブジェクトのデータの保存・取得方法についても説明します。 記事の最後にサンプルも掲載しています。 １．localStorageとは localStorageは、cookieのようにデータをブラウザで永続的に保存できる仕組みで、ブラウザを閉じてもlocalStorageのデータは保存されます。 データは、キーと値の組み合わせで保存されます。 localStorageはwindowsオブジェクトのプロパティなので、正しくは「window.localStorage」ですが、「window.」は省略して実装することができます。 ２．localStorageにデータを設定する localStorageにデータを設定するには、setItem()を利用します。 localS
意外と簡単。HTML5のデスクトップ通知を実装してみる - MUGENUP技術ブログ
こんにちは、MUGENUPの倉成です。 最近はWebアプリでもデスクトップ通知が出来るものが増えていますよね。 今日はそんなデスクトップ通知の実装を取り上げてみようと思います。 便利なライブラリ デスクトップ通知はブラウザによって実装が異なり、各ブラウザの対応は手間がかかるので、今回はクロスブラウザ対応を簡単にできるHTML5-Desktop-Notificationsを使います。 他のデスクトップ通知のライブラリにはnotifyもあり、こちらもHTML5-Desktop-Notificationsと同じくらいのStarが付いているようです。 使い方 さて、ここからはHTML5-Desktop-Notificationsの使い方をREADMEにそって ブラウザ対応状況の確認 ユーザーに通知の許可を求める 通知を発行 の3段階で説明していきたいと思います。 なお、本記事はこのコミット時のコー
HTML5 Japan Cup 2014 by html5j
HTML5 Japan Cup とは？ HTML5 Japan Cup（5jCup）とは、WebデザイナーやWebエンジニアのためのクリエイティブ・アワード（コンテスト）です。運営委員や審査員、はたまたボランティアに至るまでが、同じくWebに関わる人たちで構成されています。そんな私たち（皆さん）が自分たちのために作り、盛り上げていくのが、このアワードです！ 超豪華なスポンサー陣が提供する様々な賞に応募することができますので、複数の賞を同時に受賞することも夢ではありません。まずはテーマを選び、動作するプラットフォームを選び、そしてその他の特別賞などを目指して応募作品を作りましょう！また、5jCupを盛り上げるための公式ハッカソンや準公式イベントなど、さまざまなイベントを企画していますので、皆さん楽しみにしていてください。 :)
AndroidやiPhoneのHTML,CSS,JavaScriptのバグまとめ
AndroidやiPhoneのHTML,CSS,JavaScriptのバグまとめ AndroidやiPhoneなどのスマートフォンではHTML,CSS,JavaScriptにバグが多くてコーディングが大変になります。そこでバグを紹介しているサイト、記事をまとめてみました。(中にはバグではなく仕様なものもあるかもしれません) iOS 8.4.1の:hover問題 iOS 8.4.1で:hoverを指定していると1タップでページ遷移できない問題 【STINGER5】AndroidのChromeで＆nbsp;が「・」になってる気がする | ビビビッ を に変更すると直るとのこと。 Mobile Safari 8でposition: fixedした擬似要素が完全に位置が固定されない - Weblog - Hail2u.net Mobile Safari 8でposition:
Styling Form Controls – WebKit
Styling Form Controls Using Pseudo Classes WebKit provides a way to give CSS styles to form controls. Some form controls can be styled through pseudo classes. This article will illustrate how we can customize their appearances using the pseudo classes. Note: These pseudo classes are not standardized and we might change the behavior in the future. <progress> By giving "-webkit-appearance: none;", <
[CSS, HTML] スマートフォン(iPhone, Android)ブラウザのバグまとめ(2011年版)
[CSS, HTML] スマートフォン(iPhone, Android)ブラウザのバグまとめ(2011年版) Androidの所為で工数が増えてウザイとか、AndroidのWebkitはWebkitじゃねぇとか スマホのCSS3関係はどうしてもAndroidをdisる感じの内容になりますね！ 特に明記がないものはすべてWebkitについてです。 見つけ次第順次追加予定。 タイトル変更、増えてきたので目次追加しました。 この記事はiOS5、Android 3以前について記載したものです 【css】 タップ時にz-indexを無視して下の要素に枠がつく(Android) 【html, css】 マルチバイト文字にfont-weight:boldが効かない(Android) 【css】 border-radiusのコーナーがジャギる(Android) 【css】 box-shadow、text-
![[CSS, HTML] スマートフォン(iPhone, Android)ブラウザのバグまとめ(2011年版)](https://cdn-ak-scissors.b.st-hatena.com/image/square/8d71ff5111e05619a10d29bb40d7aebaa75c8fbc/height=288;version=1;width=512/https%3A%2F%2Fs0.wp.com%2Fi%2Fblank.jpg)
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
フォームのテキストエリアをより使いやすくするテクニック集
How to store a (dictionary) object in JavaScript localStorage?
Fabric.js Javascript Canvas Library
HugeDomains.com
re-dzine.net situs togel online toto 2023 -
公海555000kk线路检测—首页（欢迎您）
Tumblr