Web制作に役立つ情報一覧

Illustratorで印刷物風のかすれの描き方

2013/07/22(Mon) 15:19

ギザギザのあの線のラフの方法と、パスのオフセットで角を丸くするの方法を同時に使ってかすれ文字。文字の細い部分が途切れるため、古い印刷物やコピーを繰り返したようなレトロな感じのかすれに…

http://suzuki33.blog.fc2.com/blog-entry-113.html

フロップデザインフォント

2013/07/19(Fri) 11:07

フロップデザインフォントは、どなたでも自由に無料でダウンロードして、商用・非商用問わず使用できるオープンソースのフリーフォントです…

http://www.flopdesign.com/freefont/flopdesignfont.html

場面に合わせて使いわけよう！デザイナーなら知っておきたい、美しい和文フォント10選

2013/07/18(Thu) 14:14

僕がよく使う、有名な和文フォントを10個ピックアップしてみます。アポー先輩〜！「チラシの見出しに最適なフォントはないか」って相談がきたのですが、見出しに最適なフォントって何がありますか〜っ？

http://www.moxbit.com/2013/07/well-known-japanese-font-pick-up.html

[CSS]パーセントで指定された正確なサイズが不明な要素を天地左右の中央に配置するスタイルシートのテクニック

2013/07/17(Wed) 16:09

天地左右の中央に配置したい要素のサイズが幅も高さもピクセルで指定されていれば、marginやpaddingで簡単に配置できますが、サイズ指定にパーセントを使用した要素だと表示サイズに依存されてサイズが分かりません…

http://coliss.com/articles/build-websites/operation/css/centering-percentage-widthheight-elements-by-css-tricks.html

ウェブサイトの制作に携わる全ての人に役立つスタイルガイドを簡単に作成できる -Style Guide Boilerplate

2013/07/16(Tue) 11:20

ウェブサイトのデザインや実装の一貫性を促進するために、制作に携わる全ての人に役立つスタイルガイドを簡単に作成できるテンプレートを紹介します…

http://coliss.com/articles/build-websites/operation/work/style-guide-boilerplate.html

良いCSSアーキテクチャのゴール

2013/07/12(Fri) 11:58

多くのWebデベロッパとって、良いCSSとはビジュアルモックアップをコードで完全に再現できることを意味する。tableタグを使わず、また出来る限り画像を少なくすることに誇りを持つ…

http://enja.studiomohawk.com/2013/07/06/css-architecture/

デザインの勉強に使わせてもらうべき無料のフラットアイコンセット30選

2013/07/10(Wed) 11:55

シリーズ化してきました、デザインの勉強に使わせてもらうべきシリーズ。今回は、トレンドであるflatデザインで作られたアイコンセット達のご紹介です。勉強させてもらいましょう…

http://shingekidesign.com/?p=116

この上なく便利！すごい「jQuery」の小技まとめ３２

2013/07/10(Wed) 11:54

先日ECサイトを制作したときに、動きのあるサイトにしないといけなかったので、色々調べて組み込んでみたんですが、jQueryでもう何でも出来ちゃいますね。近い将来ローカルで画像なんかを編集しなくても、ブラウザだけで色々できるようになるんじゃないでしょうか…

http://commte.net/blog/archives/3298

より素早くCSSコーディングするための、Sass（SCSS）のmixinスニペット集

2013/07/09(Tue) 12:12

以前「効率良くCSSコーディングできるSassを使ってみよう！Mac+Codaなら設定も簡単！」という記事で紹介したSass／SCSS。皆さん使ってますか？今回はそのSassの @mixin という機能に注目してみようと思います…

http://www.webcreatorbox.com/tech/sass-mixin/

PhotoshopCS5以上を使っているなら…髪の毛の切り抜きは「境界線を調整」がオススメ！

2013/07/09(Tue) 12:11

今回はPhotoshopCS5以降についている便利機能「境界線を調整」を使って髪の毛を切り抜く方法をご紹介します。結構色んな所で紹介されているとは思いますが、復習がてらお付き合いください…

http://liginc.co.jp/web/design/photoshop/37657