画面遷移がすごいサイトのまとめ | バシャログ。

2018/02/21 155 users 画面遷移 チャットグループ チェケラ tvk まとめ

TVKで再放送されているあぶデカにハマっているgamiです。あの時代の関内・馬車道あたり物騒すぎるでしょ…。 さて、以前にも紹介しました、気になるデザインを共有するDesignClipという社内のチャットグループより、画面遷移がシームレスでこいつぁすげえや！となったものを幾つか紹介できればと思います。チェケラ！ 佐久間徹設計事務所 デザインはすごくシンプルで動きもいいと印象によく残ります。 下位ペ... 続きを読む

フロントエンドエンジニアにオススメする参考になりすぎるブログ10選 - North-Geek

2016/04/20 350 users North-Geek NxWorld ICS MEDIA

Webサイト制作時に、僕がいつもお世話になっている素晴らしいWebメディア・ブログがいくつかあります。 そこで今回はいつも参考にしている フロントエンドエンジニアにオススメのブログ を紹介します。 dwango creators' blog おすすめ記事 バシャログ。 おすすめ記事 ICS MEDIA おすすめ記事 commte おすすめ記事 NxWorld おすすめ記事 Syncer おすすめ記... 続きを読む

CSSでblock要素を上下左右中央寄せにする、イマドキの方法。 | バシャログ。

2015/06/14 972 users いまどき CSS block要素 上下左右中央 margin

Backjoyを買ってみたらほんとに腰が楽なminamiです。 CSSで要素を上下中央寄せする方法は古くから色々と試されてきました。 今回は海外のサイトで知って目から鱗だった方法をご紹介します。 基本的な設定 上下左右中央寄せしたい要素に以下のCSSを設定します。 position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: a... 続きを読む

position: absolute; の指定で要素が上下左右中央配置になる理由 | WWW WATCH

2014/08/06 433 users CSS いまどき block要素 上下左右中央 人気エントリー

人様の人気エントリーに乗っかる感じで恐縮ですが、「CSSで block 要素を上下左右中央寄せにする、イマドキの方法。 ： バシャログ。」 という記事が話題になっていたので、なんでその指定で上下中央配置になるのか補足してみます。 詳しい話は下記のリンク先をご覧ください。 CSSでblock要素を上下左右中央寄せにする、イマドキの方法。 ： バシャログ。 何でこういうことを書くかというとですね、例え... 続きを読む

CSSでblock要素を上下左右中央寄せにする、イマドキの方法。 | バシャログ。

2014/08/06 972 users いまどき CSS block要素 上下左右中央 margin

Backjoyを買ってみたらほんとに腰が楽なminamiです。 CSSで要素を上下中央寄せする方法は古くから色々と試されてきました。 今回は海外のサイトで知って目から鱗だった方法をご紹介します。 基本的な設定 上下左右中央寄せしたい要素に以下のCSSを設定します。 position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: a... 続きを読む

11の項目を設定するだけでJavaScriptコーディングガイドラインが作成できるjsCode | バシャログ。

2014/05/07 106 users 項目

ゴールデンウィーク中に5年ぶりにフットサルをしてまだ筋肉痛が癒えてないishidaです。社内でフットサル部を立ち上げてみましたが、参加人数が少ないので横浜近辺で一緒に球蹴りしてくれる人を募集中です。 さて今回は、JavaScriptのコーディングガイドラインを作成してくれるサービスのご紹介です。 JavaScript は HTMLやCSSよりも自由度が高いので、 ガイドライン化してコードを統一する... 続きを読む

スマートフォンサイトのコーディング Tips あれこれ | バシャログ。

2014/04/23 691 users macky Latin スマートフォンサイト 横幅 CSS

