カテゴリー：記事

11～12月で4サイト制作・公開しなきゃで混乱しておりますが、めでたく、先ずは２サイト無事に公開できました！ あと2つ、年内に公開できるよう、頑張りますっ！ 長年お付き合いのある、名古屋の企業さまのブランドサイトです。 健康、長寿、といった内容ですが、モノクロを基調にお洒落で既存のイメージに捕らわれない、様々な年齢層に呼びかけることをイメージして作りました。 わりと好きにやらせていただいたので楽しいお仕事になりましたw ※画像クリックでサイトに跳びます。 もうひとつは、ドライヘッドスパ + 細胞レベルから薄毛改善をされているサロンです。 今回はイメージ主体ではなく、文章できちんと解説をされていて、思いをまとめられたとのこと。こういう自由度がスクラッチの魅力ですよね！ ※画像クリックでサイトに跳びます。 ———- HS Works の制作するHPは、コスパと、フレキシブルな対応に自信があります！ いいね！と思ったら、是非ご相談ください！ お待ちしています！

みなさん悩まれますよね。 ここのメニュー項目はどうしますか？ ここの内容はどうしますか？ このページの原稿ください！ やいやい催促が来て嫌な気分になって「もういい！やっぱ止める！」なんてなりがちですね。 新規でHPを作る場合、どのように考えていけばいいのでしょう。 今回はそんなお話です。 最初のステップ ◆会社、お店、商品 (サービス) について 1. 先ず、何屋さんなのか？ 　　これを明確にしないとですね。 2. このHPの情報は何方向けですか？ 　　BtoB なのか、BtoC なのか、所謂ターゲットを決めないとです。 3. 扱う商品 (サービス) は？ 　　商品 (サービス) ごとのアピールポイント (選ばれる理由) は？ 　　(例) なぜ良いのか、なぜ勧めるのか？ 　　→ ○○でお悩みの方を何とかしたいと思い～ 　　→ このような効果が期待できるので～ 　　→ なので自信をもってお勧めします！(お任せください！) 等々 次は具体的に ◆構成について 4. 各ページのメニュー名を考えましょう 　　Top、○○とは、○○について、よくあるご質問、About、お問い合わせ 等々 5. サイト (または会社、商品、サービス) のキャッチコピーを考えましょう 　　トップページにどーん！って出すイメージです。 　　「より暮らしやすい未来のために」とかとか… ここまで考えられたら ここまでで整えていただければ威張って制作会社に相談、依頼ができます！笑 あとはメニュー内の詳細を詰めていけばホームページが完成します♪ HS Works では、もう少し具体的なところまで (ここは企業秘密ですw) お話しながらイメージを固めていきます。 原稿が書けない場合も、「こんな感じでしょうか？」というたたきを (捏造してw) 先にはめ込んでお見せしますので、「えーと、そうじゃなくて…」というところから、意外と進んだりします。 最初どうしていいのか、どこから進めればいいのか、そんなことはわからなくて当たり前なので、制作する側がきちんと先導していく義務がありますよね、何事もコミュニケーションが一番です！ というわけで、なんでもお気軽にご相談ください！お待ちしています♪

