シングルページなサイトをデザインする上で、知っておいて損は無いかもしれないプラグインとか色々！ | バンクーバーのうぇぶ屋
最近多いですねー、1ページで完結するタイプのサイト。One Page Loveのサイトなんかから、シングルページの事例も大量に見ることが出来ますし、パララックスやらフリップ型のコンテンツやら、なんか色々出てきてて着いて行くのがやっとです… でも実際シングルページをつくろうとすると、え？何これどうなってんの？って物も多くてビビることもしばし。 ってことで、今日は僕が知ってる中で『お、これ、シングルページ作る時に使えるんじゃね？』って物を幾つかご紹介させて頂きます！ 主にはシングルページデザインの表現の幅を広げるjQueryプラグインの紹介になるかなと思いますが、楽しい物も多いので、是非興味があれば試してみてくださいませ〜！ それではいってみましょー！ パララックススクローリング系プラグイン この辺は以前に紹介したことがあるものばかりなので、ぱぱーっと行きます。 jQuery Waypoint
Webデザインのスキルを磨こう！Webサイト模写のススメ
2014年8月17日 Photoshop, Webデザイン 先日、Webデザイナーになってもうすぐ2年がたつというMさんから、「どうすればデザインのスキルを磨くことができるのか？」という旨のご相談を頂きました。今回は彼女の相談メールでもふれられている、デザインのスキルアップに有効なWebサイトの模写のやり方について掘り下げてみようと思います！ ↑私が10年以上利用している会計ソフト！ 頂いたご相談メール 実は最近スランプぎみになっていて、サイトデザインを作成してもなぜかダサい、野暮ったいデザインになってしまいます。 デザインスキル向上させるために、いいデザインのサイトを模写するといいときいて模写もしてみたのですが、ぴったり一致するように作るのに意識がいってしまい、あまりデザインスキルが上がったと実感できないでいます。（模写したデザインを自分のオリジナルで活かせない） もし模写するときはどう
Webクリエイターを目指せ！
Webクリエイターを目指すにあたって必要な知識、HTML〜CSSをはじめとしていろんなノウハウをまとめていっていますFacebookを使っていく上で必ず出てくるカバー画像！！特にフェイスブックページにはカバー画像を設置することが必須ですが、ここのサイズってイマイチわかりづらいんですよね。 という訳で！！ 今回このブログのフェイスブック […] Markdown使っていますか？これからのためにも覚えようMarkdown！ wEVA社内でも「仕様書の書き方を学びたい」という声が出てきていますが、そういう文書制作にも活用できる書式で「 Markdown記法 」という […] SublimeText2はWebクリエイターを目指すならオススメです！！ 普段授業ではDreamweaver等のAdobeのツールでも授業してきていますが、HTMLやCSSのコードを書いていく中でも私達が一番使っている時 [
美しいバランスを生み出す黄金比をウェブページのレイアウトに使ってみたい人に役立つ -The Golden Grid
黄金比（1:1.6180）をベースに作成されたグリッドを使った、ウェブページのレイアウトに役立つテンプレートとツールを紹介します。 The Golden Grid [ad#ad-2] The Golden Gridの仕組み The Golden Gridのセット内容 The Golden Gridの仕組み 「The Golden Grid」は960 Grid Systemに水平方向のガイドを加えたもので、グリッドを構成するカラムと溝を黄金比ベースにしたものです。 黄金比については以前の記事で少し取り上げました。 黄金比をサイトのデザインに取り入れる簡単な3つの方法 「The Golden Grid」は長方形の幅と高さ（a/b）が黄金比（1.6180）をベースに構成されており、マージンの横と縦（x/y）も黄金比をベースにしています。
Web制作者は知っておきたいwebサイトのレイアウト7選 │ Design Spice
レスポンシブwebデザインからグリッドデザインまでよく使われているwebデザインのレイアウト用語をまとめました。 レスポンシブwebデザイン エラスティックレイアウト リキッドレイアウト フレキシブルレイアウト 固定幅レイアウト グリッドレイアウト 可変グリッドレイアウト レスポンシブwebデザイン(Responsive Web Design) PCやスマートフォン、タブレット事に複数のデザインを制作するのではなく、 ディスプレイの幅に合わせてデザインを最適化する方法。 CSS3のMedia Queriesを利用してディスプレイサイズに応じてデザインを変更します。 メリット 一つのソースで複数デバイスに対応できるのでメンテナンスが容易です。 また今後デバイスの種類が増えてもそれに対応できます。 それぞれのデバイスに合わせた形で調整できるのでユーザーエクスペリエンスも高くなります。 デメリッ
【一部閲覧注意】いろんな意味でインパクトありすぎるWebサイト10 | Webクリエイターボックス
2021年12月27日 Webデザイン 衝撃的な配色、心踊りだすgifアニメーション、斬新な背景画像…そんな一度見たら忘れられないくらいインパクトのあるWebサイトをいくつか紹介しようと思います！また、あなたのWebサイトを素敵に変身させてくれるWebサービスも一緒にご紹介します！ ※一部閲覧注意のWebサイトもあるのでお気をつけください。 ↑私が10年以上利用している会計ソフト！ どこか懐かしさも感じるWebサイト 1.【閲覧注意】激安 格安 爆安ホームページ制作屋 WebクリエイターボックスのTwitter 人気のつぶやき 2010年 トップ30で見事3位に輝いたWeb屋さんのサイト。離れて見ても体に悪影響を及ぼしかねません。 » 激安 格安 爆安ホームページ制作屋 2.【閲覧注意】ACCEPT JESUS, FOREVER FORGIVEN! レインボーの背景が横に高速で流れていきま
2010年度版・とても参考になった国内のWeb制作関連エントリーまとめ - かちびと.net
少し気が早いですが、今年も残すところ あと僅かです。ここで、Web制作をする にあたって、個人的に、とても参考にな った素晴らしいエントリーをご紹介します。 基本的にまとめ記事が大好物なので、 まとめのまとめ、という形になってしまい ますがご了承願います。 まぁ、単なる個人的なメモです。今年はお世話になりました、という感謝の意を込めてリンク&トラフィックで返したいのと、自分の復習用リンク集です。来年もたぶんお世話になる記事だと思いますので、備忘録も兼ねて。順不同です。 尚、当ブログのエントリは御礼の場であるこの記事では割愛しています。後日、別記事にてまとめさせて頂きますので、宜しければ御覧ください。 デザイン 読み物系が多いです。正月とかで見直す用。 配色パターンからWebデザインを考える ウェブデザインでこれは気をつけたいの35のポイント デザインQRコードの作り方 非デザイナーのための
国産のWebデザインギャラリーサイトが一番参考になるのでまとめた - かちびと.net
Webデザインのギャラリーは沢山 ありますが、結局感性の近い国産 のギャラリーが一番参考になるの でまとめました。探してみると結構 いろいろあるんですね。助かります。 やはりギャラリーは国産がいいですね。沢山あるので、ある程度厳選しています。 io3000 最近知りました。すごくいいですね、ここ。見やすいし、使いやすいです。おすすめ。 io3000 straightline bookmark とにかくクールでクオリティの高いサイトをブックマークしているギャラリー。 straightline bookmark Web Design Clip こちらも個人的にオススメのギャラリーサイトです。目的のデザインも直ぐに見つかりますよ。 Web Design Clip Good Design Web こちらは他ではあまり見かけない良デザインのサイトを紹介してる貴重なギャラリーです。 Good Desi
MdN Design｜総合情報サイト
いくつものツールを切り替えて使うとき、いちいちマウスを移動してクリックするのは意外とめんどうだ。1回の操作では大したことがなくても、何百回、何千回と同じ操作を繰り返すと、多大な作業負担になる。こういった場合は、キーボードのショートカットを活用しよう。ショートカットはシンボルやトゥイーンの作成などに利用しているケースが多いと思うが、実はツールの切り替えにも使える。 操作方法は簡単で、【1】【2】のように設定されている単一のキーを押すだけで即座にツールが切り替わる。設定されているキーが気に入らなければ、編集メニュー→“キーボードショートカット”から変更可能だc。筆者は、頻繁に使用する虫めがねツールのキーを、押しやすいZキーに変更している。ちなみに、各パネルのフィールドなどにフォーカスがある場合は、文字入力が優先されてしまいツールがうまく切り替わらない。このようなときは、ステージを1回クリックす
綺麗なフッターデザイン集 – creamu
フッターをデザインしたい。 そんなときに参考になるのが、『Beautiful Footers in Modern Web Design for Inspiration』。綺麗なフッターデザイン集です。 かっこいいものが揃っていますね。 Bits And Pixels 滴が垂れたようなデザイン。グラデーションも綺麗です Urban Pie 背景のテクスチャとイラストがかわいい「Urban Pie」 Miss Web Lash マルチストライプとテクスチャが綺麗な「Miss Web Lash」 Kailoon フッターにポートフォリオの画像を配した「Kailoon」 Straw Poll Now 木のイラストがかわいい「Straw Poll Now」 フッターのデザインを変えてみたいときに、一度見てみてください。 Beautiful Footers in Modern Web Design f
よりリッチで、よりフレンドリーになったウェブデザインの現状 -2010年のトレンド
The Current State of Web Design: Trends 2010 下記は記事の意訳と実例をいくつか抜粋したものです。元記事では他にも多数の実例が紹介されています。 はじめに ウェブデザインとは移り変わりが激しい業界です。他のすべての芸術的な表現とまったく同じように、ウェブデザインは絶え間なく、そして驚くほど早いスピードで進化を遂げてきました。 そして現在、私たちはウェブデザインの黄金時代を経験しているところです。それはこれまでのところ、少なくとも最も良い期間です。主要なブラウザで利用できる新しいツール（CSS3, HTML5, 埋め込みフォントなど）、自由に利用が可能な多くのリソース、デザインコミュニティなど、ウェブのスタンダードの信頼性が高いサポートを持っています。 私たちはより良いインタラクションなデザインや審美的なデザインを見ています。そして同様に個人的で魅力
覚えて良かったCSSテクニック « zaru blog
ここ最近、覚えてよかったなーと思ったCSSテクニックをまとめてみる CSSテクニックは時代とともに変わっていくけれど、ここ1年ほどスタメンレベルで使うCSSテクニックが絞られてきたので、ここらでちょっと個人的にもまとめておこうかと。 liボックス 幅：190px マージン：15px liボックス ダミーテキスト。ダミーテキスト。ダミーテキスト。ダミーテキスト。ダミーテキスト。 liボックス ダミーテキスト。ダミーテキスト。ダミーテキスト。ダミーテキスト。ダミーテキスト。 <li>にはクラスを指定せずに、左右にぴったりくっ付くように配置が可能。 <style type="text/css"> #box1{ width: 600px; } ul{ width: 615px; margin: 0 -15px 0 0; overflow: hidden; _zoom: 1; font-size:7
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
cmmntr.com
レスポンシブWebデザインのサイト設計・実装・確認に役立つツールとリソースのまとめ
Loading...
Webクリエイターなら押さえておきたい、CSS3を使った次世代表現
http://n1kumeet5.com/2011/08/website-renewal/
http://designaholic.cc/2011/02/post-82.html
見出しデザイン.com -Webデザインの“見出し”を集めたサイト-
ウェブ初心者も安心して作成できる、無料HTMLテンプレート素材24個まとめ - PhotoshopVIP