【 HTML終了タグチェッカー 】改訂版の再配布を致します

弊ブログのこの記事 ↓ を発端にして、FC2ブログを「HTMLタグのみ」の改行設定で記事を書くブロガーさん達が増えつつあります。


Webテク倉庫のアイキャッチ画像

最近の筆者の趣味は皆さんのブログ記事のHTMLソースを読むことです(笑) - 初級パソコン術

最近の筆者の趣味は、皆さんのブログ記事のHTMLソースを読む(覗く)ことなんですよね~(笑) 悪趣味ですよね~ (〃^▽^〃)oあはははっ♪ そうそう、HTMLソースって ↓ こんなのですよね。 ブラウザのGoogleChromeをお使いでしたら...


筆者としては嬉しい限りなんです、弊ブログ記事から刺激を受けてそれにチャレンジしてくださってるブロガーさん達がいらっしゃるんだぁ♪ なんてね(爆)

でも、実はHTMLタグを駆使して記事を書くには終了タグ(閉じタグ)忘れには気をつけなければいけません!

HTMLタグで記事を書くときには「段落タグ」として <p></p> タグで文字列を挟んで囲みますよね。


■ 終了タグ忘れの例
 <p>今日は良いお天気ですね~♪</p>  ← 終了タグあり
 <p>今日は良いお天気ですね~♪  ← 終了タグ忘れ

この <p></p> の場合の「終了タグ </p>」は、HTML4.01以降からは「省略出来る」ようになり、今時のHTML5になって、更にその省略出来る終了タグの種類が増えました。
でも勘違いしてはなりません! 省略できるには要件がありまして、なんでもかんでも「省略してしまえ」とは行かない危なさもあるんですよ。

「省略出来る」ようになったのは、今時の新しいバージョンの「各ブラウザがそれらの終了タグを補完して終了タグがあるかのように表示してくれるように進化している」と言うことなんですが、場面によっては </p> の終了タグ抜けのみならず、他の省略できる終了タグ抜けでもとんでもない表示崩れを引き起こす要因にもなってしまうんです。

一度 『省略できる終了タグ』 のキーワードで検索してどんな種類のものがあるか見て下さいね。

つまり、もっと身近に言いますと、あなたが保存してあるいつもの定型の要素(アイコンや画像等)のHTMLコードをコピペでペタペタと各記事に貼り付ける場合には「終了タグ忘れ」がないかを気をつける必要があり、そのようにいつも記事に貼り付ける定型のHTMLコードは正しいものになっているかキチンと確認しておかないと、毎回気がつかないままに「表示崩れ」を起こしているかもしれないですし、他のHTMLタグと「入れ子(互い違い)」で貼り付けてしまっていないかも注意が必要です。

例えば、、、

このような、そのブログのマスコット的画像を毎回同じ場所に貼ったりする時、HTMLの終了タグがキチンと書かれているか、また他のタグと入れ子になってしまう位置にHTMLコードをペタリと貼り付けてしまっていないか! と言うことなんです。

こんなことを書くと『え゛~ ずいぶん面倒なのね~、もうHTMLタグで記事を書く自信がなくなったから止めようかなぁ (・・.)グスン』なんて言い出すブロガーさんが出ちゃうかもしれませんから、もうこの辺でおしまいにしておきます(笑)

でも大丈夫! そんな悩ましい「終了タグ抜け」を簡単にチェックしてエラー原因箇所を表示してくれるツールがあるんです。


ブロガーでしたら【 HTML終了タグチェッカー 】 を活用しましょう

筆者がずっと以前に『終了タグチェッカー』のキーワードで検索した時にブラウザChromeの拡張機能である「 HTMLエラーチェッカー 」がヒットして、それからは必要な時にこれでチェックして来ていたんですが、下図のような感じでちょっと使い勝手に違和感を感じていたんです。

Chromeの拡張機能 HTMLエラーチェッカー の場合

検出されたエラーのリストの様子

