Myrica - Rictyをベースに視認性を向上したプログラミングフォント MOONGIFT
プログラマーであればこだわりたいのがフォントです。特に英語は見やすくても日本語がつぶれてしまったり、誤認しやすいフォントを使っていると余計なバグが入り込む可能性が高まります。 個人的にはRictyを使っているのですが、さらにそのRictyを継承してプログラマー向けに進化したフォントがMyricaです。 Myricaの使い方 フォントを表示したところ。ピの文字が特徴的ですね。 特徴としては、ASCII/ひらがな/カタカナに対してヒンティング情報を追加しているので文字を小さく表示した場合にも文字がつぶれず、視認性が落ちません。また、濁音や半濁音が大きく表示されるのでぺとべの違いなどがはっきりと分かるようになっています。 等幅、プロポーショナル、さらに幅が狭いタイプと揃っています。Rictyをベースにしているので、Myricaと好みの方を試して使ってみても良さそうです。 MyricaはSIL O
Myth - 学習コストの低そうなスタイルシート代替記法
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました コンパイルしてJavaScriptに変換する系統の言語としてはDartやCoffeeScriptなどが知られています。同様にスタイルシートについてもSassやScss、LESSといった代替記法が存在します。 今回紹介するMythもその一つで、スタイルシートの代替記法なのですが、多数の機能がある訳ではなく最も必要とされるであろう機能だけを提供しているのが特徴です。 まずインストールから。npmを使ってできるのですぐに導入できます。 $ npm install -g myth 続いて対応している記法を紹介します。まず変数。 :rootで変数を定義し、それをvar(aaa)といった形で使っています。数字や色の定義が使えます。 変数をさらにcalcという関数に渡すことで計算処理を実現してい
Google Chrome/Firefoxで使える開発スニペット集·DevTools Snippets MOONGIFT
DevTools SnippetsはGoogle Chrome/Firefox用のソフトウェアです。 このソフトウェア（？）を試すまで知らなかったのですが、Google Chromeのデベロッパーツールにはスニペット管理機能が備わっています。よく使うJavaScriptを登録しておけば開発がよりスムーズになります。そこで今回は便利なスニペットを多数登録しているDevTools Snippetsを紹介します。 例えばこれはjQueryが読み込まれていないサイトでjQueryを読み込むスニペット。 スニペット編集中。DevTools Snippetsにあるものを貼付けるだけです。 後は登録してあるものの中から右クリックしてRunを押すだけです。 これまた知らなかったのですが、consoleでテーブル表示。こちらはクエリストリングを分割してテーブル表示してくれます。 DevTools Snipp
素敵なカンファレンスページを提供したいなら·Conference MOONGIFT
Conferenceはカンファレンスサイトです。ノート機能やオフラインでも使える機能があります。 日本でも随所で行われているカンファレンスですが、その紹介サイトにConferenceを使ってみるのはいかがでしょう。すっきりとしたUIで使い勝手が良いです。 トップページです。日ごとのスケジュールが一目で分かります。 スピーカーの一覧。 ノートを残しておけます。 ユーザ登録もできます。 オフライン対応です！ Conferenceはカンファレンスの紹介ページであり、利用者はノートを残しておいたり、ブックマークしておくこともできます。GOOD/BADをつけることもできるので、面白そうなセッションを見つけたりするのにも役立つでしょう。 Conferenceはnode.js製のソフトウェア（ソースコードは公開されていますがライセンスは明記されていません）です。 MOONGIFTはこう見る よくあるカン
Webサイトをもっと万人に対してアクセスしやすくするために·HTML_CodeSniffer MOONGIFT
HTML_CodeSnifferはウェブアクセシビリティ改善のためのブックマークレットです。 Webは限られた人たちのものではなく万人向けのものであるべきです。そこで考えられるべき項目として障害のある人に対するアクセシビリティです。そのチェックに使えるブックマークレットがHTML_CodeSnifferです。 実行すると右上にフローティングウィンドウが出ます。エラー、警告、通知の3つに分けてポイントが出ます。もちろんポイントが少ない方が良いです。 各項目の説明を見られます。これらはW3Cのウェブコンテンツ・アクセシビリティ・ガイドラインに則っています。 指摘されている箇所を確認できるマーカーも出ます。 MOONGIFTの場合…がっくりするくらいのエラー数です…。 アクセシビリティと漠然と言われてもなかなか具体的な施策が思いつきませんが、エラーや警告という形で表してくれれば対応もとりやすくな
レガシーなWebブラウザにもgetUserMediaを·getUserMedia.js MOONGIFT
getUserMedia.jsはFlashを使うことでレガシーなWebブラウザでもgetUserMediaライクなWebカムアクセスを実現するJavaScriptライブラリです。 HTML5の新しいAPIの一つにWebカムアクセスがあります。そんなWebカムアクセスをレガシなーWebブラウザを含めて使えるようにしてくれるのがgetUserMedia.jsです。 最初です。カメラへのアクセスが求められます。 まずはWebカムの映像を画像として保存します。 さらに顔を認識して鼻眼鏡をつけるアクションです。 getUserMedia.jsではWebRTCに対応している場合はHTML5のgetUserMediaを使い、それ以外の場合はFlashベースのWebカムアクセスを使います。結果は同じように扱えるので、安心してWebカムアクセスできるようになるでしょう。 getUserMedia.jsはJa
CPUと対戦もできる。Web上で動作するオセロゲーム·jquery.reversi.js MOONGIFT
jquery.reversi.jsはjQueryを使って実装されたオセロゲームです。 シンプルなルールながら面白いオセロ。海外ではリバーシと呼ばれるこのゲームをWebベースで再現したのがjquery.reversi.jsです。 まさにオセロの画面です。色々な表示が選べます。 勝ちました！ こんなビッグなモードも。 jquery.reversi.jsでは先手、後手の設定や対CPUまたは一人オセロ、さらに盤の大きさが変更できます。縦横の数を自在に変更した特殊なオセロ、なんてのも面白いかも知れません。 jquery.reversi.jsはjQuery/JavaScript製、MIT Licenseのオープンソース・ソフトウェアです。 MOONGIFTはこう見る jquery.reversi.jsのコンピュータのレベルは高くありませんが、そのエンジンを鍛えればWebブラウザ上で手軽にオセロが楽しめ
最低限かつ十分なスタイル設定が特徴のCSSフレームワーク·Kube MOONGIFT
Kubeはプロフェッショナル向けのCSSフレームワークです。 見やすく、かつ様々なニーズに対して即座に答えられるようなデザインを考えるのはとても大変なことです。しかしその道のプロが作り出したスタイルシートフレームワークであるKubeを使えば実現しやすくなるかも知れません。 デモページです。リンクやサイドバーが並んでいます。 こちらはシンプルなベース表示。 iPhoneに対応。 全て一列になって表示されます。 タブレット向け。こちらも最適化されます。 横向きだとうまくいかず…残念。 こちらは表示例。Bootstrapのようなrowが使えます。 フォーム。 テーブル。 リンクの色変更も用意されています。 ボタン。 Kubeの特徴は優れたタイポグラフィ、グリッド表示、フォーム、テーブル、様々なクラスユーティリティ（.width-50とすれば半分になるなど）、ボタンなど最低限ながらも実用的なスタイ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
