WEBサイトについて どんなツール使ってるの？共栄美装WEBデザイナーの御用達のソフトウェア達！

こんなツールでWEBサイトを開発してます！

まず使っているツールを列挙しますね。

これらは、使っているツールのうち、代表的なものです。細かい事を言い始めると、さらにファイラーや検索ソフト、画像ビューアーなどもあわせて使用しますし、一時的にしか使わないようなツールもいっぱいあります。

何をする為のツールなの？

一つひとつ説明していきます。

WordPress

WordPressは、今世界で最も沢山使われているオープンソースのCMSの一つで普及率も高いです。CMSとはコンテンツ・マネジメント・システムの略語であり、WEBサイト納品先のユーザーがプログラミングの知識を必要とせずに自分でサイト運営者に簡単になれるようにしたものであり、管理画面にログインして更新したり内容修正をできるようにしたものです。

プラグイン(拡張機能)や外観テーマが豊富で、柔軟性に幅があることです。弊社WEBサイトもこの利点を生かして様々な機能を実装しています。

なぜWEB上ツールと書いたのかというと、このWordpressはサーバー上で稼働するプログラムだからです。1台1台のPCに入っているわけではないので、主にブラウザ上で操作します。

Notepad++

Notepad++は、主にプログラミングをする為のテキストエディターです。ソースコードを入力するにあたって便利な機能が揃っており、こちらもプラグインにより機能を自分好みに追加したり外観テーマを変更できます。

テキストエディターは、これ以外にも様々なものがあります。職種や、そのエンジニアの習熟度や個性に応じてまだまだ難しいものがあれば、簡単に操作できるものもあります。

難しいもので言うとVimやEmacsというエディターがありますが、これらはラーニングカーブが高く、使いこなせるようになるまでには相応の時間がかかります。

一方でマイクロソフト製のVisual Studio Codeは今最もメジャーなコードエディターで、導入の敷居も高くありません。ですがカスタマイズ製が非常に高く完成度の高いソフトウェアと言えるでしょう。こんな風に様々なエディターがありますが、私はNotepad++が快適すぎるので移行ができませんでした。

カスタマイズをしすぎると、その環境にどっぷりと足をつけてしまうことになるので他のエディターになかなか移行できなくなります。つまり、良い意味でも悪い意味でも病みつきになります。

ですがモダンな技術にきちんと付いていかないと、あっという間に今の自分をとりまく環境はガラパゴスになってしまいます。

Filezilla

Filezillaは、FTPソフトウェアの一つです。手元のファイルをサーバー上にアップロードしたり、逆にダウンロードしてくることでバックアップも取れます。

FTPとはファイル転送プロトコルの略語であり、プログラムが記述されたテキストファイルや画像などを、ユーザーの代わりに送ったりしてくれる中継役のような存在です。

これがあるお陰で、Wordpressサイトが不具合を起こした時に修正を行うこともできるんです。

Adobe PhotoshopとIllustrator

どちらも画像加工のために使用するソフトウェアですがその目的は変わってきます。一番大きな違いは、取り扱う画像がビットマップ形式かベクター形式かという事でしょう。

ビットマップは画像が細かなドットの集まりで出来たデータであるのに対して、ベクター形式は主に「ここは直線にしなさい」「ここはカーブにしなさい」といったデータによる命令によるものです。実はこの理屈はWEB制作に生きてくるケースがあります。

その最たる例が、フォントです。

もし「画像化されたテキスト」があるとします。そのテキストはビットマップ形式ですから、画像をズームアップすると当然ぼやけてしまいます。ですがCSSで背景色の上にテキストがあるだけだと、どこまでも綺麗です。

画面の拡大率に応じて、フォントや図形が都度レンダリング(画面上に描画すること)されるからです。そして、1つのデータではなく背景とテキストは別々に分かれているのでそのぶん再編集性も高いのです。

この再編集性を保ちつつ情報発信をしていけるようにWEBサイトを運営していくことは私がWEB制作をするにあたって肝としている部分の一つです。

プログラミング言語について

文明の利器であるシステムの発達により、プログラミングの知識を要さずともユーザーは昔よりも様々なことがインタラクティブに出来るようになりました。現に、WEBデザイナーとして活動している私自身もこのサイトをフルスクラッチビルド(完全にゼロベースからテンプレートなしで構築すること)した訳ではありません。

どのタイミングで何を培って、何を優先すべきか？
今どの技術の引き出しが必要なのか？

あくまで現場目線で、WEBサイトを成長させていくために本当に必要なものが何なのかを考えながら、プログラミング言語を勉強しています。

実際にやってみた結果、まだまだテンプレート化されたものには限界がありますから私が直に既存のテンプレートにプログラミングを加えることもあります。つまり様々な技術を幾重にも掛け算したのがこの共栄美装WEBサイトです。

最後に

沢山のテンプレートやフレームワークが日々生み出されているお陰で、情報の大洪水が起きているなと最近感じます。そんな中で、そもそも論に立ち返ることはとても大切です。

情報についていくだけでなく「そもそも」何をするために生み出された言語なのか？

例えばHTMLの元となった「ハイパーテキスト」や、さらにその元となった「Memex(拡張記憶機)」というものがあります。これは離れた場所にあるマイクロフィルムに記録したテキストデータを伝送して、閲覧できるようにした作られました。これによって電気信号でやり取りできる図書館を作ろうとした方がいました。

これは現代当たり前になっているWEBの在り方にも共通する部分があります。
その話を知っているからといっていきなり目の前の問題が解決することはありませんが、WEBを作ってきた先人たちのストーリーは物事を立体的に理解することの手助けとなることも多いです。

せっかく見に来て情報に目を通していただいたからには、ツールを使っていく上で私が大事にしている考えも共有できればと思い、僭越ながらお話をさせていただきました。

最後まで読んでいただき、ありがとうございます。