ご覧のようにリストタグの </li> の終了タグがないよ!って言うエラーが出まくってますが、実はこの </li> の終了タグも今の時代は「省略できる」タグでして、ですからエラーではないんです (^^ゞポリポリ

弊ブログで使わせて戴いておりますFC2ブログ共有テンプレートのクリエーターさんの Akiraさんのレスポンシブテンプレート では、リストを表すこのタグの </li> 終了タグは積極的にテンプレートレベルで省略してあるんです。
ですから、このチェッカーを使う度にこのようにエラーとして表示されてしまうので、不快感を感じつつも使っていた時期があったんです (^_^; アハハ…

その後に「もっと使い勝手の良いチェッカーはないものか」と探してみました。

とっくりばーさんの HTML内タグの閉じ忘れをチェックするツール[ブックマークレット] の場合

ある日、 とっくりばー さんの HTML内タグの閉じ忘れをチェックするツール[ブックマークレット] を知り、早速この記事(2008/11/29)のブックマークレットを利用させて戴いたんですが、やはり </li> の終了タグがないよ! と怒られる(笑)ことには変わりはありませんでした。

それに、実はとっくりばーさんご提供のブックマークレットはまだSSL化がされておりませんから、SSL化されたブログページのチェックが出来ないんです (^^;; アセ

検出されたエラーのリストの様子 その2

(~ヘ~;)ウーン こうなったらこのブックマークレットをSSL化も含めて改造させてもらおうかぁ 』 って気持ちになり、早速改造!(改造よりも改訂ですかね~(笑))

ぼっちん風 「HTML終了タグチェッカー」 改訂版の場合

おかげさまでやっとAkiraさんのレスポンシブテンプレートでも </li> の終了タグがないよ!って怒られなくなりました (^。^;)ホッ

このブックマークレットの作者さん とっくりばー さんのJS内コメントによりますと、、、

/*
 * tagcheck.js
 * タグの対応エラーをチェックし、結果ウィンドウに表示する
 * @author tockri
 * 改変、再配布、諸々自由にやってください
 */

このように「改変、再配布」を許可する明示をしてくださっておりますので、筆者の改訂版を弊ブログで再配布させて戴くことに致します。
著作権者の とっくりばー さんに感謝と御礼を申し上げます m(_ _)m

【 HTML終了タグチェッカー 】 改訂版の設置のしかた

ではここからは改訂版の【 HTML終了タグチェッカー 】の設置やそのブックマークレット利用について説明致します。

ブックマークレットを直接利用する方法

とにかく面倒なことはイイから一番簡単な方法でパパっと利用出来るようにしたい(笑)方は下記のブックマークレットを利用して下さい(笑)

ブラウザのChromeを利用でしたら HTML終了タグチェッカー このボタン部分をマウスボタンを押さえたままで、あなたのブラウザの「ブックマーク欄」までス~っと引っ張って行って、ペチョっと貼り付けて下さい(マウスボタンから指を離すだけ(笑)) それでブックマークレットの登録が完了します。

その操作例を下図のGIFアニメーションでご参照下さい ↓ このまんまですから(笑)

[ 画像クリックで GO & STOP ] ブックマークレットをブラウザのブックマークバーに登録する様子
[ 画像クリックで GO & STOP ]

上記ブックマークレットを登録出来ましたか? (^_^)ニコ

但しですね、この方法で簡単登録したブックマークレットは、筆者がもしこのブログ「Webテク倉庫」を辞めて削除してしまったら、皆さんの登録した【 HTML終了タグチェッカー 】も機能しなくなってしまうから、それでは案配が悪いんですよ(爆)

それを避ける為の方法は下記になります。

Jsファイルを自身のブログのスペースに設置する

上記ブックマークレットでは改訂版JavaScript「tagcheck2-kaimin.js」ファイルを動作させて【 HTML終了タグチェッカー 】として機能するようにしている訳でして、このファイルをあなたの利用しているブログスペースにアップロードして使えば、弊「Webテク倉庫」がなくなってしまっても(笑)問題なくなる次第です。

圧縮ファイル

上図フォルダアイコンをクリックすると「tagcheck2-kai2min.zip」という圧縮フォルダがダウンロードされますから、それを解凍すると中に「tagcheck2-kai2min.js」というファイルがありますから、そのJavaScriptファイルをあなたのブログスペース(FC2ブログでしたら管理ページのファイルアップロード)へアップロードして、そのファイルURLをメモ帳にでもコピペしておいて下さい。

アップロードしてそのURLを取得する様子

ブックマークレットの中身のtagcheck2-kai2min.jsファイルURLを差し替える

そしたら、先ほど設置したブックマークレット部分をマウスの「右クリック」して現れるメニューの「編集」をクリックして、上記でコピーしたあなた用のtagcheck2-kai2min.jsファイルURLを下のGIFアニメーションの要領で差し替えて下さい。

ブックマークレットを編集する様子
[ 画像クリックで GO & STOP ]

これによって、もし弊「Webテク倉庫」が消えてしまっても(笑)ずっとあなた用の【 HTML終了タグチェッカー 】は存在し続けると言うことなんです(笑)

ただ、上記GIFアニメーションのようにブックマークレット編集欄でのURL修正って、編集欄そのものが狭いですし編集しにくい場合には、その欄の全てを一旦メモ帳にでもコピペしてから、メモ帳上で編集して、その全てをもう一度ブックマークレット編集欄に戻してあげてもいいでしょう。 もっと他の方法もあるでしょうから、その辺りは皆さん良きに計らって下さい(笑)

【 HTML終了タグチェッカー 】 改訂版の使い方

使い方は至って簡単でして(笑)チェックしたいブログページで、ブックマークレットを単にクリックするだけなんです。

エラーがあると下のGIFアニメーションサンプルのような表示になりますから、そのエラー部分をクリックすると、パッとそのエラー記述箇所に遷移しますから、記事ページのその部分を修正すれば良いんです、簡単ですね~(笑)


開きタグが足りないことが見つかった様子
[ 画像クリックで GO & STOP ]

【 HTML終了タグチェッカー 】改訂版 あなたのブログ執筆のお供にご活用くださいね~ ^^



自身のブログを各種ツールで分析しましょう

スマホで正しく表示されるかテストする
モバイル フレンドリー テスト

スマホ表示速度分析は PSI が強力です
Google PageSpeed Insights

自身のブログのHTMLは最新かチェック
Nu Html Checker


関連する記事
 24

COMMENTS

mochi
2018/02/25 (Sun) 16:07

すごい便利です!!

こんにちは。ぼっちんさん。

 早速ブックマークレットに入れて試してみました。
 HTMLコードで書くようにしたほとんどの記事でタグの閉じ忘れが検出されてました。 ^^;

 そんなこんなで20記事ほど修正しましたが、不具合箇所も分かりやすく表示してくれるので、ちょちょいと修正できました。

 コレすごい便利です。
 ブラウザ上はちゃんと表示されているように見えていたので大丈夫だと思っていたんですが、結構抜けている所って多くあったりするもんですね。

 念の為JSファイルもいただいて自分のブログスペースから起動するようにしました。

 ホントに良いツールを紹介してくださってありがとうございます。
 僕にとっては、ブログ記事作成に欠かせない一品です。( v^-゚)Thanks♪

ぼっちん
ぼっちん
2018/02/25 (Sun) 16:29

To mochiさん

mochiさん、こんにちは~ ^^

> HTMLコードで書くようにしたほとんどの記事でタグの閉じ忘れが検出されてました。 ^^;

おやおや、なんとまぁ (^_^; アハハ…
なんて言ってますけど、実は何を隠そう、私の記事もタグ抜けがドバドバ検出されて笑ってしまいました(爆)
酷いのなんて

<pre><code>
</pre></code>

こんな入れ子で書いちゃってる記事もありまして、これには \(><)/ギョ~~~ッ って焦っちゃいましたよ (^_^; アハハ…

> コレすごい便利です。

良いでしょ~(笑) もう手放せませんってば(笑)

> 念の為JSファイルもいただいて自分のブログスペースから起動するようにしました。

ハーイ(^O^")/ 丁度アクセス解析を覗いたらmochiさんがZIPファイルにアクセスしておられたから分かっておりましたよ~(笑)

> ホントに良いツールを紹介してくださってありがとうございます。
> 僕にとっては、ブログ記事作成に欠かせない一品です。( v^-゚)Thanks♪

そう言って戴けて実に嬉しいです、どうもありがとうございます m(_ _)m
是非是非ご活用くださいね~ うんうん(^-^)

よつば
2018/02/26 (Mon) 09:23

オオーw(*゚o゚*)w すごーい!

ぼっちん先生~♪ ヾ(^∇^)おはよーございまーす♪

流石!ぼっちん先生! 素晴らしいアイテムですね!
早速 使わせて頂きましたところ なんと27個のエラー!ぉお!!(゚ロ゚屮)屮
タグ自体も良く理解しないで使ってるから、当然の結果ですよね~
また勉強しなくちゃ!google先生に学びに行きまーす(^▽^)/
素晴らしいアイテム配布して下さってありがとうございます♡

ぼっちん
ぼっちん
2018/02/26 (Mon) 09:39

To よつばちゃん

よつばちゃん、おはよ~です(笑)

> 早速 使わせて頂きましたところ なんと27個のエラー!ぉお!!(゚ロ゚屮)屮

うん、知ってる知ってる(爆)
こっそり、よつばちゃんの記事のあっちこっちをこれでチェックしちゃってたもん (≧ω≦。)プププ
気になる「表示崩れ」してる記事ページがあったもんだからチェックしたんだけど、そのうちによつばちゃん自身で気がつくと思って伝えてなかったのよ (^^ゞポリポリ

【 HTML終了タグチェッカー 】を操って、不具合部分を修正してね~ ヽ(^^ ) ヨシヨシ

うにトラ
2018/02/26 (Mon) 14:32

こんにちは

私もブックマークしてさっそくやってみました!
まだHTMLタグ使い始めで使ってるタグもごくわずかだからってこともあるのは承知の上ですが、それでも「素晴らしい!」って褒められるってすごく嬉しい(*^^*) 大人になると褒められることなんてそうないですから・・。
毎回この褒め言葉で次なる進化を目指したいと思います。ありがとうございます♪

ぼっちん
ぼっちん
2018/02/26 (Mon) 15:17

To うにトラさん

うにトラさん、こんにちは~ ^^
おっ【 HTML終了タグチェッカー 】手に入れてくれたんですね~ ヽ(^^ ) ヨシヨシ

> それでも「素晴らしい!」って褒められるってすごく嬉しい(*^^*) 大人になると褒められることなんてそうないですから・・。

そうそう(笑) 大人だって褒められたら嬉しいですよ (〃^▽^〃)oあはははっ♪
平昌でメダル取った選手のみなさんだって、素直にあんなに笑顔でしたしね~ (^-^)//""パチパチパチ~♪

【 HTML終了タグチェッカー 】フル活用して、自信持って執筆活動を楽しんで下さ~い♪

二階堂朱哩
2018/08/23 (Thu) 16:41

はじめまして^^

コメントどうもありがとうございました!
最近いろいろ調べまくっていたので足跡ペタペタ踏み荒らしてたかもしれません~(;´・ω・)スイマセン。。。
それなのにこんな重要な記事をスルーしていたという・・・
今ブックマークレットで確認したら5つ出てきました(´;ω;`)
しかも自分でいじる予定ではなかった部分っぽいので、自分で書き込む際に間違って消してしまったり変な場所に突っ込んでしまったのかな。
4つは閉じる位置の問題のようですが1つは閉じてないようなので、どこで閉じれば良いのか原本とにらめっこになりそうです。あぁ・・・
WEBテク倉庫は永遠に続くと信じながらも、帰宅したらjsのほうもいただきに伺います!

ぼっちん
ぼっちん
2018/08/23 (Thu) 17:07

To 二階堂朱哩さん

わざわざのコメントをありがとうございます ^^

> 最近いろいろ調べまくっていたので足跡ペタペタ踏み荒らしてたかもしれません~(;´・ω・)スイマセン。。。

いえいえ、何の何の、そんなこと気になさらないで下さいね~ ヽ(^^ ) ヨシヨシ

> 4つは閉じる位置の問題のようですが1つは閉じてないようなので、どこで閉じれば良いのか原本とにらめっこになりそうです。あぁ・・・

テンプレートではなくて、記事欄で使ったタグの閉じ忘れかと思いますよ~、私からはその詳細までは覗いてはおりませんが (^_^)ニコニコ 

> WEBテク倉庫は永遠に続くと信じながらも、帰宅したらjsのほうもいただきに伺います!

(〃^▽^〃)oあはははっ♪ お時間のある時にでもDLなさって下さいね~(笑)

二階堂朱哩
2018/08/23 (Thu) 22:40

こんばんは^^

家のPC、chromeがなぜか調子悪く今日はやっぱりVivaldiにてアクセス(笑)
ブックマークレットが使えないので応急処置としてエラーチェックの拡張機能を入れたらVivaldiでも動いたので確認していたんですが、記事に明らかにタグ間違いのないページを開いてチェックしてみても、同じ箇所でエラーが発生しています。という事は記事ではなくテンプレート内なのかと思うのですが、考え方が間違っているでしょうか??
テンプレートのHTMLは「拍手」を入れたくらいだったと思うので、その時タグを消してしまったのか・・・
あぁ、振り出しに戻ったほうが良いのかな(´;ω;`)うぅぅぅ

ぼっちん
ぼっちん
2018/08/24 (Fri) 07:49

To 二階堂朱哩さん

おはようございます ^^

えっ? 朱哩さんパソコンもChromeが調子悪いんですか? あららら (^_^; アハハ…
私のはいまなんとかChromeは正常動作しております (^^ゞポリポリ
やっぱり私の場合はChromeがキチンと動いてくれないと、パソコンする意欲も減退しちゃうんですよね~(爆)

あっ なるほどなるほど、いまHTML終了タグチェッカーでチェックしてみましたら、トップページでも記事ページでも同じ閉じタグ抜けが存在しておりますねぇ。
--------------------------
(45行目) <div id="container"> : タグが閉じていません
(581行目) </dd> : <div style="height:200px;scrollbar-face-color:#ffffff;overflow:auto">よりも先に閉じてしまっています
(582行目) </dl> : <div style="height:200px;scrollbar-face-color:#ffffff;overflow:auto">よりも先に閉じてしまっています
(620行目) </div> : <dd class="plg_body" style="text-align:left">よりも後で閉じてしまっています
(undefined行目) </div> : <dl class="sidemenu_body">よりも後で閉じてしまっています
--------------------------
これはテンプレートのHTMLに問題があると言うことです(カスタマイズした時にうっかり消してしまった?)
それとサイドバーにありますプラグインの「月別アーカイブ」にもHTMLタグの欠損が存在しております (^^;; アセアセ
プラグインの場合には利用者が中身のJavaScriptやHTMLを弄ることはあまりないですから、もともと欠損が存在していたんじゃないかと思うんですが、、、。
このプラグインは同種の他のプラグインを探して交換した方が良いと思いますよ (^^ゞポリポリ

いまちょっと時間が取れませんので、後で手が空いた時に詳しくチェックしてここに追記させて戴きます。
ちょっとお時間下さいね~。

そうそう、ご利用のテンプレートって、FC2公式テンプレートの「lilly」ですよね?

----------------
追記です ^^

(~ヘ~;)ウーン どうやらテンプレートを修復するのは断念して、改めて「lilly」をダウンロードし直して利用される方が早い様子ですよ (^^;; アセアセ
もしそうされる場合には、いま利用している「テンプレート名がlillyのまま」だと、改めてのダウンロードは出来ませんから、現在設定中のものを「lilly-1」とか「lilly-old」等にリネームしてからダウンロードするようにしてくださいね。

いまのWebの世界は HTML5+CSS3 のWebデザイン技術を使ったものが主流になって来ている時代なんですけど、お使いのテンプレート「FC2公式テンプレート/lilly」は、残念ながら一世代前の HTML4+CSS2 で作られている古いタイプのテンプレートでして、仮に朱哩さんがネットの何処かのサイトで見つけた「あっ これ、良いわぁ、コピペして使ってみよう」って思ったものがたまたま HTML5+CSS3 を応用しているコンテンツだったら、朱哩さんのブログ記事にコピペしても正常表示されないと言うことが起きるんです (^^;; アセアセ
幾ら頑張っても表示出来ないんです。

そういうこともあり、これを機会に朱哩さんが関心をお持ちの「レスポンシブテンプレート」に乗り換えてみてはどうでしょう?
私のブログをパソコンやスマホからも覗いてくださって気がつかれたと思いますが、パソコンからもスマホからも同じデザインで表示されておりますよね(スマホからの見え方はそれなりに画面幅に応じて自動的にフィットするように変化します)
これがレスポンシブテンプレートの効果(魅力)でして、レスポンシブテンプレート1個あれば「スマートフォン用テンプレートは不要になる」んですから、管理も楽になります ^^

そんな記事を弊ブログのカテゴリの「レスポンシブ」に複数書いてありますからご参照ください。
レスポンシブテンプレートとはどんなものなのかが少しは理解して戴けると思いますよ ^^

二階堂朱哩
2018/08/24 (Fri) 12:49

うわぁ!

わかりやすくありがとうございます!
先日息子にHTMLの仕様があってないんじゃない?と言われていたのは、まさにその事だったのかな・・・でも詳しく説明を求めたら「わかんないけど」と言われて放置しておりました。
テンプレートのlillyは原本もとってありますが、やっぱり変更しようかな・・・。そしてどうせ今から替えるならレスポンシブか!
レスポンシブに関してはテンプレートを作っていらっしゃるAkiraさんの所で拝見しました!それ以来「変えたほうが良いかなぁ」と思っていたんです。これはもうやるしかないですね(笑)
そして次からは変更する度にタグチェックをしよう!
まずはテンプレート探しから・・・
アドバイス本当に助かります!ありがとうございました!!!

ぼっちん
ぼっちん
2018/08/24 (Fri) 13:10

To 二階堂朱哩さん

私のくどくど書いた長文を快くご理解くださったご様子で(^。^;)ホッとしております(笑)

もうね「Akiraさんのレスポンシブテンプレート」はFC2ブログテンプレートでピカイチで私も推奨致しますよ (^_-)-☆パチッ
私はもうかれこれ3年?Akiraさんのテンプレートと出会ってからはその虜になってしまって、もう一途です (^_^; アハハ…

FC2ブログの管理ページにログインしている状態で
https://admin.blog.fc2.com/control.php?mode=design&process=user&author=vanillaice000
にアクセスしますと、Akiraさんだけのテンプレートリストが表示されますから、いろいろと「プレビュー」してみて、好みのものを見つけられると良いでしょう ^^

レスポンシブテンプレートは、使い始めには今までの固定幅テンプレートと様子が違いますから、当初は戸惑うこともあるかもしれませんが、要は「慣れ」ですからね(笑)

> アドバイス本当に助かります!ありがとうございました!!!

いえいえ、お役に立てたんでしたら嬉しいです (^_-)-☆パチッ
これからもブログ運営を存分に楽しんでくださいね~♪

二階堂朱哩
2018/08/25 (Sat) 01:05

連日すいません!

Akiraさんのテンプレートは本当に素敵なものが多いですよね!そして可憐に素敵なものが多くて、さすがに「うまい棒」には似合わない(笑)
そんな中わりとシンプルでカッコイイのを見つけたのでそれに変更してみました!!!
祝レスポンシブ(*´∀`*)
CSSがPC用にしていた部分があったのでちょっと手直しをして、教えていただいた月別のプラグインのdiv閉じ忘れを修正しました!まさかあんな場所にあったとは!あのエラー画面を見てもそこが問題だというのには辿り着きませんでした。難しいなぁ(´;ω;`)
HTMLは前のテンプレートの時は記事内にうまい棒の画像を透かしで入れていたけど、こんなにカッコいいテンプレートだと入れられないなぁ。どこかにしのばせたかったけど、不釣り合いすぎる(笑)
まぁ、タイトルから不釣り合い極まりないですけどね(;´∀`)
次に時間が出来たら記事も更新する予定ですが、こちらのサイトも紹介させて頂きたいと思います!
あ、大事な事忘れてましたが、最初にこちらにお邪魔したのはブログのSSL化の記事でした!よつばさんが教えてくれたのがきっかけです!そしてお陰さまで無事に出来ました♪その時点から大変お世話になりました。重ねてありがとうございます♪♪♪

ぼっちん
ぼっちん
2018/08/25 (Sat) 07:54

To 二階堂朱哩さん

朱哩さん、おはようございます ^^

> 連日すいません!

いえいえ、そんなの全然気にしなくていいんですよ~ (笑)

> そんな中わりとシンプルでカッコイイのを見つけたのでそれに変更してみました!!!
> 祝レスポンシブ(*´∀`*)

おっ Akira先生のレスポンシブテンプレート「Decoy」を選択されたんですね~ 私も以前利用させて戴いたことがあったテンプレートですよ (≧∇≦)ъ ナイス!
いよいよ朱哩さんもレスポンシブテンプレートデビューですねぇ、おめでとうございます (^_^)ニコニコ 

プラグインが不出来なものってけっこう実はあるんです(爆)
そのせいでブログテンプレートの構造が崩れてしまうことも (^_^; アハハ…

> HTMLは前のテンプレートの時は記事内にうまい棒の画像を透かしで入れていたけど、こんなにカッコいいテンプレートだと入れられないなぁ。どこかにしのばせたかったけど、不釣り合いすぎる(笑)

いやぁ、あれ、ユニークで楽しいと思いますよぉ(笑) テンプレートデザインに合わないなんてことはありません(笑)
臆せず自己主張なさってくださいな (^_-)-☆パチッ

> 次に時間が出来たら記事も更新する予定ですが、こちらのサイトも紹介させて頂きたいと思います!

あらぁ、なんと嬉しく、今後も記事を書く励みになるお言葉をありがとうございます (*^.^*)エヘッ
楽しみにさせて戴きますね~♪

> あ、大事な事忘れてましたが、最初にこちらにお邪魔したのはブログのSSL化の記事でした!よつばさんが教えてくれたのがきっかけです!そしてお陰さまで無事に出来ました♪その時点から大変お世話になりました。重ねてありがとうございます♪♪♪

おやまぁ、よつばちゃん繋がりだったんですね(笑)
よつばちゃんもWebテクニックに楽しみながら果敢にチャレンジなさってて素敵でして、そう言えば朱哩さんとイメージがダブって感じられます ^^
そういう努力を楽しみながらなさる方を見かけると、応援したくなっちゃうんですよね~ 私って (^^ゞポリポリ

わざわざのコメントをどうもありがとうございました m(_ _)m
これから仲良くしてくださいね~ ポッ (*^。^*)

-
2018/08/27 (Mon) 01:02

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

ぼっちん
ぼっちん
2018/08/27 (Mon) 07:51

To 鍵コメさん

鍵コメさん、おはようございます ^^

わざわざのお知らせをありがとうございます ^^

> Akiraさんのテンプレートにもある<li>タグを閉じないような感じなのだと思っていました。

ハーイ(^O^")/ 仰る通りで「廃止された閉じタグ」が書かれていないとそのようにエラーをドドドって表示しているんですよね~ (^_^; アハハ…
要は「書かなくてもよくなった閉じタグ」ですから書かなくてもいい(笑)んですけど、裏を返したら「記述を間違えたらとんでもない表示崩れを起こしちゃいますぜ、旦那!」って性質の部分でして、<li>タグの性質とはやっぱり違いますからあえて本チェッカーからは「除外設定」はしてありません(笑)
識者さん達には「ウザイ・目障り!なんとかして!」って思われちゃうのは解ってはいるんですけど、鍵コメさんのようにもっと識者さん(笑)でしたら「ああ、そういう意味なんだろうな」って解ってくださると思いまして (^^ゞポリポリ

私の場合は不要になった閉じタグでも用心の意味でまだ書いちゃいますけどね~(爆)
だって、書いたからと言ってそんなに容量増えないですもん (^_^; アハハ…

-
2018/08/27 (Mon) 10:07

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

ぼっちん
ぼっちん
2018/08/27 (Mon) 11:19

To 鍵コメさん

> そうと分かれば、閉じタグを記述します。
> プラグインは全ページで表示されるので、逆に本当のエラーがあった時に見落としそうなので(笑)

すみませんね~ お手数をお掛け致します m(_ _)m

> ところで、このBulletテンプレートいいですね。
> 私も以前から気になっていました。

いつもそうするんですけど、望むテンプレートをDLしてきて真っ先にHTMLソースやCSSを楽しみに覗く(笑)んですけど、また今回もまた「わおっ! すっげ~♪ さすがAkira先生♪」なんて感嘆しちゃってからプレビューしてみるんですよね(笑)
で、その時に「これだったらこういうのやってみよう!」って感じで大まかな裏構想を練るんです(笑)
それから時間を掛けてコツコツって具合にカスタマイズを進めて (^_^)ニコニコ 

> ただしIE率の壁に加えて、Jqueryプラグインのcolorboxを画像以外の要素にも利用していて手放せないので、部分的に参考にさせてもらっています。

私もしっかりまだjQuery使ってますよ~ とてもAkira先生のようにスパッとjQueryにサヨナラしちゃう技量なんてありませんから (^_^; アハハ…

この「Bullet」DL期限が今月いっぱいですからね~(笑)

mojorum
2019/05/27 (Mon) 02:53

私にも導入できました~

ぼっちんさん いつもお世話になっております(*^^*)。
PC立ち上げて、手順に従ってやってみました!直近の自分の記事を早速チェックしてみたところ
「素晴らしい!とりあえずタグの対応だけは完璧です!」とお褒めの言葉が…えっ、いえ、あの、
覚えたての<p></p> と <br>の二種類しか使っていないのですが、、褒められるとうれしいですね(笑。
今回はたまたまタグの抜けがなかったようですが、文章が長くなったりするとうっかり抜けてしまいそう、
そんな時、こちらのチェッカーの本領が発揮されるのでしょう。頼もしいツールをシェアいただき
ありがとうございます(*^^*)

ぼっちん
ぼっちん
2019/05/27 (Mon) 07:36

To mojorumさん

mojorumさん、おはようございます 熱心にコメントをありがとうございます ^^

【 「素晴らしい!とりあえずタグの対応だけは完璧です!」とお褒めの言葉が…えっ、いえ、あの、 】

(〃^▽^〃)oあはははっ♪ この語句で褒められると、大人でも(笑)嬉しくなっちゃいますよね~(笑)

私なんか記事書いて「公開」してから「あっ 閉じタグチェック忘れてた!」なんて、だいぶ後になってからチェックすることが多くて (^_^; アハハ…
裏を言えば「チョンボなんてしてる筈がない」なんて変な意識で、漫然と執筆してるってことですよね~ (^^ゞポリポリ
私ももっと HTML終了タグチェッカー を活用しなくちゃ(爆)

bon
2020/04/10 (Fri) 19:08

ぼっちんさん

はじめまして。Akiraさんのブログでお世話になっているbonと申します。
Akiraさんのブログで勉強して、最近ブログをHTMLで書き始めました。まだチャレンジしている最中ですが、とても楽しく取り組んでいます。
こちらで配布されているHTMLタグチェッカーを私も使わせて頂きます。ありがとうございます。
タグチェッカーを押すときはドキドキしますが、素晴らしい!とほめてもらえるので嬉しいです。
ぼっちんさんのサイトでも勉強させてもらいます。どうぞ宜しくお願い致します(^^)

ぼっちん
ぼっちん
2020/04/10 (Fri) 20:03

To bonさん

bonさん はじめまして こんばんは~ ^^

は~い、Akiraさんブログでいろいろとコメントなさったりして、勉強されているお姿を拝見しております ^^
しっかり段落も <p>~~~</p> で書いておられて、HTMLソース覗かせて戴いてもとっても綺麗で素晴らしい執筆されておられますよね ^^

弊ブログにも、最近沢山アクセスしてくださってて、ありがとうございます m(_ _)m

> タグチェッカーを押すときはドキドキしますが、素晴らしい!とほめてもらえるので嬉しいです。

(〃^▽^〃)oあはははっ♪ とっても新鮮(笑)で素直なお気持ちですね~ ^^
私もけっこう HTML終了タグチェッカー に助けられることがあって、苦笑いしちゃうんですけど(爆)

> ぼっちんさんのサイトでも勉強させてもらいます。どうぞ宜しくお願い致します(^^)

あっ 記事執筆の励みになるお言葉を、どうもありがとうございます。
私こそ、どうぞ宜しくお願い致します ^^

bon
2020/04/11 (Sat) 17:17

To ぼっちんさん

こんばんは。
はい、Akiraさんを質問攻めにしてしまっておりお恥ずかしいです。

>しっかり段落も <p>~~~</p> で書いておられて、

書き方、これで良いのかな?と不安に思っていますが、ぼっちんさんにお褒めをいただけて嬉しいです。ぼっちんさんはやる気を出させるのがお上手ですね(^^)

>弊ブログにも、最近沢山アクセスしてくださってて、

はい、テク倉庫というタイトルにふさわしく、こんなことができるの?!と驚くような技術が満載で、勉強になるのでいろいろ読ませて頂いておりました。例えばブログ背景に色をつけるのも、ぼっちんさんのブログを見て真似させていただきました。薄いグリーンが目に優しくてとても良いですよね。ご挨拶が遅くなって申し訳ありません(;^_^A
また質問させていただくこともあるかもしれませんが、その際はどうぞよろしくお願い致します。

ぼっちん
ぼっちん
2020/04/11 (Sat) 17:40

To bonさん

bonさん またまたのコメントをありがとうございます ^^

> 書き方、これで良いのかな?と不安に思っていますが、ぼっちんさんにお褒めをいただけて嬉しいです。ぼっちんさんはやる気を出させるのがお上手ですね(^^)

あのですね、FC2ブログで記事を書くのに、改行の扱いを 「HTMLタグのみ」の設定にして、<p>~~~</p> で段落表現出来れば、画像の配置やいろいろな記事表現がグッと楽になるんですよね(笑)
慣れてしまえば、むしろその方が記事を書くのが楽しくなっちゃうんです(笑)
皆さん「なんだか面倒くさそうだから、私はパス~」なんて、トライする前から逃げ腰になっちゃうんですよね (^_^; アハハ…

> 例えばブログ背景に色をつけるのも、ぼっちんさんのブログを見て真似させていただきました。薄いグリーンが目に優しくてとても良いですよね。

最近「ダークモード」流行の為か、背景色が暗色で白文字系を利用するブロガーさんが増えたんですけど、私にとってはその「色の組み合わせ」って、けっして目に優しくはなくて、むしろギラついて見にくいんです、数年前に白内障の手術をしてから、それが更に敏感になりまして (^^ゞポリポリ
私の目では、今のこの配色がとっても楽なんです ^^

> また質問させていただくこともあるかもしれませんが、その際はどうぞよろしくお願い致します。

は~い、解る範囲で(笑)お応えさせて戴きますから、ご遠慮なくどうぞ~ ^^
知らなくて、ググって考えても理解出来ないものでしたら「私じゃ解りません」とスパッとお答えしますから(笑)

便利なアプリ