タグ

web制作に関するhalohalolinのブックマーク (357)

  • Adobe® BrowserLab

    Adobe BrowserLab requires Adobe Flash Player version 10.0.0 or higher and Javascript enabled in your browser. Click the button below to download and install the latest version of Flash Player now Adobe BrowserLab An easier, faster solution for cross-browser testing Preview and test your webpages on leading browsers and operating systems - on demand. Adobe BrowserLab makes it easier and faster t

    halohalolin
    halohalolin 2010/02/13
    IE/Safari/Firefox/Chromeでのブラウザ表示結果を比較できるWebサービス
  • 【楽天アフィリエイト】楽天モーションウイジェット:ブログパーツ無料提供!アフィリエイトツールで稼ごう - make

    ■初めてご利用の方は、こちらでログインまたは楽天会員登録をすると楽天アフィリエイトの利用者(バートナー)として登録されます。 ■ご利用に際しては、楽天アフィリエイトパートナー規約にご同意いただく必要があります。 ■サービスをご利用の方には、楽天アフィリエイトからのお知らせ(メール)が配信されます。

    halohalolin
    halohalolin 2010/02/12
    サイトの内容に合わせた商品を自動的に楽天市場の中から紹介する(要:楽天アカウント)
  • ブラウザが落ちてもフォーム内容が消えないようにするjQueryプラグイン「jQuery autosave」:phpspot開発日誌

    ブラウザが落ちてもフォーム内容が消えないようにするjQueryプラグイン「jQuery autosave」 2010年01月19日- rikrikrik.com - jQuery autosave plug-in ブラウザが落ちてもフォーム内容が消えないようにするjQueryプラグイン「jQuery autosave」。 データを編集中にフォームに書き込んでいて、ブログ記事などが消えたりするとても悲しい気持ちになりますが、このプラグインを使えばデータをブラウザのクッキーに保存してくれて、次にアクセスした時にリストアできるという素晴らしいプラグインです。 クッキー保存のため、サーバに保存する必要はないですし、手軽に使うことができそうです(ブラウザごとにクッキーに依存した文字数制限などは存在すると思います) こういうことを1からやろうとすると結構大変ですが、毎度のことながら、jQueryプラグ

    halohalolin
    halohalolin 2010/01/21
    Cookieにフォームの内容を自動保存する。IEでページ戻り(history.go(-1))の際に、新しいタブを作ったりすると入力内容が消える問題にも対応できそう!
  • 複数のCSS/JavaScriptを結合&圧縮·phpFlair MOONGIFT

    phpFlairはPHP製Webベースのオープンソース・ソフトウェア。jQueryなどのJavaScriptフレームワークやCSSフレームワークを用いていると、ついつい一度のアクセスで多数のコネクションが張られるようになる。これではサーバの負荷はもちろんクライアントでも表示が遅くなってしまう。 利用するサンプル(公式サイトより) そこで考えたいのがJavaScript/CSSファイルをそれぞれ結合して一度のアクセスで済ませてしまう方法だ。手作業でもできるが、メンテナンスを考えると自動処理の方が便利そうだ。phpFlairを使えばそれを簡単に実現できる。 phpFlairはPHPで作られているのでPHPを使ったプロジェクトでは手軽に導入できそうだ。JavaScriptファイルやCSSファイルを表示する際にphpFlairを経由して呼び出すことでキャッシュしたり、レスポンスのヘッダにもキャッシ

    複数のCSS/JavaScriptを結合&圧縮·phpFlair MOONGIFT
    halohalolin
    halohalolin 2010/01/09
    JavaScriptファイルやCSSファイルを表示する際にphpFlairを経由して呼び出すことでキャッシュ・結合したり、レスポンスのヘッダにもキャッシュ指定をして負荷を下げられるようになる
  • Google、ページの表示範囲シミュレートツール「Browser Size」発表

    「何%の人がページのどこまで表示できるか」を視覚的に見せてくれるWebデザイナー向けのツールがGoogle Labsに登場した。 米Googleは12月16日、Webページがユーザーからどのように見えているかをシミュレーションするWebデザイナー向けツール「Browser Size」をGoogle Labsの機能として公開したと発表した。 Webページでは、重要なコンテンツやダウンロードボタンなどはスクロールしなくても見える位置に置くことが重要だ。例えばGoogle Earthのダウンロードボタンの位置を100ピクセル上に移動しただけで、インストール率が10%増加したという。 だが、PCの解像度やWebブラウザの表示サイズなどの要因で、ユーザーによって表示している範囲は異なる。Browser Sizeでは、サイトの入力枠にシミュレートしたいページのURLを入力すると、表示できる範囲を示す半

    Google、ページの表示範囲シミュレートツール「Browser Size」発表
    halohalolin
    halohalolin 2009/12/17
    「何%の人がページのどこまで表示できるか」を視覚的に見せてくれるWebデザイナー向けのツールがGoogle Labsに登場した。
  • 製品の特徴についてカッコよく表示できるjQueryプラグイン「Feature List」:phpspot開発日誌

    製品の特徴についてカッコよく表示できるjQueryプラグイン「Feature List」。 次のような、製品の紹介なんかでどこかで見たようなUIパーツを簡単に実装できるみたいです。 実装方法 最初はちょっと難しいような気もするのですが、実はかなり簡単で次のように<div>以下に2つのulを置いておきます <div id="feature_list"> <ul id="tabs"> <li> <a href="javascript:;"> <img src="services.png" /> <h3>Services</h3> <span>Lorem ipsum dolor sit amet consect</span> </a> </li> <li> <a href="javascript:;"> <img src="programming.png" /> <h3>Programming<

    halohalolin
    halohalolin 2009/12/14
    会社のトップページなどに使えそう
  • スクロールした位置についてくるサイドバーをjQueryで実装するサンプル例:phpspot開発日誌

    スクロールした位置についてくるサイドバーをjQueryで実装するサンプル例が公開されており、チュートリアルと共にダウンロード可能になっています。 サンプルを見ると、殆どの面倒なことがjQuery側にてやってくれるため、非常に簡単なプログラムになっています。 付いてくるのがリアルタイムにしすぎるとガクガクして酔いますが、ちょっとした遅延があったあと、アニメーションして付いてくるので、動きとしてもよいですね。 jQueryの学習用に、また実際にサイトにサクッと組み込んでみる際にもよさそうですね。 以下のエントリを参照してください。 Scroll/Follow Sidebar, Multiple Techniques | CSS-Tricks

    halohalolin
    halohalolin 2009/12/05
    フレームの代わりとしてメニューに使えそう
  • dfltweb1.onamae.com – このドメインはお名前.comで取得されています。

    このドメインは お名前.com から取得されました。 お名前.com は GMOインターネットグループ(株) が運営する国内シェアNo.1のドメイン登録サービスです。 ※表示価格は、全て税込です。 ※サービス品質維持のため、一時的に対象となる料金へ一定割合の「サービス維持調整費」を加算させていただきます。 ※1 「国内シェア」は、ICANN(インターネットのドメイン名などの資源を管理する非営利団体)の公表数値をもとに集計。gTLDが集計の対象。 日のドメイン登録業者(レジストラ)(「ICANNがレジストラとして認定した企業」一覧(InterNIC提供)内に「Japan」の記載があるもの)を対象。 レジストラ「GMO Internet Group, Inc. d/b/a Onamae.com」のシェア値を集計。 2023年5月時点の調査。

    halohalolin
    halohalolin 2009/12/02
    モバイルサイトのWebデザイン15選/携帯サイトの制作に入る前に確認しておきたいチェック項目/携帯サイトをHTMLではなくPHPで組むときのDOCTYPE分岐方法/iPhone対応ウェブページにするおまじない/携帯からのアクセス振分け方法
  • CSSとJavaScriptを組み合わせたアニメーションライブラリ·emile MOONGIFT

    emileはCSS/JavaScript製のオープンソース・ソフトウェア。Webブラウザ上でアニメーションを行う際、まず思いつくのはFlashを使った手法だろう。だがそこまで複雑なアニメーションでもなく、そもそもFlashを扱うのが苦手な場合はどうしたら良いだろう。そこで使えそうなのがJavaScriptだ。 動作サンプル 最近のJavaScriptは表現力が高く、簡単なアニメーションくらいなら十分に実現できるようになっている。さらにCSSを使うことで位置の設定も容易に、色の変更もできるようになる。それを使って作られているのがemileだ。 emileはPrototype.jsやjQueryといった有名なライブラリを使わずに作られている。アニメーションを使いたいとなった途端に重たいフレームワークを導入というのでは萎えてしまう。わずか50行程度でアニメーションを実現しているのだから面白い。

    CSSとJavaScriptを組み合わせたアニメーションライブラリ·emile MOONGIFT
    halohalolin
    halohalolin 2009/11/24
    Prototype.jsやjQueryといった有名なライブラリを使わずに作られている。アニメーションを使いたいとなった途端に重たいフレームワークを導入というのでは萎えてしまう。わずか50行程度と軽い。
  • 一つのHTMLファイルを使ったiPhone最適化サイトライブラリ·Magic Framework MOONGIFT

    Magic FrameworkはiPhone向けのオープンソース・ソフトウェア。日においてもiPhoneが約200万台発売されたという噂だ。ある程度の市場性が出てきたと言えそうだ。そうなるとネイティブアプリや最適化サイトへの需要も高まってくるだろう。 メインメニュー 幾つかのiPhone向けWebサイトテンプレートがあるが、Magic Frameworkもその一つだ。だが特徴的なのは全体で一つのHTMLのみ提供するという点だ。そしてHTMLファイルをJavaScriptで分断し、スライダを使って表示を切り替えられるようになっている。 何ページもあるようなサイトコンテンツを一つのHTMLで表現できる。例えば小説サイトで最初のページを目次に、各見出しごとにページを分割して表示するような方法が考えられる。1ページなので汎用的なテンプレートではないが、マッチする場面もありそうだ。 ページ切り替え

    一つのHTMLファイルを使ったiPhone最適化サイトライブラリ·Magic Framework MOONGIFT
    halohalolin
    halohalolin 2009/11/24
    iPhone向けWebサイトテンプレート、全体で一つのHTMLのみ提供するという点だ。そしてHTMLファイルをJavaScriptで分断し、スライダを使って表示を切り替えられるようになっている。
  • PHPを使って3分で作る3キャリア対応ケータイサイト | ke-tai.org

    PHPを使って3分で作る3キャリア対応ケータイサイト Tweet 2009/11/17 火曜日 matsui Posted in ソフト紹介, 全キャリア対応 | 28 Comments » 日は3分で3キャリア対応ケータイサイト作れてしまうというPHPスクリプト、「らくらくケータイ3キャリアコンバーター(仮名)」を作成してみましたので、そのご紹介をさせていただきます。 先日のPHP勉強会で発表させていただきました。 ご参加いただいた皆様、当にありがとうございました。 発表資料をアップしてありますので、まずはこちらをご覧ください。 PHPを使って3分で作る3キャリア対応ケータイサイト View more documents from ketaiorg. ということで、「3分で作る」とは謳っているものの、ドコモ用に作られたHTMLを他キャリア用にコンバートするだけの、実に簡素な作りです。

    halohalolin
    halohalolin 2009/11/18
    docomo向け携帯サイトを簡単に3キャリア対応サイトにする方法。要PHPとmod_rewrite。
  • css-lecture.com

    halohalolin
    halohalolin 2009/11/17
    画像の下に回り込みをしない/横並びのブロックレベル要素の配置の調整系/リストの最初だけ border を消す/ページ分割系のナビゲーション/注意事項系に使える/リンクが途中で折り返しされるの防ぐ
  • jqueryでウェブサイトをリッチにするプラグインまとめ « vanillate

    jqueryのプラグインのまとめです。jqueryはjavascriptベースのライブラリのようなもの。画像やメニューに動的な操作を与えたりすることが可能です。また、HTMLソースも複雑になりにくく、デザインをCSSで操作可能なものが多く、ウェブデザインをより魅力的にすることができます。 フェードしながらスライドするjQueryプラグイン デモ jQuery ListMenu Plugin デモ 大量のアイテムもすっきりとリストにできます。 Sliding login panel with jQuery  デモ ログインフォームもおしゃれに。常に表示しておく必要はないですよね。アニメーション付きでぶらさがってくるこんなプラグインはいかがですか。 create a better jQuery stylesheet switcher デモ スタイルシートをjqueryで切り替えるプ

    halohalolin
    halohalolin 2009/11/05
    フェードしながらスライド/大量のアイテムもすっきりとリストに/ログインフォームもおしゃれに/スタイルシートを切り替え/スマートなフォーム遷移/タグクラウドを美しく/ツイッターライクなログインフォーム
  • IDEA * IDEA

    ドットインストール代表のライフハックブログ

    halohalolin
    halohalolin 2009/10/22
    文字数をカウント/残り文字数をカウント/エラーチェック/リストから入力/リストへ入力
  • [CSS]スタイルシートの記述をより読みやすくする5つのルール

    <textarea name="code" class="css" cols="60" rows="5"> #nav{ border: solid 1px #DEDEDE; color: #000; padding: 10px; width: 650px; } </textarea>

    halohalolin
    halohalolin 2009/10/22
    プロパティをアルファベット順に/子のエレメントをインデント/コメントでセクション分け/スペースでツラ揃え/同じプロパティをグルーピング
  • PHPで携帯のエージェント判別法 - phpspot

    docomo,au,softbank,pcのいずれかを判別するコードです。 Net_UserAgent_Mobile ユーザの送出するUserAgentよりキャリアを判別します。 使い方 <?php require_once('Net/UserAgent/Mobile.php'); $agent = Net_UserAgent_Mobile::singleton(); if ($agent->isDoCoMo()) { echo "docomo\n"; if( $agent->isFOMA() ) { echo "foma\n"; } } elseif ($agent->isVodafone()) { echo "softbank\n"; if( $agent->isType3GC() ) { echo "3G\n"; } } elseif ($agent->isEZweb()) { ec

    halohalolin
    halohalolin 2009/10/19
    docomo,au,softbank,pcのいずれかを判別するPHPのコードです。
  • http://www.rider-n.sakura.ne.jp/regexp/regexp.php

    halohalolin
    halohalolin 2009/10/10
    正規表現を試せるwebサービスの一つ、左に書式がまとめられているのでわかりやすい、半角文字のみを検索する場合は『[\x20-\x7E]+』、全角文字の検索は『[^\x01-\x7E]+』
  • ButtonMaker webボタン素材 自動生成サイト - 無料

    このページはホームページ制作に使えるボタン素材を生成するサイトです。 ご希望の項目を設定し、右上の「create」ボタンをクリックするだけで簡単にボタンを作れます。 ※印の付いた項目は設定必須で、その他の項目は必要に応じて設定してください。 各項目の「カラー」の欄は入力欄をクリックするとカラーピッカーが表示されますので、 ご希望の色をクリックすると自動で入力できます。 背景色の「方向」はグラデーションにする際の1から2への色の向きです。 テキストの位置2は自由に指定したい場合に設定すると、 位置1の指定を無視して、位置2で指定した位置にテキストを表示します。

    halohalolin
    halohalolin 2009/10/06
    ボタンを生成できる国産Webサービス。工夫次第で様々なデザインを作成できます。手軽なので簡単なボタン作成時に役立ってくれそう。(かちびと.net)
  • CSSツールラボ

    CSSツールラボでは、よく使うCSSを自動作成するツールを提供しています。 使い方は簡単で、左メニューから自動作成したいスタイルシートを選び、 フォーム上のプロパティを入力して、 最後に出力ボタンを押すだけです。

    halohalolin
    halohalolin 2009/10/06
    cssで良く使われるa:hoverやa:link等のスタイルを指定してプレビューできるというシンプルなWebサービスですが、地味に便利だったり(かちびと.net)
  • 画像写真素材 足成

    「写真素材 足成」は、全国のアマチュアカメラマンが撮影した写真を、写真素材として無料で提供しています。個人、商用を問わず全て無料でお使い頂け、その上、煩わしいクレジットやリンクの表記、ユーザー登録は一切不要。Web、紙、動画他、あらゆる媒体で写真素材としてのご利用が可能です。更新も365日毎日行っております!

    halohalolin
    halohalolin 2009/10/06
    全国のアマチュアカメラマンが撮影した写真を、写真素材として無料で提供しています。個人、商用を問わず全て無料でお使い頂け、その上、煩わしいクレジットやリンクの表記、ユーザー登録は一切不要。