鹿児島のWebデザイナー小田聖夏のリアルブログ｜失敗、悩み、裏話

ことわざでは「一を聞いて十を知る」っていうのがあるけれど
「10を知って1を学ぶ。」って大事だなと。

例えばWebデザイナーになりたい場合
デザインだけでなく、コーディングも学ぶべき。
コーディングの知識があるのとないのとではデザインが全く違ってくる。

よくあるのが、グラフィックデザイナーがWebデザインをする場合、
コーディングの知識がないままお洒落なデザインを作ってしまうと、必ずコーダーとトラブルになるということ。

だから、コーディングができなくても、最低限のしくみは知っておくべき。

さらに、マーケティングのしくみや行動心理学を学んでいると、
どこに何を配置すれば効果的かも考えられるようになる。

ただお洒落なだけでは、意味がない。

だからこそ、Webデザインを学ぶ際には、
デザイン以外の周辺知識も一緒に学ぶと強みになるという話。

たとえば、建築物の素晴らしい設計図を書く人は、自分で組み立てることもできるし、使用する素材にも詳しい。

また、テレビのレポーターも、ただ現場で話すだけではなく、
編集の過程を学ぶことで、誰に何を聞き、どう話すべきかが見えてくる。

凄腕のレポーターは「現地に行って撮影し、終わったら帰ってオンエアを見る」だけではなく、
「現地で撮影し、その後、編集者の横について素材を確認し、どう編集されるかを学んでからオンエアを見る」
というふうに、見えないところでたくさんの努力をしているのだ。

だからこそ、
「10を知って1を学ぶ。」と
あえて、わたしはいいたい。

もうね。ホームページを作るための
簡単に作れるツールがたっくさ～～～～んありすぎる。

だから、自分で作ろうとか、自社で作ろうと思えば
ただ「作る」だけだったら、それで事足りる。

だから、ホームページ制作を仕事とするのであれば、これからは、
●マーケティングの知識や
●SEOの知識、
●PHPでシステムが組めたり
いろいろな知識を身に付けて、プロならではの提供について考えることは重要事項と考える。

料理に例えると
家で作れるけれど、外食するのは、なぜ？

ケーキも自分で焼けるけれど
ケーキ屋さんで買うのはなぜ？

プロだからこそ提供できる何か。

水戸黄門の歌にもあるように
「あ～とか～ら来～たの（人）に、追い越され～
泣くのが嫌なら、さあ　あ～る～け～」

いつまでネットの進化についていけるのか！？

とりあえず、歩き続けなければ。

県外の陰陽師の方々のホームページやブログのカスタマイズ制作を
今も現在進行形で、時折、更新作業などさせていただいており、

今回は、県内で霊視鑑定をしている方のホームページを制作中。
同時進行で病院関係のホームページも。

私はスピ系が好きだけれど
最近、スピリチュアルは、物理学から来ていることがわかり
物理学にハマっているところ。

会う人、会う人に、量子学を語るうざいやつになっています；

ところで、
そのような方々が、私へご依頼いただいていることに
私が不思議な事が好きだから引き寄せているのか
それとも、何か思うところあって私にご依頼くださっているのか。

真意はわからないけれど
ご縁に
感謝*

私にもそのような不思議な力があれば、、とも思うけれど
幽霊は見たくない。（霊視できる人はみんな視えると言う）

絶ーーーー対に見たくない。ฅฅ°́Д°̀))ｷﾞｬｧｧｧ

だが、
声は聞いたこと、ある。( ≖ᴗ≖​)

プログラムの技術が、
ずば抜けてすごい人がいる。

凄すぎて笑いが出てくるほど。

世の中にはすごい人がたくさんいるのだろうけど
わたしの周囲では、その人が1番。

彼はすごい。繰り返すが本当にすごい。
その上、熱い。
教育熱心だし、仕事も気がつけばヒー トアップ!

・・・が原因で、転転としている。。。

もったいない。。

風のたよりで聞いたのだけど
前職場を退職するとき、自分の作ったデータを見られないように
ちょっとした仕掛けを作っていたらしい。
見ようとした途端、、そのパソコンがハッキングされたかのような仕掛けを。

（本来してはならない行為だが；）
凄すぎる!

