ネットで見かけたWebテク
1. Ultimate Responsive Web Design ToolKithttp://smashinghub.com/ultimate-responsive-web-design-toolkit.htm
レスポンシブWebデザインのフレームワーク、
以下のカテゴリーに分けて、
- 初心者向けツール
- 可変幅グリッドのフレームワーク
- 画像サイズを可変させるツール
- テキストを可変させるツール
- メディアクエリー関連のツール
- よく使われるコード類
- WordPressのプラグイン
![図1 レスポンシブWebデザインのツールキット 図1 レスポンシブWebデザインのツールキット](/assets/images/design/clip/01/weekly-web-tech/201205/17/thumb/TH800_001.png)
2. Collection of Great Resources for Bootstrap by Twitter - REPUBLICOF3 | REPUBLICOF3http://www.republicof3.com/collection-of-great-resources-for-bootstrap-by-twitter/
Twitterの提供するフレームワーク、
- ジェネレーター
- テーマ
- Bootstrapで作られたサイトのギャラリー
- モックアップ作成のためのBootstrapのUIパーツ
- その他
に分けて、
![図2 Bootstrapの関連ツールいろいろ 図2 Bootstrapの関連ツールいろいろ](/assets/images/design/clip/01/weekly-web-tech/201205/17/thumb/TH800_002.png)
3. 15 Thorough & New CSS3 Tutorials | Design Woop | The Web Design and Development Bloghttp://designwoop.com/2012/05/getting-started-with-css3-animations/
CSS3のチュートリアルを15個紹介しています。
CSSとjQueryとを組み合わせたテクニックの紹介も多いですね。
![図3 CSS3のチュートリアルいろいろ 図3 CSS3のチュートリアルいろいろ](/assets/images/design/clip/01/weekly-web-tech/201205/17/thumb/TH800_003.png)
4. Showcase Of 30 Stunning Parallax Scrolling Websites | Lava360http://lava360.com/showcase-of-30-stunning-parallax-scrolling-websites/
視差スクロールを使ったWebサイトのショーケースです。
スクロールに合わせて、
![図4 視差スクロールを使ったWebサイトのショーケース 図4 視差スクロールを使ったWebサイトのショーケース](/assets/images/design/clip/01/weekly-web-tech/201205/17/thumb/TH800_004.png)
5. 40 Beautiful & Functional Search Box Designs | inspirationfeed.comhttp://inspirationfeed.com/inspiration/design-elements/45-beautiful-functional-search-box-designs/
検索窓
サイトのテイストや検索の目的に合わせてデザインされている、
![図5 検索窓のデザインギャラリー 図5 検索窓のデザインギャラリー](/assets/images/design/clip/01/weekly-web-tech/201205/17/thumb/TH800_005.png)
そのほか、
- これがMozillaのモバイルOS
「Boot2Gecko」 だ ≪ WIRED. jp 世界最強の 「テクノ」 ジャーナリズム
MozillaからもモバイルOSが登場するそうです。 - 資生堂、
女性に人気のPinterestに公式アカウントを開設 - bizmash!:@nifty
日本ではまだ珍しい企業(ブランド) のPinterest公式アカウントですね。 - アドビ、
オープンソースのHTMLエディタ 「Brackets」 を公開。まだまだ開発中 - Publickey
AdobeのコーディングツールがGithub上にひっそりと公開されました。
先週の気になるWebサービス
hakolog.heroku.comhttp://hakolog.heroku.com/
hakologは、
Markdown記法で書いたテキストを、
また、
Dropbox上のファイルを扱える環境なら、
![図6 Dropboxと連動したブログサービス 図6 Dropboxと連動したブログサービス](/assets/images/design/clip/01/weekly-web-tech/201205/17/thumb/TH800_006.png)