HomepageExcellent 10+ Tools & Resources for Designers and Agencies in 2025
CSS3グラデーション・角丸のジェネレーターをjQuery/CSS3/HTML5で作成するチュートリアル
jQuery, CSS3, HTML5を使用して、CSS3グラデーション・角丸を生成するCSS3ジェネレーターを作成するチュートリアルを紹介します。 Creating a CSS3 Generator with CSS3, HTML5 and jQuery デモページ ※デモはWebkit系ブラウザ（Chrome, Safari）で動作します。 [ad#ad-2] 上記デモでは、CSS3グラデショーン（上のキャプチャ）、角丸（下のキャプチャ）のCSS3をブラウザで表示確認しながらコードを生成できます。 チュートリアルでは、HTML5のDOCTYPEの解説から、各要素へのスタイルシートの適用まで詳しく解説されています。 時間がない方は、とりあえずページ下のファイル一式をダウンロードすると、上記のデモがそのまま楽しめます。
Stu Nicholls | CSS PLAY | Return of the image maps
Information It has been a little while since my last image map demonstration, so I thought that I would investigate this again using the latest techniques from some of my other demonstrations. So here we have an image map that will pop up speech bubbles of various sizes with pointers on all four side. The speech bubbles also contain a short piece of text and links to further information on the web
最近公開されたNewなPhotoshopロゴデザイン70のチュートリアル集:phpspot開発日誌
70 Photoshop Tutorials For Text Decoration From 2010 - SloDive 最近公開されたNewなPhotoshopロゴデザイン70のチュートリアル集のご紹介。 次のような新しいロゴデザインのチュートリアル集です。非常に凝ったものもあって、こなしてみると楽しそうです。 どれも素晴らしいロゴデザインばかりですが、これらのチュートリアルをこなせば、センスも磨かれつつ、テクニックも相当つきそうですね。 関連エントリ あの有名プロダクトのロゴを作るPhotoshopチュートリアルいろいろ 映画のタイトルロゴのような非常に美しい光と文字を描画するPhotoShopチュートリアル クールなネオン風ロゴを作成するPhotoshopビデオチュートリアル 車のエンブレムのようなカッコいいロゴを作るPhotoshopチュートリアル ５０のクールロゴ作成Phot
[CSS]あなたのウェブデザインに繊細を加える珠玉のスタイルシート
繊細のポイントは「気がつくかな？」ぐらいにすること。 そんなわずかな繊細をウェブデザインに加えるスタイルシートを紹介します。 Take Advantage of CSS3 to Achieve Subtle Design デモページ 下記は各ポイントを意訳したものです。 はじめに 繊細の大事なポイントは人々が気づかないかもしれない、そして記憶に残らないくらい非常にささやかなものにすることです。 私はこれが初耳だという人がいることを疑います。これは感覚と認識研究によって述べられたよく知られている概念の一つです。 繊細なデザインが難しいのは、「もう少し多くした方がいいのかな？」と容易に思えてしまうところです。このことを知らないと、繊細は失われるでしょう。 以上を踏まえた上で、ウェブデザインにさまざまな形の繊細を提供するために使用できる三つのCSS3のテクニックを紹介します。 1. transi
均一で単調なシャドウから卒業するPhotoshopのチュートリアル
均一で単調なシャドウではなく、大きさや不透明度を調整して奥行きのあるシャドウを描くPhotoshopのチュートリアルを紹介します。 Warping Drop Shadows to Give Depth 下記はそのチュートリアルを元に意訳したものです。 Photoshopの標準機能だけで簡単に作成ができます。 Step 1 まずは準備をします。 下記の例では、白い背景と紙のテクスチャを用意しました。 Step 2 シャドウの元になる矩形を描きます。 背景とテクスチャの間に新規レイヤーを作成（Ctrl+Shift+Alt+[N]）します。選択ツール[M]で長方形ツールを選択し、実体の下の方にやや小さめに矩形を選択します。塗りつぶしツール[G]を使用して、選択範囲を黒（#000000）で塗りつぶします。 シャドウの形は後のステップで整形するので、適当で構いません。
Pretty Simple Content Slider with jQuery and CSS3 | Codrops
Today we will create an auto-playing content slider with jQuery and CSS3. The idea is to alter the background image and to slide in the heading and the description. By clicking on one of the menu items, the auto-play function is stopped and the respective content slides out. So, let’s start with the markup. The Markup The HTML consists of a main div called rotator and an unordered list where we wi
ミニマルなウェブデザインで使用される特徴的な12のエレメント
ミニマルデザインでよく使用される特徴的なエレメントとそれを効果的に使用したウェブサイトを1stwebdesignerから紹介します。 Modern Element Trends In Minimal Webdesign of 2010 ミニマルデザインの特徴的な12のエレメント 参考として当サイトで紹介した関連記事を記しています。 多くの効果的なネガティブスペース 参考：ウェブデザインにおけるネガティブスペースの活用ガイド グリッドベースのウェブデザイン 参考：グリッドシステム -サイトへの有効活用方法 クリアで大きなタイポグラフィ 繊細なテクスチャとパターン 小さいアイコン 軽いシャドウ、グラデーション、レタープレスのエフェクト 参考：ドロップシャドウとグラデーションの使用を的確にするためのチュートリアル レタープレスエフェクトのチュートリアル リボン、スケッチ、点線、ルーラー、半透明な
Creative Sessions | Tuts+
Character illustration is a huge creative field. It is intimately connected to animation and comic traditions, and has a long history of being used in advertising to both promote products and brand companies. In this session, you’ll learn how to come up with great character concepts, develop a character’s backstory, sketch character ideas like a pro, and the process of taking that sketch to a fina
100 Best Photoshop Text Effects Tutorials
Text effect is perhaps one of the most frequently used as well as the most versatile techniques in graphic designing on Photoshop. The bst thing about it is that you can use just about any effect, style or texture to produce interesting typography. The more versatile the text effect technique is, the more people have experimented with it and produced some brilliant tutorials. And so this post aims
無駄なdiv要素やclassだらけのマークアップから卒業する方法
グリッドベースのレイアウトを作成すると、ついついdiv要素を多用してしまいがちですが、意味のあるデータにはそれに適した要素を使用し、無駄なdiv要素やclassだらけのマークアップから卒業する方法をWebdesigner Depotから紹介します。 Fight Div-itis and Class-itis With the 960 Grid System 下記は各ポイントを意訳したものです。 はじめに CSSのフレームワーク：960.gsの場合 classの乱用を避ける リスト要素の使用 画像とキャプションの使用 複数の見出しとパラグラフの使用 子要素のclassは親要素に はじめに 数年前までウェブページの設計はテーブルがスタンダードでした。そしてCSSはそれを大きく変え、今日ではCSSのフレームワークがウェブページの設計を容易にしてくれています。 しかしながら、このCSSのフレームワ
Web制作に役立つサイト集 – creamu
6133716, Hemera/ Thinkstock Web制作の参考になる情報を探している。 そんなときにおすすめなのが、『All Showcases』。Web制作に役立つサイト集です。 CSSやFlashなどのカテゴリーに分けて、かなりたくさんのサイトがまとまっていますね。 いくつかご紹介します。 CSS Best CSS Design ブログ型のCSSデザインギャラリー CSS Flavor クールなサイトを集めたCSS Flavor Flash Design Charts 週刊のかっこいいFlashサイトランキング DOPE Awards クールなFlashサイトをグリッド状に並べているDOPE Awards その他 CMS Showcase CMSで構築されたサイトギャラリー We Love WP 美しいWordPressで作られたサイトのデザインギャラリー サイト名やUIもか
Moving Domains - Balkhis is now SyedBalkhi.com
In 2008 when I launched my personal blog to share my experiences, I decided to call it Balkhis instead of using my full name (Syed Balkhi). As time passed on, I regretted that decision because it created a lot of confusion. People thought that my last name was Balkhis instead of Balkhi. I basically combined my last name with the first letter of my first name. I was @syedbalkhi across all social me
PIONTOGEL : Slot Gacor Terbaik Yang Memiliki Sistem Deposit Dan Withdraw Tercepat Di Tahun 2025
PIONTOGEL : Slot Gacor Terbaik Yang Memiliki Sistem Deposit Dan Withdraw Tercepat Di Tahun 2025 PIONTOGEL adalah slot gacor online terbaik karena memiliki sistem deposit dan withdraw yang tercepat di tahun 2025. PIONTOGEL hadir sebagai pilihan utama para pecinta slot online berkat inovasi dan kecepatan layanan yang ditawarkan. Dengan sistem deposit dan withdraw tercepat, situs ini menjadi pusat pe
素晴らしいWebデザインチュートリアル集 – creamu
デザインの幅を広げたい。 そんなときにおすすめなのが、『The Ultimate Collection Of Brilliant Web Design Tutorials』。素晴らしいWebデザインチュートリアル集です。 クオリティーの高いものが揃っていますね。いくつかご紹介します。 Design an Italian Restaurant Web Layout レストランのサイトをデザインするチュートリアル。デフォルトで入っているカスタムシェイプをうまく使う方法など Create a Sleek, High-End Web Design from Scratch 背景のテクスチャやブラシをうまく使った、クールなサイトのデザイン手法 Create a Photo-Realistic Web Layout 木のテクスチャをうまく使ったデザイン Design a Non-Profit Web
フリーのウェブデザインテンプレートのPSD
ウェブデザインのテンプレートは結構多いけど、こうしたPSD形式での配布は珍しいですね。 今回はフリーPSDテンプレート１０というエントリからご紹介。 デザインの勉強に持つかえるかも 配布形式はPhotoshopなんかで開くPSDファイル。 ダウンロードしてじっくり見てみるのも有りかもしれませんね。 Darkwood Free hosting template Old burned paper Blog Source １０全ては以下に。 過去紹介しているhtml/cssテンプレートサイト 1170 + Ajax/Javascript/Dhtml examples and demos to download Dynamic Drive DHTML(dynamic html) & JavaScript code library Ajax/JavaScriptの宝庫。htmlはあまり関係ないけどお
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
新着記事 | PhotoshopVIP
マウスオーバーをデザインする | DesignWalker
Stockvault.net | Free Stock Photos & Free Images | Share and download
新着記事 | PhotoshopVIP
