タグ

ブックマーク / mbdb.jp (13)

  • 日本語サイト制作するなら、このコーディング向けフォントが最強じゃないかと思う件

    Webサイトの制作時に欠かすことのできないコーディング。エディターは可能な限り見やすいフォントにしたいものです。 そんなコーディング向けフォントに、現時点で最強と言ってもいいのではないかというフォントが登場しました。その名も「Source Han Code JP」。日語表示を考慮したコーディング向けフォントです。 またの名を「源ノ角ゴシック Code JP」というこのフォント、名前の通りAdobeがオープンソースで開発した「Source Code Pro」と「Source Han Sans JP (源ノ角ゴシック JP)」を組み合わせたものです。 Adobeの日フォント開発チームに所属する服部正貴氏が個人的に始めたオープンソースプロジェクトによるもので、「Source Code Pro」と「Source Han Sans JP」が調和するように、文字のサイズや太さを調整したとのこと。

    日本語サイト制作するなら、このコーディング向けフォントが最強じゃないかと思う件
    dal
    dal 2015/06/16
  • Sassに移行したのでどんな環境でサースってるのかをまとめてみた件

    皆さん元気にSassってますか? 大変いまさらなんですけども、ようやっと当ブログのデザイン面の環境をSassに移行しました。 というわけで、どんな環境でSassってコンパイルしてアップロードしてるのかってのをまとめてみましたよ。 結構前から「いい加減そろそろ覚えて使うようにしないと・・・!」と思っていたんですがねー。 現在やってる仕事がひたすら系なもんで、その合間の気分転換にしようじゃないかってことで、ようやく今頃になって手を付けました。 いやー、実際やり始めると楽しい楽しい。今までなんで放ったらかしてたんだろうと激しく後悔。CSS書くのがめっちゃラクですなー。 Sassってなんじゃい? もう話題になってからずいぶん経ちますし、別にいまさら説明するもんでもないんですけど一応。 SassはCSSを記述するために開発されたメタ言語のことで、これを利用することで長くなりがちなCSSのコードを短く

    Sassに移行したのでどんな環境でサースってるのかをまとめてみた件
  • head要素内をまるっと整形してくれる便利プラグイン「Head Cleaner」

    先日「delaymania」の大ちゃん(delaymania)から、 「<head>の中ってどうやってあんなにきれいに並べ替えてるの?」 という質問をされて、そういえばこのプラグインについてちゃんと書いてないなぁと思ったので、改めてWordPressプラグイン「Head Cleaner」をご紹介。 すでに各所で紹介されているので、いまさら感はたっぷりなんですけどね。 WordPressのテンプレートを制作する際、<head>要素の内部をどれだけ順序立てて書いても、<?php wp_head(); ?>によってプラグイン関連のCSSJavaScriptなどが呼び出され、結局思ったような状態にはなりません。 これをどうにかしてしまおうというのが、WordPressプラグイン「Head Cleaner」です。 プラグインをインストール・有効化するだけで効果が発揮されます。 これは実際に「Hea

    head要素内をまるっと整形してくれる便利プラグイン「Head Cleaner」
  • めっちゃカンタン! オリジナルのPocketボタンを作成する方法

    レイアウト変更にともなって、新しく記事のヘッダーエリアに、Facebookへのシェアボタン、Twitterのツイートボタン、Google+への共有ボタン、はてなブックマークボタン、そしてあとで読むサービスのPocketボタンを設置しました。 今回はその中から、オリジナルPocketボタンを設置する方法について紹介したいと思います。 Pocketボタンを含むオフィシャルの各シェアボタンは、全て記事を読み終わったあとに表示しているんですが、このPocketは性質上、読後に設置するボタンではなくて読む前に押されるよう設置すべきボタン。 元々、記事のタイトル下に各シェアボタンを設置していたんですが、体感的に読み込みが遅く感じられるので、記事下に移動させました。 そんな経緯もあり、記事のヘッダーエリアにもう一度復活させるに当たって、オフィシャルのボタンは使わず、オリジナルのボタンを設置することにしま

    めっちゃカンタン! オリジナルのPocketボタンを作成する方法
  • ホバー表示のツールチップを独自データ属性とCSSだけで作る方法

    オリジナルのPocketボタンを作る方法を紹介したときに、チラッと触れていたツールチップの作り方をまとめました。 jQueryは一切使わず、シンプルなHTMLCSSだけで実装する方法です。いろいろと応用が効くので覚えておいても損はないと思いますよ。 CSSだけでツールチップを実装する手法というのは、ググればたくさん出てくるんですが、その多くのHTML構造は以下のような感じになっています。 <a href="https://www.google.co.jp/" target="_blank">Google<span>ここにツールチップの内容</span></a> ツールチップとして表示したいテキストを<span>要素で囲み、通常時はdisplay:none;にして、hover時のみ表示するという方法ですね。 今回僕が紹介する方法では<span>要素は使いません。 「ならツールチップに表示す

    ホバー表示のツールチップを独自データ属性とCSSだけで作る方法
  • 肉祭りじゃー!! ガッツリ食べたい世界の肉料理ベスト10

    ウオオオオォォォォ! 肉料理 は正義(ジャスティス)! gooランキングにて、「ガッツリ気でべたい世界の肉料理」というテーマのランキングが紹介されていました。 深夜腹減ってる時は閲覧注意ですぞ。肉ぅ。 第1位 シュラスコ(ブラジル) 牛肉などを串に刺し、炭火焼にしたもの。玉ねぎやトマトのソースで頂きます。レストランでは串ごと客席に運ばれ、目の前でべたい量だけ切り分けてくれます。 第2位 シュバイネハクセ(ドイツ) Photo:Schweinshaxn By Seph Swain バイエルン地方の名物肉料理。香味野菜といっしょに下茹でした豚足を、カリカリにローストした香ばしい感がたまりません! 第3位 アヤムバカール(インドネシア) スパイスに漬け込んだ鶏肉を炭火で焼きます。パリッとした皮とやわらかいお肉が欲をそそります。タレをつけてべてもおいしい! 第4位 生ハム(スペイン)

    肉祭りじゃー!! ガッツリ食べたい世界の肉料理ベスト10
    dal
    dal 2013/10/04
  • 【2013年3月】これは手放せない! モバデビ的必携iPhoneアプリ29選 | [M] mbdb (モバデビ)

    そういえばこの手のことって、まだうちではやってないなぁと思ったので、思いつくままにやってみることにします。 今のところ、これだけはもうiPhoneに入れておかないと、むっちゃ困る!!というアプリをまとめてみました。いざまとめると割と普通に定番ばっかりでしたけど。 ソーシャルメディアクライアント

    【2013年3月】これは手放せない! モバデビ的必携iPhoneアプリ29選 | [M] mbdb (モバデビ)
  • めっちゃクリエイティブなFacebookタイムラインのカバーまとめ

    でも切り替えができるようになり、22日には全面的に切り替わることが予定されているFacebookの新プロフィールページ「タイムライン」。現在から過去へ流れるレイアウトに大きく変わった「タイムライン」の中で、最も注目すべきがカバー画像です。 今回はカバー画像を使ったクリエイティビティあふれる「タイムライン」をまとめてみました。 過去を取り込む Andrew Grojeanさんのカバー画像は、以前のプロフィールページを組み合わせたもの。 現在から過去へ流れるタイムラインを、カバー画像で象徴的に表現しているように思えますよね。 Emanuele Bartolomucciさんのカバー画像も過去を取り込んだといえる感じのもの。 宇宙の向こうから続くサムネイルは、おそらくEmanueleさんの昔の写真を古いモノから順に並べ、現在の写真へと続くように見せています。これもタイムラインが象徴的に表現され

    めっちゃクリエイティブなFacebookタイムラインのカバーまとめ
  • Facebookコメントに切り替えたのでブログ導入の手順をメモ

    ついぞ先月、コメント管理のために「DISQUS」を導入したばっかりなんですが、やっぱりFacebookコメントにしよーってことで、サクッと切り替えてみました。 コメントなんてそうそうくるブログでもないので、別にコメントシステムそのものが必要ねーっていう気がしてますが、一応体裁としてね。。 Facebook Commentsの仕様が変更になり、以下の導入方法が変更になりました。 以下の記事でフォローしているので、そちらもお読み下さい。 Facebook Commentsの仕様が変更されて設置が簡単になったっぽい 実際の導入イメージ 導入するとこんな感じになります。 これはFacebookにログインして見ている状態ですね。 一応、Facebookを使っていない人や、ログインしていない状態でもコメント投稿できる(名前とメールアドレス必須)ようにしてあって、そういうユーザーの場合は「Anonymo

    Facebookコメントに切り替えたのでブログ導入の手順をメモ
  • [M] mbdb | FriendFeedがアツいらしい

    2014.10.02 「DATA GO JP」はブクマ必須! 公共データの横断一括検索型カタログサイトがリリース

    [M] mbdb | FriendFeedがアツいらしい
  • [M] mbdb | FriendFeedがアツいらしい

    2014.10.02 「DATA GO JP」はブクマ必須! 公共データの横断一括検索型カタログサイトがリリース

    [M] mbdb | FriendFeedがアツいらしい
  • ギャル系の間で急速に広まるケータイTwitterクライアント「Realtime Love」 | [M] mbdb

    フリーランスのモバイルウェブディレクターがウェブやモバイルの話題を独自の視点で紹介なんでも最近急速に広まりを見せているというケータイ向けTwitterクライアントサービスの「Realtime Love」。ギャル系の利用に特化したサービスだそうです。 ちょっと中身を観てみましたが、基的な機能としてはごく普通のTwitterクライアント。これといって凄い機能をつけているというわけじゃありません。ただ、絵文字の利用とデコメ絵文字を使ったツイートが可能というところでしょうか。 その他、ああ面白いなぁと思ったのが"リアタイ画"というもの。Twitter APIを使って最新ツイートをバナー画像に取り込んで表示させるというもので、各ユーザーのプロフィールページから、そのバナー画像の表示タグを取得できるようになっていて、ギャル系ユーザーが自身のブログに貼り付け可能になっているんですね。ギャル系のブログ

    dal
    dal 2010/08/03
    その「リアタイ画」ってようなものは携帯文化ではよく見かけるものですね。
  • モバイルサイト運用の上で確認すべき3つのこと

    モバイルサイトの運用は結構面倒くさいです。「開発も面倒だよね」という声も聞こえてきそうですが、個人的には運用の方が面倒だと思っています。 その理由としては、まめな情報収集をしなきゃならんのです。というわけで、以下にチェックしておくべき3つのことを書き出しておきます。ある意味、自分用。 キャリアのIPアドレス帯域変更 コレ、意外に頻発します。 というのも、モバイルサイトって大概がIPアドレスでアクセス制限を行うんですよね。ケータイ以外からのアクセスをさせない目的で。 特にキャリア公式サイトの場合は必ずってくらい。 で、このキャリアのIPアドレスなんですが、ホント頻繁に変更されるんですよ。追加されたり削除されたり。出来れば変更しないでくれと誰もが思いますが、気付くと変更されるのでコレは定期的にチェックをしておかなきゃなりません。 仮にこの変更に対応しなかった場合、何が起きるかというとモバイルサ

    モバイルサイト運用の上で確認すべき3つのこと
  • 1