ゴールデンウィークはゴールデンに過ごせそうにない Latin です。 今回はスマートフォンサイトのコーディング周りでのあれこれをまとめてみます。 先日の macky の記事、「スマホサイトの矢印付きメニューをCSSのみで実装する。」もあわせてご覧ください。 viewport 系の設定 描画サイズをデバイスの横幅に合わせる、拡大縮小を不可に これが一番よく見る形式でしょうか？ <meta name=... 続きを読む

【JavaScript】デザインパターンを知ってみる。モジュール・パターン編 | バシャログ。

2014/03/24 361 users モジュール YUI 手始め フレームワーク ライブラリ

JavaScriptで書くデザインパターンが気になっているので、手始めに一番よく見ているであろうモジュール・パターンについていろいろ調べてみました。 なぜ使うの？ モジュール・パターンは名前の通り、処理を他の処理とぶつからないように安全に切り離し、モジュールの形として提供する考え方です。YUI などの大規模なフレームワークから小さなライブラリにも取り入れられています。以下のようなメリットがあります... 続きを読む

あれ、いつも書いてるな～というJavaScript の小技集 | バシャログ。

2014/03/05 510 users minami JavaScript 小技集 Tips 配列

いい加減髪を切りたいminamiです。 JavaScriptでいつも書いてるな～という処理や、知っていると便利なTipsを簡潔に集めた記事を見てほお～と思ったものがいくつもあったので抜粋してみました。 45 Useful JavaScript Tips, Tricks and Best Practices 配列からランダムで値を取り出す var ary = ['犬','猫','鳥','タコ','イ... 続きを読む

【WordPress】あなたの大切なサイトを守るセキュリティ対策のまとめ（2013年秋） | バシャログ。

2013/10/17 328 users WordPress セキュリティ対策 プレフィクス まとめ

JOJOのアニメ第三部が正式に決まったそうですね！ 楽しみ～な、にわかファン Latin です。 最近のWordPress界隈ではAmazon Web Serviceが俄然盛り上がっておりますが、大好きなWordPressを守るため、セキュリティ対策をまとめてみました。 初期セットアップ・設定系の対策 データベースのプレフィクス（接頭辞）を変更する wp-config.php 内の「wp_」の接頭... 続きを読む

【jQuery】要素が"見えた"タイミングでイベントを発生させるjQueryプラグイン | バシャログ。

2013/07/25 200 users jQuery 本題 jQueryプラグイン グラフ 要素

はじめまして、今月よりバシャログのメンバーになったfukasawaと申します。 まだまだ勉強中で至らぬ点も多々あるとは存じますが、生温く見守っていただけると幸いです。 本題です。社内で行われているjQuery勉強会のネタ探しのためにWeb DesigningのjQuery Lab.を読んでいたのですが、記事の中でinviewというjQueryプラグインが使われていました。 記事では「グラフを描画す... 続きを読む

【CSS】擬似クラスの:(hoge)-child系と:(hoge)-type系の違いをここいらでしっかり覚えておこうか。 | バシャログ。

2013/07/03 136 users Hoge child 階層 CSS 擬似クラス

対象になるグループの範囲は？ :(hoge)-child系、:(hoge)-type系のいずれもグループ内での順番を判定します。 その対象となるグループは、同じ階層に並んでいるひと続きの要素群となります。 図にするとこのような感じ。 直属の親要素が異なると、別グループになります。 また、グループ内の要素の種類は一種類に限りません。 「:(hoge)-child」は並び順→要素、「:(hoge)-t... 続きを読む

[WordPress]3大カスタム要素、カスタム投稿タイプ・タクソノミー・フィールドを使いこなす | バシャログ。

2013/06/18 180 users WordPress コンフェデレーションズカップ 目次

こんにちは Latin です。 コンフェデレーションズカップはじまりましたね！夏のフットボール観戦はやっぱり燃えます。 さて今回は、WordPressの「3大カスタム要素」と題しまして、「カスタム投稿タイプ」、「カスタムタクソノミー」、「カスタムフィールド」についてまとめていこうと思います。 目次 カスタム投稿タイプ カスタムタクソノミー カスタムフィールド 3大カスタム要素を使ったサイトの運用例... 続きを読む

CUI で Git 使うなら入れておきたいツールまとめ | バシャログ。

2013/05/16 394 users CUI Git tig nakamura コマンドライン

ブランコ と同い年だったことが判明しました。みなさん、こんにちは nakamura です。あいつも昭和 55 年会か・・・。 Git をコマンドラインで使う利点は色々ありますが、git コマンド以外にも便利なツールがいくつかあるっていうのもひとつかなと思います。今日はそんな中でも個人的にこれないと困るわーっていうのを独断と偏見でご紹介したいと思います。 tig Index of /tig これはけ... 続きを読む

[WordPress]スマホ対応プラグインの"いっちゃんいいヤツ"って結局どれ？ | バシャログ。

2013/04/22 150 users Latin ヤツ WordPress ゴールデン かんたん

どうすれば GW をゴールデンに過ごせるか、思案中のLatinです。 今回はスマートフォン対応プラグインの良し悪しについて。 WordPressのスマホ用プラグインは結構な数ありますが、結局の所、「いっちゃんいいヤツ」ってどれだろう？とふと思い立ち、勝手ながらカンタンに考察をまとめさせていただきました。 他にも、こっちの方がいいよ！こんなプラグインがあるよ！とかありましたらぜひ教えてください。 ま... 続きを読む

【CSS】画像を上下中央に表示する（IE7以下にも対応させる） | バシャログ。

2013/04/08 358 users CSS 上下中央 ishida IE7以下 display

娘が小学二年生になり、みまもりケータイ2を買い与えました ishida です。 娘がケータイのボタンを押すたびに、位置情報が送られてきて便利なのですが、 電話をかけたときにも、位置情報がメールで送られてきてちょっと通知頻度高すぎなんじゃね？ さてさて、今回はとある案件で画像を上下中央に表示する機会がありまして、 忘れないように自分的メモです。 CSS3が使えるようになってからは、display: ... 続きを読む

どれ使う？使い勝手の良いカラースキームツール8選！ | バシャログ。

2013/04/05 103 users どれ使う 使い勝手

今更ながら最近PSPの「勇者のくせになまいきだor2」が楽しくて仕方ない seki です。世界に平和はおとずれなぁい!!! さてさて今回は、もう何番煎じになるか分りませんが･･･！私がよく使うカラースキームツールのご紹介です。こういうツールは、突然URLが消えてなくなってしまう事もあるので、定期的におさらいも兼ねて一覧を作っておくのはいいことなんだ･･･！と自分に言い聞かせつつ、最近のものから定番... 続きを読む

Vim で PHP 開発するためにやってる設定 3 つほど | バシャログ。

2013/02/27 109 users vim nakamura IDE PHP 補完

どうもこんにちは、インフルエンザ空けの nakamura です。寝過ぎて腰痛めたっつーの。 以前は IDE 使ったりもしていましたが、ここ数年 PHP 書く際は Vim を使ってます。Vim に関してはまだまだ初心者から抜け出せてないんですが、PHP 用にやってる設定をいくつか紹介してみたいと思います。こんなのもやっとくと便利だよとかあれば教えて教えてー。 関数名とか補完 Vim には辞書ファイル... 続きを読む

[CSS3]面倒なCSS3、linear-gradientを使いやすくまとめてみた | バシャログ。

2013/02/05 150 users linear-gradient Latin ジェネレータ

こんにちはLatinです。 今年も残す所、あと11ヶ月となってしまいましたが、やり残しのないよう頑張ろうと思っております。 今回はCSS3のグラデーションにまつわるエントリーです。 ハッキリ言って面倒くさい！ さてCSS3のグラデーション「linear-gradient」なんですが、はっきり言って面倒です･･･。 今はCSS3のジェネレータもたくさんあるので、それらを使うのもいいのですが、足りない... 続きを読む

jQuery 1.9 で変わったところを調べてみる。 | バシャログ。

2013/01/21 221 users ベータ版 jQuery 1.9 IE6 ところ 準備

引越しの準備がままならないminamiです。 jQuery1.9 が正式にリリースされました。すでにベータ版として発表されているjQuery 2.0 はIE6/7/8に対応しないことを謳っているため、これらのブラウザ対応をする場合は1.9 を使っていくことになりますね。 jQuery1.9 で変更があった機能を見ていきたいと思います。 どう変わったの？ jQuery 1.9でアップグレードされた機... 続きを読む

【Fireworks】ワイヤフレーム作成時に覚えておくと便利なアタリ画像＆アタリテキストを簡単に作成する拡張機能 | バシャログ。

2012/12/08 132 users Fireworks ishida Firew ノロウイルス

3日間、ノロウイルスにやられ寝込んでいました ishida です。 手洗い・うがいはキチンとしておきましょうね。 さてさて今回は、「Fireworks Lover Advent Calendar 2012」 8日目のエントリーとして Fireworksでワイヤフレーム・モック作成時に覚えておくと便利な拡張機能について２つご紹介します。 自分はワイヤーフレーム作成につかうツールは、もっぱらFirew... 続きを読む

【WordPress】お問い合わせ内容も管理画面で管理できてトレビア〜ンなフォームプラグインinquiry form creator | バシャログ。

2012/11/29 320 users WordPress ishida ブログシステム 管理画面

今年の年末はカニを食べる！と思い、値段があがる時期前に冷凍カニを購入しましたishidaです。早くカニを食べて食っちゃ寝したいっ。 さてさて本日は、WordPressのプラグイン紹介です。 これまでブログシステムはもっぱらMovableType派でしたが、コレもしかしたらWordPressで実装できるんじゃねぇ？と思う要件がありました。 調査がてらにお問い合わせフォームプラグインをいろいろと使って... 続きを読む

フォームを改めて考えなおしてみるエントリーフォーム最適化のまとめ（EFO） | バシャログ。

2012/11/13 140 users Latin EFO キムタク 世間 ウェブサイト

世間が彼を見捨てても、私はキムタクの月9を見続けます。 どうもこんばんは Latin です。 今回はエントリーフォームの最適化についてです。 フォームって、ウェブサイトをローンチした後は、メンテナンスが全然されていない･･･って事は結構多いのではないしょうか？ 仕様が思いの外複雑であったり、分析・改善に費やす時間がなかったりと、理由は様々だと思うのですが、今回は最低限把握しておくべき項目をまとめて... 続きを読む

様々なイケてるUIを参考にできるサイト | バシャログ。

2012/09/10 835 users イケてるUI minami アベンジャーズ 参考 UIデザイン

足掛け2年、全ての関連作品を見てからアベンジャーズを見て最高に盛り上がったminamiです。 Webデザインの中でもサイトのUIデザインは近年重要性を増していると思いますが、デザインする際のインスピレーションを受けられるサイトをご紹介します。 UI Patterns UI Patterns User Interface Patter Libraryというサイト名通り、UIが体系的にまとめられ解説さ... 続きを読む

Illustrator の時間短縮！ウェブやチラシで使うアクセスマップの作り方 | バシャログ。

2012/08/24 339 users Illustrator Retina nonaka チラシ

こんにちは nonaka あらため、Latin です。 「Retina」 ではありません。ラテンの「Latin」です。 もうすぐ夏が終わりそうというのに、ウチのビルの喫煙所はサウナのように蒸し暑いです。 ダイエット中の方はぜひご活用ください！ さて今回ですが、デザイン分野での記事を Postします。 何かと制作機会の多い「アクセスマップの作成」の時短テクニック！（？） みなさんの時間短縮テクニック... 続きを読む