1：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 17:41:24.70 ID:flJZIImcH.net

最近クソみたいなデザインとグッチャグチャのソースコード書いてる
ミーハー丸出しアフィサイトが増えてきて鬱陶しいから、
これからサイト作る初心者用にサイトを紹介していく
これ以上俺のウェブサーフィンライフを邪魔すんじゃねえぞ




2：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 17:42:31.08 ID:flJZIImcH.net

まずはドットインストール

開発環境の構築方法からプログラミング言語の基礎の基礎を教えてくれる
一回の動画の時間が短く区切られているので使いやすい。
プロからはあまり評判が良くないが、必要最低限のことはここで十分だ


http://dotinstall.com/




3：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 17:43:00.86 ID:dEC9e03/0.net

支援




【事前予約！】コロプラの期待の新作“東京カジノプロジェクト”事前登録スタート！

4：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 17:44:28.65 ID:flJZIImcH.net

次、wordpress

フリーのCMSの代表格。これの導入さえできればあとは
てきとーにテンプレを導入すればとりあえずの体裁は整えられる
プラグインといわれる拡張機能みたいなのも豊富で
いわゆるネットショップやSNSみたいな大規模なサイトでも十分に作れる。
更新も簡単なので企業のwebサイトでも多々利用されている。
htmlの勉強すら面倒臭がるやつはここを使っとけ。そのうちphpにぶつかるけどな


http://ja.wordpress.com/




5：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 17:46:10.27 ID:dEC9e03/0.net

ｋｓｋ




6：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 17:47:31.80 ID:flJZIImc+.net

wordpress関連で高橋のり様のwebデザインレシピ

wordpressの構造をわかりやすく教えてくれるサイト。この人の本も買ったが
初学者にはかなりわかりやすい。


http://webdesignrecipes.com/




7：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 17:52:27.16 ID:flJZIImc+.net

wordpressなんて使わねえ。俺はちゃんとhtmlとcssで頑張るんだと
そう主張するやつ。悪いことは言わねえ、ブートストラップを使え。

もともとはtwitterの社内で使われてたらしい
かなり簡単にhtmlとcssのひな形を作ってしまえるのが強み
htmlからスクラッチビルド（一からつくり上げる方法）でやってる人も
だいたいはブートストラップ的なのを使ってる。使い方はググれ
ドットインストールでも講座があったような気がする


http://getbootstrap.com/




8：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 17:52:59.53 ID:flJZIImc+.net

亀ですまん書き溜めてないんでな




9：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 17:55:18.89 ID:flJZIImc+.net

基礎がわかったら次はデザインの優れたサイトを見て、だいたいの作りたいイメージをつくれ

とりあえず俺がブックマークしてたページを貼っておく


http://w3q.jp/t/3903


http://www.ikesai.com/


http://gooddesignweb.com/




11：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 17:59:50.91 ID:flJZIImc+.net

ページ内で必要なアイコンやら見出し素材を紹介する

まずはLigature Symbols

こいつは普通のアイコンじゃねえぞ。アイコン画像ってのはページを重くする原因になりやすい
そこでアイコンフォントってのが登場した。もちろんアイコンフォントを使ってくれてもいい
だがこのLigatureSymbolsはアイコンフォントの弱点を補うことができる画期的なフォントだ。
詳しくは書かないが、googleに検索されやすくなる可能性がある。使い方はぐぐってくれ


http://kudakurage.com/ligature_symbols/




12：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 18:02:02.62 ID:flJZIImc+.net

見出し素材のサイト

最近はcssだけで見出しをそれっぽく加工するが、それがめんどくさいやつは
ここの素材を使うだけで見た目が改善するはずだ


http://www.toriho-dai.com/tittle/tittle6.html




13：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 18:02:11.77 ID:Zfpzv4Ena.net

html挫折した俺が通りますよ




14：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 18:03:39.29 ID:flJZIImc+.net

>>13
htmlがわからなくてもテンプレさえあればなんとかなるよ
一応貼っておく


http://websae.net/html5-templates-20140519/




15：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 18:06:59.08 ID:flJZIImc+.net

次に写真素材だ
トップ画像を作るために必需品となる
イラレやフォトショでロゴを作れないやつは画像に適当に文字さえ入れとけばそれっぽくなる