制作会社に見積り頼むと結構な価格差があったりしてびっくりするかもしれませんね。 激安だけど殆どカスタマイズできないとか、そんなに高いの～？とか、様々です。 今回は一般的な構成のHPの相場感についてお話します。 ———- 【会社HPとして以下の構成を例としてみます】 1. トップページ 2. サービス (商品) の紹介ページ 3. こだわりや特集等の専門的なページ 4. 会社情報 5. お問い合わせ (フォーム) 6. blog (お知らせとしても使えます！) 7. プライバシーポリシー ———- ◆制作会社の見積り ・お見積り：60～120万 (下層ページのボリュームによる) ・制作期間：一か月～1.5か月 ・運用保守：アリの場合は月額￥1～2万 さて、このお見積り根拠はなんでしょう？ 1ページ単価だと1ページ10万前後？高過ぎでしょー？ ———- では解説しますね。 一昔前はページいくらでお見積りをしていた会社も多かったです。 しかし近年のスマホでスクロールが当たり前になると、長さが何メートルでも1ページね！ということにもなります。 なので、このサイトを全部作るのに何人で何日かかる？という、人日単価でのお見積りが主流になっています。 HP制作には、ディレクター、デザイナー、コーダー、エンジニア等、役割が違う人員が全員で何日かかるの？というのがお見積り根拠になります。 もうひとつは、その人日単価です。 これは制作会社が大きいほど単価は上がります。 もしくは会社規模は小さいけど、イケてて有名な会社なども単価は高いです。 この人日単価 x 制作日数 = 制作費 となるため、例えば20日かかる場合だと… ◆人日単価 3万 だと 60万、人日単価 4万 だと 80万 になります。 ※会社なので人件費と利益を考えると人日単価の相場は概ねこのくらいです。 ※更に20日で完成するHPはとてもシンプルなものになるため実際は1.5か月～2か月かかるでしょう。 ※システム構築だと人日単価は更に上がったりもします。 個人事業の場合は、この人日単価がお安くできるため、全体の制作費もお安くなります。 しかしその反面、クオリティ、やり取りの円滑さ、アフターフォロー等の不安も出てくるでしょう。 安くてもストレスが大きかったら満足できませんよね。 自分も個人事業主ですので、この辺りはきっちりと払拭するよう努めています。 ———- 今回リアルに裏話をお話しましたが、HS Works は、制作会社のクオリティで制作コストがお安くできる、数少ないところだと自負しています。 そのため、激安ではありませんが、BtoB 相場との比較では大変コスパが良いかと思います！ また、私自身が長年ディレクターをしており、皆さまのアイデアを形にするお手伝いを制作全体を見据えて行えるため、きっとご満足いただけると思っています！ なんだ、結局宣伝かい！となってしまいましたが、ご興味を持っていただけましたら幸いですw お気軽にご相談ください。お待ちしています！

今回はマニアックなお話。 WordPress のプラグインで XML Sitemaps ってのがあって、ド定番なんですが、Google サーチコンソールで除外扱いになって有効なページが偉い少なくなってしまう現象があります。 XML Sitemaps の設定で「HTML形式でのサイトマップを含める」のチェックを外すなんてのはやっているわけで、それでも除外されるのですよ。 もちろん、meta に noindex 記述などはしていません。 ググってもこれに関して数えるほどしか出てこなくて、色々試した結果なんとか登録できたのでその方法を残しておきますね。 ———– ◆先ず以下の状態であるとします。 ・新規サイトに XML Sitemaps を入れて設定をして サーチコンソールに sitemap を登録 ・暫くしてガバレッジを見ると本来20ページあるのに1ページのみ有効で、19ページが除外にされている ・sitemap は正しく読まれているが、index されていない ・「HTML形式でのサイトマップを含める」のチェックはもちろん外してある ◆対処法 ・ftp で /wp-content/plugins/google-sitemap-generator に行く ・ここにある、「sitemap.xsl」と「sitemap-core.php」を落とす ・sitemap.xsl 12行目の meta name=”robots” content=”noindex,follow” / を削除 ・sitemap-core.php 1576行目の if(!headers_sent()) header(‘X-Robots-Tag: noindex’, true, 200); をコメントアウト ・そしてこの2ファイルを上書きアップロードする ・サーチコンソールで sitemap を再指定 ※行数は ver などで変わるかもなのでその辺ですw ———– 色々試した結果、サーチコンソールに index させるにはこの2つのファイルの書き換えが必要でした。 プラグインの記述なのかコンソールのエラーなのかわかりませんが、robots が原因なのは確かですねぇ。 ロボットメタタグは記述してないし、robots.txt もアップしてないので、XML Sitemaps の設定の「サイトマップの URL を仮想 robots.txt ファイルに追加」ってのが超怪しいw これ、実体化されない (ftp で見つからない) ので厄介です。 とまぁ、これで二日待ってガバレッジを見ると、有効が適したページ数に増えました♪ 除外もあるけど、中身見るとOKなページなのでこれで良し。 XML Sitemaps の ...

