にむチャンネル

30代社会人のブログ初心者がやっている雑記ブログです。気軽に読者登録してください。

web開発するときに作業がはかどるチートシート14選

f:id:nimuu:20170315124033j:plain

web開発するときには様々なコードやショートカットキーを覚えているだけで作業が効率的に進むことが多いです。しかしコードやショートカットキーというのは便利な反面覚えるのが大変だったり、ど忘れしたりすることが多々あります。そういうときに役に立つのがチートシートです。チートシートとはカンニングペーパーのことで覚えておくべきことを紙にまとめた物のことです。こういうものを活用してweb開発をすれば作業が捗ると思います。そこで今回は使えそうなチートシートをまとめました。

Macのショートカットキー

www.danshihack.com

こちらはチートシートではないですが、チートシートのような使い方ができる便利なアプリです。Macにインストールしてコマンドキーを長押しすると画面にショートカット一覧が表示されます。作業の効率化に役立ちそうです。

ワードプレスのチートシート

www.webcreatorbox.com

ワードプレスのコードも覚えていると役に立ちますが、なかなか全部覚えるのは難しいと思います。そういう時はチートシートを是非活用して下さい。

Photoshopのチートシート

helpx.adobe.com

Adobeの公式サイトでPhotoshopのショートカットの早見表がpdfでダウンロードできるようになっています。ショートカットを使いこなすだけでかなりの作業効率になりそうです。

Illustratorのチートシート

helpx.adobe.com

こちらもAdobeの公式サイトからIllustratorのショートカット早見表です。公式サイトから発表されているものなのでとても見やすいです。

HTML5のチートシート

www.hostingreviewbox.com

基本のHTML5のチートシートです。すべてHTMLで直接入力してサイトを作るということは中々ないと思いますが、HTMLを知っていないとサイトのちょっとしたカスタマイズや修正ができないので覚えていると便利です。

CSSのチートシート

www.textdrop.net

CSSはサイト作成には必須ですね。CSSを少し変えるだけでサイトの見栄えがよくなったりします。よく使うCSSですがうっかりど忘れすることも多いと思います。そういう時はチートシートを使って思い出して下さい。

PHPのチートシート

www.textdrop.net

webアプリケーションを作る言語としてメジャーなPHPのチートシートです。pdfファイルにして印刷できます。

JQueryのチートシート

oscarotero.com

はてなブログでもカスタマイズの際にjQueryを使う機会は多いと思います。ブログで関連記事を表示させる時などにJQueryをよく使いますね。

マークダウン記法のチートシート

bamka.info

マークダウン記法でwebサイトがつくれるととても便利です。はてなブログはマークダウン記法でブログが作れるのでチートシートがあればサイト作成がはかどります。

Windows10のショートカットのチートシート

blog.nomupro.com

Windows10もショートカットを使うことで作業を効率化出来ます。全部マウスでやるよりはショートカットを覚えたほうが楽です。

Chromeのショートカットのチートシート

support.google.com

webブラウザとして人気があるChromeのチートシートではないですがショートカットキーがまとめてあるグーグルのサポートページです。このショートカットを覚えるだけでストレス無くブラウザを使うことができます。

Firefoxのショートカットのチートシート

www.ghacks.net

拡張機能が豊富なオープンソースのwebブラウザFirefoxのチートシートです。こちらもブラウザの機能が豊富なのでショートカットを覚えると便利です。

 

カラーコード、カラーチャートのチートシート

blog.e-riverstyle.com

webカラーをすべて暗記していればチートシートは必要ないですが中々そういう人はいないと思います。webで使う色がほぼ網羅されているのでチートシートがあるととても便利です。

Excelのチートシート

blog.nhireland.com

Excelも全てマウスで作業するよりもキーボードでショートカットを覚えたほうが作業効率が圧倒的に早いですね。