はっしー｜Webディレクター

福岡｜フリーランス Webディレクター＆コーダー｜制作実績 300件以上｜双子のパパ｜多胎児向けアプリmoms運営＆ponoスクール講師

[はっしー｜Webディレクター @hassy_web]

先日リニューアルを担当したクリニックのホームページが、

「地域名 × 業種」
「地域名 × サービス名」

などの検索キーワードで、Google検索1位を獲得しました👏✨

めちゃくちゃ嬉しい…！

SEOは、ただ検索順位を上げるだけではなく、

✅ 必要としている人に見つけてもらう
✅ ホームページにアクセスしてもらう
✅ お問い合わせや予約につなげる

ここまで考えて設計することが大切です。
実際にクライアント様からも、
「アクセス数が増えました！」
「お問い合わせが鳴り止まないです！」

という嬉しいご報告をいただいています😭✨

ホームページは作って終わりではありません。

私たちは、集客につながるところまで考えて設計したWebサイトを作っています。
“ちゃんと届く・ちゃんと選ばれる”
そんなホームページづくりを大切にしています。

SEOで困っている方は、ぜひお気軽にご相談ください😊

[はっしー｜Webディレクター @hassy_web]

今日は担当しているクリニックのホームページの撮影でした😊

六本松にあるクリニックだったんだけど、本当に7、8年ぶりくらいに七隈線に乗ったきがする笑

[はっしー｜Webディレクター @hassy_web]

チャットワーク落ちてる？？

[はっしー｜Webディレクター @hassy_web]

@scale_ceo 希望

[はっしー｜Webディレクター @hassy_web]

異業種交流会に参加してきました！
Web業界以外の方と色々とお話しできてとっても楽しかった😊

自分にはない視点や考え方を聞けたり、知らない業界のことを直接聞けたりしたのでとても有意義な時間でした！

困ってることを相談いただいたり、逆に相談できて良かった！

ぜひまた異業種交流会行きたいと思います✨

[はっしー｜Webディレクター @hassy_web]

事業用のサイトをリニューアル中😊
爆速サイトを目指してmicroCMS×AstroのJAMstackで開発してます！
実はAstroを扱うのは初めてなので、勉強しながら実装を進めてる！

[はっしー｜Webディレクター @hassy_web]

Loomはこちら↓
https://t.co/RbtiYZIVlp

[はっしー｜Webディレクター @hassy_web]

クライアントへの説明、チャットだけで頑張っていませんか？💬

僕はよく説明するときに「Loom」をよく使っています。

これが本当に便利で、クライアントさんにもかなり喜ばれます😊

理由はシンプルで、
文章だけでは伝わりにくいことも、画面録画しながら話せば一気に伝わるから。

たとえば、
・納品時に管理画面の使い方を説明する
・ワイヤーやデザインの制作意図を伝える
・実装したアニメーションの動きを解説する
・修正内容や確認してほしいポイントを補足する
・チャットだと長くなりそうな内容をサクッと共有する
こういう場面でかなり役立ちます👍

顔出しありでもいいし、
ビデオオフで音声だけでもOK。
AIで内容も文字起こししてくれる

文章で長々と打つより、
パッと録画して話したほうが早いことも多いです。

しかも、声のトーンやニュアンスも伝わるので、
こちらの人柄や人間同士の暖かさも感じてもらえる。

チャットだけだとどうしても無機質なやりとりになったりしますよね💦

実際に、業務委託いただいてる会社さんにも、
不明点や修正内容を動画で補足して送ると褒めてもらえることが多いです。

「百聞は一見にしかず」

Web制作やフリーランスをしている人は、
クライアント説明にLoomを取り入れるだけで、
かなりやり取りがスムーズになります。
保存して、次の案件で試してみてください📌

[はっしー｜Webディレクター @hassy_web]

figmaでも画像生成でGPT image2が使えるの便利！
クライアントへ伝えるためのイメージ画像もそのままデザインに使えるんじゃない？ってクオリティで生成できる😊

[はっしー｜Webディレクター @hassy_web]

フリーランスでも住宅ローン審査通った！
正直厳しいのかなーと思ってたけど、なんとか夢のマイホームが手に入りそうです😊

[はっしー｜Webディレクター @hassy_web]

