『200サイトのiPhoneデザインを見て感じたスマートフォンの最適化』
本を買わずに解決するWeb制作の小技 ホームページ作成でちょっとしたことを参考書を買わずに解決する方法をPHP CSS Webデザイン jQuery Flashを中心に便利な技をまとめていきます！現在、長野県長野市の制作会社でWeb作成中！ 現在、私はiPhoneのWebデザインを集めた「iPhoneデザインボックス」を運営しています。 掲載しているデザインは、良いデザインだけでなく、レイアウトやUIなどにも注目しています。サイトを運営して、多くのサイトを見て感じたiPhone（スマートフォン）の最適化についてまとめてみました。 iPhoneデザインの最適化 目次デザインUIフルFlashURL デザイン当初のデザインの傾向としてグローバルメニューをアイコンにして、iPhoneのホーム画面を意識したデザインが流行っていました。 最近は、iPhone向けサイトの必要性が高まりとりあえず作った
『Webデザインのまとめサイトをさらにまとめてみた』
デザインに関する、すばらしいまとめ記事が多いのでそれをさらにまとめてみました。スマフォのWebサイト、モバイルサイト、PCのWebサイトのまとめで個人的に参考になるものをピックアップしました。 スマートフォンサイト» スマフォとかミニマルデザインに特化した、これからお世話になりそうなWebデザインギャラリー » スマートフォンサイトのデザイン集サイトのまとめ » デザインに優れたスマートフォンサイトのキャプチャを集めたサイト「iPhoneデザインボックス」とこの手のサイトのまとめ » iPhone スマートフォンサイトのデザインのまとめ » iPhone／スマートフォン ギャラリーサイトまとめ » 初心者でも分かる、iPhoneサイト制作に参考になるサイトのまとめ 携帯・モバイルサイト» 携帯サイトのデザインをするのに便利なまとめサイト » 携帯サイトのデザイン参考サイトまとめ » 携帯サ
『WebのスキルでiPad/iPhoneアプリ風のWebアプリ作成のまとめ』
本を買わずに解決するWeb制作の小技 ホームページ作成でちょっとしたことを参考書を買わずに解決する方法をPHP CSS Webデザイン jQuery Flashを中心に便利な技をまとめていきます！現在、長野県長野市の制作会社でWeb作成中！ iPhoneやiPadのアプリを作りたいけど、iPhoneアプリ初心者なので 作るにはObjective-Cを覚えたり登録したりお金かかったりとか iPhoneアプリの作成にはハードルがちょっと高い。 そこで、今までのWebの知識を活かして、Webアプリにしようと 思って試してみた。 基本的な知識を理解しなければいけないので、超簡単なWebアプリを作成してみた。 だた、写真を100枚表示するだけ。 Webアプリと呼べるのだろうか？ 今回は、基本的な知識を知りたかったのと分かりやすいので Webアプリと呼ぶことにします。 完成したものはこちら！iPhon
『IEでHTML5で作られたWebサイトを印刷対応させる方法』
本を買わずに解決するWeb制作の小技 ホームページ作成でちょっとしたことを参考書を買わずに解決する方法をPHP CSS Webデザイン jQuery Flashを中心に便利な技をまとめていきます！現在、長野県長野市の制作会社でWeb作成中！ HTML5で作成されているWebサイトを最近見るようになってきました。 IEはまだ未対応ですが、HTML5をIEやFirefox2でも使えるようにする方法を使うと 利用できます。 ブラウザで見るだけならいいのですが、これをIEで印刷（プリント）すると HTML5用のタグが認識せず、レイアウトが崩れたりするようです。 そこで、印刷した時に崩れないようにする解決方法としてJavaScript「IE Print Protector」 が紹介されていたのでメモ IE Print Protector デモはこちら これを使うと印刷時にレイアウトを崩れないようにす
jQueryでもっとフォームを使い易くするプラグインのまとめ
本を買わずに解決するWeb制作の小技 ホームページ作成でちょっとしたことを参考書を買わずに解決する方法をPHP CSS Webデザイン jQuery Flashを中心に便利な技をまとめていきます！現在、長野県長野市の制作会社でWeb作成中！ Webサイトでフォームは大事ですよね。 使いにくかったり、分かりにくかったり、入力多ってなったり したら離脱しますよね。 そこで使い易いフォームに改善できるjQueryのプラグインをまとめました。 フォームに先に何を入力するかを入れておいてフォーカスされたら 消すとか必要な時だけにヘルプを表示させるなどフォームをもっと 分かりやすくするライブラりが紹介されてます。 あなたのWebを入力しやすくするjQueryプラグイン10選 チェックボックスやラジオボタンを見映え良く 【1】「Checkbox」 ドロップダウンの領域を節約し見映え良く 【2】「comb
『CSSだけでボックスからはみ出した文字列を折り返す方法』
本を買わずに解決するWeb制作の小技 ホームページ作成でちょっとしたことを参考書を買わずに解決する方法をPHP CSS Webデザイン jQuery Flashを中心に便利な技をまとめていきます！現在、長野県長野市の制作会社でWeb作成中！ Web制作をしていてスタイルシートでDIVなどボックスを作って その中に長い文字列があるとはみでてしまうことがある。 とくにURLとか これをなんとかCSSで自動改行させたい。 全ブラウザではなく一部のブラウザは、横幅で折り返してくれる やり方があるけど、クロスブラウザで対応させた良いやり方が 思いつかなくて今まで困っていたので、これで解決できそうです！ Wrapping Long URLs and Text Content with CSS でスタイルシートのみでボックスからはみ出した文字列を 折り返すやり方が紹介されていました。 動作はこちらで確認
『IEのみにJavaScriptを適用・実行させる方法』
本を買わずに解決するWeb制作の小技 ホームページ作成でちょっとしたことを参考書を買わずに解決する方法をPHP CSS Webデザイン jQuery Flashを中心に便利な技をまとめていきます！現在、長野県長野市の制作会社でWeb作成中！ @cc_onって何だ？ ツイッターのタイムラインで気になったツイートがあったので見ていたら 見たことがないものがあったのでメモ @cc_on ってなに？ /*@cc_on ほげほげ*/ この暗号みたいなものを書くとIEのみにJSを有効にさせることがきるみたいです。 これは知りませんでした。 @cc_onを使ってIEを判別するやり方も役に立ちそうです。 JavaScriptでIEかどうかをたったの1行で判別する方法 var isMSIE = /*@cc_on!@*/false; if (isMSIE) { alert('IE!'); } else { a
『Google Analyticsで特定の場所のクリック数を計測する方法』
本を買わずに解決するWeb制作の小技 ホームページ作成でちょっとしたことを参考書を買わずに解決する方法をPHP CSS Webデザイン jQuery Flashを中心に便利な技をまとめていきます！現在、長野県長野市の制作会社でWeb作成中！ グーグルのアクセス解析「Analytics（アナリティクス）」で特定のリンクのみの クリック数を取得したい場合がある。 通常だと同じリンク先だと同じ数字になってしまうが本当に利用されている のか分からない。そこで利用率を調べる簡単な方法をメモ aタグに onclick="javascript:pageTracker._trackPageview('場所を示す名前');" を追加するだけ。 こんな感じに設置する<a href="#top" onclick="javascript:pageTracker._trackPageview('top');"> こ
『ブラウザを全面にしたときの可能表示サイズ一覧』
本を買わずに解決するWeb制作の小技 ホームページ作成でちょっとしたことを参考書を買わずに解決する方法をPHP CSS Webデザイン jQuery Flashを中心に便利な技をまとめていきます！現在、長野県長野市の制作会社でWeb作成中！ いつもサイトを作るときにブラウザの表示領域の幅が気になっていて 前から知りたいと思っていたところとても良いサイトを発見 サイトにアクセスした際に最初に見れるファーストビューがどこまで 見えるのかの参考にもなります。 ビスタのガジェットは常に見える状態で閲覧するのか気になるところですね。 あと、お気に入りを表示していない状態なので表示したらもっと狭くなってしまうので いつもこのあたりは考えさせられますね。 主要なブラウザをモニターいっぱいに広げた時の表示領域一覧表 コリスさんいつもとても役に立つ情報ありがとうございます！ Web Safe Area 64
『jQueryでサクッとXMLを解析して表示させる簡単な方法』
本を買わずに解決するWeb制作の小技 ホームページ作成でちょっとしたことを参考書を買わずに解決する方法をPHP CSS Webデザイン jQuery Flashを中心に便利な技をまとめていきます！現在、長野県長野市の制作会社でWeb作成中！ jQueryでXMLを解析して表示させるサンプルコードが紹介されていたのでメモ 簡単にXMLを扱えるんですね。 jQueryでXMLをパースして表示するコードサンプル例 Parse XML with jQuery jQueryでXMLをパースして表示する方法 $(document).ready(function () { $.ajax({ type: "GET", url: "books.xml", dataType: "xml", success: xmlParser }); }); function xmlParser(xml) { $('#loa
『ページを読み込んだ後に数秒後にフェードイン表示させる方法』
本を買わずに解決するWeb制作の小技 ホームページ作成でちょっとしたことを参考書を買わずに解決する方法をPHP CSS Webデザイン jQuery Flashを中心に便利な技をまとめていきます！現在、長野県長野市の制作会社でWeb作成中！ Webサイトを制作していてjQueryでどうしてもHTMLの読み込みが完了した あとに指定した時間後に表示させたくて、色々調べて組み合わせたら いい感じにできたのでメモしかも簡単に作れました jqueryでページが読み込まれた後に数秒後にフェード表示させる方法 $(function() { var count = 14500;//表示までの時間（ミリ秒） setTimeout(function(){$("#フェード表示させたいid名").fadeIn(1000);}, count); }); fadeInをfadeOutにすれば消すこともできます。
『flashのas3で印刷対応させる方法』
本を買わずに解決するWeb制作の小技 ホームページ作成でちょっとしたことを参考書を買わずに解決する方法をPHP CSS Webデザイン jQuery Flashを中心に便利な技をまとめていきます！現在、長野県長野市の制作会社でWeb作成中！ flashの印刷に関する情報が紹介されていたのでメモ AS3でのやり方なのでこれは今後使いそう！ FlashのActionscript3で印刷する方法 var printJob:PrintJob = new PrintJob(); if(printJob.start()) //←印刷ダイアログでOKが押されるとtrue { try { printJob.addPage(pageSprite1); } catch(e:Error){} //←エラーの場合は何もしない printJob.send(); } 実は、プリント機能をつけるのは簡単なんですね。 プ
『jQueryでURLのパラメーターを簡単に取得する関数』
本を買わずに解決するWeb制作の小技 ホームページ作成でちょっとしたことを参考書を買わずに解決する方法をPHP CSS Webデザイン jQuery Flashを中心に便利な技をまとめていきます！現在、長野県長野市の制作会社でWeb作成中！ jQueryでQueryStringをパースして配列で受け取れる便利関数が紹介 されていたのでメモ GETで値を渡したときにjavascriptで処理させたいときに 使えますね Get URL parameters & values with jQuery http://www.example.com/?me=myValue&name2=SomeOtherValue の?以降のパラメーターを配列で取得できます。 function getUrlVars() { var vars = [], hash; var hashes = window.locati
『jQueryでマウスオーバーでスライドアニメーションさせる(解説付き)』
本を買わずに解決するWeb制作の小技 ホームページ作成でちょっとしたことを参考書を買わずに解決する方法をPHP CSS Webデザイン jQuery Flashを中心に便利な技をまとめていきます！現在、長野県長野市の制作会社でWeb作成中！ jQueryとCSSを使ってマウスオーバーでメニューが スライドするアニメーションさせるサンプルが紹介 されていたのでメモ 動きもクールでいい感じなので使えそうですね。 Animated Navigation with CSS & jQuery このテクニックを使えば、サイトのナビゲーション以外にも 使えそうです！ 今まではメモだけだったけど今後は、スキルアップ のために解析していきたいと思います 既にコメントが入っているので分かりやすかったです。 間違っていたら教えてください HTML<ul id="topnav"> <li><a href="#">
『初心者なのでHTML5の基本的なことから知りたい！』
本を買わずに解決するWeb制作の小技 ホームページ作成でちょっとしたことを参考書を買わずに解決する方法をPHP CSS Webデザイン jQuery Flashを中心に便利な技をまとめていきます！現在、長野県長野市の制作会社でWeb作成中！ HTML5を最近ちょっとずつ勉強を始めているがまだまだ さっぱり分かりません HTML5の基本タグの説明とか組み方などが載っているので 最初に勉強するときによさそうだったのでメモ HTML5 and The Future of the Web ドキュタイプはこれになるのか。短かッ <!DOCTYPE html> まだCSSが対応していないブラウザがあるのでJavascriptで対応させる。 document.createElement('header'); document.createElement('footer'); document.creat
『CSSだけで文字列を省略して「・・・」を付けて表示する方法』
本を買わずに解決するWeb制作の小技 ホームページ作成でちょっとしたことを参考書を買わずに解決する方法をPHP CSS Webデザイン jQuery Flashを中心に便利な技をまとめていきます！現在、長野県長野市の制作会社でWeb作成中！ javascriptやphpを使わずに CSSだけで文字列を省略して「・・・」を付けて表示 させるテクニックを発見 前からできる感じだったが、つい最近知りました。 FirefoxとSafariのCSS対応--ボックスに収まらないコンテンツの表示方法 どうやるかというと text-overflow: ellipsis; を使う。 ellipsis は、はみ出した部分の最後に「・・・」を付け足す。 ちなみに clip は、何もつけません。 text-overflow: ellipsis; だけだと上手くいかないので やり方としては、 横幅(width)、w
『jQueryでhtmlのフォームを簡単に整列させる方法』
本を買わずに解決するWeb制作の小技 ホームページ作成でちょっとしたことを参考書を買わずに解決する方法をPHP CSS Webデザイン jQuery Flashを中心に便利な技をまとめていきます！現在、長野県長野市の制作会社でWeb作成中！ ちょっと使えるテクニックが紹介されていたのでメモ 綺麗に整列させるのって以外に手間なんですよね。 これを使えば楽にできます。 Justify elements using jQuery and CSS labelの横幅を一番長いサイズに合わせてます。 以下引用です。 $(document).ready(function() { var max = 0; $("label").each(function(){ if ($(this).width() > max) max = $(this).width(); }); $("label").width(ma
『javascriptでリアルタイムにテキストエリアの文字数をカウントする』
本を買わずに解決するWeb制作の小技 ホームページ作成でちょっとしたことを参考書を買わずに解決する方法をPHP CSS Webデザイン jQuery Flashを中心に便利な技をまとめていきます！現在、長野県長野市の制作会社でWeb作成中！ ちょっとしたものだがフォームのテキストエリアに使うと 結構便利なのでメモ onkeyupとonfocusに使用するといい感じにできる。 こんな感じ onkeyup="strLengthCount(value, 'textcount');" onfocus="strLengthCount(value, 'textcount');" /** * javascriptでリアルタイムにテキストエリアの文字数をカウントする */ //value テキストエリアのvalue //outid 表示するID function strLengthCount(value,
『Flash as2,as3で文字列の検索、置換をする』
本を買わずに解決するWeb制作の小技 ホームページ作成でちょっとしたことを参考書を買わずに解決する方法をPHP CSS Webデザイン jQuery Flashを中心に便利な技をまとめていきます！現在、長野県長野市の制作会社でWeb作成中！ flashで文字列を検索、置換するときにいつも手間だったので 簡単になる方法をみつけたのでメモ 関数にされてくれている方がいました。 FLASHで文字列の検索・置換 // _str 検索・置換の対象となる文字列 // _search_str 検索する文字列 // _replace_str 置換する文字列 function str_replace( _str , _search_str, _replace_str) { var strArray = _str.split(_search_str); return strArray.join( _repla
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
『Google Analytics（グーグルアナリティクス）でFlashのボタンも解析する』