ブログ集客をする自営業・起業家のための《ひとりWebマーケティング》

ブログ型HP制作と集客力をオンライン講座で学ぶ

プロがホームページ作成に使っているMacソフト21選

約 18 分
【コンテンツ作成ポリシー】
「脱・動詞ブログ」「脱・過剰ブログ」
網羅しすぎて難しいことを難しいまま説明するのではなく
数を「3つ」に絞って誰もが行動に移せるほどシンプルで、
簡単な表現で「実践できる」を信条に書きます。
※操作記事は「3つ」に絞れないのでご了承ください。
吉田ユタカ(2017.9 up)
プロがホームページ作成に使っているMacソフト21選

ホームページ作成に興味を持っている人って、プロ・アマ問わず増えましたよね。

これから、ホームページ作成をしてみたいなーと思っている人のためにプロってどんな作成ソフト使ってるのかを、あくまで私個人のホームページ作成ソフトをご紹介しようと思います。

しかも、私はMac使いなので「Macソフト」です^^;
ごめんね。Windowsの方。
けど、Windowsでも利用できるソフトもあるので、ぜひ確認してください!

ブラウザベースのツール系は、書いていないです。
また、別の機会に覚えていたら書こうと思います^^

あと、言葉もなるべく初心者にもわかるような付け方しています(笑)

こういうツールじゃねーよ!とか、突っ込まないでね^^;

【2017.8.6 加筆しました】
あまり使っていないソフトや、便利なツールやソフトが出てきているので、修正ではなく「加筆」してみました。
すでに「21選」ではなくなりましたが、そこはご愛嬌ということでお許し頂ければと思います^^;

この記事の目次

WordやExcel原稿の確認

【1】OpenOffice(Windowsあり)

クライアントから提供されたWordファイル、Excelファイルを開きます。

OpenOffice(Windowsあり)

2017年8月現在、メインとしては「Google ドライブ」の

を使うようにしました。レイアウトの互換性には、少し難もありますが内容の確認には便利なので使っています。

Google ドキュメント

Google ドキュメントは、どこにいても無料でドキュメントの作成、編集、作業が可能です。パソコンのHDDが壊れたり、破壊、紛失しても大切なデータは大丈夫です!スマホやタブレットのアプリを使えば、さらにデータの編集場所が広がります。

Google スプレッドーシート

Google スプレッドシートは、どこにいても無料でスプレッドシートの作成、編集、作業が可能です。支社や支店の売上を、それぞれ1つのスプレッドシートに入力してもらうことも可能です。パソコンのHDDが壊れたり、破壊、紛失しても大切なデータは大丈夫です!スマホやタブレットのアプリを使えば、さらにデータの編集場所が広がります。

素材を選んだり確認する画像管理ソフト

【2】Adobe Bridge CC(Windowsあり)

Adobe Bridgeは、画像管理ソフトです。ファイル名の一括変更などもバッチ処理で可能です。

Adobe Bridgh CC(Windowsあり)

全体の作業工程ソフト

【3】Mindjet MindManager(Windowsあり)

マインドマップのソフトです。私は、これを使って作業内容を洗い出し、作業が完了したらチェックしています。自分のための作業確認用です。マインドマップとしては、サイトマップを作成したりします。

Mindjet MindManager(Windowsあり)

昔、使っていたのもご紹介します。

クラウドツールを利用するのもオススメです。
cacoo(リンク先は、マインドマップ)」を使うと簡単にサイトマップを作成することができます。

cacoo

クラウドツールでどこからでも、マインドマップを作成することができます。他にもフローチャート、ワイヤーフレーム、ネットワーク構成図、データベース設計図なども作成することができます。

【4】Omni Plan 3

Omni社の公式サイトです。

Omni Plan 3

日本の販売サイト act2.com

Omni Plan 3を販売している日本の販売サイトです。

Omni Plan 3【iPhoneアプリ】

iPhoneアプリの「Omni Plan 3」です。

Omni Plan 3【iPadアプリ】

iPadアプリの「Omni Plan 3」です。

ヘッダーや画像、バナー、ボタンなどの素材作りのソフト

【5】Photoshop CC 2017(Windowsあり)

まさにプロの画像編集ソフト Adobe社の Photoshop CC 2017です。Mac/Windows両方あります。

Photoshop CC 2017(Windowsあり)

スマホ用のサイトデザインをする際に、iOSデバイスであれば「Adobe Preview CC」アプリを使えばリアルタイムでiPhoneの画面にデザインを表示させながら編集することができます。

↓Adobe公式のヘルプ内のページを確認してみてください。

iOSデバイスでWebとアプリのデザインをプレビュー