バーチャル異空間即売会『Vマ＋』(ぶいまプラス) 【秋の陣】9/23(祝)、24(金)、25(土) が開催されました。 vma.virtual-space-market.com 今年二回目の大きな開催。初日はシステムトラブルにより会場時間が延長され、復旧アナウンスの後少し見れたけど、やはり致命的な何かがあり敢え無く初日開催を断念。 まぁ、まだベータ版なので色々あるよねーって感じだったけど、二日目からは見事復旧！ストレスなくサクサク動き回れた。 VR空間に参加者のアバターが各々リアルタイムで動きまわれ、展示ブースではテキストと音声でも会話ができたり、自由な視点でスクリーンショットが撮れたりできる。もちろん、気に入った商品はその場で購入が可能。 よくあるポリゴンの粗さや、カクカクすることも無く、これは普通に世間に浸透して当たり前になる気がした。 各ブースやあちこちにあるトークエリアでは、そこにいる全員でのリアルタイム音声会話も可能だった。 これは便利！普通に商談ができてコミュニケーションがスムーズ！ 今回は何でもアリの展示即売会場で、食品、グッズ、イラスト、健康関連等々、色んなブースが並んだ。 個人的には↑画像2枚目の、展示会場からライブ会場へ行く光の通路が良かったかな！ 奥には水中のような野外ライブ会場があり、でっかいスクリーン3枚に動画を流していた。そこへ参加者のアバターがわらわら集まってて、リアルな感じだった。(※これ、丁度ライブやってないときに撮ったので人が居ないですね、すみません。) アバターのアクションでぴょこんってジャンプができるんだけど、ライブ会場では追加で拍手と、頭の上でタオルを回すことができます♪w (↑画像) 今後はこういうの増えていくんだろうな。 見本市なんかのリアルな出店ってやっぱりお金もリソースもかかるしね、アバター同士が対面で話せるならなんだこれで良くね？みたいなところもあるのかなと。(あと、片づけなくていい！w これは何気に大きいですよ！w) 実際、商品購入までは中々難しいのかもだけど、今後改善の余地はあると思うし、未来のビジネスツールに十分成り得る気がした。 最後に、参加するときのPCスペックだけど、うちのデスクトップは corei7 でグラボも挿してるのでなんのストレスもなかったけど、corei3 のグラボオンボードのノートでは正直ダルかった。シーンが変わるたび歩くのが遅くなるとか、走れるんだけど走れないとか。 でも会話は普通にできたからそこはインフラが優秀だったのかな？と。 冬にも【冬の陣】がまたあるようなので、次回はみなさんもチェックしてみてくださいね！ ではでは。

ハンバーガーメニューって何のことだかわかります？ HPをスマホで見たときに、上段の右か左端にある、押すと展開するメニューボタンのことです。 ちょい前までは横三本が主流で、ハンバーガーに見立ててそう呼んでいました。 この三本線ボタンを押すとメニューが出てきて、次に閉じるのがわかるよう、✕になるんですね。 こうしておけば、あぁメニュー閉じれるのねってわかります。 ところが… あれ？✕は二本線だから一本どこいった？って突っ込みがあったかどうかはさておき、今の主流は最初から二本線になっています。 そうなるともはやハンバーガーでも何でもないww でも三本線が定着した後だから認知されるわけで、今だからできる変更ですよね。 HS Works でも最近の制作では二本線にしました。(↑ 右の画像) こういうのは流行りすたりがあるのでまた違うアイコンになるかもですが、暫くは二本線で行こうかと思っています。 場所も、数年前は右端だったんですが、スマホを左手に持って見るときに左端の方が押しやすいとなって左端が多くなりました。 その他にも色々なフィードバックがあって、日々進化していくので作り手もトレンドを追うように心がけています♪ スマホでの表示が今どきではないと思っていたら、是非ご相談ください！ ご予算に合わせてイケてるご提案をさせていただきます。お待ちしています！

