Hot Page - グラフィックサイトビルダー

 (hot.page)
4 ポイント 投稿者 GN⁺ 2024-08-25 | 1件のコメント | WhatsAppで共有
  • Hot Pageは実際のHTML、CSS、JavaScriptを使いながら、ビジュアルツールとドラッグ＆ドロップでWebサイトを作れるグラフィックコードエディタ
  • “no code”の制約ではなくyes codeを掲げ、テンプレート依存よりもページのソースコードを見てコピー・リミックスする制作スタイルを強調
  • シンプルなサイトは無料で作成でき、独自ドメインを接続でき、より多くのオプションが必要なときだけアップグレードするモデル
  • 作成したサイトはダウンロードして別の場所でホスティングでき、フロントエンドフレームワーク・カスタムエレメント・WebプラットフォームAPI・オープンソースのコード断片も活用可能
  • Web標準の上で作業しながらWeb開発スキルを学べる流れのため、別の抽象化や新しいエディタインターフェースを学ぶ負担を減らせる

実際のコードベースによるビジュアル制作

  • Hot Pageは、Webサイトを作るときに実際のHTML、CSS、JavaScriptを使うグラフィックサイトビルダー
  • エディタはドラッグ＆ドロップのコードエディタとビジュアルツールを組み合わせ、最初から独自のデザインを作れるようにする
  • すぐ試せるエディタ体験を提供しており、無料のWebサイト作成は登録ページから始められる
  • テンプレートを提供しない代わりに、すべてのページのソースコードを見られ、これをコピーしてどこでもリミックスできる
  • 必要な機能は、インターネット上のフロントエンドフレームワーク、カスタムエレメント、コード断片、オープンソース実装を取り込んで貼り付けられる

デプロイと所有権

  • シンプルなサイトは無料で作成でき、独自ドメインも無料で使え、より多くのオプションが必要なときだけアップグレードすればよい
  • Hot Pageを離れたくなったときは、サイトをダウンロードして持ち出せて、どこでもホスティングできる

Web開発学習に合った流れ

  • Web開発の入門者はサイトを作りながらコーディングを学べ、すでにWeb開発を知っているユーザーは既存の知識でそのまま使える
  • 中核となるWeb技術をそのまま使うため、新しい抽象化やエディタインターフェースを覚える負担が減り、Webの後方互換性も利点として強調されている
  • 推薦文では、クリーンでセマンティックなコード出力、12カラムのレスポンシブレイアウト作成、迅速なランディングページ調整、新しいCSS機能とWebプラットフォームAPIの利用、即時ロードされるレスポンシブサイト出力を利点として挙げている
  • HotFX libraryは色とモーションを加える特殊効果コレクション

関連記事