Photoshop関連アプリのPreview CCを使用して、アートボードやレイヤーカンプで作成したモバイルアプリやWebサイトのデザインをプレビューする方法について説明します。

※2017年8月6日に、「Photoshop CC(2015)」→「Photoshop CC(2017)」に修正しました。

【6】Illustrator CC 2017(Windowsあり)

まさにプロのドローソフト Adobe社の Illustrator CC 2017です。Mac/Windows両方あります。

Illustrator CC 2017(Windowsあり)

以前は、Webで使う場合にぼやけていたのですが「ピクセルのスナップ」に3つのオプション(描画中、移動中、サイズ変更中)の全てを選択することで、移動したり拡大することでぼやけていたアートがぼやけなくなり、さらにWebで使うイラストを描く際にも使いやすくなりました。

デザインのピクセルを最適化

UI/UXプロジェクト、Web、スクリーン、その他のデジタルデザインで、シャープな線やアートワークを作成する方法を説明します。

※2017年8月6日に、「Illustrator CC(2015)」→「Illustrator CC(2017)」に修正しました。

無料の画像編集ソフトなら

【7】GIMP(ギンプ)(Windowsあり)

無料で利用できる画像編集ソフトです。無料とは、思えない高機能です。MacとWindowsで利用できます。

GIMP(ギンプ)(Windowsあり)

インストール方法は、以下のサイトを参考にしてください。

GIMP日本語.com

MacのGIMPについて解説しているサイトです。インストールから使い方まで、親切に書いてあります。記事数が少ないのがチョットですが…

さらに2017年8月現在では、「Canva(キャンバ)」というクラウド型のデザインツールもオススメです。

簡単にオシャレでカッコイイ、そして可愛いヘッダー画像、バナー画像、そして、SNSでも使いたくなる画像が作れます。

Canva

クラウドのデザインツールで、初心者でも簡単にしかもオシャレに画像を作ることができます。使い方によっては、ブログのヘッダー、バナー、サイドバナー、記事内で使う画像なども作成することができます。

HTMLやCSS、Javascriptなどのコーディングソフト

【8】Coda 2

Macのコーディングソフトとして人気が高いCoda 2(コーダ ツー)です。WordPress、PHP、Javascript、HAMLなどもプラグインを入れることでコードの補助も出るので幅広くコーディングできます。

Coda 2

【9】Adobe Dreamweaver CC 2017(Windowsあり)

最初に、これが使えるとプロだなーと思ったソフトが、Adobe Dreamweaver(アドビ ドリームウィーバー)です。今では、PhotoshopやIllustratorとの連携も凄いです。Bootstrapを使ったレスポンシブサイトもテンプレートから作成できます。

Gitも使えるようになって、さらに便利になっています。

Adobe Dreamweaver CC 2017(Windowsあり)

※2017年8月6日に、「Dreamweaver CC(2015)」→「Dreamweaver CC(2017)」に修正しました。

FTPソフト

【10】Transmit

サーバーに接続するためのFTPソフトです。Transmit(トランスミット)です。

2017年8月現在だと、Transmit 5が最新版です。

Transmit

Photoshopから画像をスライスするアプリ
(Photoshop CC 2015内にも同様の機能「画像アセット」があります)

【11】Slicy

Slicy(スライシー)は、Photoshopで作ったあと、Webで使うために画像をパーツごとにスライスします。指定されたレイヤー名やフォルダ名を付けることで、一括スライスしてくれるアプリです。昔のPhotoshopから使っています。これでスライスが爆速になりました。

Slicy

2017年8月現在では、Photoshop CC 2017の「画像アセット」「書き出し」「クイック書き出し」などを利用しています。なので、必須のソフトではないと思います。

画像と動画のキャプチャソフト

【12】Snagit(Windowsあり)

Snagit(スナグイット)は、パソコン画面のキャプチャ(撮影)をして、文字や罫線、矢印、見せたくない箇所にボカシなどの画像処理ができます。手順を教えるのにも、便利です。社内のマニュアルなどにも利用できます。高機能な編集はできませんが、動画としても撮影できます。

Snagit(Windowsあり)

【13】Camtasia(WIndowsあり)

Camtasia(カムタジア)は、Snagitと違いは、動画としてパソコン画面をキャプチャ(録画)できます。マニュアルや操作説明、画面と自分を撮影しながらWebセミナーとしても使えます。テロップを入れることはもちろん、モザイクなども可能です。

Camtasia(WIndowsあり)

画像の容量圧縮アプリ

【14】JPEGmini Lite

スライスした画像のサイズ容量をさらに小さくしたい場合に利用します。ホームページでは、スマホユーザーが多いので徹底的にサイズ圧縮を行い表示スピードを上げます。

