3 Cool Techniques For Your Next Web Design Project
2017年3月27日 CSS, jQuery, Webサイト制作 Webデザインの勉強を始めたという方によく質問されるのが、「どうやって勉強すればいいですか？」。私はWeb制作の学校の学生だった頃から実践しているふたつの事があります。素敵だなって思えるWebサイトを見つけたら、どのように作られているのか自分なりに分析してみること。そしてそこで使われている技を実際に試してみること。そこで今日は最近見かけた素敵Webサイトと、そのサイトで使われていた技術を解説してみたいと思います！ ↑私が10年以上利用している会計ソフト！ 準備：分析＆実践に役立つツール Chrome、Safariなら付属のデベロッパーツール ChromeとSafariならブラウザーにはじめからデベロッパーツールなる開発のためのツールがついています。私が愛用しているのはこのツール。表示しているWebページのHTMLやCSSが確
やっとHTML5とCSS3の「現状での」全貌が自分なりに見えた。 - Webディレクションやってます blog｜Webディレクター名村晋治の仕事感やサービス・ツールなど雑感交じりの備忘録
先日m-schoolさんでやっている「ここがすごい！CSS3入門講座」を受講してきました。 講師は関西つながりでもある森 和恵（もり かずえ）さん。 講座名で受講を決めたので、講師が誰かを知ったのは当日の午前中だったという（笑） 内容は実際に手を動かす内容もあり、カリキュラム的にも入門講座として疑問に思っていたところが網羅されていて、講師の森さんも教え上手で、とてもいい内容でした。 で、こういった技術系のセミナーをガッツリ受けるのは、実は結構久しぶり。 色々な理由はあって、 自分自身が以前より実装の現場から離れてしまっている。 昔より技術の知識習得に対して腰が重くなってきている。 何が出来るかよく分からず、動けなくなっていた。 っていうのが結構大きなところ。 どの比率が高いわけでもなく、それぞれがぼんやり絡まって、なかなかそういったセミナーに行くことをしなくなっていた感じです。 使えるH
[CSS]HTML5対応、さまざまなデバイスのMedia Queriesを使ったリセット用スタイルシート -320 and up
320 and up [ad#ad-2] Media Queriesとはビューポートのサイズやカラーなどユーザーの環境ごとに異なる最適なスタイルシートを条件式のように適用できるもので、下記のようにブラウザのサイズを変更すると、レイアウトがそれに合わせて最適なものを提供できるようにすることができます。 サイトを640x480で表示したデザイン Media Queriesの詳しい説明は、以前の当サイトの記事も参考にしてください。 CSS3のMedia Queries（メディアクエリ）の使い方と実装例 [ad#ad-2] 320 and upのスタイルシートの構成 スタイルシートの構成は、最小限なものとなっています。 リセット用のスタイルシート カラー用のスタイルシート タイポグラフィ用のスタイルシート Media Queriesで予め用意されているのは、下記のサイズです。 480px 768p
HTML5とCSS3をページ全体or少しずつ導入するチュートリアル
デモページの全体のキャプチャ 下記は各ポイントを意訳したものです。 全体をHTML5化しても、面白そうなCSS3のエフェクトを少しずつ適用しても面白そうです。 ウェブページにHTML5を導入 ウェブページにCSS3を導入 ウェブページにHTML5を導入 デモページのHTMLの構造は、下記のようになっています。 HTML5：ページのベース 各エレメントを配置する前のHTMLのベースは、下記のようになります。 <!DOCTYPE html> <html lang="en"><head> <meta charset="utf-8" /> <title>Ferris Buller on Abduzeedo</title> <link rel="stylesheet" href="style.css"> <!--[if IE]> <script src="http://html5sh
2011年、押さえておきたいウェブデザインの11のトレンドとテクニック
Web Design Trends in 2011 [ad#ad-2] 以下、各ポイントを意訳したものです。 1. HTML5 + CSS3 2. シンプルなカラースキーム 3. モバイル対応 4. 視差効果 5. タッチスクリーン 6. 奥行き 7. 大きい写真の背景 8. 素敵なドメイン名 9. QRコード 10. サムネイルデザイン 11. Life Stream 1. HTML5 + CSS3 HTML5とCSS3はリリースされてから今日まで、あまり多くは使用されませんでした。しかし、この2011年、多くのサイトで採用されるようになるはずです。 多くのデザイナーはFlashから離れてはじめています。次の2つのサイトを見てみてください。 Scribblertoo(Flash) ここで注意してほしいのは、FlashとHTML5は敵対するものではないことを理解しておいてください。問題は、
HTML5+CSS3用のブラウザのスタイルをリセットするテンプレートファイル -HTML5 Reset
HTML5+CSS3の環境で汎用的に利用できるHTML・スタイルシート・スクリプトなどのファイルを一式にまとめたテンプレートを紹介します。 ファイル構成：コメント無し版 各ファイルの説明 index.html HTML5の要素を配置した汎用的に利用できるHTMLファイル。各スタイルシートファイルも埋め込まれています。 css/main.css @import用のスタイルシートです。 css/reset.css Eric Meyerの「Reset CSS」です。 css/core.css ベースとなるスタイルが定義されています。 css/_patches 各ブラウザ用のスタイルシートです。 css/_print プリント用のスタイルシートです。 js Modernizrがセットされています。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Loading...
IBM Developer
http://www.designwalker.com/2010/06/html5-template.html
http://shoonm.com/2010/03/html5css3.html