中途半端を極める

web関連で役に立ちそうなものを紹介いたします

技術

webディレクターだけど、初心者に役立つサイト教える URLのみまとめ

投稿日:2015年8月29日 更新日:

一時期まとめサイトで話題になった「webディレクターだけど、初心者に役立つサイト教える」のURLのみをまとめた紹介ページです。
仕事中にまとめサイトを開くのはちょっと…と思っている方がいましたら使用してください。

学習系

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

■コリス
http://coliss.com/
コリスの更新情報に目を通すのは必須
未だにここなしではやっていけない

制作支援系

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

■HTMLテンプレまとめ
http://websae.net/html5-templates-20140519/
htmlがわからなくてもテンプレさえあればなんとかなるよ
一応貼っておく

■semooh plugin sample site
http://semooh.jp/jquery/sample/
jQueryの便利なサイト

■Unheap
http://www.unheap.com/
jQueryプラグインのサイト

■Best of jQuery
http://bestofjquery.com/
jQueryプラグインのサイト

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

CMS(wordpress)

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

■wordpress関連で高橋のり様のwebデザインレシピ
http://webdesignrecipes.com/
wordpressの構造をわかりやすく教えてくれるサイト。この人の本も買ったが
初学者にはかなりわかりやすい。

デザイン・素材配布系

■日本人クリエイターのハイセンスなポートフォリオサイトまとめ
http://w3q.jp/t/3903

■イケサイ ウェブデザイナーのWEBデザインデータベース
http://www.ikesai.com/

■WEBデザインリンク集
http://gooddesignweb.com/

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

■見出し素材のサイト
http://www.toriho-dai.com/tittle/tittle6.html
最近はcssだけで見出しをそれっぽく加工するが、それがめんどくさいやつは
ここの素材を使うだけで見た目が改善するはずだ

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

■テクスチャーキング
http://www.textureking.com/
背景用の画像に役立つのがこのテクスチャーキング
コンクリとか木材の感じが出せるのでおすすめ

■シアターグラフ
http://theatergraph.com/
あとこれはトップ画像に応用することができると思って最近注目してるシアターグラフというサイト
以前2ちゃんでも流行った「一部だけ動くgif画像」の共有サイトだ
ファッション系の企業のトップページで使うところが増えてきているから参考にしてくれ

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

■その他フォント
http://fontfree.me/

動画・音声素材系

■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/

■VIDEO COPILOT
http://www.videocopilot.net/tutorials/
After EffectsのTipsを公開してるサイトで
本物の映画みたいな映像を作る方法が学べる

-技術

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)

関連記事

短期間でプログラミング言語を覚えるのに役に立ちそうなサイトまとめ

プログラミング基礎:http://nadesi.com/doc/start/index.htm HTMLの基本:http://www.tohoho-web.com/wwwbeg3.htm CSS基礎文 …

ウィジェットをサイトに埋め込まずチェックするページ「フレームチェッカー」

ウィジェットなど作成したときに、プレビューが無い場合などがあります。 そういったときはhtmlファイルにウィジェットを埋め込み、FTPでアップロード…などといった作業をしなければいけないの …

Explorerを再起動する方法

エクスプローラーが落ちたとき、普通は自動で再起動するのですが、たまに起動してくれないことがあるかもしれません。そんな時に、エクスプローラーを手動で再起動する方法です。

スパムコメント対策!PHPを使って偽コメントトラップを仕掛けるspam trap

メールフォームからスパムコメントが大量に送られてきて、困った! というときにどう対策しようかと調べているとコメントトラップが有効的だという記事を見ました。 確かにWordpressのスパムコメント対策 …

PHPで呼び出すファイルの文字コードを変更する方法

外部ファイルをインクルードするとき、HTMLの文字コードと違う文字コードのファイルを読み込むと、文字化けしてしまいます。しかしインクルード先のファイルがプログラムで文字コードが変えることができない&# …