-
CSS3で作るグラデーション・ストライプの見出し(hタグ)デザインまとめ
2015/10/8
サイトのリニューアルの仕事があって、仮のデザインを作っているのですが画像で見出しを作るとちょっとした修正も画像ソフトを使うのが面倒になってきました。 なので出来るだけCSSでカッコよく見出しを作ろうと ...
-
Adobe Fireworksで作る、簡単に3D文字を作るテクニック(制作データダウンロード付き)
2014/4/3
Adobeのfireworksで文字をカッコよく見せたりするときに使うテクニックです。 フォントをゴシック系などに変えたりしてカッコよく見せたり、色々方法はありますが今回は簡単に3D文字を作る方法をご ...
-
「CSS Shake」を使って注意を引きたいテキスト・画像を揺らす(サンプル付き)
2014/3/10
テキスト・画像が揺れていると気になりますね! 簡単に揺れる仕組みを実装が出来ますので今回は「CSS Shake」を使って再現してみます!
-
1ページで魅せる素敵なWebサイト
2014/2/26
最近、1ページのWebサイトを良く見掛けます。 海外ではよく使われていますね。海外のデザインはシンプルでカッコいいサイトが多いのです。 背景に動画を入れたり、下にスクロールすると横から文字が出てきたり ...
-
jQuery 「swipebox.js」を使ってスマホにも対応している画像切り替えをする方法(サンプル付き)
2014/2/23
LightBox系のプラグインを今まで使っていましたが、Swipeboxは画像を表示しているときにキーボードの矢印で画像を切り替えることが出来るので便利です。 URLhttp://brutaldesi ...
-
背景の画像をフェードイン・フェードアウトさせるjQuery 「BACKSTRETCH」を使って実装する方法(サンプル付き)
2014/2/21
画像を大胆に大きく使ってサイトをカッコよく見せる方法があります。 今回は、web初心者向けにwebサイト上で配布しているスクリプトを使って背景の画像がフェードイン・フェードアウトをするjQueryを実 ...
-
Web初心者がCSSを使って見やすい表組み(table)を実装する方法(サンプル付き)
2014/2/18
テーブルタグを使って見やすいように記事を書いていたのですが、なんとなく読みにくかったのでCSSを使用して縦長になっても表組みを読みやすくするために今回は、web初心者向けにCSSを使って読みやすいテー ...
-
2つのステップでレスポンシブルサイトのレイアウトを作成する方法
2014/2/17
スマートフォンの普及率がどんどん高くなっていますね。 IDC Japanの調べによると、日本でのクライアント端末別の普及率はスマートフォンが49.8%、タブレット端末が20.1%、PCが97.0%だっ ...
-
WebデザイナーのためのオススメのChrome拡張機能
2014/2/11
firefoxで、firebugでコードを見直していたんですが、firefoxが重くてね。。。 それに、よくブラウザが固まって動かなくなる。 「firefoxよりchromeのほうが良い」っていう声が ...