タグ

ブックマーク / bashalog.c-brains.jp (7)

  • 【MySQL】カンマ区切りのIDのリストを、マスタテーブルで定義されている日本語名にフォーマットして出力する不思議なSQL | バシャログ。

    【MySQL】カンマ区切りのIDのリストを、マスタテーブルで定義されている日本語名にフォーマットして出力する不思議なSQL | バシャログ。
  • フォームを改めて考えなおしてみるエントリーフォーム最適化のまとめ(EFO) | バシャログ。

    世間が彼を見捨てても、私はキムタクの月9を見続けます。 どうもこんばんは Latin です。 今回はエントリーフォームの最適化についてです。 フォームって、ウェブサイトをローンチした後は、メンテナンスが全然されていない・・・って事は結構多いのではないしょうか? 仕様が思いの外複雑であったり、分析・改善に費やす時間がなかったりと、理由は様々だと思うのですが、今回は最低限把握しておくべき項目をまとめてみました。 フォームの初期実装時やリニューアルなどに少しでもご参考になればと思います。 【入力サポート】 選択項目は、デフォルト値に配慮する 例えばですが、都道府県のプルダウン選択なら、メインターゲット層の多い都道府県にするというヤツです。「東京都」をデフォルトにしているところを良く見かけますよね。 必須アイコン「必須」の表記で目立つ色で配置する 「※」や「*」は不親切だし、伝わりづらいようです。

    フォームを改めて考えなおしてみるエントリーフォーム最適化のまとめ(EFO) | バシャログ。
  • 画面遷移がすごいサイトのまとめ | バシャログ。

    TVKで再放送されているあぶデカにハマっているgamiです。あの時代の関内・馬車道あたり物騒すぎるでしょ…。 さて、以前にも紹介しました、気になるデザインを共有するDesignClipという社内のチャットグループより、画面遷移がシームレスでこいつぁすげえや!となったものを幾つか紹介できればと思います。チェケラ! 佐久間徹設計事務所 デザインはすごくシンプルで動きもいいと印象によく残ります。 仕事一覧から仕事詳細へ 一覧の写真をクリックするとコンテンツの後ろでニュッと大きくなる感じが好き。 下位ページへ グローバルメニューに注目してるといつの間にかコンテンツが変わってる。 Orenda Security セキュリティ会社のサイト。シャッターのような動きからのロゴアニメーションはまさに鍵をかけてるように感じました。 スタジオスプーン株式会社 四方のボタンをクリックすると、その方向から背景がスラ

    画面遷移がすごいサイトのまとめ | バシャログ。
  • PHP で配列の先頭要素の値を取得するきれいな方法を考える | バシャログ。

    あすで東日大震災からまる4年ですね。当日の発災時刻には山形県山形市の JR 北山形駅というところに偶然いた kagata です。何もないときに旅行に訪れたいとかねがね思っているのですが、まだ実現できずにいます。 さて、今回は前回の続編です。配列の先頭要素の値をとってきたいなら array_shift() よりも current() のほうが処理速度が速い…ということを前回確かめました。ただ、どちらの方法もあまりきれいではないし、どんな場面にでも使えるというわけにはいかなさそうです。 ということで、配列の先頭要素の値を取得するできるだけきれいな方法をねちこく考えてみました。 おさらい 前回の記事では、配列の先頭要素の値を取得する方法を2つご紹介しました。さらに、読者の方からさらにもう1つの方法をご提案いただいています。 それぞれの方法について、簡単に振り返ります。 array_shift(

    PHP で配列の先頭要素の値を取得するきれいな方法を考える | バシャログ。
  • 【gulp】BrowserSyncでSSIを使う方法についてメモメモ | バシャログ。

    みなさま、こんにちは。 嫁に20年前の写真を見せて、「誰に似てる?」って聞いたら「堺雅人」と言ってもらえて喜んでいる kourakuです。 さてさて、たまにですけどSSIを使ってコーディングする案件が来ることがあります。 そんなとき、わざわざSSIが使えるようにサーバを立ち上げるとか、ちょっと手間ですよね。 そんな面倒も gulp+BrowserSync に見てもらう設定をしてみよう!ということについてメモメモ。 ※前提:gulp、CofeeScript導入済。 ※前回の記事『【gulp】CoffeeScriptとBrowserSync導入をメモメモ』の内容を元に進めていきます。 BrowserSyncでSSIを使う準備 それでは早速、次のコマンドを叩いて、SSIを使うためのプラグインをインストールします。 ここではconnect-ssiを使用します。 connect-ssi $ npm

    【gulp】BrowserSyncでSSIを使う方法についてメモメモ | バシャログ。
  • width:auto;とwidth:100%;の違い+中央寄せについて。 | バシャログ。

    どうも。mackyです。 花粉症とは無縁の私は、早くお花見シーズンにならないかなー…なんて、今はそれだけを楽しみに生きています。のみたい!べたい!べたい! さて今日は、その大切さ&重要さに近すぎて気づかない、みたいな存在の「width」についてちょっと書こうと思います。 これからレスポンシブどんどん勉強していきたいという方は是非。 width:100%とwidth:autoの違い 例えばPC版のコーディングから行うとして、widthをpx指定したときなどはブレイクポイントを設けてSP版用に幅を上書きする。この流れはよくあります。共に、親要素の幅に合わせるとういう意味では同じですが、paddingやborderを指定する場合にちょっと違ってきます。 width:auto;の場合 Media Queriesをつかってwidthを上書きする場合はこちらが便利です。 上の図を使って説明すると.

    width:auto;とwidth:100%;の違い+中央寄せについて。 | バシャログ。
  • Firefox 開発ツールの充実っぷりを見直す | バシャログ。

    OS Xの新しいバージョンをリリース直後にアップグレードすると、今まで使ってきたツールの一部が使えなくなって悲しい思いをする(でもやめられない)、という敬虔な?Macユーザであるtanakaです。 最近リリースされたOS X Yosemiteでもとりあえず、普段使っているツールが使えるかどうかだけチェックしたところ問題なさそうでしたのでアップグレードしました。 YosemiteでJetBrains IDEを動かすを対応する必要があったり、MacPortsのYosemite対応版をインストールする必要がありましたが、問題無く動作しているようです。 今日は、Firefox 開発ツール(標準で付属しているもの)を紹介します。Firefoxにはバージョン10から開発者向けツールが付属していましたが、最初試したときは、Firebugの代わりに使えるものでは無かったように思います。 そのころからChr

    Firefox 開発ツールの充実っぷりを見直す | バシャログ。
  • 1