まずは海外のハイセンスな画像サイトを紹介する。少し重いが我慢してくれ


http://www.raumrot.com/10/




16：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 18:08:19.90 ID:flJZIImc+.net

日本の有名画像素材サイト足成
俺はあまり好きじゃないが、ここを避けては通れない


http://www.ashinari.com/




17：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 18:09:30.65 ID:flJZIImc+.net

背景用の画像に役立つのがこのテクスチャーキング

コンクリとか木材の感じが出せるのでおすすめ


http://www.textureking.com/




18：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 18:12:22.39 ID:flJZIImc+.net

あとこれはトップ画像に応用することができると思って最近注目してる
シアターグラフというサイト

以前２ちゃんでも流行った「一部だけ動くgif画像」の共有サイトだ
ファッション系の企業のトップページで使うところが増えてきているから参考にしてくれ


http://theatergraph.com/




19：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 18:17:16.77 ID:flJZIImc+.net

一応動画素材と音声素材のサイトも紹介する。ページが重くなるので
あまりおすすめはしない

Videzzy（動画）


http://www.videezy.com/

Mazwai（動画）


http://mazwai.com/

Distill（動画）


http://www.wedistill.io/

SoundLabel（音楽）


http://www.snd-jpn.net/free_sound/

こんとどぅふぇ（音楽）


http://conte-de-fees.com/




20：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 18:20:52.42 ID:flJZIImc+.net

フォント関連
糞みてえな明朝体フォントを使ってるサイトはどれだけフォントが重要かを理解していない
フォント次第で印象は200%変わる。
英語を使うならGoogleフォントを使え
ほとんどここで使いたいフォントが簡潔する。


https://www.google.com/fonts


他は知らん、このサイトで適当に探して来い


http://fontfree.me/




21：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 18:22:33.86 ID:flJZIImc+.net

これだけ網羅すればなんとかなる。
あとはコリスの更新情報に目を通すのは必須
未だにここなしではやっていけない


http://coliss.com/




22：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 18:23:10.65 ID:flJZIImc+.net

誰も見てねえのかよ




24：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 18:25:00.79 ID:ZfdvfqG30.net

知ってるサイトしかなかった




25：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 18:25:22.52 ID:flJZIImc+.net

じゃあこっからは脈絡なく適当に貼っていくぞ

After EffectsのTipsを公開してるサイトで
本物の映画みたいな映像を作る方法が学べる


http://www.videocopilot.net/tutorials/




26：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 18:27:27.21 ID:ZfdvfqG30.net

jQueryの便利なサイト教えて




28：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 18:29:42.56 ID:flJZIImc+.net

>>26


http://semooh.jp/jquery/sample/




29：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 18:31:35.49 ID:ZfdvfqG30.net

>>28
サンクス




27：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 18:28:11.09 ID:flJZIImc+.net

ブログ記事の下にコメント欄やらシェア欄を勝手に作ってくれるサービス
いろいろ考えるのがめんどくさいやつはこれで事足りる


https://zenback.jp/




30：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 18:33:08.23 ID:flJZIImc+.net

jQueryプラグインのサイトも一応



http://www.unheap.com/


http://bestofjquery.com/




31：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 18:37:59.32 ID:flJZIImc+.net

最近なにかと騒がれているAvocode
コーディング作業に革命をもたらすとかもたらさないとか


http://avocode.com/




32：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 18:41:06.15 ID:flJZIImc+.net

個人的にすごく好きなデザインのサイト
シングルページの可能性を感じる



http://lamoulade.com/#!/projects




33：以下、＼(^o^)／でVIPがお送りします：2015/02/06(金) 18:49:26.85 ID:lT1LTGwL0.net

これから勉強しようとしてたからありがたい




引用元：webディレクターだけど、初心者に役立つサイト教える
【事前予約！】コロプラの期待の新作“東京カジノプロジェクト”事前登録スタート！

オススメまとめ記事！

・ 【画像】母ちゃんとﾗﾌﾞﾎきた結果ｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗｗ

・ 【ガチ注意】自室でシコッている所を従姉妹(15)に見つかった結果ｗｗｗｗｗｗｗｗｗｗｗｗ

・ 亀頭「I'll be back」（包皮に戻る）

・ 【おっき注意】中村静香のこのオッパイがめちゃシコでたまらんwwwww(※画像あり)