今回はHP制作とは全く関係ないのですが、サイバーパンクについて振り返ってみました。 1980年代前半、作家、ウィリアム・ギブスンとブルース・スターリングが「サイバーパンク」という小説ジャンルを作った。 サイエンス・フィクション (SF) に対し、リアル (近未来に実現しそうな化学) を取り入れた近未来のお話。 当時早川文庫で翻訳されたサイバーパンクものは殆ど読んだ！ グレッグ・ベア、ルーディー・ラッカー、K.W. ジーターにもハマってました。 ウィリアム・ギブソンの代表作、「ニューロマンサー」からの電脳3部作は、脳を直にネットに接続する系の元祖。 世界観はもろにブレードランナーの映画そのもので、間違った漢字や芸者、やくざが登場するえせ日本文化。 街には肉体改造してる輩、闇の改造屋、主人公はたいがいジャンキー、ネットに居座る意識集合体。 後の攻殻機動隊やマトリックスの基盤となり、今や当たり前になっているあの世界。 でね、当時ブレードランナーが映画化されてたとき、くっそー！ニューロマンサーパクりやがったなー！！って激怒した記憶があって、今更気になって調べてみたんだけど… あれ？あれあれ？？ —– ◆ウィリアム・ギブスン著書 1981　記憶屋ジョニィ 1982　クローム襲撃 1984　ニューロマンサー 1986　カウント・ゼロ 1990　モナリザ・オーヴァドライヴ —– ブレードランナー映画化　1982年？！ ニューロマンサーの前？！ うっそー！！ とっくに読んでたよね？だから真似しやがってー！！ってなったよね？違うの？！！ ってことは、82年の短編、ニューロマンサーの原型になった「クローム襲撃」を読んでいたからなのかな？ もう昔過ぎて記憶が曖昧！ そもそも、ブレードランナー原作の「電気羊はアンドロイドの夢を見るか」は1968年なのでサイバーパンクではない。 フィリップ・K・ディックの古典SFですよ。それを、サイバーパンクの世界観で映像化したのがブレードランナーなわけで。 そしたら、あたかもブレードランナーがサイバーパンクだ！みたいな流れになり、「ちゃうちゃう！サイバーパンクってジャンルを作った小説たちがあるねん！電気羊さんはそこから出てないねん！」って騒ぎになったんだけど… ダメだよね、ハリウッド映画とサブカルの喧嘩じゃ相手にならなくてね。 リアルタイムで早川文庫読み漁ってたおいらもこれには当然納得できなくて、ブレードランナーも攻殻機動隊もマトリックスもファック！だったわけです。 まぁスターウォーズのビームサーベルをガンダムが当たり前に使うように、今更何でもいいんだけどねw たまたまブレードランナーの30年後の続編ってのを観ちゃったんで、ちょっと調べてみたら記憶が改ざんされてる？おいらも実はレプリカントだったりして？！というお話でしたw 最近小説読んでないな。もはや文字が多いと諦めちゃう。ダメですね！ ◆おまけ blog 一覧で見れるこの記事のサムネは、むかーしに描いたやつですが、ちょいグロいので自主規制しておきましたw

未だにスマホ最適化されていないホームページをたまに見かけます。 え？だって指で拡大できるんだからOKでしょ？ まぁ読めなくはないのですが、片手でサクサク見るのに慣れちゃってる現代人からは、無いわーって思われちゃいますね。 スマホの方はこちら！みたいな、「スマホ版」があるのも古いです。 以前はスマホサイズにした、別なサイトをもうひとつ作ってた時期がありました。 同じ内容のサイズ違いを作るという、手間もお金もかかるものでした。 今はレスポンシブといって、どんなデバイスで見てもレイアウトを可変させて見せる手法で作っています。 同じページの、段組みを変えて表示させてるイメージです。 例えば PC で「画像テキスト・画像テキスト」と横並びだったら、スマホでは立て並びに組み換えています。 レスポンシブとは？ もう少し詳しくお話すると、PC、タブレット、スマホの3つの横幅サイズで区切り、3段階の段組みやフォントサイズ等を組み換えて表示させています。なのでやはり手間はかかっていますが、別々なページを表示するのではなく、裏側の仕組みで別な見せ方をしていて、この仕様をレスポンシブと言っています。 今や当たり前になったので、あまり威張ったり気にすることでもなくなりました。笑 とは言え、タブレットもスマホも様々なサイズがあって、実は完璧に全てに最適化は厳しいです。 iPhone だけでも年代によって横幅が違うし、アンドロイドだ、iPad だ、なんだと一機種ごとに完全に調整するまではしていません。 この幅以下はタブレット、この幅以下はスマホ、みたいな目安があるので、そこで切り替えています。 中には独特のサイズの機種もあるので、その場合は個別対応になります。 IE と iOS 対応 iPhone というか、iOS は独自なことをするのでその度に特別な対応をさせられます。 我々制作側から言わせてもらうと、PC の IE (インターネットエクスプローラー) と iPhone にはずーっと昔から嫌がらせを受けており、新 ver が出る度、またかよっ！！って。 ホームページを表示するソースは世界共通語なんですが、この二つはいつも独自なことをしてくるため、その度に特別な回避策をしないといけません。何様？って感じで、こっちは IE と iPhone の不具合修正のため「だけ」にどれだけ時間を費やして来たことか… 日本人って、mac 持ってないくせに iPhone で、PC は windows だから IE というね、この嫌がらせ二つセットでシェア率を上げてる、世界一厄介な制作泣かせなんですよね。 あ、つい愚痴っちゃいましたw でもそうなんですよ、やれやれです。 ————- というわけで話がそれましたが、スマホに最適化されてないと今や Google にも弾かれる時代です。 うちのホームページも古いなぁと感じていたら、思い切ってリニューアルしませんか？ 今どきでイケててサクサク見やすい、そんなホームページをご提供しています！ お気軽にご相談ください。よろしくお願いいたします！

