HTML5でWebページを作成する時のベースになるシンプルなコードで書かれたテンプレート
HTML5でWebページを作成する時に役立つ、必要最小限のブランクのテンプレート、ナビゲーションを上部に固定配置、写真画像などの背景画像をブラウザいっぱいに表示させるシンプルなテンプレートを紹介します。 画像: Girly Drop HTML5で作成する時の必要最小限のテンプレート ナビゲーションを上部に固定配置 背景画像をブラウザいっぱいに表示 ※以前、当ブログで紹介したものもバージョンアップされています。 HTML5で作成する時の必要最小限のテンプレート まずは、HTML5でWebページを作成する時にのシンプルなブランクのテンプレート。 A Generic HTML5 Template -GitHub ライセンスはCC0 1.0で、個人でも商用でもクライアントの案件でも無料で利用できます。利用する際に、許可やコピーライトの明記などは必要ありません。 テンプレートはIE9や8以下への最低
Mozilla Re-Mix: YouTubeビデオ（HTML5）の再生速度を自在に変更できるFirefoxアドオン「Html5 Youtube Video Speed Controller」
YouTubeを視聴中、時間短縮のために少し再生速度を速めたい、じっくり確認したいのでスローで再生したい、というようなことがあります。 YouTubeをHTML5で視聴している場合、こんな時でもプレーヤーの設定ボタンをクリックしてメニューを呼び出すことで、プリセットされた速度に調整することが可能です。 しかし、このメニューからは5段階でしか速度調整ができないようになっており、それ以上の速度で再生したり、それ以下の速度で視聴することができません。 動画によっては、もっと高速に、もっとスローにという場合もあると思いますが、デフォルトプレーヤーではこのような場合あきらめるしかありませんね。 Firefoxに「Html5 Youtube Video Speed Controller」というアドオンをインストールしておけば、こんな時でもさらに詳細な再生速度調整を行うことができるようになります。 「H
最も使えるWebアプリケーション開発ツールは？HTML5開発ツール天下一武道会 #html5jplat｜CodeIQ MAGAZINE
最も使えるWebアプリケーション開発ツールは？HTML5開発ツール天下一武道会 #html5jplat 2014.06.20 Category：勉強会・イベント Tag：HTML5 ,html5j ,html5jplat ,Visual Studio 日本マイクロソフトのセミナールームで開催された「HTML5 開発ツール天下一武道会（IDE+α編:初夏の陣）。Webアプリケーション開発に最も優れた天下一の開発ツールとは何か。 今回紹介されたのは話題の「YEOMAN」「Visual Studio」「WebStorm」「Dreamweaver」。いずれの開発ツールが最強なのか、デモを交えたセッションが行われた。 by 馬場美由紀 （CodeIQ中の人） Web開発のscaffrolding（足場）ツール「YEOMAN」 最初に登壇したのは、ゼノフィの佐川夫美雄氏。 ゼノフィは「Sencha」と
すぐに使いたい！レスポンシブWebデザイン対応の無料HTMLテンプレート10選 | TechAcademyマガジン
すぐに使いたい！レスポンシブWebデザイン対応のHTMLテンプレート30選 レスポンシブWebデザイン対応の【無料】HTMLテンプレートを紹介する記事です。スマートフォンやタブレットなどの多デバイスに対応できる、フリーテンプレートを集めてみました。海外サイトも多いですが、日本語表示が可能か確認済みです。 テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元：GMOリサーチ株式会社 調査期間：2021年8月12日～8月16日 調査対象：2020年8月以降にプログラミングスクールを受講した18～80歳の男女1,000名 調査手法：インターネット調査 スマートフォンやタブレットの普及に伴って、Webサイトを多デバイスに対応することが増えてき
HTTPリクエスト数削減テクニック1： インラインイメージ編
はじめに こんにちは、クラスメソッド株式会社の野中です。 前回の『Webサイト高速化に必要な画像形式の基礎知識』では、基本的な画像の書き出し方法について紹介しました。 この回からは数回に分けて、HTTPリクエストの削減テクニックについて触れていきます。 インラインイメージ CSS Spriteとイメージマップ SVGとWebフォントアイコン 画像からCSS3 本記事では「インラインイメージ」の基本的な知識と使い方、使いどころについて解説します。 対象者 今回の対象者は主にコーダー、フロントエンドエンジニアです。デザインとコーディングを合わせて担当するWebデザイナーも対象です。 コーダー・フロントエンドエンジニア Webデザイナー Webディレクター Web担当者 インラインイメージとは インラインイメージとは.gifや.pngなどをHTMLからリンクして読み込むのではなく、画像を文字列に
wri.peで学ぶ、イマドキのWebアプリの作りかた（前編）
エキスパートが手がけたプロダクトを題材に技術的な解説を行っていくシリーズ連載、今回は wri.peです。 難しい機能の実装や、先進的なAPIの利用を通じて、執筆者が得たノウハウを余すところなく紹介していきます。 HTML5を活用したメモ帳アプリ [wri.pe] 最近、仕事で作っているミイルが忙しかったり、趣味で作っているMobiRubyがなかなか進まなかったりして、個人でWebサービス的なモノを作っていない事が自分としてちょっと気になっていました。 そこで息抜きとして、ゴールデンウイークに集中してWebサービスを一つ作ろう！と思い立ち、wri.peというWebサービスの開発に着手しました。 wri.peは自分が使いたいと思えるメモ帳を作ったので、下記の様な特徴を持っています。 Markdownフォーマットをサポート Gmailの様なアーカイブ機能 全文検索 カレンダーへのマッピング iP
これなら分かる！WEB制作を無料で「学べる」サイトまとめ
作成：2013/02/4 更新：2014/11/01 Web制作 > 基本的なところを簡単に、楽しく覚えたい 自分でサービス作ったり、会社や違う職種でも 色々と「基本」はおさえておきたい 今回はサイト制作に必要な「基本的な知識・情報」を、分かりやすいサイトを中心にまとめました。必ずおさえておきたいスキル・知識です。 エンジニア速報は Twitter の@commteで配信しています。 もくじ １．HTML5 ２．CSS ３．レスポンシブ ４．配色 ５．視線誘導 / 心理学 ６．インターフェース / ユーザビリティ ７．SEO ８．ディレクション ９．アクセス解析 １０．WEBマーケティング １１．コピーライティング １２．ソーシャル １．HTML5 HTML5って何？ HTML5とは何かを簡単にまとめてみた - Yahoo! JAPAN Tech Blog Canvasについて知っておく
クロスブラウザでファイルのドラッグ＆ドロップ、Ajaxアップロードを可能にする「FileDrop」:phpspot開発日誌
クロスブラウザでファイルのドラッグ＆ドロップ、Ajaxアップロードを可能にする「FileDrop」 2012年08月24日- FileDrop ? cross-browser JavaScript Drag & Drop file upload ? Блог Прогера クロスブラウザでファイルのドラッグ＆ドロップ、Ajaxアップロードを可能にする「FileDrop」。 対応ブラウザであれば以下のブラウザでドラッグ＆ドロップによるファイルアップロードが可能になります。どのJSフレームワークにも依存せず単体で使えます。 IEではIFrameを利用した画面遷移なしのファイルアップロードが可能。 ファイルをドロップすると、各種イベントハンドラが起動されて、タイミングに応じた好きな処理を記述することも出来るみたい。 関連エントリ HTML5を使ったファイルアップロード用プログラム集 jQuer
1クリックでWordPressのテーマファイルの制作に必要なファイルが全部揃う -Underscores
HTML5ベースでWordPressのテーマを一から制作したいという人にぴったりな、商用でも無料で利用できるWordPressのテーマファイルの開発セットを紹介します。 Underscores -A Starter Theme for WordPress Underscoresのダウンロード Underscoresの特徴 Underscoresのダウンロード 自分用のWordPressのテーマファイルは、1クリックで必要なファイルが全部揃います。 「Theme Name」に好きな名前、例えば使用するサイトの名前（coliss）などを記入し、「Generate」ボタンをクリックするだけで、テーマファイル一式がダウンロードできます。 オプションはお好みで。 Underscoresの特徴 HTML5ベースのWordPressのテンプレートです。 404ページのテンプレートも用意。 オプションとし
HTML5、CSS3、JavaScriptがリアルタイム編集できる！軽量HTMLエディタ「Liveweave」 - Chrome Life
みなさんは、HTMLやCSSのコーディングには何を使っていますか？ デザイナーの方であればDreamweaverをメインで使っている人が多いと思います。 デベロッパーの場合は、自分の好きなテキストエディターを使いこなしているでしょう。 しかし、実際にはコーディングをしながら見た目や動きを確認するためにブラウザを横でたちあげてデバッグしながら作業を進めていくと思います。 コードを修正→ファイルの保存→ブラウザで更新→確認 この手順を繰り返すのですが、これがなかなか面倒です。 できれば、コードを修正したタイミングですぐに確認できるとベストですよね。 そこで今回ご紹介するのが、HTML5、CSS3、JavaScriptをリアルタイムに編集して確認ができる軽量HTMLエディタ「Liveweave」です。 「Liveweave」は、ブラウザ上で動作するHTMLエディタです。 コーディングエリアとレン
コードリーディングに最適！たった200行で作れるHTML5製テトリスのプログラミング学習ムービー - Chrome Life
みなさんは、フルスクラッチでテトリスを作ることができますか？ プログラマーといってもゲームを作る機会が少ないと、なかなかすぐには作れないと思います。 JavaScriptでなんとか作れそうな感じもしますが、すんなり実装はできない感じがします。 特にグラフィックやアニメーションをうまく使ったものを作るには、それなりの経験値が必要だと思います。 そこで、今回ご紹介するのが、教育目的で作られたHTML5製テトリスのプログラミング学習ムービーです。 HTML5 tetris - making of HTML5 tetris - making of 驚くべきことに、 たったの４５分でテトリスが完成！ それもフルスクラッチで、jQueryなどのライブラリーを一切使っていません。 Youtubeのムービーは早送りしていますが、動きを確認しながら実装しているのが分かります。 実際に、こちらでテトリスをプレ
「Meteor」は、JavaScript/HTMLで開発するリアルタイムWebアプリケーション基盤。何が起きているのかすぐに分からないほどすごい
「Meteor」は、JavaScript/HTMLで開発するリアルタイムWebアプリケーション基盤。何が起きているのかすぐに分からないほどすごい 「Meteor」は、Webアプリケーションを開発するためのフレームワークと実行環境を提供しています。アプリケーションはすべてJavaScript、HTML、CSSで記述できるため、サーバ側でRubyやPerlやJavaなどのプログラミングをする必要はありません。 TechCrunchの記事では、JavaScript/HTML/CSSだけでWebアプリケーションが開発できる点にフォーカスが当たり話題になりましたが、公開されたデモンストレーションのスクリーンキャストを見たところ、Meteorにはそれ以上に新しい仕掛けが盛り込まれていました（スクリーンキャストはこの記事の末尾に埋め込んであります）。 それは「リアルタイムなWebアプリケーションを構築す
HTML5アプリ開発基盤「Meteor」がすごい
サーバもクライアントもJavaScriptで記述できる「Meteor」が注目を集めている。サーバ上のコードが変更されると、クライアントも自動的に変更されるという Wikipedia MobileのiOS版がHTML5に 今年は、HTML5を使用したネイティブアプリ開発（ハイブリッドアプリと呼ばれます）が盛り上がりつつありますが、強力な事例が登場しました。WikipediaのiOSアプリがApache Cordova（PhoneGapのオープンソース版）を使って書き直され、Android版と同じソースコードを使用するようになったそうです（詳細：New Wikipedia app for iOS（and an update for our Android App））。 Opera 12ベータ版リリース Operaの次期メジャーリリースが近づいて来ました（リリース）。 一番大きな変化は、Oper
HTML5で綺麗なグラフを描くJSライブラリ「flotr2」
flotr2 (humble software development) HTML5 canvasで、グラフを描けるJavaScriptライブラリ「flotr2」が公開されています。 (英語) デモサンプルを見ると、種類が多くどれも綺麗なグラフで、アニメーションなどもできるようです。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
dfltweb1.onamae.com – このドメインはお名前.comで取得されています。
無料ホームページ作成 | ホームページの作り方 | Wix.com
HTML5では、div要素やh要素、p要素などのブロックレベル要素をa要素で囲っていいんです。 | MJ-WAVE.COM
HTMLの記述速度が劇的に向上。「WebMatrix」で“Zen Coding”を実現する拡張機能NOT SUPPORTED
ゲーム感覚でレイアウトを組み立てる、HTML5+CSS3に対応したレイアウトジェネレーター -PageBlox
IDEA * IDEA
