気が付くと、会社のWebサイトを公開してから一年が経過しました。
コンセプト作りから資料集め、ワイヤーフレーム制作にデザインカンプ制作、コーディングと画像の切り出し作業をして。
公開にあたっては、サーバー導入している会社さんに問い合わせをして、フォルダー構成の確認をしたました。
今回は、制作で使用したソフトを紹介します。

サクラエディタ日本語対応 / フリーソフト

文章の作成と余分な空白の削除等をするために使用しました。
テキストエディタとしての機能はもちろん、それ以外でも便利な機能がついており、データの整理などでも使用しています。

Windowsで動作する日本語テキストエディタです。
Ver.1.X(ANSI版)とVer.2.X(UNICODE)のパッケージがあります。

• ANSI版：米国国歌規格協会の規格で、Win7、Win8、Win10対応
• UNICODE版：世界で使用されている文字の共通化が図られている規格で、Win7、Win8、Win10対応

※対応OSにつきましては、サクラエディタ公式サイトをご確認ください。

機能

編集

文字に関する変換です。
文字を小文字・大文字にしたり、全角を半角にすることができます。
特にTABを空白(半角)にしたり、文字コードの変換をする機能があります。
データを扱っているときに結構な確率で使用しています。

変換

検索・変換・差分に関するメニューが多数あります。
特に検索(Ctrl+F)、置換(Ctrl+R)。Grep(Ctrl+G)、ファイル内容比較の使用頻度が多いです。
Grep機能は、複数のフォルダを検索することができる機能です。Grepでの検索結果が一覧で表示され、
検索結果から直接ファイルを開くこともできます。
ファイル内容比較機能は、簡易的な比較機能になります。
比較をするファイルをディスクトップ上に表示することで、機能を利用することができます。
あくまでも簡易的なファイル内容の比較機能なので使いづらさもあるので、高度な比較を行う場合は別のソフトの利用をお勧めします。

設定

ファイルの表示や入力方法を設定することができます。
複数のファイルをタブ表示にして一つにまとめたり、入力方法をHTML形式やプログラミング言語のC言語に切替することができます。
入力方法をプログラミング言語に変更すると、プログラミングで使用する単語が色で強調されて、とても見やすくなります。
ただし、入力補助の機能はないので、使用する際はベタ打ちになります。

列選択

サクラエディタでは、列選択をすることができます。
左図の赤で囲まれた部分のようにです。
選択したい文字の前にカーソルを移動させて、Altキーを押しながら選択範囲することで選択することができます。

illustrator日本語対応 / サブスクリプション

言わずと知れたWebサイト制作で必須とも言えるソフトAdobe社の「illustrator」です。
ワイヤーフレーム、デザインカンプの作成で使用しました。
次に説明するPhotoshopでも、ワイヤーフレームとデザインカンプを作成することができるのですが、操作性と慣れの部分で使用しました。
※切り出す時に1pxズレるので注意です。
ファビコンといわれるアイコンもillustratorで作成しました。

Photoshop日本語対応 / サブスクリプション

Adobe社のPhotoshopを使用して、画像編集をしました。
よくあるのが、赤目の処理やゴミが映った時にスタンプツールを使って、赤目を取り除いたりすることができます。
また、色々なフィルターも用意されており、写真データなどを色々加工することができます。

CubePDFフリーソフト

PDFをはじめとして、色々なデータ形式で出力することができます。
以前は、PDFを出力するためにしようしていたフリーソフトですが、PDF以外ではTIFF・PS・EPS・PNG・JPEG・BMPでデータを保存することができます。

Atom日本語対応可 / フリーソフト

コーディングソフトです。
入力補助があるので、コーディング作業も容易に行えます。
入力ごとにグループ化したりすることができるので、膨大なコーディングになったときも管理がしやすいので、
とても重宝しています。

元々は英語版のみですが、日本語化をおこなうプラグインを追加することで簡単に操作することができるようになります。
また、自動で環境を最新状態にしてくれるので、メンテナンスも楽です。

最後に

制作にあたり、必要になるソフトを紹介しました。
以前から、制作で使用するソフトを使いやすいもの。とずっと探しており、今回紹介したソフトを使用することにしました。。
これから始めようと考えている方でも、簡単に使えると思うので、興味がありましたら試してみてください。