HTMLやSCSSをホームページに載せる。手間がかかるけど楽しい。

浪人のサムライです。

少し前から、単にデモサイトを公開するのではなくて、補足情報としてHTMLやSCSSを載せるようになりました。

すべてではありません。

過去に紹介したモノに近いと載せることはありません。

手間がかかるけど楽しいですよ～。

HTMLを載せるのが難しい

さて、ホームページの強みは、デザインとコードをセットで公開できるこど。ブログで中々ないと思います。コードの表示があっても、実際の見た目を載せていない場合もあります。

理由は簡単で、スクショがめんどくさいのかなと思います(笑)。ま、ぼくはそんな感じですね。

で、HTMLをホームページで公開するには、「実体参照」というのが必要です。

• <>→&lt &gt;

HTMLの"<"と、">"は実体参照にしないといけません。そうしないと、単純に表示されるだけです。

最初は混乱して、まぁ、ぶっちゃけ2個や3個なら手動で行いますが、10個20個100個とかになるとミスる可能性が高いです。

ただ、webサービスで自動で変換されるモノもありますが、いちいちするのはめんどくさい。

そこで、DWの文字変換機能を使うようにしました。検索機能の範囲を指定して<と入力。

そして、変換したい語句で&lt;を書く。

あとは一括で変換するだけ。

これで完成。予は満足じゃ(笑)。

SCSSは簡単

一方SCSSは簡単です。codeタグの中にSCSSをコピペ。

これで終了～。

ただ、これはHTMLも同様ですが、改行するのに<br />を書かないと横一列で並んでしまう。

なので、これは結構手間です。

まぁ、許す(笑)。

DWなしではホームページ制作ができないよ

「DWってなんやねん笑」という感じですが、Adobeドリームウィーバーです。

vscodeに浮気しつつありましたが、やはりDWです。スニペット登録もたくさんしていて、かなり快適。

サブスクですしガンガン使います。もうDWなしではホームページ制作ができないよ（言い過ぎか笑）。

手間暇かかっても

手間暇かかってもします。もちろん、「これは載せなくても良いな」と思ったモノは載せませんが。

そのときの状況で判断したいと思っています。

さいごに

要するにホームページをブログ風にすることですね。解説付き。前から興味があったので、実現できて良い感じ。

今後も続けます。

おしまい！