これからのWEB制作はPCサイトだけではなく、iphoneなどのスマートフォンやipadなどさまざまなデバイスでの閲覧を前提として作成しなければいけません。 iphoneサイトやAndroidサイトはHTML5やCSS3にかなり対応しているので簡単そうなイメージもありますが、縦画面、横画面など変化することを前提に構築しなければいけませんし、Androidは機種によって解像度が違う、機種によってCSSが適用されないという昔のモバイルサイトより大変なことがおきているようです。 またシミュレーターを使ったり、実機をたくさん揃えたり、レンタルしたりとPCサイトより手間な制作の時代に逆戻りですね・・。 友人に聞いたら現在は案件よってはiphoneのみ対応、iphoneとdocomoを対応、すべて対応などさまざまなようですね。まあこれは予算によるのかもしれませんね。 僕はまだ本格的なスマホサイトの仕事
スマートフォンサイトの基本のマークアップ スマートフォンサイトは、特に理由がない限りHTML5とCSS3で制作するのが一般的です。スマートフォンに搭載されているブラウザは、HTML5やCSS3の対応が比較的進んでいるため、PCサイトのように古いブラウザを意識しながら制作する必要はありません。これまでの総まとめとして、新しい技術を試すのにちょうど良いスマートフォンサイトを作ってみましょう。 基本のHTML5テンプレート ベースとなるマークアップは次の通りです。スマートフォンならではの記述がありますので、順を追って説明していきます。 [リスト01]スマホ用のHTML5テンプレート <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title></title> <meta name="viewport" content
Deep Blue Skyというサイトで、CSS3・HTML5のブラウザ対応状況一覧がまとまっています。 自分のブラウザのCSS3・HTML5対応状況を調べてくれるjavascriptライブラリ、Modernizrを使って調べたようですね。 ↑はMac Firefox3.5。ちょっと残念な感じですね。。 対応状況は以下のようになっています。 Internet Explorer 6, 7 & 8 Firefox 3.5 (Win) Google Chrome (Win) Opera 10 (Win) Safari 4 (Win) Safari 4が一番優れていますね。IEがひどいことになっている。。。 詳しくは以下からどうぞ。 Browser support for CSS3 and HTML5 姉妹サイトである以下のサイトでは、自分のブラウザの対応状況が見られます。IPとかも調べられますよ
By Louis Lazaris / November 14, 2011 / 37 Comments Updated: August 7, 2022 This is a question that has been answered in a number of different places. Unfortunately, the answers in some instances have not been good ones. In fact, they’ve either been way too optimistic and/or presumptuous — or else just downright wrong. Also, when we use the term “HTML5”, what exactly are we referring to? HTML5 cove
HTML5はXHTML1.0やHTML4を継承しつつ、使い方が大きく変わった点もあります。 よく利用されるHTML5の各要素の誤用されがちな例とそれを正しく適切に使う方法を紹介します。 You're Doing it Wrong: Common HTML Tag Misuses [ad#ad-2] 下記は各ポイントを意訳したものです。 <br>の誤用 <br>の間違った使い方 <br>のよくある誤用は、コンテンツ間にスペースをつくるために使用することです。 これはWYSIWYGエディタで作成するとよく起きる現象で、複数の空の行で隙間をつくります。 <br>の適切な使い方 <br>は文章を改行するために使用するものです。 段落に分けるには<p>を使用し、文章同士の間をあけるためにはCSSのmarginなどで間隔を設定します。 <div>の誤用 <div>の間違った使い方 HTML+CSSでペ
マークアップ HTML5では、Webページを制作する上で基本となるマークアップがHTML5で 大きく拡張された。また旧来から使われてきた要素に加え、近年のWebの用途に合わせて必要とされる要素も数多く追加されている。たとえば、文書構造を決定するための要素、ビデオやオーディオを再生する要素、その他、Webアプリケーションに役立つ要素などだ。 フォーム関連の機能も拡張された。これまで使われてきたテキスト入力フィールドやラジオボタンなどの基本的なコントロールに加え、数値を選択するためのスライダーや、日時を選択するデート・ピッカー【1】、特定の範囲の数値を選択する スライダー【2】、色を選択するカラー・ピッカー【3】など、数多くのフォーム・コントロールが追加され、JavaScriptやプラグインを使わずとも、リッチなユーザー体験を提供できるようになった。 【1】 【2】 【3】 Webページのスタ
What is an IP Address? An IP (short for “Internet Protocol”) address is a unique number assigned to every machine that connects to the internet. Nowadays, you can have multiple computers behind a router that share a single IP using Network Address Transformation (NAT). If you have ever used a wifi hotspot to access the internet, you’ve shared an IP address with someone. What’s the Difference betwe
<<< 前ページ:「「楽しむ」という発想がないと、絶対にうまくいかない。」 面白法人カヤックで演出部に所属するディレクターの片岡巧氏、そして技術部クリエイターの吾郷協氏。今回のコンテンツに至る経緯、制作過程、苦労について聞いた。 ──今回の企画では、ほかにも案がありましたか? 片岡●日本を代表するコンテンツ、あと世界を驚かせてくださいというお題をいただいたので、そんなにブレはありませんでした。漫画を軸に3案ほど提出した、という形です。当初は書道のような、ビジネス・アーキテクツさんが制作されたようなアイデアもあったのですが、最終的には「カヤックらしいものは何か?」と。で、いまの原型になるような企画ができあがった。 ──尺は最初から決まっていたんですか? 片岡●企画が決まって、次に私たちが考えたのは「どのアニメーターさんに発注するか」でした。そこで、以前から一緒にお仕事したかった神風動画さんに
This presentation is an HTML5 website Press → key to advance. Zoom in/out: Ctrl or Command + +/- Having issues seeing the presentation? Read the disclaimer HTML5* Web Development to the next level *Including other next generation technologies of the Web Development stack Rough Timeline of Web Technologies 1991 HTML 1994 HTML 2 1996 CSS 1 + JavaScript 1997 HTML 4 1998 CSS 2 2000 XHTML 1 2002 Tablel
米Apple社は6月4日、HTML5を中心として、CSS3、JavaScriptなどの「Web標準」と呼ばれる技術でつくったデモサイト「Apple HTML5」を公開した。 同サイトでは「HTML5 Showcase」と題して、ビデオを再生させながらパースをつけられる「Video」やテキストのまま装飾やサイズの変更ができる「Typography」など、全部で7つのデモンストレーションを見ることができる。 なお、同サイトはMacやiPhone、iPadなどのWebブラウザ「Safari」で見ることができるが、Internet ExplorerやGoogle Chrome、Firefoxなど、ほかのWebブラウザでは見られない場合がある。 Video Typography Gallery Transitions Audio 360° VR 「Apple HTML5」 http://www.ap
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く