LoginSignup
1
1

More than 1 year has passed since last update.

Qiitaとはてなブログの編集機能(SVG、CSS、MathML)比較と、結局はてなブログからQiitaに出戻りした話

Last updated at Posted at 2021-06-28

はじめに

 Qiitaで、図や式をSVG、SVGアニメーション、自作フォント(CSS)、MathMLを直接編集して記事の作成をしたかったが、QiitaはMarkdownとTex数式記法以外の選択肢がない。
 そこで、SVGやCSS、MathMLを直接編集可能な技術ブログを試してみることにした。

技術ブログ選抜

 表1に技術ブログの比較一覧を示す。以下の条件でネットから個人的に気になったものを選抜した。直、個人的感想になるが、「dev.to」は「Qiita」に似ている。
【条件】

  • 技術系ブログ → MarkdownやTex数式記法が使えると技術ブログ系だろう(独断と偏見)
  • Markdownは直接編集可能な場合「〇」
  • Tex数式記法は、数式画像貼り付けは「×」
  • シンタックス・ハイライト(語法高亮)がなるべく使える。
  • SVGの画像貼り付けは「×」
  • 無料
  • 可能な限りHTMLやCSSを直接編集できる  

表1 技術ブログの編集機能比較

技術ブログ HTMLや
CSSを
直接編集
SVG
直接
書込
Markdown
直接
記法
Tex
直接
記法
その他
Qiita × ×
はてなブログ ★★★
note × × × ×
WordPress ★★
Zenn
Medium × × 英語圏
dev.to × 英語圏

 ★★★選抜の結果「はてなブログ」を選択した。

「Qiita」と「はてなブログ」の比較

 実際に利用して分かった「Qiita vs はてなブログ」の「MathML、SVG、自作フォント(CSS)」の編集機能(カスタマイズ)比較を表2に示す。

表2 「Qiita vs はてなブログ」の編集機能比較

  Qiita はてな
ブログ
Markdown記法
数式(Tex記法)
数式(MathML) ×
SVG ×
SVGアニメーション ×
自作フォント(CSS) ×

 「はてなブログ」は私の欲する機能がある事が分かった。実際に作成したはてなブログ
 この「はてなブログ」ならば、私のモヤモヤも解決して楽しい自己表現ライフが送れる!と、喜んでいたが、しばらく利用して重大な問題があることが判明した。

重大な問題(SEO対策)

「はてなブログ」のアクセス数が悲しいぐらいに増加しないのだ。😥
Qiitaに記事を投稿した場合、閲覧者を示す「views」数は少なくとも1日1件増加した。(翌朝見ると嬉しい😀)
一方「はてなブログ」は最大で10日に1件アクセルがある程度だった。
「Qiita」と「はてなブログ」への私の投稿記事の内容はそれほど変わらない。
ネットで理由を調べてみると、「はてなブログ」のSEO対策も高いようだが、QiitaのSEO対策は超強力のようだ。

  Qiita はてな
ブログ
SEO対策

『世間に私の記事にそれほど需要があるとは思ってもいないさ』
『私の記事は備忘録を兼ねたメモさ』
と斜に構えていたが、記事の閲覧数が明らかに低い現実を突きつけられると辛いものがある。
 やっぱり人間何かしらの評価が欲しいのだ。一人は寂しいのさ。「Qiita」に戻ろうかな

「Qiita」に出戻り

 Qiitaの強力なSEO対策は捨てがたい。かと言って、HTMLやCSSを直接編集したい。ウーム。と悩んだ末、選択肢は二つに絞られた。

(1)Qiitaで「MathML、SVG、自作フォント(CSS)」を編集・表現する方法を探す
(2)強力なSEO対策を持ち、かつ「MathML、SVG、自作フォント(CSS)」を編集できる技術ブログを再度探す

 (2)は前途多難なので、(1)を模索したいと思う。結果「CodePen」をQiitaで利用することにした。
 ↓こんなやつです。


See the Pen
by F.M (@kobe2018)
on CodePen.



 「CodePen」の詳細な内容は【ここ】を参照。
 表3に「CodePen + Qiita」と「はてなブログ」の機能比較を示す。

表3 「CodePen + Qiita」と「はてなブログ」のSVG、CSS、MathMLの編集機能比較

  CodePen
+ Qiita
はてな
ブログ
Markdown記法
数式(Tex記法)
数式(MathML) 〇 CodePenで補助
SVG 〇 CodePenで補助
SVGアニメーション 〇 CodePenで補助
自作フォント(CSS) 〇 CodePenで補助

終わりに

 CodePenが縦に狭い。CodePen以外の方法もなにかないだろうか。

1
1
2

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1