2月末から3月頭くらいからLPのデザインをお願いできるデザイナーさんはいないだろうか？
もし興味ある方がいれば、簡単なプロフィールとこれまでLP制作の実績が分かるものをいただけると嬉しいです😊
DMいただければ制作の詳細をお伝えします！

#デザイナー

[はっしー｜Webディレクター @hassy_web]

今年から提案資料を一新したんだけど、成約率がかなり上がった😊
2月もすでに4件ほどコーポレートサイトやLPの契約に繋がってる！

資料を送った時もそうだけど、実際に提案する時にもしっかりと考えてくれていて嬉しいと喜んでもらえる！
それに加えてお互い合意のスピードが上がって、ミスマッチも減ってる気がします！

提案資料をお客様毎にしっかり作り込むのは大事🙆‍♂️

[はっしー｜Webディレクター @hassy_web]

@web_design17 ありがとうございます😊

[はっしー｜Webディレクター @hassy_web]

実は胃腸炎で1週間くらいで動けませんでした💦
家族みんな感染してしまいなかなか大変でした。

ただ、動けない間もメンバーに協力してもらってクライアントには迷惑をかけずに進められました！
こういう時に仲間がいるってホントに助かります🙏

少し年始からつまづいた感じもしますが、ここから巻き返して頑張ります💪

[はっしー｜Webディレクター @hassy_web]

@arai_artpeace 本当にその通りだと思います。理念を共有せずに仲間を増やしても、その後のチームさらには事業の継続には繋がりませんよね。
最高のチームがつくれるように、まずは自分が軸をぶらさないように仲間づくりを進めていきます！

[はっしー｜Webディレクター @hassy_web]

昨年からチーム化を進めて、少しずつ軌道に乗ってきた感じ。
今年はさらに複数のチーム化をしていって、受けられる依頼の数も増やしいきたいなーと思ってます😊
特にデザイナーさんが不足しているので、3月までにはいい人を見つけたい🙏

[はっしー｜Webディレクター @hassy_web]

「SCSSのネスト、実は“罠”ある」って知ってました？

CSSネストは便利だけど、SCSSの感覚でそのまま移行したらハマりました。
特に①詳細度 ②&の役割 ③:hoverなど状態の当たり方。
メリット/デメリットと“事故らない使い方”を1分でまとめました👇

👍CSSネストのメリット
・ビルド不要
・セレクタの繰り返しが減って読みやすい
・関連スタイルが近くにまとまって修正がラク
・記述量が減って見通しが良くなる

👎デメリット（運用で崩れやすい）
・深くネストすると逆に追えなくなる
・チームなど複数で開発する場合は書き方が人によってブレやすい（理解度を合わせるかつルール必須）
・古いブラウザ/端末がターゲットだと注意

⚠️SCSSから移る時に起きやすい“ズレ”
①詳細度：複数親（,）まとめは :is() 相当になって詳細度が上がることがある
②&：SCSSみたいな「文字連結（&__〜）」はできない
③:hover：:hover をネストで書くと「親」じゃなく「子孫の:hover」に当たることがある → 親に当てたいなら &:hover

【CSSネストで事故らないチェック項目】
✅ネストは深くしない（目安2階層）
✅親の状態は必ず &:hover
✅状態クラスも &.is-active みたいに「親に付く」を明示
✅複数親（,）をまとめたネストは詳細度に注意（当たり方が変わる）

📌保存して、CSSネストを使う際の参考にしてもらえると嬉しいです！
💬CSSネスト、もう使ってますか？他にもハマりポイントあったらリプで教えてください！

#1分CSS現場メモ #CSS

[はっしー｜Webディレクター @hassy_web]

@matsumatsu04 LP

[はっしー｜Webディレクター @hassy_web]

@matsumatsu04 自己紹介

[はっしー｜Webディレクター @hassy_web]

個人開発やってみたい。
だいぶ出遅れてるけど、Claude Codeを入れてみたので、いろいろ触ってみよう。

AIを利用しつつ、スプシと連携させてWeb制作に特化したWBS作成してみたり、案件管理ができるWebアプリ作ってみようかな。
すでに個人開発や既存アプリに同じようなのあると思うけど...

とりあえず、つくってみることが大事だと思ってるので、アプリの制作過程もお届けしたい😊

#個人開発