タグ

ブックマーク / codezine.jp (35)

  • Webサイト高速化対策の現状

    はじめに はじめまして、こんにちは。クラスメソッド株式会社でWebを担当している野中です。 この度、「これから身につけるWebサイト高速化テクニック」と題して記事を連載させていただくこととなりました。 連載ではWeb担当者やWebデザイナー、コーダーの方々に向けて高速化に関する手法や技術について調べ、身につけたテクニックを細かな解説を加えて紹介していきます。中には少し難しいテクニックも含まれますが、できる限り分かりやすく、すぐに実践できるよう紹介していきたいと思います。とても長い連載ですが、よろしくお願いいたします。 なお、連載はクラスメソッド開発ブログで連載されている「身につけておきたいWebサイト高速化テクニック」の増補改訂版です。 連載の流れ 連載はできるだけ多くの方に興味を持っていただけるように、最初に高速化対策の全体像と必要な知識を紹介します。その後、具体的な高速化対策と

  • HTML4から変化したHTML5のマークアップ ここが違う!サンプルで見るHTML5(2)

    CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

    HTML4から変化したHTML5のマークアップ ここが違う!サンプルで見るHTML5(2)
  • ここが違う!サンプルで見るHTML5:CodeZine

    CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

    ここが違う!サンプルで見るHTML5:CodeZine
  • 「演算子と優先順位」 ~マンガでプログラミング用語解説

    CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

    「演算子と優先順位」 ~マンガでプログラミング用語解説
  • ここが違う! Adobe Fireworksで軽快プロトタイピング

    CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

    ここが違う! Adobe Fireworksで軽快プロトタイピング
  • 「Google Chrome Deveoper Tools」はこう使う! 基本機能チュートリアル & GDD 2011 セッション概要

    CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

    「Google Chrome Deveoper Tools」はこう使う! 基本機能チュートリアル & GDD 2011 セッション概要
  • サイトの見せ方をひと工夫するjQueryプラグイン

    CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

  • 構造に沿って要件をUMLで具体的に定義する

    はじめに 「上流工程で作成するドキュメント」というとWordやExcelなどを使い、自然言語(文章など)で表したものをイメージすると思います。しかし、昔から自然言語での表現はあいまいになることが多く、仕様としては適さないことが指摘されています。 皆さんも過去に意味不明な要件定義書を受け取ったことや、「いろいろ書いてあるけど重要なのはたった1行だった」あるいは粒度がバラバラで統一感のないものなどさまざまな要件定義書を見てきたと思います。 前回は要件定義には構造があり、その構造を使うことで要件をスムーズに定義できることを紹介しました。今回はその構造に沿った具体的な定義の方法をご紹介します。 リレーションシップ駆動要件分析(RDRA)は、その名のとおりリレーションシップが重要な意味を持ちます。その情報のつながりを直接表現できる図的な方法としてUMLを使います。 UMLを使って要件を定義する 視点

  • サーバー側コーディング不要のGoogle App Engine開発環境「jsonengine」

    はじめに 稿では、JavaPythonによるサーバー側コーディングを一切必要とせずにGoogle App Engineによる開発を実現するツール「jsonengine」について紹介します。 対象読者 Google App Engineに興味はあるが経験のない方。JavaScriptやActionScriptによるクライアント開発、またはiPhoneAndroidによるスマートフォン開発の経験のある方。JavaPythonの開発経験は不要です。 必要な環境 最低動作環境は次のとおりです。 Java SE 5 jsonengineって何? 「jsonengine」は、JavaPythonによるサーバー側コーディングを一切必要とせずにGoogle App Engineによる開発を実現するオープンソースのツールです。このツールは、昨年開催された「Mashup Awards 6」において「

  • Dojo道場 ~ 第1回「グラフを使いこなす(前編)」

    企業における大規模なWebアプリケーション開発を想定して設計されたJavaScriptライブラリー「Dojo Toolkit」は、欧米では、すでに多くの企業のサイトやイントラネットでも利用されており、IBMではソフトウェア製品のフロントエンド構築技術として全面的に採用されています。シリーズでは、豊富な機能の中から厳選した、ビジネス・アプリケーションのためのベスト・プラクティスを中心に、Dojo Toolkitの活用方法をご紹介します。 エンタープライズ開発に適したJavaScriptライブラリ AjaxやダイナミックHTMLなどの要素技術を利用した、リッチ・インターネット・アプリケーション(RIA)が企業システムのフロントエンドとしても注目されていますが、Webブラウザ上で稼働するRIA開発に欠かせないのが、JavaScriptライブラリーです。JavaScriptライブラリーは一般的に

  • jQuery UIのウィジェットを使ってみよう

    対象読者 jQuery UIに興味があり、使ってみたいと思っている方 必要な環境と準備 jQuery UIのダウンロード 執筆時点のjQuery UIの最新版は、1.8.2です。第1回を参考にダウンロードしましょう。 Dialog Dialogは、ユーザのアクションに対して、警告、問い合わせなどのダイアログを表示させたいときに利用します。例えば、ユーザ登録時に「登録します。よろしいですか?」といったメッセージや、データを削除させる時に「削除しますが、よろしいですか?」などのメッセージを表示させることができます。 今回は、ボタンをクリックすると、[OK]と[キャンセル]ボタンが配置されたダイアログが表示されるサンプルを取り上げます。 リスト1にDialogプラグインの使用例を、図1、図2に実行結果を示します。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML

    jQuery UIのウィジェットを使ってみよう
  • プログラミング未経験から始めるPHP入門 (3) 変数の扱い方を習得しよう!

    CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

    プログラミング未経験から始めるPHP入門 (3) 変数の扱い方を習得しよう!
  • PHPで作成する携帯会員サイトの基本

    CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

    PHPで作成する携帯会員サイトの基本
  • 原文をスラスラ読みたい! 「MSDNライブラリによく出る英単語 100選」(1/2):CodeZine

    はじめに MSDNライブラリには、マイクロソフトの技術情報が大量に掲載されていますが、英語版に比べ、日語版の内容は中途半端なのが実状です。 たとえば、スレッドの優先順位を設定する「SetThreadPriority」関数の説明を見ると、英語版には「Windows Server 2008およびWindows Vistaでは、スタートアップやレジストリのRUNから自動実行されたプログラムに対するスレッドの優先順位指定が、システム開始から60秒程度効かない」との注意書きがありますが、日語版にはありません。 また、仮想ディスクの情報を設定する「SetVirtualDiskInformation」関数を検索すると、英語版には説明がありますが、日語版には項目自体がありません。 そこで記事では、MSDNライブラリの英語版がスラスラ読めるように、とはいきませんが、英単語で引っかかることが少なくなる

    原文をスラスラ読みたい! 「MSDNライブラリによく出る英単語 100選」(1/2):CodeZine
  • ECサイトのカート機能を作成しよう! プログラミング未経験から始めるPHP入門~応用編(7)

    はじめに 連載では、PHPまたはプログラム初心者の方を対象に、PHPを用いたWebアプリケーションの作成方法を説明していきます。 今回は、応用編ECサイトのカート機能を作成します。PHPの環境構築に関しては第2回を参照ください。 対象読者 プログラミングが初めてでこれから学習する予定の方 プログラミングの経験はあるがPHPが初めての方 これまでの連載 初級編 第1回「プログラムってなんだろう?PHPってどういうもの?」 第2回「XAMPPをインストールして開発環境を整えよう!」 第3回「変数の扱い方を習得しよう!」 第4回「条件分岐と繰り返しを使いこなそう!」 第5回「入力フォームを使ってデータを送受信しよう!」 第6回「データベースの基礎を理解しよう!」 第7回「PHPを使ってデータベースを操作しよう!」 応用編 第8回「ECサイトの設計書を理解しよう!」 第9回「ECサイトの商品一覧

    ECサイトのカート機能を作成しよう! プログラミング未経験から始めるPHP入門~応用編(7)
  • Windows環境でのPerlとPHPの連携

    はじめに PerlはC言語とよく似た構文を使用するスクリプト型プログラミング言語で、sed、awk、twなどUNIXで人気の高い機能も備えています。LinuxマシンではPerlがプリインストールされていますが、Windows環境でPerlを使用するには、コマンドプロンプトからPerlスクリプトを実行するためのプログラムをダウンロードし、インストールする必要があります。Perlは汎用的な言語であり、データベースアクセス、グラフィックプログラミング、ネットワークプログラミング、CGIプログラミングなどを必要とするWebアプリケーションでよく利用されます。 稿では、次の方法について説明します。 WindowsPerl(無償のActivePerlディストリビューション)およびCygwin(UNIXライクな環境)をインストールし、設定する PHPを使ってPerlスクリプトを実行する さまざまなタ

    Windows環境でのPerlとPHPの連携
  • HTML 5のマルチメディア(オーディオ/ビデオ)サポート紹介

    はじめに もう何年も前のこと、プログラマになりたての私が主に携わっていたのは、プレゼンテーションやコンピュータゲームを構築するためのマルチメディアアプリケーション(ビデオ、オーディオ、アニメーション、テキストを組み合わせたプログラム)の開発でした。1990年代初頭には、作業のほとんどをMacromedia Directorで行っていました。ビデオはもちろん、オーディオを扱うWebアプリケーションの開発でさえ夢物語と思われていた頃でしたが、RealNetworksの登場で状況は一変しました。RealNetworksは初めてのメジャーなストリーミングテクノロジであり、バッファにためたメディアコンテンツをインターネット経由で送信するという処理を可能にしました。のちにRealNetworksはWebページへのメディアコンテンツの埋め込みにも対応しました。 HTML内にビデオやオーディオに関する専用

    HTML 5のマルチメディア(オーディオ/ビデオ)サポート紹介
  • CSSでマルチカラムレイアウト

    はじめに 連載では、「クロスブラウザに対応したデザインテクニック」をテーマに、保守性や互換性に優れたXHTML+CSSの書き方を紹介していきます。 今回は、連載の総まとめとして、CSSでマルチカラムレイアウト(段組レイアウト)を実現する方法を紹介します。CSSでマルチカラムレイアウトを実現する方法はいろいろありますが、今回は、最も基的な方法として、前回の記事で解説した「floatプロパティ」および「positionプロパティ」を利用した、「フロート型」と「ポジショニング型」のレイアウトテクニックを紹介します。同時にページレイアウトで起こりがちな問題とその対処方法についても扱います。 対象読者 XHTMLCSSの基を理解している方。 Web標準サイトの実践的な作り方に興味のある方。 必要な環境 (X)HTMLCSSを記述するエディタと、それを確認するブラウザがあれば、特別な環境は

    CSSでマルチカラムレイアウト
  • プログラムをブラッシュアップするテクニックを学ぼう! プログラミング未経験から始めるPHP入門~応用編(9)

    シリーズ最終回となる今回は、前回までで作成したECサイトのプログラムに、関数、トランザクション管理、Smartyなどを用いて、最後のブラッシュアップを行います。なお、連載では、PHPまたはプログラミング初心者の方を対象に、PHPを用いたWebアプリケーションの作成方法を説明していきます。 はじめに 連載では、PHPまたはプログラム初心者の方を対象に、PHPを用いたWebアプリケーションの作成方法を説明していきます。 今回は、応用編ECサイトのカート機能を作成します。PHPの環境構築に関しては第2回を参照ください。 対象読者 プログラミングが初めてでこれから学習する予定の方 プログラミングの経験はあるがPHPが初めての方 これまでの連載 初級編 第1回「プログラムってなんだろう?PHPってどういうもの?」 第2回「XAMPPをインストールして開発環境を整えよう!」 第3回「変数の扱い方を

    プログラムをブラッシュアップするテクニックを学ぼう! プログラミング未経験から始めるPHP入門~応用編(9)
  • ページレイアウトに使えるCSSプロパティ

    はじめに 連載では、「クロスブラウザに対応したデザインテクニック」をテーマに、保守性や互換性に優れたXHTML+CSSの書き方を紹介していきます。 今回は、ページレイアウトする際に、最低限おさえておきたい代表的なCSSプロパティとして、floatプロパティ、および、positionプロパティを中心に解説します。これらプロパティの使い方をマスターすれば、レイアウトの幅が広がるはずです。 対象読者 XHTMLCSSの基を理解している方。 Web標準に準拠したクロスブラウザなレイアウトデザインに興味のある方。 必要な環境 クロスブラウザなデザインを目指すうえでターゲットとする視覚系ブラウザを一通りご用意ください。稿では、Web標準を比較的よくサポートしているFirefox、およびユーザー数が多く表示上の問題の多いWindows Internet Explorer 6を中心に解説しています

    ページレイアウトに使えるCSSプロパティ