東京インスピレーション

東京でマイホームを建てたい...アフィリエイト奮闘ブログ

本業のWEBデザイナー・エンジニアが使う制作ツールを紹介

どうも。

 このブログは、東京のWEB系会社で働くエンジニアが、マイホーム購入のために少しでも資金の足しにしようと始めた(正確には再開した)アフィリエイト雑記ブログです。

 

今回は本業のWEBデザイナー・エンジニアが普段どのようなツールを使ってサイトを制作するのかをご紹介したいと思います。

 

まず、HTMLやCSSjavascriptなどを記述したりするテキストエディタですが、僕は主にSublime Textを愛用しています。他にも、DreamWeaverBracketsVisual Studio Codeなどたくさんのテキストエディタがありますが、何と言ってもSublime Textは圧倒的に軽くプラグインの量も豊富です。

懸念点としては、文字コード系がやや弱いところです。一括置換などをする際、プラグインを入れていてもファイルを開かないと文字化けして検索に引っかからないなど若干弱いところはありますが、それでも群を抜いて使いやすいテキストエディタです。僕の周りのエンジニアも大体サブライマーなので、是非オススメしたいと思います。

※もちろん無料です。ちょこちょこ宣伝が入りますが、ESCキーでポップアップ消せば問題ありません。

 

デザインを作る際に用いるツールは、Adobe XDでワイヤーを作り、Photoshopで形を整えます。最近はXDの使い勝手が上がったので、Photoshopを省いてXDで多少作り込んでいくやり方もしてます。

ロゴやイラストなどはIllustratorを用い作ります。

デザイン関連はやっぱりAdobe製品が使いやすい印象があります。

 

CMSサービスは、個人で何かブログなどを立ち上げたりちょっとしたニュースを配信したい場合はWordPressを使っています。仕事では規模も大きめなのでMovable Typeを使います。WPと違い、親に幾つでもブログを紐づけることができるので、そう言った意味ではWPより拡張性があります。

どちらも使いやすいですが、やはり個人で使うとなるとWPですね。Movable Typeは有料ですし、個人でそこまで大規模なサイトを作る機会もそうそう無いので基本的にはWPの機能で事足りるかなと思います。

 

主な開発に用いるブラウザはChromeです。Chromeで開発後、iPhoneSafariを同期させスマホもブラッシュアップしていく感じです。クロスブラウザ対応はブラウザスタックという、ブラウザベースのエミュレータを使ってチェックしていきます。1ユーザーで毎月19ドルですが、ほぼ全てのOSとブラウザを確認できるので実機を用意することを考えたらお得です。

 

 

以上、ツール紹介でした。また制作環境に何か変化があればご紹介したいと思います。

また次回。