「Webサイトの配色で困った！」→「HUE/360使えば良いじゃない」
Webサイト制作で避けて通れない配色の決定。芸術的素養が絶望的にないのでいつも泣いてるゴロドクさんです、どうも。 所詮素人には理論に基づいた配色など無理ゲーです。先日もちょっとしたデザイン的なゴニョゴニョという場面に出くわしましていつものように悩みつつ、なんか配色決定のためのWebサービスないかなーと思って探してたらこういうのを見つけました。 webでの色指定は基本的にRGB値での指定となりますがこれって光の三原色の混色なんですよね。 実際にCSSなんかで数値いじりつつデザインしてると「なんか違うなー」というときにもっと明るくしようとか、もっと彩度上げようってのが感覚的にどの数値をどんだけいじって良いのかってわからないんですよ。 RGB値直接いじって彩度上げようと思ったらくすんじゃった上に色みかわっちゃってオヤオヤ残念なんて日常茶飯事ですよ（いやそのまえにフォトショなりなんなりでデザインカ
Notepad++とEmmetでサクサクコーディング
以前の記事で紹介したNotepad++、大変便利で私もブログライティングやコーディングのデフォルトエディタとしてありがたく使わせてもらってます。 最新のNotepad++ではデフォルトプラグインでEmmetが入っているらしく（もちろん旧バージョンにあとから入れることもできます）、これはちょっと便利だなぁ、と感じましたのでEmmetの基本あたりを備忘録兼ねて紹介しておきます。 Emmetってなにさ？ Webコーディングに携わってる方はご存知の方が多いかもしれない、Zen-Coding。独自の記法でHTMLやCSSを記述し、それを展開することでコーディングが楽チンになるというものです。 EmmetというのはそのZen-Codingの次期バージョンです。 Zen-Codingの次期バージョン、Emmet について Sergey Chikuyonok氏のGithubを見に行ったら、”Emmet (
平均を語る記事を読むときに知っておくべきバラツキの話
平均的な世帯に生まれ平均的な育ち方をし平均的な家庭を持つけど思考にだけはスキューがかかっているゴロドクさんです、どうも。 特に特定のマスメディア記事やブログ記事について揶揄しようということではありません。しばしば数字を扱う記事においては「平均」なるものが登場しますが、これはどれくらいあてになるのでしょうか、というお話。 平均と最頻値 例えば。 10人のグループに対し100点満点のテストを行った結果 85、80、65、55、75、80、95、90、80、75 という点数だったとします。このグループの平均点は78点ですね。あ、ちなみに今「平均点」と言ってしまいましたが、特に断りなく平均と世に言われるものはたいがい「相加平均」です。相加平均というのはデータの総和をデータの個数で割ったものです。 は？なに当たり前のこと言ってるの？という向きもあるかも知れません。しかし平均というとほかに「相乗平均」
英語堪能な新入社員が仕事ができない30の理由
こんにちは日本生まれ日本育ちのゴロドクです、どうも。 現代ビジネスさんに興味深い記事がのっていたのでちょっと考察しました。 ニホンゴ、ムツカシイアルネー 紹介したいのはこちらの記事。 グローバル人材が欲しい! 楽天のある幹部が言う。 「一度、英語が堪能だという新入社員に、海外の取引先に電話をさせたことがあった。一見スムーズにやりとりしているように見えたのですが、あとで相手の担当者から私のところに電話がかかってきた。電話先の相手は中国人で、英語はできるがネイティブではなかったため、内容が全く通じていなかったんです。そういう人と話すとき、ましてや電話では、簡単な単語を使ってゆっくり話すものですが、その新人にはそうした常識がなかった。話が通じているのかわからないまましゃべり続けるなんて論外です。コミュニケーション能力がないんでしょうね」 最近、日本企業で「英語はできるが仕事ができない」社員が急増
宇宙一わかりやすくベイクドチーズケーキの作り方を解説しますょ
「宇宙一わかりやすい」シリーズのレシピ書いてると時々指摘を受けるのが「全然簡単お手軽じゃない！」というもの。 一応スタンスとしては「わかりやすさ第一」ということで写真多めにしてできるだけ工程を細分化して説明…ということで、必ずしも簡単お手軽というわけではありません（ものによってはそういうのもありますが）。 というわけであくまで「自分で料理やお菓子を作る楽しみをちょっとでもわかってもらえれば～」というつもりで書いております。で、今回はベイクドチーズケーキの作りかた。1年ほど前にレアチーズケーキのを書いてまして、今度は焼き菓子バージョンということで。 材料 18cmケーキ型1個分の材料です。 クリームチーズ：200ｇ 生クリーム：200cc 卵：2個 ビスケット：100g バター：50ｇ レモン汁：大さじ1 薄力粉：大さじ3 グラニュー糖：90g 普通のスーパーで手に入らないものはないと思いま
CSSでディスクを回転浮上させるエフェクトのサンプル
CSS演出小ネタ連投です。 【borde-radius】で作った丸型の要素に対し、マウスオーバーでコンテンツを回転させながら浮かび上がらせる方法です。 transformで拡大と回転 言葉で説明するのはとっても難しい（けどやってることは全然難しくない）のでさっそくサンプルをご覧下さい。 HTML <p> <span>Shop</span> <a href="#">More info</a> </p> 【p】のなかに【span】と【a】が並んで内包されています。通常時は【span】のみ表示させておいてhoverで【a】を浮き上がらせてこよう、という構想。 p,span,a{ display:block; position:absolute; width:100px; height:100px; border-radius:50%; font-size:16px; text-align:cen
筆者について | 56docブログ
筆者について 【About】 wrote on 2011/09/30 http://blog.56doc.net/Entry/1/筆者について 日々のらりくらりとブログを書いているゴロドクと申します、どうも。 スポンサードリンク 1974生まれ、一児の父。北海道の真ん中あたり在住。普段は何かを作る会社で何かを描いている人ですがリーマン生活はシノギです。幸せになるためにHTML/CSS/PHP/MySqlを勉強中。 甘いものが好きです。ビールも好きです。夏はドライ、冬はコク系を飲み分けますが甘いものは年中なんでも食べます。時々自分で作ったりもします。 ツイッターで私とじゃれ合いたい方はこちらをフォローください。 ゴロドク (gorodoku)さんはTwitterを使っています 使用頻度低いですがフェイスブックで中の人を知りたいときはコチラから。 岡田 真琴 さらに使用頻度の低いGoogl
宇宙一わかりやすくタコライスの作り方を解説しますよ
筆者について 【About】 wrote on 2011/09/30 http://blog.56doc.net/about/%E7%AD%86%E8%80%85%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6筆者について 日々のらりくらりとブログを書いているゴロドクと申します、どうも。 スポンサードリンク 1974生まれ、一児の父。北海道の真ん中あたり在住。普段は何かを作る会社で何かを描いている人ですがリーマン生活はシノギです。幸せになるためにHTML/CSS/PHP/MySqlを勉強中。 甘いものが好きです。ビールも好きです。夏はドライ、冬はコク系を飲み分けますが甘いものは年中なんでも食べます。時々自分で作ったりもします。 ツイッターで私とじゃれ合いたい方はこちらをフォローください。 ゴロドク (gorodoku)さんはTwitterを使っています 使用頻度
CSSのみ画像不要の吹き出しの作り方を若干丁寧に解説してみる
WEBページの演出で吹き出しの中にテキストが入ってるのをよく見かけますが、あれのやり方をかなり最近まで知らなかったゴロドクさんです、どうも。 CSSのbefore/after擬似要素の説明で吹き出しのサンプル紹介してるんですけど、今回はそれについてもうちょっと詳しく書いておこうかな、と。 吹き出しの矢はボックスのボーダーで描画します ベースとなるHTMLは以下の1行のみです。 <p class="balloon">ゴロドクさんイケメン過ぎて泣けた！</p> クラス指定なので１つCSS定義しておくと同じ演出を繰り返し使えますね。 divタグネストとかでも同様のこと出来るんですが、HTMLソースがスッキリするのでbefore/after擬似要素を利用します。ご存じない方は事前に 劇的！（でもない）before after 擬似要素の使い方まとめ | 56docブログ を読んでおくと分かり良いと
拡張子のないURLでページにアクセスさせる.htaccessのTips
需要があるかどうかわかりませんが、個人的にちょっと困ったことがあって調べものをしまして、ウェブ上のファイルに拡張子のないURLでアクセスする方法を知ったので備忘録残しておきます。 .htaccessでのMIMEタイプの指定 私の利用しているウェブクロウプラスというレンタルサーバーでは.htaccessでMIMEタイプが指定できません。MIMEタイプというのはざっくり言うと「拡張子とファイルの種類の関連付け」のようなものです。 通常apacheサーバーでは.htaccessというファイルに必要なMIMEタイプの指定を記述します。良くある例ではphpのファイルに拡張子「.html」をつけて動作させたりとか（あるいはHTMLファイルの中に部分的にphpスクリプトを埋め込んだり）。 そういった場合.htaccessには AddType application/x-httpd-php .php .h
JSではてブのデータを取得してWebに表示させてみよう！
ちょっとお勉強したことの備忘録。はてなブックマークに登録されたページの情報（タイトル、URL、ブックマーク数、コメントなど）をはてぶのAPIを利用してjavasciptで取得する方法を調べました。 【追記】関連記事書きましたのでこちらも参考にどうぞ。 RSSフィードをJSONとして受け取る方法～Google Feed APIの応用 はてブの情報はJSONで はてぶされたページの情報は はてなブックマークエントリー情報取得API – Hatena Developer Center このページの解説にあるようにJSON形式のデータとして取得することができます。 いやちょっと待って、そもそもJSONとはなんぞや？という話ですが JSON（ジェイソン、JavaScript Object Notation）は、JavaScriptにおけるオブジェクトの表記法をベースとした軽量なデータ記述言語である。
無料でOCR(光学文字認識)したかったらGoogleDriveを試してみるといいかもね
昨日ツイッターのフォロワーさんがTLで「人を殴ったらかなり痛いくらいの紙書類の束渡されて、一晩で再編集とか死ぬる」とおっしゃってまして、まだまだ紙ベースの業務進行ってありますしPCに取り込んで効率的にさばくにはどうしたらいいだろうなーと思いまして。 調べてみたところ、GoogleDriveでもテキストスキャンした画像ファイルをOCR変換する機能があるらしくちょっとサンプル作って試して見ましたので本日はそのレビューを。 【追記】縦書き版の検証記事も書いときました。あわせて参考にどうぞ。 GoogleDriveOCR、縦書きだったらどうなのよ？ Google Drive OCRの使い方 GoogleDrive利用するにはとりあえずGoogleアカウント必要なのでない方はまずそちらのご用意を。GoogleDriveの導入については過去に サービス開始したオンラインストレージ『Google Dri
WEBデザインギャラリーのまとめ 57サイト 2012年9月版
WEBデザイン時の参考にするのにサイトデザインのキャプチャをまとめたギャラリーサイト。その界隈の方が定期的にまとめ記事書いてますが2012年9月版ということでリンク切れチェック等兼ねて改めてまとめてみました。ちょっと数が多いので PC向けデザイン【36サイト】 モバイルデバイス向けデザイン【14サイト】 パーツごとのデザイン【7サイト】 ということでざっくり区分してみました（クリックで各項目へジャンプ）。 それぞれのサイトについての説明は省きますがサイトのジャンルやテーマ、色調などで検索できるところが多いので「なんとなくボンヤリしたイメージは出来てるんだけどもうちょっと」というときに参考にするといいと思います。 PC向けデザイン 一般的なPC向けWEBページのデザインギャラリーサイトです。 1.ズロック 2.ウェブセレクション 3.WEBデザインの見本帳 4.イケサイ 5.bookma!{
『いじめ問題』が何故なくならないか皆わかってるのにね
大津の中学2年生自殺事件に関し、学校・行政・加害者家族の動きが明らかになるたびにいちいちクズ過ぎてもうため息しか出ないのは私だけではないと思います。 それに絡んで『いじめ問題』が何故後を絶たないのかという話をちょっとだけ。 『いじめ』なんて存在しません あまりにも酷い事件及び関係者の対応でモヤモヤしてたところツイでこんなトゥギャりが流れてきまして 「いじめ」を2手で覆す方法 – Togetter 「あーこれこれ、こういうことだ」とだいたい私の言いたい事が書かれていました。 つまり『いじめ問題』というのは学校における児童・生徒間のトラブル、それもかなり一方的な被害・加害の関係の総称であって、個別の事例についてそれを『いじめ』などと曖昧模糊とした呼称で呼ぶのはふさわしくないのです。 蹴られたり殴られたりすればそれは暴力・傷害事件であり、不当に金銭を要求すれば恐喝であり、言われなき中傷を受け仲間
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
