2012年北米でWEB制作者として生きてきた僕にとって絶対に無くては成らなかった英語圏サイト全部！ | バンクーバーのうぇぶ屋
This is my roundup post of online information sources, such as technical blogs and trend websites, that helped me a lot as a web designer through out this year. Massive thanks to those pages, and you all! さて、僕の年末感謝祭（？）もいよいよ大詰めです！前回は2012年を振り返って 僕にとって無くては成らないアプリやWEBサービスの数々を大感謝の思いでご紹介させて頂きました。 今回は2012年の僕にとって知識や情報の宝庫となってくれたサイトの数々を今回は英語圏に絞って超感謝の意を込めて全部一気にご紹介させて頂ければと思います！ この一年、僕の Facebookや Twitterで何度も何度
モジナビ | みんなのインターネット漢字辞典
忘れたままの漢字をゼロに。 モジナビは検索性を追求した漢和辞典。 Unicodeに登録済みの6万文字の漢字から 使用頻度の高い6,654字についてまとめました。 つかってみる
ウェブデザイナーは知っておきたい、ページレイアウトの代表的な10のパターン
実際のウェブサイトを例に、ずっと廃れないであろうページレイアウトの10のパターンとその特徴を紹介します。 10 Evergreen Website Layouts (that will never go out of style) [ad#ad-2] 下記は各ポイントを意訳したものです。 2カラム、広いヘッダ 3カラム、広いヘッダ フォーボックス 不確定なグリッド 大きいスクリーンショット シングルカラム 打ち出し画像 固定サイドバー グリッドベースのギャラリー マガジンスタイル [ad#ad-2] 2カラム、広いヘッダ これは最も普通のレイアウトと言ってもよいでしょう。広いヘッダが上部にあり、960pxを2カラムにし、一つは広く、もう一つは狭くしたものです。狭い方はサイドバーでナビゲーションなどが設置してあります。 慣習的に、ブログでは広い方の右にナビゲーションを置き、スタティックなサイ
Twitter BootstrapでさくさくWeb開発 : アシアルブログ
<div class="container-fluid"> <div class="row-fluid"> <div class="span4"> Span4の中身 </div> <div class="span8"> Span8の中身 </div> </div> </div> Preタグで囲むコード エンジニアの皆さんなら、ブログにコードを書きたいですよね。 Twitter Bootstrapでも、かっこ良くコードを見せる手法を提供しています。 ・codeタグで囲む 赤くなります。 ・preタグで囲む 囲み枠がつき、灰色になります。 ・Preタグ+Google Prettifyを使う preタグのclassに、prettyprint linenums を入れましょう。 これが超かっこいい！！コードを見せるならこれがよさそうですね！ さて、かっこいいGoogle Prettifyですが、こ
WEBサイト負荷テストツール7選 | さぶみっと！JAPAN
WEBサイトに情報を入力するだけで負荷テストができるLoad Impact、GUIから操作できるApache JMeterや、コマンドラインから使うcurl-loader・httperf・Siege・Pylot・abを簡単な使い方と共に紹介していきます。 Load Impact http://loadimpact.com/ Load ImpactはスゥエーデンのGatorhole AB社が管理している、フォームに必要な情報を入力するだけで負荷テストをしてくれるWEBサイトです。 ツールをインストールしたりする必要が有りませんので、非常に楽です。 毎月5回まで無料で負荷テストができます。 それ以上は10回/$30のクレジットを購入する事になります。 トップページのフォームにURLを入れて「Run free test」をクリックすると、世界各地のいずれかのAmazon EC2サーバから負荷テス
「htmlすら知らなかった私が2週間でWordPressの新テーマを作成するまでにやったこと」と参考にした記事まとめ
どうも、@OZPA です。 先月、当ブログのテーマをWordPressにて自作した私。 しかしながら、実はそれまでWordPressの知識どころかhtmlすらろくすっぽきちんと理解していない人間だったのです。 今回はそんな私がWordpressのテーマを一から自作するまでにやったことを備忘録がわりに纏め上げておこうかと思います。 ひとりじゃ出来なかった 今回、テーマを作り始めたのが2011年の12月29日、そしてテーマが完成したのが年が開けて1月の12日。 だいたい2週間弱で自作テーマ発表まで漕ぎ着けたわけなんですが、そこにはそうそうたる方々によります手助けがありました。 そんな方々に敬意を払いつつ、テーマ自作までにやったことと手順を備忘録として残しておこうかと。 WordPressのテーマ作成の手順 さて、WordPressのテーマを作成するためには、 0.WordPressをローカルに
2011年、成長するWebにふさわしいCMS選択ベスト5: 世界中の１％の人々へ
2010年12月| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 (cc)The U.S. Army Webは企業と制作会社が一緒になって作り、育てることでビジネス競争に勝つ時代になっている。 昨日は「CMSは目的や環境に応じて選ぶといいよ。でもそれより大事なのはパートナー選びだからね」ということを書いたのだけど、今日は一歩進めて、そんな時代にふさわしい育てる時代にふさわしいCMSとはどのようなものかを考えてみました。従来の機能にプラスして、今後制作する新たに考慮しなければならないのは下記3点だと思います。 マルチデバイス SNS連携 高い拡張性 マルチデバイス対応、マルチブラウズ ひとつのコンテンツをデバイスやブラウザ毎にHTMLのバージョンを最適化して出力する機能が
jQuery MobileでGoogle Mapsの表示からお問い合わせフォームの作成まで「jQuery Mobile」でスマホサイトを作ってみよう【実践編】 | HTML5でサイトをつくろう
jQuery MobileでGoogle Mapsの表示からお問い合わせフォームの作成まで「jQuery Mobile」でスマホサイトを作ってみよう【実践編】 スマートフォン向けフレームワーク注目の「jQuery Mobile」の第2弾の記事です。前回はjavascriptを一行も書かずにjQuery Mobileでページを作成してみましたが、今回はスマホサイトで、google Mapsやお問い合わせフォームの設置など、より実践的に使える内容を作っていきたいと思います。 前回の記事はこちらになりますので見ていない人はこちらから見るとより今回の記事がわかりやすいくなります。 スマートフォン向けフレームワーク注目の「jQuery Mobile」でスマホサイトを作ってみよう【基本編】 さて前回もあげましたが、jQuery Mobileのメリットと言えば！ マルチデバイスに対応できる クロスブラウ
WordPressでブログじゃないWebサイトを作るときのいろいろ（サンプル付き）
とても長い記事になってしまいましたが、WordPress を使って、コーポレートサイトのサンプルを作ってみました。WordPress はブログだけじゃなくて、色んな Webサイトが作れますよね！今回は、私が WordPress でサイトを作る時にやっていることをまとめてみました。 今までこのブログの中で、いろいろな WordPress の Tips を書いてきました。でも WordPress を使った Webサイトの作り方そのものは、今まで書いた事がありませんでした。そこで今回は、 WordPress を使ってブログじゃない Webサイトをまるごとひとつ作って、私なりの作り方をまとめてみました。 今回のサンプルサイトでは、WordPress の固定ページ機能はもちろん、カスタム投稿タイプやカスタムタクソノミー（カスタム分類）を使って作っています。 ページを表示する為に使っているテンプレート
めんどうな作業がわずか数秒に！新人デザイナーが 知らないと一生後悔するExcelを使ったHTML生成
お客さんから送られてきた、Excelデータからせっせとリストや表のHTMLをコーディングしているあなた！そろそろ手がが疲れてきていませんか？ そんなあなたは、この記事で紹介するExcelテクニックをぜひ覚えてください。 面倒な作業が、わずか数秒で終わります！ Excelを使った高速HTML生成 僕たちプログラマーは、ちょっとしたコード生成に、Excelを使います！ DreamweaverでもCSVファイルを取り込むことはできるのですが、<dl>タグでマークアップしたい時とか、カスタマイズしたい場合は、これから紹介するExcelを使った方法が簡単で、効果的です。 さぁ、↓のようなお客さんから送られてきたExcelデータから ... こんな感じの、<dl>タグでマークアップされたHTML生成する流れを説明します。データ数はうんざりするくらいあると思ってください。 Let's Excel 1)
Facebook 向けウェブサービスは IE6 に対応すべきか ( 2011年12月の Facebook のブラウザシェア ) - IT戦記
はじめに みなさん、お元気ですか＞＜リリースも終わって、一息ついたあまちゃんです！ ヽ(´ー｀)ノわー さて今日は、最近「お花サプライズ！」というサービスをリリースしたのですが、そのときにちょっと面白いデータを見つけたのでそのいきさつも含めて紹介したいと思います。 （今日のテーマはこの円グラフ） フェイスブック系のサービスはどのブラウザに対応すれば良い？ よく、ウェブサービスを開発するときの悩みとして「古いブラウザでのデザインをどのくらいケアするか？」というものがあります。 「お花サプライズ！」でも、割と短い期間で実装することを目標としていたり、本番の HTML を書いた経験があまりないメンバーが多くいたことで「IE6 や IE7 への対応が鬼門なんじゃないか？」という心配が常にありました。 そこでよぎる甘い誘惑 このご時世、 IE6 とか IE7 に特別対応する必要なんてないんじゃね？
使いやすいFAQをサクッと作る際に便利なjQueryプラグイン「SimpleFAQ」:phpspot開発日誌
JK - jQuery SimpleFAQ 使いやすいFAQをサクッと作る際に便利なjQueryプラグイン「SimpleFAQ」。 FAQというと内容が多くなればページが長くなって見難くどんどん使いづらくなっていきますね。 そんな場合に、項目は並べつつも、クリックした際にアニメーションで質問のすぐ下に現れるようなFAQが簡単に作れます。 質問のリスト。 とりあえず質問が並んでいるので分からないことを探してもらいます。 そんなに大規模なFAQじゃなければ質問項目を羅列しておくだけでもそれなりに使いやすいです。 クリックすればページ移動とかもなく、その場にアニメーションしながら答えが表示されます。 別ページに移動したりといったことがなく、ストレスフリーで内容が見れます。仮に答えが的外れでも戻ったりせずにすぐに他の質問に行けます で、何がいいかという個人的におすすめする点は、作り方。 作り手は、
ブラウザチェックが10倍カンタンに！ Expression Web 4「SuperPreview」がすごい。
いつも さぶみっと！JAPAN をご愛顧いただきありがとうございます。 この度、誠に勝手ながら2017年9月29日(金)を持ちまして、「さぶみっと！サイト制作マッチング」のサービスを終了させていただきます。 日頃よりご利用いただいております皆さまにはご迷惑をおかけすることとなり、誠に申し訳ございません。長らくのご愛顧、厚くお礼を申し上げます。 終了するサービス ・サイト名：さぶみっと！サイト制作マッチング ・URL：http://hp.submit.ne.jp/ ・サービス終了日：2017年9月29日(金)11:00 サービスご利用中の方へ ・案件情報のご登録は2017年8月28日(月)より停止しており、新規でご登録をいただくことはできません。 ・現在掲載中の案件に提案を行うことはできますが、サービス終了日を持ちましてサイトをご利用いただくことはできなくなります。 ・現在サイト内で商談中の
FlashからHTML5/JavaScriptへ·Smokescreen MOONGIFT
SmokescreenはHTML5/JavaScript製のオープンソース・ソフトウェア（予定。ライセンスは未定）。AppleのFlash拒否の動きは止まることなく、他のスマートフォンとの対立が深まっている。Flashは既に世界中で利用されており、無数のコンテンツが存在するのが理由だ。 広告デモ。上がHTML5+JavaScript、下がFlash だからといって、今後永遠にコンテンツが増え続けるとは限らない。HTML5の登場によって、Flashによらないアニメーションや多彩な表現力がHTML5で実現する。旧来のFlashと今後のHTML5をつなぐのがSmokescreenだ。 Smokescreenは以前紹介したGordonと同様にFlash（SWF）ファイルを解析し、HTML5/JavaScriptによって実行するライブラリだ。広告のバナーやアニメーションのデモがあるが、SWFと変わら
Google Chromeを使ってスクリーンショット+説明書き·Explain and send screenshots MOONGIFT
Explain and send screenshotsはGoogle Chrome向けのフリーウェア。Webサイトを使って、何かの説明を行いたいと思うことはよくある。遠い場所にいる人に対してサイトのどこを見るべきか説明したり、サイトのヘルプを作ったり、デザインの修正依頼をしたりといった具合だ。 一部の範囲を指定して説明書きを加えられる そんな時によくやる手としてはWebサイトのスクリーンショットを撮って、画像編集ソフトウェアで開いて矢印や文字を加えてアップロードするといった操作だ。これでは手間がかかりすぎる。解決するのはExplain and send screenshotsだ。 Explain and send screenshotsはGoogle Chromeの機能拡張で、任意のWebサイトでボタンを押すと、範囲を指定してスクリーンショットを撮る機能になる。そこで送りたい範囲を指定す
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
sekailog.com
Balsamiq. Rapid, effective and fun wireframing software. | Balsamiq
WordPressでここまでできる！WordPressで作ったとは思えないWebサイトまとめ12個 - W3Q
A/Bテストの生事例 蔵出し14パターン一気紹介 （ポイント解説付き） | U会話入門
ブラウザベースのワイヤフレーム素材 -Paper Browser