個人的に役立ったデザイン素材やTips、WEBサービス、役立つグッズ、あれやこれやをご紹介

ワンランク上のWEB表現を目指すなら!HTML/CSS/JSの必見テクニック満載「Top Pens of 2013」

CodePenというWEBサービスをご存知でしょうか。
CodePenは、HTML/CSS/JavaScriptコードをシェアすることができるWebサービスです。
WEBデザインの最先端な表現が世界中から公開されていて、初心者には役立つこと必至ですし、熟練者には刺激になることうけあいです。
そんなCodePenさんは毎年、閲覧回数の多かったコードを「Top Pens」として特設コーナーで発表してくれています。
これを見るだけでも勉強ならびにインスピレーションを受けると同時に、今後のWEB表現のトレンドをつかむうえでもとても役立ちます。
WEBにかかわるお仕事をされているなら、見ておいて損はないと思いますよ!
jsdo.itのように、フォークしたり、編集することも可能です。

2013年、もっとも人気のあったHTML/CSS/JavaScriptコードのトップ100がわかる「Top Pens of 2013」

top
Top Pens of 2013」は、HTML/CSS/JavaScriptコードをシェアすることができるWebサービスCodePenが、2013年中に閲覧回数の多かったコードを「Top Pens」として発表している特設コーナーです。
正直、おっそろしいほどハイクオリティーな表現ばかりなので、1つ1つみているだけで日がくれてしまいそうです。
でも、見ちゃうんですよね。
勉強になるし、楽しいから。
気に入ったのがあったら、ひたすら「模写して」練習するだけですね。
素晴らしいWEBサービスです。

100-91位

100-91
100-91位 – Top Pens of 2013

90-81位

90-81
90-81位 – Top Pens of 2013

80-71位

80-71
80-71位 – Top Pens of 2013

70-61位

70-61
70-61位 – Top Pens of 2013

60-51位

60-51
60-51位 – Top Pens of 2013

50-41位

50-41
50-41位 – Top Pens of 2013

40-31位

40-31
40-31位 – Top Pens of 2013

30-21位

30-21
30-21位 – Top Pens of 2013

20-11位

20-11
20-11位 – Top Pens of 2013

10-1位

10-1
10-1位 – Top Pens of 2013

お役に立てましたら、以下どれでも結構のですので、ポチリと……。

  • 0
  • 0
  • 0
  • 0

Amazonアソシエイト・プログラム規約による記載
当サイトはamazon.co.jpを宣伝しリンクすることによってサイトが紹介料を獲得できる手段を提供することを目的に設定されたアフィリエイト宣伝プログラムである、Amazonアソシエイト・プログラムの参加者です。

この記事を読んだ人はこんな記事も読んでいます

ブラウザの閲覧履歴をファビコンで一覧表示するChrome機能拡張

もはやアート?ブラウザの閲覧履歴をファビコンで一覧表示する「Iconic History」

ブラウザの閲覧履歴をファビコンで一覧表示するChromeの機能拡張「Iconic History」を

記事を読む

今この瞬間もサイバー攻撃が行われている!DDoS攻撃を可視化する「Digital Attack Map」に戦慄

今この瞬間もサイバー攻撃が行われている!DDoS攻撃を可視化する「Digital Attack Map」に戦慄

戦慄を覚えるマップです。 サービス自体は1年前に公開されていましたが、海外で再び注目され、私自身が

記事を読む

2013年のベストjQueryプラグイン47

2013年も残すところわずかになりました。 今年もたくさんのjQueryプラグインが発表されていま

記事を読む

レスポンシブ対応HTMLメールのフレームワーク集「Responsive HTML Email Framework」

レスポンシブ対応HTMLメールのフレームワーク集「Responsive HTML Email Framework」

レスポンシブ対応HTMLメールのフレームワーク集「Responsive HTML Email Fra

記事を読む

これは簡単!CSSだけで棒グラフが作成できてしまう「chart.css」

これは簡単!CSSだけで棒グラフ/チャートが作成できてしまう「chart.css」

CSSだけで棒グラフ/チャートが作成できてしまう「chart.css」をご紹介します。 CSSファ

記事を読む

レスポンシブ対応済みサイトがApple Watchに対応しているかどうかがわかる「the ultimate responsive test」

レスポンシブ対応済みサイトがApple Watchに対応しているかどうかがわかる「the ultimate responsive test」

Apple Watchがいよいよ発売になります。 ところで、あなたのレスポンシブ対応済みのサイトは

記事を読む

プログラミング初心者がプログラミングを学ぶのにベストな海外チュートリアルサイト11

プログラミング初心者がプログラミングを学ぶのにベストな海外チュートリアルサイト11

日本でプログラミングを学ぶなら、ドットインストールが有名ですよね。 海外でもプログラミングを学ぶう

記事を読む

Gmailの送信メールを一定期間で自己消滅させる機能拡張「Dmail」

Gmailの送信メールを一定期間で自己消滅させる機能拡張「Dmail」

Gmailの送信メールを一定期間で自己消滅させる機能拡張「Dmail」をご紹介します。 Gmail

記事を読む

無料で商用利用可のレスポンシブ/HTML5対応のテンプレートをまとめてくれている「HTML5 UP」

無料テンプレートを探すとき、どういう基準で探していますか? レスポンシブ対応? HTML5対応?

記事を読む

100GB使える無料ストレージサービスshared.comにマルウエアが仕込まれてた

100GB使える無料ストレージサービスshared.comにマルウエアが仕込まれてた!?

各方面で紹介されている太っ腹な無料ストレージサービス「Shared」を利用し始めたところ、えらい目に

記事を読む