どのようにしたらそんな事ができるのか、知りたい。
知りたいというより学びたい！、、が、、、
その人を知っているだけというのが、、残念。。。

( ｰ̀ωｰ́ ).｡oஇ

私の場合、ホームページからの新規依頼が８割。

ホームページは眠らない２４時間の営業マン！
ということで、お仕事の依頼はホームページから頂くのが一般的なのだと体感していました。

もともと「鼻歌からのオリジナル音楽制作」でプチ起業し、
営業ができないから、広告用にホームページを作りはじめて
その結果、県内外から制作依頼をいただくようになったので
ホームページから依頼はくるものなのだ、と。

・・・・が！！！！しかし！！！！

それは稀なことであって
みなさん、紹介が多い、ということがここ数年で判明。

企業であっても、そういうところが多い模様。

ここ何年か、いろんな同業者の方と話す機会があって
よく
「どこから仕事もらってる？」
という話になって、
「紹介」
というコメントが多い中
「ホームページから」
というと、大概みんなびっくりして

その反応に、私もびっくり。みたいな。

でも、私のクライアントさまのほとんども、多かれ少なかれホームページから依頼を受けており、
ホームページからの新規顧客が９割というクライアントさんもいらっしゃいますし、
それは、スポーツ系であったり、お堅い職業であったり、ジャンルは関係ないのだけれど
だから、ホームページからお問い合わせはくるものだと。

デジタルハリウッドSTUDIO鹿児島校さまも、ヒューマンアカデミー鹿児島校さまも
講師業のお話をホームページよりお問い合わせいただきました。

ただ、
「ほとんど」
であって、、お問い合わせのない方もいらっしゃって；
原因として考えられるのは、
①ホームページが放置状態（記事更新なし）で活気が失われていたり、
②内容が周知されていないレアなビジネスであったりすると、、難しいようです。
③そもそも論になりますが、需要のあるビジネスであるということは必須条件になります。

ホームページは作って終わりでなく作ってからがはじまりなので
記事更新したり、画像を差し替えたりと、ちょこちょこ手を入れることは大切です。
放置された活気のないホームページは、検索エンジンにもヒットしなくなります。

内容がレアなビジネスの場合は、まず、そのビジネスを周知させるまでの時間と労力が必要になります。
ホームページは周知させるためのツールの１つになります。

ということで、
私はホームページからお問い合わせはくるものと思っているのですが、いかがでしょうか。

「2024年2月1日以降、Gmail アカウントにメールを送信するすべての送信者は、
このセクションに示す要件を満たしている必要があります。」

ということで、

2023年10月、GoogleはGmail宛にメールを送信する際のガイドラインを強化することを発表した。
一部の未対応者に対するエラーレスポンスはすでに始まっており、2024年6月にはGmailユーザーへのメールが届かなくなるかもしれない、と波紋を呼んでいる。

引用元　 Impress Corporation

詳しくは、メール送信者のガイドラインに記載あります。

し、知らなかった。

昨夜、先月初めに納品したPHPファイルにおいて
「Gmailのお客様だけにリターンメールが届かない。」
というメールをいただき、

私の設置環境ではGmailでもリターンメールが送れることから
一番の原因は、受信するお客様側のGmail設定ではないかと思っていたけれど

調べれば調べるほどに、上記の記載をみつけ
原因は、送信側のクライアントさまのメール設定にあるのかも、という考えに至った次第。

ちなみに

私のメール設定は、日頃お世話になっておりますヘテムルサーバー側にて
今年の１月に既に設定済となっていた。

2024/01/31 16:37
●「DKIM」「DMARC」への対応完了と、Gmail宛ての送信に関するお知らせ（Gmail送信者ガイドラインへの対応）

平素はヘテムルをご利用いただき誠にありがとうございます。
ヘテムルでは2024年2月のGmail送信者ガイドライン変更に伴い、メール送信について「DKIM」「DMARC」について対応いたしました。

