HTMLを白紙から全て作成するのは面倒だ。タグの知識と挿入が必要だ。リンク設定や文字の色・フォント・サイズ設定も面倒だ。構造化も知識と管理が大変だ。写真などの挿入も面倒なタグや細かくテキストで設定が必要になる。
テキストや表や写真・動画を作成し、それをHTMLエディタに貼り付けたらHTMLに作ってくれるなら、大変便利だ。ネット上の情報を引用紹介・利用するケースも多いが、表示しているものをそのまま利用できないケースが多い。HTMLの内部構造で、表示の陰に膨大な仕掛けが潜んでいてコピー貼り付けで問題が発生する。これを防ぐ方法の一つに、コピーを一度テキストエディタに貼り付けて、装飾を一切除去する方法は役に立つ。その後、テキストだけをHTML作成に利用する。
HTMLは、実際の作成編集の場では、ゼロからHP(HTML全体)を作るということは、実際は少なく既存のHPにページや部分を追加するという使い方がほとんどだ。
この場合は、デザイン担当するCSSは全体共通のものを利用するから、追加するコンテンツだけ作ることになる。
WordPress利用の場合でも、事情は同じだ。ブロックエディタは、お仕着せの内容になり表現など調整しにくいことがあり、ページ全体をHTMLコードでも扱えるクラシックエディタを使いたくなるケースは案外多い。
表示が意図したものと異なり、対処に困って、HTMLコードで見たら解決方法が見つかることは、案外多いのだ。
今行っている小生のHTML作成方法など含めて、良い方法がないかAIのGeminiに聞いてみた。
意外にも試行錯誤の末採用している私の方法を、Geminiも最適だと評価してくれたので、ご紹介。
最も効率の良いHTML作成方法とは、
1.原稿素材をテキストエディタ、Word、エクセル、写真などで作成
2.ブログサービス Jugem のHTML新規作成(HTMLエディタ)利用してHTMLに
Webサービスなので、ブラウザのタブ切り替えで同時に多数のページ表示して並行作業できるのも便利だ。終わったら、PCのファイルとして保存し、WebのJugemは保存せず終了できる。
3.Jugemのコード表示で、HTMLコードテキストを、正規表現使えるテキストエディタで修正する(Freeのnotepad++ や 有料のEmEditorなど)
4.それをWordPressのコード原稿に貼り付ける、或いは作成したHTMLをサーバーへFTPソフト(WinSCPなど)でUploadする。
この方法が、最もHTML効率がよいという。
また、AI(Gemini、Copilotなど)に HTML用原稿を渡してHTMLを作成依頼する方法も最近は有力だ。
実際に、行ってみたら驚くほど体裁の良いレスポンシブ仕様のCSSとHTMLのセットで提示もしてくれる。
ただ、この場合は原稿内容情報が、AI側に無償提供(情報漏洩)することになっていることに留意必要。
ブログjugem のHTML作成機能 フリー版ありの紹介
機能:
1.テキスト貼り付けで簡潔な構文のビジュアルHTMLを作成してくれる
Uploadできるのは写真だけ、gif・jpg・png 使える。ファイルは不可。
2.エクセル・スプレッドシートで作成した表貼り付けでHTMLーテーブル作成
3.HTMLのリンク付与、文字サイズ、文字の色設定、フォント変更容易
4.コード表示でき、テキストエディタで調整できる。
正規表現使えるテキストエディタ(notepad++など)を利用すれば、素早く大量のタグの修正ができる。
5.既存のHTMLに作成したコード部分を挿入すれば、加筆HTMLができあがる
6.WebサービスなのでPCに負担を掛けない
WordPress 癖が多く意外に不便な面もある
機能:
1.テキスト貼り付けでHTML作成してくれるが、最新規格のHTML Living Standardではなく、HTML4以前の利用のためか、無意味な<div>タグを多用し、表示すると行間隔が狂う原因にもなり、HTMLの構造が複雑で読みにくい。
2.写真の配置など、勝手に解釈されて配置されたりサイズ調整されてしまう。
3.WordPressの提供サービスシステムだけで1万ファイルもあり、バグ多発でそのUpdateが頻繁。作成したHTMLのバックアップ容量も巨大になる。記事や写真は全て部品として内部のデータベースに収納されHTMLに作られる。内容は調べることができない。DBが壊れたらすべて消失する。バックアップの管理が大変だ。
4.世界のWebの大半が利用しているため、サイバー攻撃の標的になることが多いという。プログラムのファイル数が多いため隠れたバグを利用して侵入されることも多いという。
Visual Studio Code 機能豊富だが、全部手打ち必要
1.タグ作成支援はあるが、HTMLタグと使い方知識が前提で全て手打ちになる
2.アプリの容量が大きくCPUには負担大きい。様々なプログラム作成支援とデバッグ機能もあるためだが、HTML利用に絞るならそれほどの機能は不要だ。

