![コリス](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
●Top
●Category
●Contact
●About
Web制作時に備えておくと便利なチートシートのまとめ︵iOS, Android, Bootstrap, WordPress, Git, Sublime Text, Emmetなどいろいろ︶
サイト構築 -制作
87
660
Post on:2014年7月24日
sponsors
![ロゴやアイコンを素早く形にしよう!ここまで進化したIllustratorの生成AI機能 2024年7月17日水曜日 開催 20時から21時](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
iOS/Androidの各デバイスやエレメントの規格、BootstrapやFoundationなど人気のフレームワーク、WordPressのテーマファイル、Git/GitHubの便利な機能、Sublime TextやEmmetの使い方をまとめたチートシートなど、フロントエンドのWeb制作者に役立つチートシートをまとめました。
Web制作時によく使うサイズとかスニペットとかショートカットとか、チートシートを印刷してすぐに見られるようにしておくと便利ですよね。
チートシートの目次
●iOS デザイン チートシート
●Swift チートシート
●Android チートシート
●Android デザイン チートシート
●Twitter Bootstrap 3 チートシート
●Foundation チートシート
●WordPress 時短用チートシート
●WordPress テーマ開発用チートシート
●GitとGitHub チートシート
●Sublime Text 2 キーボードショートカット
●Emmet チートシート
●jQuery チートシート (1.0-1.10/2.0対応)
●Flexbox チートシート
●ファビコン チートシート
●ソーシャルメディア チートシート
iOS Design Cheat Sheet
iPhone, iPod, iPadなど、iOSの各デバイスのサイズをはじめ、各種アイコン、画像、アプリに使うさまざまなUIエレメントのサイズがまとめられています。
![サイトのキャプチャ](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
Swift Cheat Sheet
AppleがWWDC 2014で発表した﹁Objective-C﹂に代わる新しい開発言語﹁Swift﹂のチートシート。
![サイトのキャプチャ](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
Android Cheatsheet for Graphic Designers
Android用のページ・アプリと作成する時に役立つグラフィックデザイナー用のチートシート。
![サイトのキャプチャ](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
Android Design Cheat Sheet
こちらもAndroid用で、上記より簡単にグラフィカルにまとめられたチートシート。
![サイトのキャプチャ](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
cheat sheet for Twitter Bootstrap 3
Bootstrap 3でページを作成する際、グリッドやエレメントなどに使われているスタイルをまとめたチートシート。
![サイトのキャプチャ](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
Foundation Cheat Sheet
こちらはFoundation 4でページを作成する際、グリッドやエレメントなどに使われているスタイルをまとめたチートシート。
![サイトのキャプチャ](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
The Time Saving WordPress Cheat Sheet
WordPressのテーマファイルの構成をはじめ、各ファイル用の関数やループがまとめられたチートシート。
![サイトのキャプチャ](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
WordPress theme development Cheatsheet
WordPressのテーマファイルを作成する時に役立つチップスをテンプレート形式にまとめたチートシート。
![サイトのキャプチャ](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
GitHub Cheat Sheet
GitとGitHubのよく使う機能から、あまり知られていないような便利な機能をまとめたチートシート。
Gitは以前紹介した本がすごい役立ってます︵できることを軸に書かれてるから分かりやすい入門書 -Git 逆引き入門︶。
![サイトのキャプチャ](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
Sublime Text 2 Keyboard Shortcuts
Sublime Text 2のキーボードショットカットをまとめたチートシート。ページ上部の﹁Downloads﹂からPDFがダウンロードできます。
![サイトのキャプチャ](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
Emmet Cheat Sheet
あなたが使用しているエディタ︵Sublime TextやDreamweaverなどいろいろ︶で、簡単な記述でよく使うHTML/CSSのコードが書けてしまうEmmetのチートシート。
![サイトのキャプチャ](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
jQuery Cheatsheet
jQuery 1.0から、1.10 / 2.0 までのセレクタや関数、イベント、エフェクトなどがまとめられたチートシート。そろそろ1.11/2.1のアップデートがくるかな。
![サイトのキャプチャ](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
Flexbox Cheat Sheet
最近ではfloatの代わりに﹁display: flex;﹂を使ってる人も多いと思います。そんなCSSのフレキシブルボックスを使ったさまざまなレイアウトのチートシート。
![サイトのキャプチャ](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
Favicon Cheat Sheet
デスクトップからスマフォ・タブレットまで、さまざまなデバイスを考慮したクロスブラウザ対応のファビコンのチートシート。
![サイトのキャプチャ](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
Social Media Cheat Sheet
Twitter, Facebook, Google+など、さまざまなソーシャルメディアのページレイアウトの規格がまとめられたチートシート。シェアするとPDFがダウンロードできます。
sponsors
Related Posts
関連記事が見つかりませんでした。
87
660
top of page
![ワードプレステンプレート](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
Sponsors
![WordPressテーマTCD](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
誰よりも先をリードするWordPressテーマTCD
![TCDの有料の国産テーマファイル「Rebirth」が無料でダウンロード](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
![有料フォントが限定特価](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
![無料のデザインリソース](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
![Eagle コリス限定クーポン配布中](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
![Kindle Unlimited 3ヵ月がなんと0円](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
申込は7/17まで
![広告掲載募集中](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
coliss
Recnet Entry
●CSSのclass名やJavaScriptの関数名を付けるときに役立つ単語リストのまとめ -Classnames
●Affinityを使ってみたかった人に朗報! Win, Mac, iPadのDesigner、Photo、Publisherが6ヵ月無料で使用できる
●ビー・エヌ・エヌ社のKindleセールはかなり貴重!1年ぶりとなる夏のセールが開催、Web制作・デザイン・イラスト関連のKindle本がお買い得です
●商用無料、新作フリーフォントがリリース! かわいいデザインにぴったり、女子校生の書き文字風フォント﹁ninaSchoolgirl﹂
●Bartenderの代替に! macOSのメニューバーのアイコンを常に表示・非表示にできるオープンソースのアプリ -Ice
●Kindle特大セールが開催! ソシム社大感謝祭、人気のデザイン書・配色本・Web制作の解説書が55%オフで超お買い得です
●UIデザインに最適! シンプルなデザインで使いやすく、商用でも無料で利用できるSVGのアイコン素材 -Lucide
●Kindleセールで半額以下! マンガや小説、同人誌の創作に﹁感情類語辞典﹂﹁場面設定類語辞典﹂など類語辞典シリーズが超お買い得、書体をマンガで学べる﹁となりのヘルベチカ﹂も半額以下
Pickup Entry
●2024年用、日本語のフリーフォント707種類のまとめ -商用サイトだけでなく紙や同人誌などの利用も明記
●手書きの日本語フリーフォント、筆文字・毛筆の日本語フリーフォントの総まとめ
●おしゃれな手書き! 筆記体の英語フリーフォントの総まとめ
●商用利用無料、国内のフリーイラスト素材の総まとめ
●商用利用無料、おしゃれでシンプルなかわいい海外のフリーイラスト素材の総まとめ
●フォント名を画像から調べる、日本語・英語のフォントを検索・自動判定できる無料サービスのまとめ
●いい感じの写真画像がクレジット表記無しで無料利用できるサイトのまとめ
●背景素材に困った時に!ダウンロードしておきたい実用度満点のフリーの背景素材のまとめ
●2024年のトレンドカラーは、癒やしのカラー﹁ピーチファズ︵Peach Fuzz︶﹂
●色々な色の名前、伝統色の名前が分かるサイトのまとめ
●VS Codeのおすすめ機能拡張のまとめ、HTMLやCSSやJavaScriptなどのコードを書く時に便利
●最近の実装に合わせたHTMLテンプレート
●5分で完璧に分かる!CSS Gridの基本的な使い方を解説
●独学の人にオススメ!CSS Flexboxの基礎を一通り学べるチュートリアル
●CSS Flexbox の各プロパティの使い方を詳しく解説
●CSS Flexboxの使い方・バグ情報・グリッドの実装など、有用なリソースのまとめ
●CSSの中央揃えで、最も万能で信頼できる実装テクニック
●2024年、現在の環境に適したリセットCSSのまとめ
●2024年版、CSSフレームワークのまとめ
●Googleのアルゴリズムにおける検索順位に影響を与える200+個の要因のまとめ
●Font Awesome アイコンの使い方と便利な機能のまとめ
●Photoshopの新機能がかなり便利!かゆいところに手が届く改善点が盛りだくさん
●Photoshopの選択範囲や切り抜きはこれが一番簡単で正確!CC 2021で進化した選択範囲とマスクの作成
●UI/UXデザインツールの大本命、Adobe XDの私が大好きな便利な機能をすべて紹介
●2023年、ロゴデザインのトレンド -最近のロゴに使われているデザインテクニックのまとめ
●ウェブデザイナーは知っておきたい、ページレイアウトの代表的な10のパターン
●フォントやタイポグラフィの知識・テクニックを学ぶまとめ
●無料で高品質!レスポンシブ対応のWordPressのテーマファイルのまとめ
●プロカメラマン仕様、Photoshopのトーンカーブのまとめ -簡単に写真画像の自然光とカラーを印象的に美しく仕上げる
●写真がもっと楽しくなる!写真画像をワンランク上に仕上げるPhotoshopのアクションのまとめ
●黄金比について詳しく解説、レイアウトや構図に効果的に取り入れるデザインテクニックのまとめ
●黄金比をサイトのデザインに取り入れる簡単な3つの方法
●フェルメールやゴッホ、北斎など西洋・日本の名画を楽しめるサイト集
● 美しい日本語を使いたい、ワンランク上のビジネスメールの作法
●著作権・肖像権について、写真やイラストなどの素材を安全に使うために知っておきたいこと
Recommend
![本の表紙](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
Adobeの進化がすごすぎる! 生成AIによるデザインの新しい作り方が学べるデザイン書︵紹介記事︶
![本の表紙](data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==)
簡単だけど、すごくよくなる! SNSでのデザイン戦略を学びたい人にお勧めの解説書︵レビュー記事︶
top of page
Category
●サイト構築 -調査・分析
●サイト構築 -設計
●サイト構築 -制作
●サイト構築 -ユーザビリティ
●サイト構築 -ライティング
●サイト構築 -デザイン
●サイト構築 -CSS
●サイト構築 -JavaScript
●サイト構築 -スタイル ガイド
●サイト構築 -検証
●サイト構築 -運用・更新
●SEO対策・検索エンジン
●WordPress
●WordPressのプラグイン
●Freebies︵無料素材︶
●ウェブ サービス
●ハードウェア
●ソフトウェア・アプリケーション
●ブラウザ
●ブラウザ -Internet Explorer
●ブラウザ -Firefox
●ブラウザ -Opera
●ブラウザ -Safari
●ブラウザ -Chrome
●書籍紹介、書評
●Life︵ライフハック︶
●Digress︵雑記・お知らせ︶
●Sitemap︵記事一覧︶
Blog Info
●follow me on Twitter
●subscribe to my RSS
●Powered by WordPress
当サイトではCookieを使用しています。引き続き当サイトを閲覧することにより、ポリシーを受け入れたものとみなされます。今後表示しない詳しく見る
©2024 coliss