昔の WordPress では表示が重かったり、php の ver-up の度に動かなくなったり、javascript がバッティングしたりと、個人的に印象良くなくて、フルスクラッチでサイト作成する方が多かったんです。 今は何の問題もなく普通に動くし表示も速いし、オリジナルテーマでガンガン作れるので随分と印象が違います。(良い意味で) このサイトも WordPress ですが、外観はフルスクラッチしたものをテーマとして使用しています。 blog のカスタマイズも徹底的にしてみました。 最近の事例で、割とボリュームのあるサイトをすべて　WordPress で制作し、既存のものとマージしましたが、問題も起こらずホッとしていますw そこで！WordPress を使用した基本パッケージでのサイトをズバリ ￥400,000 で制作いたします！ ———– ◆構成内容です 1. トップページ 2. サービス (商品) 案内 3. こだわりや特集などのフリーページ 4. 会社情報 5. お問い合わせ (フォーム) 6. お知らせとしても使える blog 7. プライバシーポリシー このボリュームで40万円 + 消費税になります。 制作会社の相場からだと破格かと思います♪ (オリジナルテーマスクラッチですので) トップページには、かんたんなPR文、各メニューの導線になるようなリード文 「詳しく見る→ で該当ページへ)、所在地と連絡先と地図、お問い合わせボタン、SNS拡散ボタンと並びます。 また、blog 機能を利用してお知らせを作成し、トップページに見出しを自動で表示できます。 動きもスクロールに合わせてシュルシュル動かします。 とまぁ、このサイトもそうですが、こちらの 「works」から制作事例のサイトをご覧いただくとイメージが掴めるかと思います。 このメニュー数でほぼ足りてしまうかも？という規模を想定していますが、もっとメニューが多いとか、お問い合わせフォームをカスタムしたいとか、諸々も併せてご相談ください。一般の制作会社さんとクオリティは同等かそれ以上で、お値打ち価格にてご提案いたしております！ ———– こちらの基本パッケージは 8/31 までのお値段となります。この機会に是非！ よろしくお願いいたします！

Instagram がまた熱いです！ インスタ映えなんて言葉も冷めてインスタ離れが起きましたが、Facebook の傘下になってから、また再燃しました。 Facebook には Facebook ショップといって、EC 販売ができる機能があるんですが、インスタはそれと連動します。 つまり、Facebook ショップ上の商品写真をインスタにアップして広告として使えるんですね。 その商品画像をクリックすると Facebook ショップの商品ページが開いて購買に繋げる仕組みです。 HS Works では、EC サイトとしては Shopify の方がイケてるので Shopify とインスタの連携をおすすめしていますが、この新しいSNS 拡散による集客方法は見込み客の獲得に効果アリなんですよね。 HS Works では Instagram に特化した集客方法をご提案しています。 インフルエンサーにお金を払って宣伝してもらうの？いやいや、自分がインフルエンサーになればいいんですよっ！w えー？どうやって？ そう思いますよね、でもまぁ方法があるんです！笑　 で、その方法で実際自分のアカウントで日々実践しているのですが、平均月に千人くらいフォロワーさんを増やしています。 インスタではフォロワー1万人になると無料で広告が打てるので、1万人目標で頑張っています。 (参考までに、このページのヘッダーの「Instagram」をクリックしてみてください。現在の僕のアカウントが開きます。 約半年でこのフォローワー数です。そしていいねの数も見てください。やらせではありませんよ！) おすすめは個人経営のお店ですね。特にエステ関係ではチェーン店舗丸ごととか、多くの方々に導入いただいており、実績も豊富ですのでご安心ください。 もしも口コミで集客したい業種で、且つHPも併せてブランディングしたいとお考えの方へは、最適で最強なご提案をいたします！ ご興味のある方は是非お問い合わせください。お待ちしています！