1件のコメント

 
GN⁺ 2024-08-25
Hacker News の意見

  • Hot Pageを作ったTimです。古いサイドプロジェクトで、今は友人何人かの助けを借りてブートストラップで育てているところです
    目標は、SquarespaceやWixのようなドラッグ＆ドロップ編集機能の手軽さを取り入れつつ、HTML要素やCSSルールといったWebページの基本構成要素とのつながりを失わないことです。Web Componentsの登場で、このモデルはずっと強力になったと思っています
    本来は数か月後に自分でHNに投稿するつもりでしたが、今はエディタをはるかに強力にする機能に取り組んでいます。より多くのCSSプロパティを視覚的に編集しながら生成されるCSSとの1:1の対応を保つ機能、:hoverやメディアクエリを使える要素ごとのインラインCSSエディタ、左パネルの基本要素と一緒に入るコードスニペットライブラリ、Web Componentsとのより緊密な統合、VS Code言語サーバーによる正確なオートコンプリートなどを計画しています
    HNは長年ロム専してきて、このコミュニティが好きでした。特にマーケティングが本当に難しい課題だと分かってきているので、考えやフィードバックはどれも歓迎します

    • microflashが先に出してくれたので、自分も付け加えます。https://fx.hot.page/ にWeb Componentsがいくつかあります
      slinkyはばかばかしいけれど楽しく、ギャラリーコンポーネントはかなりいいです。軽量で使いやすそうに見えましたし、何が起きているのかを詳しく解説した注釈付きソースコードページが印象的でした。跳ねたり渦を巻いたり多色に光ったりするテキストがミッションなら、強みは自分たちで書いたドキュメントのほうにありそうです
    • Web Componentsとビジュアルアプリビルダーの組み合わせは本当に魅力的な領域です。自分も似たものを作っているので、もっと多くのアプローチが出てくるのはうれしいです
      スタイルは明らかに素晴らしく、その感覚が顧客サイトにも染み出して、Webにもっと楽しくてばかばかしいけれど実際に使えるものが増えるといいなと思います
      ビジュアルビルダーと並行して、Web Componentsのカタログとcustom elements manifestのバリデータも作っています。こうしたツールで使える高品質なWeb Componentsが増え、カタログもビルダー内に埋め込めるようになるといいですね
    • HNでのローンチ計画を台無しにしてしまってすみません。偶然見つけたのですが、Webではこういう偶然が起きるものなので、いい感じに見えてここに投稿してしまいました。これから出てくるものを楽しみにしています
    • 素朴なバニラWebが好きな立場として、今のhot.pageは全部気に入っています。ついに個性のあるWeb資産が出てきたという感じです
      コミュニケーションとドキュメントが良いというAstroJetsonの意見に同意します。料金体系と、無料プランにもカスタムドメイン対応を入れている点もいいですね。こういう点を見ると、まともな人たちなんだろうなと思えて応援したくなります
    • HyperCardを思い出させるスタイルが本当に気に入っていて、どうやって作ったのか気になります
      完全にゼロから始めたのか、それともベースにした既存のCSSキットがあったのか知りたいです

  • 見て回っていたらショーケース例の中に https://alice.hot.page/ を見つけて、本当に5分間『不思議の国のアリス』を読んでいました。時間の使い方を少し見直したほうがよさそうです

    • 下へ下へと続いていくスクロール効果が本当に見事でした。教えてくれてありがとう

  • かなり良さそうです。不思議なことに、ほぼ20年前の学生時代に戻ったような気分になりました。ドメイン名を買うお金はありませんでしたが、ワールドワイドウェブにいくつかWebサイトを作りたかったのです
    無料ホスティングを探してGeocitiesを知りましたが、そこではfoo.geocities.comのようなサブドメインではなく、geocities.com/fooのようなパス配下にサイトがホストされていました
    結局、その名の通り20MBの無料ホスティングスペースを提供していた20m.comを見つけました。一番良かったのは、自分のWebサイトをサブドメイン配下で公開できたことです
    驚くことに、そのとき作ったサイトの1つが今でも生きています: http://encoders.20m.com/ 内容は判断しないでほしいです。若くて純朴で、ただWebで遊んでいた頃でした

    • 2002年の自分も似たようなものでした。Geocitiesは見ずに、すぐfreeservers.comを見つけてdavinder.8m.netのサイトを作りましたが、今でも残っています
      2007年から2022年までパスワードをなくしていましたが、Yahooのメールアカウントを復旧したときに再び見つけました

  • ここで使われている美学が気に入っています。同じ系統の別プロジェクトである https://mmm.page/ を思い出します

  • セルフホスティングも可能なオープンソースのコンテンツ操作システム Hotglue[1] に触発されたのかなと思った
    [1]https://hotglue.me/

    • Hot Page は自分のプロジェクトだけど、どういうわけか Hotglue のことは知らなかった。いま見てみると、見た目は似ているけれど実際には違うと思う
      Hot Page は抽象化を使わないビジュアルなドラッグ＆ドロップ式 Web エディタなので、使っている間ずっと結果の DOM 全体を完全に制御できる。すべての要素、ネスト、属性、CSS ルールなどを直接扱えるということ。だから実際のサイトを作るための CodePen のような感じ。この哲学についてはここにもう少し書いてある: https://hot.page/takes/picking-the-right-abstraction
    • あまり似ているとは思わない。個人的には、90年代に一時期人気があった古い HTML/ページエディタ HoTMeTaL を思い出した
      ページをビジュアルな半 WYSIWYG と半要素ツリーモードで表示する、似たアプローチがあった
    • 自分も最初に思い浮かんだのは Hotglue だった。セクションを編集してユーザーコードやスタイルを入れられる、本当に自由形式の Web デザインツールだった
      インストールも、たいていは PHP が動く Web サーバーにフォルダを1つ置く以外ほとんど必要なかった。数か月前にレビュー記事も書いた: https://rafichaudhury.com/site/blog/Freehand-Web
    • もう誰かが先に言っていた。元のプロジェクトと関係がないなら、名前をあんなに似せるべきではなかったと思う。クローズドソースの Hotglue クローン/SaaS/インスパイア作品に見える
      いずれにせよ、Hotglue の開発がここ数年止まっているのは残念。友人の何人かはいまだに個人サイトで使っている
    • HoTMetaL や HotDog も思い出す。どちらも90年代の HTML エディタ だった

  • 奇妙でギラギラした流行が戻ってきてうれしい。あまりにも長く クリーンでフラットなデザイン の世界にいた
    今ではもう少し自意識があり、皮肉や自虐も避けられないけれど、それこそがポストモダニズムなのだとも思う

  • デザインとコミュニケーションの仕方が本当にいい。自分も製品も、どちらもファンになった
    最初は HN のタイトルより製品のほうがずっと面白そうだという予感でクリックした。サイトに入った瞬間、「ついに、合意で磨き込まれたデザインから抜け出すことを恐れない人がいるんだ」と感じたし、このまま大胆でいてほしい
    このデザインを好きになりそうな人たちの顔も浮かんだ。友人たちのサイトを作ってほしいとよく頼まれるけれど、時間と柔軟性が足りないこと、小規模事業者が自分のドメインで運営するにはいら立つほど費用が高いことが理由で、よく断らざるを得なかった。ランディングページを見ると、まさにそれを提供しようとしているように見えた。開発者としては、素早く作れて、見栄えがよく、費用もあまりかからないやり方が可能に思える
    HN のスレッドを読み始めてからは、どれほど誠実で現実的な人に見えるかに驚いた。製品を試してみるし、不完全さも我慢して待つつもり。登録する人たちと、いま HN でしているように今後も対話し続けるなら、あなたと製品を応援したいと思うファンがたくさん生まれると思う

    • ありがとう。実のところ、ほとんど 一人で孤立した状態 で作ってきたので、こういう熱のこもったフィードバックをもらえるのは本当にうれしい
      Hot Page は自分のリソースでブートストラップすることに本気で取り組んでいて、誰かにデザインをもっと平凡にしろとか、顧客から搾取する方向へ圧力をかけられたりしないようにしたい。もちろん、プログラミングのすべてとマーケティングの大部分を自分でやるのは簡単ではなかった
      今はベータ版を使ってフィードバックをくれる顧客が本当に必要。応援してくれてありがとう

  • 土曜の早朝に自分の Geocities ページを思い出させてくれてありがとう。くるくる回る 工事中サイン も追加できるといい。ああいうのが一番好きだった

    • 以前のホームページを見るべきだった: https://old.hot.page/ Web 1.0 への目配せというアイデアは本当に良かったけれど、少しばかり粗すぎた
    • 自分のプロジェクトではないので変えられないけれど、自分も Geocities っぽさを感じたので投稿した

  • 価格を見ると月9ドルで 帯域幅5GB だけど、不合理に高く聞こえる

    • これは S3 ではない。帯域幅は単にプランを分ける基準の1つにすぎない

  • 個人的には名前はいまいちだと言っていいのか分からない。女性は自分の名前をサブドメインに入れるのをためらいそう

    • 「Hot」が常に「セクシーさ」を意味するわけではない。実際に Web サイトを一度見れば、その点はかなり明らか
      ただし Neocities のようなところでホスティングするほうを好む可能性はある。それは Neocities には猫がいて、全体的にもっとかわいく見えるからという可能性が高い
    • Hotmail もその名前でうまくいった
    • 初期の HTML エディタの1つである HoTMetaL を思い出した
    • それでもカスタムドメインを使えると書いてある