す、すばらしい。*･☆(人´Д｀）

ありがとうございます。

昨日のブログの続きになるけれど、

ピンチもチャンスと考える。

ピンチは人を育てる。
ピンチを乗り越えた経験の数だけ、人も成長していると思う。

物事がスムーズにいって、スムーズに納品できたら、もちろん最高♪
けれど、そうでないときの経験こそ大事だったりする。

とはいえ、ピンチから逃げたこともある。
（ご迷惑をかけたKさん、ごめんなさい。。）

まあ、２０年以上も制作していれば
いろんなことがあるわけさね。

最近、そんな話をする機会がときどきあって
「ほうほう」
と尋ねて聞いてくれる人がいて
「そんなに話てくれる人いないんで、面白かったです」
とか
「結構、Webの世界って奥深いんですね。」
とか
雑談みたいな話で、そんなふうに興味をもって楽しんで聞いてくれる人がいると
私の転んでつまづいて、泥んこになった部分の人生も、
まあ無駄ではなかったのだね～と
感慨深いこの頃であるよ。

最近、県外からのご依頼やお問合せが多くなった。

ホームページ制作は、
コロナ禍あたりから、すごい勢いで制作業者が増え、個人も増え、
飽和状態になっている感が否めない；

さらに最近はホームページではなく、インスタグラムやフェイスブックで終わらせる人も多い。
インスタグラムはいいとして、フェイスブックはログインしないと見れないから
（わざわざ、フェイスブックのアカウントを作ってまで見る人はほぼいないから）
見込み客を逃していていると思う。

勿体無い。。。

というわけで、最近は
・PHPで⚫︎⚫︎のようなことできますか、
とか
・⚫︎⚫︎を自分達のホームページに組み込みたいのですが、、
とうような、内容が多くなり、以前のように鹿児島県外からのお問合せが増え始めた。

頼まれごとは試されごとというけれど
私的には、頼まれごとは（他者が導いてくれる自分に可能な）新たな世界のはじまりと思っている。

もともと、音楽制作してたわけだし。
ホームページ制作もそんな流れで始めたし。

人生はどこでどうなるかわからない。

だから、いつもと違う依頼がきたとき、
それはチャンスである。

ここ数年、「作る」から「教える」にシフトしたいと考えていることを
常々ブログにも書いている乙です。

昨年夏からお教えしていたヒューマンアカデミー鹿児島校の求職者支援訓練は、
業務委託というカタチでお受けしておりましたが
今年の７月からは非常勤講師としても、日中お教えることになりました（＿）

「作る」よりも「教える」方が楽しく感じる今日この頃。

とはいえ、不安要素が全くないわけではありませぬ。。
常に自分も学ばなければならないことが多く、インプットがおいついていない感；。

デジタルハリウッドSTUDIO鹿児島校では、
コーディングを主に担当しておりますが、
以外の知識も必要で、特に、デザインを言語化して説明するのが、、私にとってはなかなか難しい。。

お役にたてるよう日々精進して参ります。

わ・た・しのChat GPT♡

もちろん、わたしがパソコンで使用しているChat GPTのこと。

というのも、有料でChat GPTを契約しようと思った際に
（今まで使用していたアカウントではなく）別の支払い専用のメールアドレスで新たにChat GPTのアカウントをとって契約しようとして

クレジットカードを紐づけする前に
ふと、コーディングに関する同じ質問を２つのchato GPTに問いかけたら、それぞれ全く別の答えが返ってきた。

この数か月使ってきたChat GPTは、私のほしい答えとコードを返してくれて
新しいアカウントのChat GPTは、あたりさわりのない答え。

おお～～～～～！！！(*`⊙0⊙´*)ｵｫ~

なんということでしょう。

となると、新しいアカウントではなく、この数か月使用してきたアカウントを使用しなければ
また１から育てることになるのだ、

ということを理解した。(￣￣∇￣￣ ;

比較的、危険を顧みず、思うように行動している。

・・・が、
私の思考、遠く及ばないところで「回避した方がいい出来事」と判断されたとき

そのような時は、必ず邪魔が入るので（そのような出来事が起こるので）
うまくいかないことがあったとして
それは結果的に、うまくいっているのかもしれないと思うこの頃。

例えば、あやしい人物との契約とか。

メールをいただいて、打ち合わせにいって
「俺、怪しくないですよ。」
と自らいきなりそんな話をしだして免許証を見せた人。

今思えば、それだけでも充分に怪しい。
・・・が、その話は流れた。

また、受けようとしていた知人からの依頼が流れ、
のちのち、知人が依頼した業者との間にいざこざを起こして裁判沙汰になったと聞いたとき。
流れて良かったとほっとした。

他にも数知れず。

だから、うまくいかないときは
危ない何かを回避しているのだと。

何かが守ってくれているのだ、と。

とにかく、
きっと、すべてが「おかげさまで」
なのだ。と。

きっと。

と思った今日。

ネットの世界は進化が早すぎて
４～５年前に作ったホームページが、既に古い作りになっているという現実。

ホームページの更新や修正などで
数年ぶりにログインしては、それを目の当たりにし、

システムは仕方ないとして
自分のコーディングなど、書き変えたくなる。

当時はなかった「display：flex」とか「 box-sizing：border-box　」とか
今は便利なタグがたくさんあって
それはこれから先にもいえることだけれど
たった、数年で、こんなに書き方がかわっていくのかと、
そして昔書いたコードがなんとも消したくなるというか、書き換えたくなるというか
むずがゆい。

あと、当時は「これでバッチり！」と思って納品したのに
数年たってみると、「う～～～～む。。。」となって
これは、成長している証、と思いたい。

(。-`ω´-)

ホームページを作るに、色々なツールがある

私は、Wordpressを利用してHTML・CSS・PHPで制作しているけれど
他にも
WIX
STUDIO
canva
などなど。

この世界を深く知らない人は
「WIXで作れるんで、フリーランスになろうかと。」
という人もいる。

言い換えれば
「カップラーメン作れるんで、ラーメン屋になろうかと。」
に似ている。

実際にWIXで作成して納品する人もいるし
クライアントは何もわからないから、それで納得する。

個人（自分自身）で制作するのであれば、WIXでもSTUDIOでもcanvaでもいいと思うけれど
仕事として受けるであれば、クライアントさまのためにも
先見の明をもって事にあたらなければならない、と考える

以下のツールは、サービスが突然終了したら、ホームページもなくなるという怖い可能性を秘めている。
ちなみに、以下のようなメリットとデメリットがあり、
個人で作成して開設する分には、コスト安（無料版でご利用の場合）。

仕事として受ける場合は、おしゃれなデザイン云々よりも、
FTPで直接サーバーを触れること、まるッとバックアップが取れること、SEOに強いことは必須であり、
結論として、仕事で、こちらのツールを使うのは怖い。

Wordoress（CMS）を利用して作るホームページは、レンタルしているサーバーが終了する場合は、
別のサーバーに引っ越しができるし
SEOは強い上に、記事更新も楽々でさらにSEOを強化できる。

他のCMSとしてはMovableTypeなどもあるけれど
cgiで動いているので、少し重たいし、
プラグインなど、Wordpressの方が豊富なのでやっぱりWordpressかな。
（大規模なホームページになれば、また別の話ね。）

というようなことを書いたのは、canvaでもホームページを作れることを知って
実際のところどうなのかな？と思って、Hトレーナーに尋ねたら
「仕事で受ける場合に、canvaは怖いかな。。」
とおっしゃっていたので、
理由を聞いてなるほど、と思った次第。

PHPを使用して「Web開発」をしている人はすごいな～と思いながら、、

今はあまり使われてない掲示板（BBS）。
所要あって必要になり、できればPHPがよくて
なかなか既存のものがなくて、結果、自作。

テスト投稿を繰り返しながら作っているうちに、あれもこれもと欲がでてきて・・・

簡単なスレッド式掲示板でいいかな。
↓
写真も投稿できたらいいな
ファイルサイズとファイルの種類も設定しなきゃ。
↓
写真はクリックで拡大される感じがいいかな
↓
ログイン機能をつけたいな
↓
新規登録の時に、メールアドレスが送られてURLクリックで認証するシステムをつけたいな
あ、でもIDやPWは重複しないようにしなきゃ。
↓
あたりまえだけど、投稿した人が削除もできる機能もつけたいな
↓
スレッド投稿者と返信する人の二人分必要かな。
↓
スレッドが20を超えたら次のページで表示させたいな
↓
できたらWordpressに組み込みたいな

、、、で作られたファイル一覧

uploadsフォルダ・・・画像アップロード用フォルダ
register.php・・・. ユーザー登録
login.php・・・ログイン機能
logout.php・・・ログアウト機能
index.php・・・ユーザーがログインしているかどうかを確認し、ログインしていない場合はログインページにリダイレクト
delete_thread.php・・・スレッド投稿者削除機能
delete_post.php・・・返信削除機能
view_thread.php・・・指定されたスレッドの詳細とそのスレッドへの返信を表示
verify.php・・・・・認証完了ページ
add_post.php・・・・スレッドに対する返信項目をデータベースに追加
create_thread.php・・新しいスレッドを作成し、データベースに保存
db.php・・・・・・・・データベースの情報

ログイン画面

投稿画面

スレッドページ

１つ項目を増やすのに
「格納するカラムをデータベースに追加・入力するためのフォーム・受け取ってデータベースへ渡すための記載・データベースから受け取って表示させる記載」
と、たいへん極まりなく
掲示板でこんなに大変なのに、プログラマーは本当にすごい人たちだ、とヘロヘロになりながら思った。

まだ、改善の余地ありありだが・・・・

時計が深夜１時をまわったところで
とりあえず、、寝まつ…( っﾟ､｡)っﾊﾟﾀｯ

先日のブログに、AIによってみんな考える力がなくなっていってしまうの？、
なんて単純に考えていたことを書いたけれど、

これからはAIのだした答えに対して、はたしてそれが正しいのかそうでないのか
・間違いを見つける力
・それをさらによりよいものにしていく力
が問われていくのかもね、とMBCのクリエイティブ事業の方。

おお～。。
自分のあさはかさが・・・( ˊᵕˋ ; )💦

ところで、最近、ＰＨＰで独自のWeb開発をする際、「chat GPT4o」でざっくりと作ってもらうことが多い。
ざっくりと作ってもらったファイルに肉付けをしていくのだけれど、
エラーも多くて、、時間だけが経過していく・・・
でも、１から作るよりはずっと楽♪

・・・で、今までデータベースはWordpress関係でしか使ったことなかったのだけれど
phpMyAdminにログインしてSQLをごりごり。
エラーは、SQLとのやりとりがうまくいかないのが原因であることがほとんど；

コロナ禍になって、Webデザインを学ぶ人が多くなって
人どころか、プログラムもAIによって、だんだん自動化されていく中で
何が淘汰されて何が残っていくのか。

カラー剤や、ハサミがあるけれど、美容師さんがいるように
会計ソフトがあるけれど、税理士さんがいるように
マニキュアは売っているのに、ネイリストさんがいるように、
ネットがあっても、新聞を必要としている人がいるように
 
ＡＩが普及しても残っていく何か

ふ～む。( ｰ̀ωｰ́ ).｡o

Canva（キャンバ）

photoshop持っている人でも使っている人が結構多い！

デジハリで同じトレーナー業のHさんは、無料版よりも、
おしゃれな画像やイラスト、テンプレートが多いプロ版を使用しているらしく
「Photohopで１から作るより簡単で効率がいい♪」とおっしゃっていた

ちなみにプロ版は年間11,800円（2024年5月現在）

ちょっと気になっている乙です( ｰ̀ωｰ́ ).｡o

昨日、同業者で唯一、心置きなく話せるSさんと
オプシアのブックスミスミでバッタリ🎵

１年ぶり？(*ﾟOﾟ *)

最近のウェブ事情やら、アニメやら
彼が教えている求職者支援訓練のこととか
Chat GPT-o4についてなど
気づいたら、あっという間に１時間半も経過していた！

しかも立ち話。

Sさんはすでに有料のChat GPT-o4をいろんな形で仕事に役立てていて
（やっぱ私も有料にすべきかなあ）と思ったところで、
恐ろしいことに気づいた。Σ(๑°ㅁ°๑)

題名は忘れたけど、地球にやってきたエイリアンが
いろんな技術を提供してくれて、病気も治してくれるし
次第に地球人も心を許し、そのエイリアンにまかせてばかりで依存していった結果、
人間は考えることをしなくなり、次第に侵略されていくという話。

エイリアン＝AIでは？？

AIに頼ることで、文章もプログラムも、自分では１から考えなくなり

結果、
何もできなくなるのでは？？((((；ﾟДﾟ))))

これって、どうなの？

ねえ、どうなの？

受講生のデザインの添削だけは、、し難い。。

視認性が悪いとか、
あきらかに色の組み合わせがマッチしていないとか
デザインする対象のものと、デザインのジャンルがそもそもあっていない、とか
１＋１＝５
みたいに、あきらかに、違うと理解できるものであれば
自信もって添削できるのだけれど

そうでない場合。

何をもって正解と断言できるのかがわからないので
（クライアントさまがいらっしゃる場合は、クライアントさまの考えが基準となるが）
添削し難い；

なので、デザインの添削に関しては、グラフィックトレーナーさんのコメントを可能な限り傍観；している。
自分が担当日であれば、デザインよりも、データの観点からアドバイスするようにしている。
例えば、アウトラインがかかっていない、とか、ゴミデータがないか、とかとか。

コーディングは１＋１＝２みたいに明確な答えがあるので
どんどこ添削できるのだけれど。

自分がクライアントの立場であれば、こうしたら？ああしたら？って言えるのだけれど、
そうではないので、、っていうか、

( ﾟдﾟ)ハッ
自分がクライアントの立場でアドバイスすればいいのでは？？

いやいや、、((-ω- ;)(;-ω-))
それはなんだかちょっと違う気がする。

そして、今日も傍観している・・・

FigmaやChat GPT-4o・・・便利すぎて怖い。
何が便利かについてはいろいろなサイトで説明しているので省略。

ただ、急速にすすんでいるAI世界。
はたして１０年後とか、いや５年後どうなっているのかと思うと、
ちょっと興奮気味になる。w

現在、受講生はFigmaでの指導だけれど
ちょっとまえまではＸＤだった。

Figmaのすごいところは、開発モード（有料）で使用すると、
デザインから、ＨＴＭＬやＣＳＳを出力してくれる。

ただ、どこまで出力してくれるのか？
どこまで正確なのか？
まるっと１ページしてくれるのか？

気になって気になって、ここのところ調べていた。

ちなみにＶＳCodeとも連携できる.｡.:*･'(*°∇°*)’･*:.｡.

↓手前が開発モードで見ているFigmaの画面で、右奥がVScodeの画面

すごいんだけれど
だけど。
今の段階だと、コードは、やっぱりまだ自分で書いた方が早いかなあ。

コンテンツの幅を、HTMLにstyle属性で、直接書いているときもあるし・・・；
コードを見て、修正を加える方が、めんどいかな。。

ただ、デザイナーさんとコーダーさんが別の場合は
Figmaで作ったデザインを、コーダーさんに渡した方が
開発モードでpaddingとか、詳細分析してくれるので、楽かも♪

まるっと１ページHTMLとCSSで、しかもレスポンシブで確実に出力できたら
量産できるな～って夢みた。（￣▽￣*）・・・

そしたら、コーディングの授業は不必要になるのでは？
なんて考えていたけれど
やっぱり、コーディングの知識がないと、間違いに気づけないし手直しができないので
まだまだ必須ですね。

パソコンのブラウザで、デザインの確認をする際に
デベロッパーツールのデバイスモードを勧められることが多いと思うけれど

私は、基本、デベロッパーツールのデバイスモードは使わない。

↓デベロッパーツールのデバイスモード【赤枠】

スマホの確認では、100歩ゆずって
レスポンシブのデザインの確認では、
ブラウザの幅を拡大＆縮小させて、980px～1920pxの間で確認した方がいいと考えている。

なぜなら、ブラウザ幅100％(ブレイクポントぴったり)で閲覧していない人も多いから。

例えばMACでは、ブラウザ100％ではなく、
適当な幅のブラウザをいくつも重ねて、閲覧していることが多いかと。

なので、レスポンシブデザインの確認は
デベロッパーツールの左上に表示されている幅を確認しながら、
ブラウザ幅を拡大＆縮小させて、どんな幅でも崩れることのないようにチェックしている。

そしてそのまま、スマホの幅まで縮小させ
レイアウトに問題なければOKかな、と。

というのも、デベロッパーツールのデバイスモードではちゃんと表示されているのに
ブラウザ幅の縮小だと崩れる作りのものもあって
自分的には、そこが、なんだかモヤっとするのであります(´･ω･`; )