インラインSVGで線や丸や四角や三角や弧を描いて色を塗るマークアップ HTMLのsvgタグを使うとサイトに描画できる。色も塗れるし、線や丸や四角や三角や弧を繋げて簡単なアイコンから非常に複雑な絵まで作成できる。マークアップは座標系の数値を入力して行われる。 SVGはScalable Vect Graphics(スケーラブルベクターグラフィッ...
CSSのpositionのstickyでコンテンツをサイトの一定の範囲内にフローティングする ブログの記事/追加ページの本文の右下に フローティングの戻るボタン を付けた。 当初、方法は分かったけれども画面のスクロールからアドセンスのサイト広告に重なるとポリシー違反の恐れがあるので、用心してやらなかったんだ。 ところが記事/追加ページの本文のところだけとかア...
Bloggerブログで記事のラベルを中心に構造化データのkeywordsとして追加するSEO対策 構造化データにkeywordsを追加してSEO(検索エンジン最適化)対策に効果的かどうかは定かではない。 かつて metaタグのkeywordsにサイト内容と無関係なキーワードを記載したサイトによって検索結果が混乱した という経緯からGoogleなどの主要な検索エンジンは...
BloggerのJSON-LDの構造化データのpublisherをブログ自体に合わせる Bloggerの 2017年の公式テーマ のContempoとSohoとEmporioとNotableは記事毎に JSON-LD の構造化データが付いていてGoogleなどの検索エンジンがサイト内容を通常よりも認識し易くなっている。 ブログのテンプレートのソースコードから...
JavaScriptの画像などの読み込みが遅い場合に使いたいpreloadのソースコード ボタンで複数の画像を切り替える方法 をやってみたら二枚目以降の画像の読み込みが遅くて参った。何とかならないかと調べてみたらHTMLの「rel="preload"」を使うと助かると分かった。ファイル毎のブラウザの先読みを可能にするからJavaScriptで後か...
JavaScriptの繰り返しボタン:押した回数を数えて実行結果を元に戻すプログラム サイトのボタンはHTMLのinputやbuttonとJavaScriptのonclickを組み合わせて実装できる。後者のプログラムが前者を押して発動するようになる。JavaScriptのonclickはイベントハンドラと呼ばれてHTMLのinputやbuttonの開始タグに他の...
JavaScriptでHTMLを書き換えるinnerHTML HTMLのマークアップをJavaScriptのプログラミングで書き換える、またはサイトのソースコードを置き換えるには innerHTML が良く使われる。 Element.innerHTML プロパティは、要素の子孫を記述する HTML 構文を設定または取得します。 ...
Bloggerブログで投稿の日付からアーカイブページへ記事タイトルから記事ページへリンクする方法 僕がBloggerのテンプレートで最も不可解だと感じるのは記事の日付に記事ページへのリンクが付いている。およそ日付にリンクを付けるならば年別や月別などのアーカイブページへ向けなくてはピンと来ないだろう。 日付のリンクは目立たないし、殆ど誰も使わないようだから放っておいたけ...
JavaScriptで日付や時刻を取得して曜日を数値から文字列へと変換する方法 Dateクラスのコンストラクタ関数を使うとDateインスタンスを素早く生成できる。 An Owl on a tree branch by Lepale [ CC0 ], via Pixabay 四つの構文と使用可能なオブジェクト Dateオブジェクトは UTC ...
Bloggerの時刻のフォーマット/投稿の年月日と曜日の並び替えのカスタマイズ Bloggerの投稿の日付の時刻のフォーマットはデフォルトで七種類が用意されているけれどもHTML編集のカスタマイズで年月日と曜日を並び替えて他のスタイルでも表示できる。 Powdery snowfield by cocoparisienne [ CC0 ], via Pix...