第9回 ページ内リンクをスムーズにスクロールさせるには | gihyo.jp
ease系のJavaScriptプラグインで気持ちいい動きを演出 1ページの中に複数のページ要素を配置し、ページ内リンクで移動するタイプのサイトを目にするようになってきました。たとえば2007年度のグッドデザイン賞 コミュニケーションデザイン部門を受賞した石川県の温泉「多田屋」のサイトは、Flashを使い、1枚の大きな絵の中をスクロールして移動するUIとなっています。 図1 石川県の温泉「多田屋」のサイト 最近では、Flashではなく、JavaScriptを使って静的なページの中を遷移するタイプのサイトも見かけるようになりました。たとえば「Pline Studios of Architecture」はとても美しいUIとなっています。 図2 JavaScriptでページ内を移動する「Pline Studios of Architecture」 実装にはMITライセンスのscrollto.js
第1回 SVGの基礎知識 | gihyo.jp
SVGは比較的古くからある仕様の1つですが、2010年3月にマイクロソフトがInternet Explorer 9でのサポートを表明してから一気に注目が高まりました。そんな古くて新しいSVGを今から使える情報と、将来の展望を全4回の集中連載で解説します。 SVGとは SVG（Scalable Vector Graphics）は、XMLベースのベクターグラフィック言語もしくは画像フォーマットです。W3Cによってその仕様が定義されており、画像フォーマットとして用いる場合は拡張子.svgが使用され、MIME形式はimage/svg+xmlが用いられます。 SVGの現状 Firefox、Safari、Google Chrome、Operaなどのブラウザが既にサポートしており、Internet Explorerもそのバージョン9、具体的にはInternet Explorer 9: Platform
第1回 とにかく、今すぐ「お知らせ」だけMTで更新できるようにしたい（1） | gihyo.jp
最低限のMTカスタマイズで企業サイトをCMS化するためのテクニック MTをCMSとして使いたいけど、なんだか敷居が高いまま挫折してしまったデザイナーの皆さんにお聞きします。 「MTのインストール方法やMTでできることはいろいろなところで語られているのでだいたい理解できた。でも、いざMTのカスタマイズをしようと思って、ドキュメントや書籍を見ても自分のやりたいことがすぐにわからない。MTの概念とか、MTタグの種類とか、テンプレートの種類とか、変数とか、覚えることが多すぎて、結局何もわからず諦めてしまった……」。そんな経験はありませんか？ この連載ではサンプルサイトを通して必要最低限の操作と最低限のMTタグで、1つの企業サイトをMT化していく過程をシンプルに、誰にでもわかるように解説していきます。ここで紹介するカスタマイズのテクニックは必要最低限、MTの機能の一部分でしかありませんが、いつの
第1回 はじめよう！Progression | gihyo.jp
はじめまして。本連載の執筆を担当する青木と申します。Flashのフレームワークである「Progression」が4月22日にバージョンアップされました。本連載では、約8回に渡ってProgression4の使い方を説明していきます。少しでも分かりやすく作成手順を紹介することで、Progressionの素晴らしさを伝えることができればと考えています。どうぞよろしくお願いいたします。 初回は、Progressionの沿革や概要を説明し、Progression環境を設定します。 Progressionの需要と事例 Progressionは、実案件にも耐えうるフレームワークとして、数々の案件に使用されてきました。導入事例数は、把握しているだけでも軽く1,000件を超えます。Flashサイトを見た時に右クリックを押すと、Progressionの文字をよく見かけるはずです。 それだけ、Flashサイトを
第1回 ウェブブラウザとJavaScriptの未来 | gihyo.jp
こんにちは、id:os0xこと太田昌吾です。今回から、クロスブラウザ対策を中心としたJavaScriptの初級から中級の方向けの連載を開始します。JavaScriptの基礎的な文法は理解されているという前提での解説となりますので、ご了承ください（間違いやすい、わかり難いと思われるところは適宜補足します）。初回である今回はJavaScriptやウェブブラウザの背景など盛りだくさんの内容でお届けします。 JavaScriptのイマ JavaScriptは2010年現在において、最も重要な言語となりつつあります。旧来はすべての処理をサーバーで行って、結果をウェブブラウザ上に表示するだけというのがウェブの一般的な姿でした。2005年に登場したGoogle Mapsを一つの契機として徐々にウェブブラウザ・クライアント側での処理が見直され始め、近年ではクラウドやSaas、そしてHTML5の流行によ
独学で極める “Webデザイン”の技と心：第10回 CSS Spritesでサイトを高速化｜gihyo.jp … 技術評論社
今日は、CSSを使ってサイトを高速化するテクニック「CSS Sprites（CSSスプライト）」についてのお話をさせていただきます。 サイトの高速化というと、プログラムの最適化を行ったり、サーバのチューニングを行ったりというイメージがあるかと思います。実はCSSを上手に使うことによっても、サイトの高速化を行うことができます。しかも、かなりの効果が期待できるのです。 CSS Spritesとは？ 通常、ウェブページを制作する場合、デザインファイル（psdやpngなどの画像）をスライスし、HTMLのimg要素として埋め込んだり、CSSの背景画像として指定していることと思います。 それらの画像を一つにまとめ、１度の読み込みでのリクエスト数を減らすテクニックのことを「CSS Sprites」と呼びます。 このテクニックは、以前からマウスオーバーメニューを実現する際にも使われていたものでもありま
2010年のJavaScript：「これまで」と「これから」 | gihyo.jp
2010年のJavaScriptと題しまして、JavaScript周辺の「これまで」と「これから」についてまとめてみたいと思います。 2009年までのJavaScript JavaScriptは各ブラウザベンダなどが個別に実装するという特殊性から、ブラウザ（実装）ごとの非互換性の問題に悩まされ続けてきた言語です。まず、そのJavaScriptの歴史を簡単に振り返ってみます。 ECMA-262 3rd editionとスピードコンテスト JavaScriptはNetscape社によってLiveScriptという名前で誕生し、その後ECMAScriptとして標準化が進みました。1999年12月にECMA-262 3rd editionが策定されてから、Internet ExplorerのJScript、MozillaのSpiderMonkey（TraceMonkey）、SafariのJav
ブラウザだけでできる！wonderflではじめるFlash制作 記事一覧 | gihyo.jp
第4回Papervision3Dとtweensyを利用してアニメーションをつくっていく 大塚雅和 2009-03-23
第6回 Firebug要らずなChromeのWeb Inspector | gihyo.jp
こんにちは、太田です。今回はChrome拡張の開発時のノウハウとして、開発ツールの解説をお送りします。Google ChromeにはWebKit由来のWeb Inspectorというデバッグツールが搭載されています。以前にも少しだけ紹介しましたが、今回は具体的な使い方まで掘り下げて解説します。なお、今回のWeb Inspectorの解説はChrome拡張だけでなく、JavaScriptを使ったウェブアプリケーションの開発に一般的に役立つノウハウとなっています。 WebKitのWeb Inspector Chrome拡張の開発の必需品であるWeb Inspectorですが、こちらは元々WebKit（Safari）で開発されたもので、Google Chrome（Chromium）に搭載されているものはさらに機能が追加されています。FirefoxにはFirebugという定番ツールがありますが、そ
第1回 W3Cとその標準化プロセス | gihyo.jp
「Web標準」や「XHTML+CSS」といった言葉がでてくるWeb制作の本には、必ずといっていいほど「W3C」という言葉が登場します。今回はそのW3CというWeb標準化団体について、またW3Cが策定する仕様がどのように作られているのかをとりあげます。 そもそもW3Cって? W3C（World Wide Web Consortium）とは、Web技術の標準化を行う団体のひとつです。「Webの可能性を最大限に引き出す」ことを目的とし、Webの発明者であるTim Berners-Leeによって1994年に組織されました。W3Cは今日までにHTML（3.2以降）やXML、XHTML、CSSといった、数々の仕様を公開しています。 W3Cには、IT関連企業をはじめとする400近くの会員が参加しています。Apple, Google, Microsoft, Mozilla, Operaといったブラウザベ
第1回 jQueryにふれる | gihyo.jp
はじめに ここ数年、JavaScriptライブラリを使ってサイトを製作するという機会がどんどん増えてきました。今まででであれば、JavaScriptのライブラリを使う・使わないに関わらず、その製作の多くはプログラマーの方が行っていたと思います。しかし近年、そのJavaScriptライブラリも種類が増えてきて、プログラミングの知識がなくても簡単に導入できるようなライブラリも出てきました。そのため、それらの使い手はプログラマーからWebデザイナーやマークアップエンジニア側へとシフトしつつしている部分もあります。 そんな数多くあるJavaScriptライブラリの中でも、Webデザイナーなどのプログラミング知識がない人でも比較的導入のしやすいのが『jQuery』です。このjQueryの魅力は、その使いやすさとプラグインの豊富さにあり、プラグインだけでも、すでに使ったことがあるという方も多いと思いま
【PHPで作る】初めての携帯サイト構築 記事一覧 | gihyo.jp
運営元のロゴ Copyright © 2007-2024 All Rights Reserved by Gijutsu-Hyoron Co., Ltd. ページ内容の全部あるいは一部を無断で利用することを禁止します。個別にライセンスが設定されている記事等はそのライセンスに従います。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
もっと便利に！jQueryでラクラクサイト制作（実践サンプル付き） 記事一覧 | gihyo.jp
第2回 楽にリストをストライプ模様にする | gihyo.jp