Commerce | Merkle
We use cookies. You have options. Cookies help us keep the site running smoothly and inform some of our advertising, but if you’d like to make adjustments, you can visit our Cookie Notice page for more information. We’d like to use cookies on your device. Cookies help us keep the site running smoothly and inform some of our advertising, but how we use them is entirely up to you. Accept our recomme
The Pete Design | Minimal UI and Functional UX Design and Development Freelancer
I am a freelance visual designer with a focus on minimal UI and functional UX design for startups. In addition to design, I am skilled in front-end coding (HTML, JS, CSS3) and back-end coding (Ruby on Rails). Over the past five years, I have worked with companies of all sizes from around the globe to develop a unique visual language for their online presence. In addition to my freelance work, I am
これは衝撃的！CSS開発を爆速化する「Emmet LiveStyle」:phpspot開発日誌
Emmet LiveStyle ? live bi-directional CSS edit of new generation CSS開発を爆速化する「Emmet LiveStyle」。 ブラウザのDOMインスペクタの方でCSSを修正するとSublimeTextに反映され、またSublimeTextを編集するとブラウザに即反映されるというプラグインです。 ブラウザで編集しちゃえば簡単にカスタマイズはできるけど、テキストエディタにコピーが必要で、逆にテキストエディタで書くのもブラウザのリロードが必要といった具合に手間がかかりますが、その手間がなくなります 更に、複数のブラウザウィンドウに即座に反映されるため、横幅を小さくしたブラウザ、通常のブラウザを開けば、レスポンシブデザインのプレビューが同時に終わります。 片方のブラウザのDOMインスペクタでCSSをカスタマイズしてももう一方のブラウザ
一目惚れするくらいかわいいダイアログを表示するjQueryプラグイン | アルパカの具
思わず一目惚れしてしまいました。このダイアログのかわいさに。しかも、ものすごく簡単に実装できてしまうんです。 ダイアログの種類は「Notice（通知）」、「Success（成功）」、「Warning（警告）」、「Error（エラー）」の4種類があるので、用途に合わせて使い分けることができます。 使い方 1.jQuery $( function(){ $().toastmessage( { position : 'middle-center' } ); // Notice $( '#demo-notice' ).click( function(){ $().toastmessage( 'showNoticeToast', 'こんなにかわいいダイアログが手軽に使えるなんて' ); }); // Success $( '#demo-success' ).click( function(){ $(
縦や横に長いサイト「高級ペライチ」1度は見ておきたいスクロール演出のまとめ32個！
HTML+CSS+JavaScriptでつくるサイトの定番演出「高級ペライチ」！ HTMLファイ部の「HTML5の鬼」ことほんだです。 カヤック社内では「高級ペライチ」という愛称で呼んでいる縦や横に長い1ページサイト。 スクロールに合わせたパララックスやアニメーションの演出が印象的ですよね。 今回は「高級ペライチ」とググると1位に表示される、 僕のはてブ「高級ペライチ」タグから厳選32サイトを紹介します！ まずは王道！縦に長い高級ペライチ
[CSS]border-radiusを使って、角丸ではなく落書き風にボーダーをデザインするテクニック
角丸を指定できるborder-radiusで、ボーダーを落書き風にすることもできます。 色によっては、蛍光ペンや絵筆みたいにもできますね。 デモページ ※リンク切れ 実装は、こんな感じです。 HTML 要素はdivだけ、入れ子もラッパーも必要ありません。 <body> <div> This is my paragraph. Like my border? This is my paragraph. Like my border?This is my paragraph. Like my border?This is my paragraph. Like my border?This is my paragraph. Like my border? </div> </body> CSS 落書き風のボーダーを実現しているのは、border-radiusです。 スラッシュで区切ることにより、水平
CSSでfloatを解除する方法のまとめ
CSSのfloatを解除（クリア）する方法をまとめてみました。 以前、floatを解除するテクニックとして以下の記事をエントリーしたのですが、その後色々なテクニックがあることに気がつきました。 CSS の after 擬似要素で回り込みを解除する ということで、そもそものfloatの問題（というか仕様）と、その対処方法についてネットで調べた情報を一通りまとめました。 １．floatにより親要素の高さが出なくなる（＝背景がなくなる）問題 親要素の中にある子要素にfloatプロパティが設定されていると、内容をもたない親要素の高さが0になるという仕様になっています。 例えば、次のCSSとHTMLを例にします。 <style> #container { width: 200px; background: #ddd; } .box { width: 25px; margin: 10px; paddi
新人デザイナーならブクマして損なしのWebデザインギャラリーサイト
【フレッシュなWebデザイナーの皆さんへ】数ある... / ━━国内ギャラリーサイト━━イケサイ、ABM、S... / 【イケサイ】国内のコーポレートサイトが中心のデザ...他...全14件 【フレッシュなWebデザイナーの皆さんへ】 数あるWebデザインギャラリーサイトの中で、新卒Webデザイナーがとりあえず毎日見ておけば間違いない特にオススメのギャラリーサイトをまとめました。
SassとCompassを使って楽しくCSSコーディング！ - develo.org
HTML、CSS、Javascript、デザイン、絵を描いたり。
ズルデザStylusでモック体質の愛され★ウェブサイトみたいな
Rubyのヒトは迷わずSass+Compass使うのかもしれないけど、僕は見た目がすっきりしているStylusのほうが好きです。 Stylusのよいところ Pythonっぽくかける coffescriptっぽくもある {}を極力使わなくていいので右手の小指に負担がかからない(Emacsユーザーは酷使するのは左手小指で十分) Jadeを使えば全てインデントで統一できる nibがある Stylusのよくないところ LESS2Stylusがない(twitter-bootstrap困る) Sass関係ないですね。 ズルいStylus ズルいデザインが良かったので、自分のためにStylus+nibで関数(mixin)にしておくことにした。CSSプリプロセッサのメリットはこういったデザイナーさんの知恵というかプロセスに名前を付けて単なる関数に落とし込めることだと思うんだけど、そういうライブラリはまだあ
yuga.js :: Kyosuke.jp
yuga.jsって？ ウェブサイトを作る上で面倒な部分を自動で実装したり、ちょっとした機能を簡単に追加したりするJavaScriptです。jQueryを使って作られています。Web制作を優雅にするために作られました。 設置方法 まず、ファイル一式をダウンロードし、読み込みたいサイトの任意のフォルダに配置します。 yuga.jsを使いたいHTMLファイルのhead要素でjavascriptを読み込みます。 <link rel="stylesheet" href="css/thickbox.css" type="text/css" media="screen" /> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/thickbox.js"></s
Kyosuke.jp
中村享介。株式会社ピクセルグリッド代表取締役/Jamstackエンジニア。過去の著書に『webクリエイティブのためのDOM Scripting』
Photoshopのキラーチュートリアル30個
Photoshopはあらゆるところで使われており、だからこそ山のように使い方を解説したチュートリアルがあるわけですが、その中でも特に「これは！」と思われるようなキラーチュートリアル30個です。 30 Killer Free Photoshop Tutorials http://slodive.com/photoshop/free-photoshop-tutorials/ ◆1：ダーク・フォト・マニピュレーション「ヴァンパイアハンター」（光と影をうまく操作するためのレタッチ・カラー調整・レイヤーの操作が分かる） ◆2：魅力的なオウムの写真操作（動物の写真を抽象的かつインパクトのある画像に加工するレイヤー操作方法） ◆3：Photoshopで手描き風イラスト ◆4：雰囲気のある風景に加工する（レイヤーとテクスチャを駆使してそれっぽくする） ◆5：水であふれて見るものを不安にさせるシーン作り（2
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://www.rollwithmakisan.com/
Bootstrapのalertをかわいく動かす - 暮らしの技術
本の書き出し
taikikawakami.tk