JPEGmini Lite

2017年8月現在、ブログ記事内で使う画像(Photoshopで書き出していない画像)は、Webサービスの「TinyPNG」を使って圧縮してアップロードしています。

当ブログでも紹介した記事がありますので、参考にしてみてください。

PNG・JPEG/JPG画像圧縮は「TinyPNG」で一括軽量!Windows/Mac対応

画像の一括サイズ変更

【15】Th-MakerX(ウォーターマークも付けられる)

一括で50枚の画像サイズを横幅200pxに変更しなければいけに時に利用します。実に簡単にできるので、重宝します。

Th-MakerX(ウォーターマークも付けられる)

視覚障がい者や色覚障がい者のアクセシビリティを高めるためのアシスタントツール

【16】Fujitsu ColorSelector(2013年8月20日で提供終了)

背景色とテキスト色を指定して、視覚障がい者や色覚障がい者の方でも見やすいかを判定してくれるソフトです。
残念ながら2013年8月20日に提供が終了してしまいましたが、今でも現役で動いています。

2017年8月現在でも、使い続けています。提供終了が悔やまれます。

Fujitsu ColorSelector(2013年8月20日で提供終了)

Gitソフト

【17】SourceTree(Windowsあり)

デザイナーなので、Gitを使うための真っ黒画面でのコマンド打ちは、拒否反応が出てしまうため、GUIベースでわかりやすいGitソフトとしてSourceTree(ソースツリー)を使っています。
それでもGItで競合が出ておかしくなることもあり、その時は凄腕プログラマーさんに助けを求めます(笑)

SourceTree(Windowsあり)

テキスト差分比較ソフト

【18】TextWrangler

indexファイルで、前に作った「Aファイル」とこれから触ろうとしている「Bファイル」でどこを変えたのかを調べたいときに使います。
他にも、WordPressのテーマで「デフォルトテーマ」と「購入したテーマ」のfuction.phpなんかでどこを追記しているのかを見つけて勉強するために利用したりもします。

TextWrangler

テキストエディタ

【19】mi

Macの定番テキストエディタと言えば mi(ミミカキエディット)です。シンプルだけど、パワフルな機能が満載です。ずっと使っています。

mi

Windowsの方に送る場合の圧縮ソフト

【20】WInArchiver Lite

Macの機能で圧縮すると、Windowsで開いた際に不要なファイルが入ってしまいます。このソフトで圧縮すると、不要なファイルが含まれないので相手もわかりやすくなり、変に不安な気持ちにさせません。

WInArchiver Lite

Macをローカルサーバーにするソフト

【21】MAMP(Windowsは、XAMPP)

主にWordPressをインストールして「テーマのカスタマイズ」「プラグインの追加またはアップグレード」の動作確認をします。

MAMP(Windowsは、XAMPP)

プロがホームページ作成に使っているMacソフト21選のまとめ

今回は、プロと言っても元プロがホームページ作成で使っているMacソフトを21個ご紹介させて頂きました。

これ使っている!これ知らない!なんてソフトもありましたか?

他にも同じような機能を持ったアプリやソフトは、山程あるので自分にあったホームページ作成ソフトに出会えるといいですね^^

この記事を気に入って頂けましたら、ぜひ下にある「いいね」「シェア」「はてブ」などよろしくお願いします!<(_ _)>

この記事が役に立ったら
▼いいね!しよう▼

※登録したメールアドレス宛てに、ダウンロード先のURLを記載しています。

必須 お名前
必須 メールアドレス *携帯メールアドレス不可

こんな人が書いています

株式会社イーシークリエイト代表取締役・ひとりWebマーケター吉田ユタカ
当サイトへ、お越し頂きありがとうございます。

初めまして「子育て」と「仕事」を両立させながらWebマーケティングコンサルタントをしている吉田ユタカです。

当社は【オンラインWebコンサルティング会社】です。
これまで広告代理店のグラフィックデザイナー、個人としてWebプロデュース&デザイナー、ネットビジネスでのローンチを経験。事務所なし、電話なし、名刺なし(2017年4月に必要な場面があり作りました^^;)、オンラインのみの対応でコンサルティングをやっています。

現在は『オンラインコンサルティング』『オンライン講座』『WordPressを使ったブログ型ホームページ制作(テンプレート使用)』をしています。

吉田ユタカの使命は
——–
「ネットを通じて社会貢献する役割を果たしながら、自分の人生も思いっきり楽しむ人を増やす」
——–

一人でも多くの方にネットを通じて「自分の人生を楽しむ!」ことができるように日々サポートしています。
Follow :

Facebookコメント