HTML+CSS+JavaScriptでつくるサイトの定番演出「高級ペライチ」！ HTMLファイ部の「HTML5の鬼」ことほんだです。 カヤック社内では「高級ペライチ」という愛称で呼んでいる縦や横に長い1ページサイト。 スクロールに合わせたパララックスやアニメーションの演出が印象的ですよね。 今回は「高級ペライチ」とググると1位に表示される、 僕のはてブ「高級ペライチ」タグから厳選32サイトを紹介します！ まずは王道！縦に長い高級ペライチ
縦や横に長いサイト「高級ペライチ」1度は見ておきたいスクロール演出のまとめ32個！
HTML+CSS+JavaScriptでつくるサイトの定番演出「高級ペライチ」！ HTMLファイ部の「HTML5の鬼」ことほんだです。 カヤック社内では「高級ペライチ」という愛称で呼んでいる縦や横に長い1ページサイト。 スクロールに合わせたパララックスやアニメーションの演出が印象的ですよね。 今回は「高級ペライチ」とググると1位に表示される、 僕のはてブ「高級ペライチ」タグから厳選32サイトを紹介します！ まずは王道！縦に長い高級ペライチ
超定番の jQueryプラグインをサンプルと一緒に集めました。（商用利用OKなもの多め） | KAYAC DESIGNER'S BLOG - デザインやマークアップの話
超定番のjQueryのプラグインを厳選して集めました。 商用利用が可能なものを優先的にピックアップしています。 （利用する際はそれぞれライセンスをご確認くださいね） 超定番プラグイン アニメーションのイージングを簡単に扱えるプラグイン jQuery.easing jQuery.easing
インスピレーションを刺激する！Facebook新タイムラインのデザイン51選！
あっという間に12月！ さて、こんな年末の年の瀬迫るちょー多忙期に、なんとFacebookのタイムラインが新しくなることに！ カバー写真とプロフィール写真を工夫することで、面白い見せ方をしているデザインを51個ご紹介します！ 新タイムラインの設定方法やカバー写真の変更方法についてはこちらがおすすめです！ 来月スタート！新・facebook「タイムライン」登場。で、準備しておきたい５つのこと Facebookでタイムラインのcoverを設定する方法 - nanapi Web また面白いプロフィールページだけを集めたFacebookのグループもおすすめ！ Awesome Profile Hacks Ekkapong Techawongthaworn Mohammad L. Azzam Andrew Grojean Yale Zhao Sune Adler Miltersen Sven De B
CSSだけで必殺技を作るコンテストのクオリティーが高すぎる件
jsdo.itで「SPEC」というコーディングコンテストを開催しています。 今回のテーマは以下の二つ。 CSSだけを使って必殺技の演出を加えてください ローディングの演出を考えてください 「こんなマニアックなテーマだけど参加してくれる人がいるのだろうか…！」と心配していたのも杞憂に終わり、続々とすごい作品が投稿されています。 開催期間中ですが、ぼくが個人的に「これは！」と思った作品をピックアップして紹介したいと思います。（コンテストの審査とは関係ないですよ！） CSSだけを使って必殺技の演出を加えてください スーファミのRPG風 えい！：forked: CSSで必殺技！ - jsdo.it - share JavaScript, HTML5 and CSS 光が集まる必殺技 forked: CSSで必殺技！第2弾！ - jsdo.it - share JavaScript, HTML5 a
知らないと人生損してる！デザイナーのための必見ブログまとめ
はてブたくさんついちゃいました(・∀・) お久しぶりの意匠子です。 先日のHTML５に関する記事がとんでもないブクマ数ついちゃいました。 今の世の中はHTML5旋風吹き荒れてますね！ このような最新情報を集めるのもデザイナーの大事なお仕事！ そこで今回は知らないと人生を損しているであろうデザイナー必見のサイトをまとめました！ 続きをどうぞ！ まずは鉄板サイトから！！ Webクリエイターボックス チュートリアル系の記事が豊富。 まぁWebデザイナーはほぼ100%見てるいると思って間違いなし。 コリス Webデザイナーやマークアップエンジニアで、 このサイトを知らないのはモグリと思われてしまうくらい有名なサイト。 CSS3やJavaScriptの話題が豊富。ちなみに某りすこさんとは関係ありません。 ホームページを作る人のネタ帳 Webデザインを学ぶ人はみんな一度は見たことがあるぐらい有名なネタ
ユーザーを逃さない！海外Webアプリの入力フォームいろいろ
このフォームのポイント！ 上部のボックスでエラー表示 入力時にリアルタイムのエラー判定 それぞれのフォーム下部にエラー文言 項目名を赤く目立たせる
初めての企画書が、最終選考に残った アイデアの出し方
販促会議賞という企画コンペに出させていただき、ファイナリストに残ることが出来ました！ 本職デザイナーが、どうやって考えて企画を立てたか。思考の足跡をつらつらと書きます。 ちなみに出した企画はこちら。 ただいまWeb投票もしているので、企画見てオモロイ！と思った方は、ぜひ投票お願いしまーす！ まずは販促会議賞ってなに？という人にご説明。 販促会議賞は、いろんな企業から「この商品の販促アイデアを考えて下さい」という感じでお題が出され そのどれかに応募するというものです。 企画をパワーポイントにA4サイズ10枚以内で、容量は5MB以内にまとめてくださいというルール。 誰でも参加可能、いくつでも提出OKです。 今回は、全27社から28課題出てました。 1.まずやったこと どうしたら勝てるか研究しました。 販促会議賞は第2回目だったので、1回目の受賞作品をざざっと拝見。 思ったこと 第１回の優勝者、
永久保存版！？携帯コーディング、これだけ読めばすぐできる！ | KAYAC
マークアップエンジニア（以下、ME）のtacamyです！(`・ω・´) カヤックでは、デザイナーもHTMLコーディングをしてくれています。 （いつもありがとうございます！） そんなワケで、本格的にHTMLコーディングはしないけど、 ちょこっとしたページなら組みますっていうデザイナー向けの、 「コレだけ読めばすぐできる」シリーズを始めました。 第一回は「携帯コーディング」についてです。 携帯はPCとは全くの別物なので、なんとなく敬遠しがちですが、 最低限の内容であれば覚えることも少ないですし、 一度覚えてしまえばスタンダードがしばらく変わらないので、覚えておいて損はないですよ！ 携帯コーディングの基本 基礎の基礎 文字コードはShift-JIS CSSはインラインで指定（タグに直接style属性を追加する） 画像を含むページ容量100KB以内（HTML自体の容量は9KB以内） 画像はgifか
購買意欲を刺激する！印象的なHTMLメルマガ10選
マラソンに夢中！ nonakaです。 毎週通販サイトのhtmlメルマガを作っているので、他の通販サイトのメルマガも多数購読してます。 今回は、通販サイトのhtmlメルマガを集めてみました。 通販サイト html形式メルマガまとめ セレクトショップ：BEYES（バイズ） 【メルマガの横幅】600px。 【構成】バイヤーからの一押しアイテム、毎週更新される特集ページバナー、新商品情報、ファッションコラムなど。その他、購入者限定のメルマガも配信してます！ 靴下専門店：Tabio（タビオ） 【メルマガの横幅】713px。 実際のメルマガ用のhtml 【構成】雑誌掲載商品、季節のリコメンド、ランキングなど要素が豊富！ 無印良品 【メルマガの横幅】569px。 実際のメルマガ用のhtml 【構成】バナーが縦に並ぶ構成が多い。 facebookやtwitterの案内もさりげなくヘッダーに入っている。 z
ログイン画面の離脱率を下げる！ECサイト各社の工夫
こたつにみかんはじめました。nonakaです。 週に１度は通販で買い物してます。そんな中、ログインする画面をいろいろ見たので、ファッション通販サイトのログイン画面を集めました！ ファッション通販サイトの場合、ログイン画面に「新規会員登録」への誘導があるのがほとんどです。今回は、2つのパターンにわけてご紹介します。 「ログイン画面」エリア、「新規登録」エリアが上下にあるパターン セレクトショップ：BEYES ログイン画面、新規登録が上下にあるパターン。入力フォームが大きめで入力しやすい。新規会員登録のボタンは色を変えて目立たせてます。 無印良品 ログイン画面、新規登録が上下にあるパターン。フォームとボタンの横幅がそろっていて見やすいですね。 ユニクロ ログイン画面、新規登録が上下にあるパターン。入力フォームが大きくて見やすいです。ログインと会員登録の分けかたも見やすいですね。 子供服：goo
いま読むべき、クリエイティブWEBマガジン10選
カッティングエッジなカルチャーをピックアップする、クリエイティブWEBマガジンをセレクト。 いますぐキャッチアップして、クリエイティブシーンのニューウェイヴをサーフしよう！ Public-image.org Public-imageは、ANSWR代表の針谷氏によって創められたWebマガジン。 ひとつひとつの記事に、執筆者名が記載されており、 単なるインフォメーションでなく、ひとつの視点によるエディットされた情報が堪能できる。 その独自視点によるコラムは脳汁モノ。 現在は、オルタナティヴスペース「Public-image3D」など、オンラインメディアを飛び出して、 メディアと現場をクリエイティブスクラッチした実験を日々発信中！だそうです。 2次元メディアにとどまらないその心意気にクラップハンズ。 Public-image3D: http://3d.public-image.org 以下サイト
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
