スキップしてメイン コンテンツに移動
ラベル(サイト)が付いた投稿を表示しています すべて表示

Imgurの一件の画像のアップロードエラーで投稿済みの全ての画像を失った

イメージ

Imgurに画像をアップロードしていたら最初は何事もなく、何枚かスムーズに完了したにも拘わらず、不意に一枚がおかしな状態になり、アップロードがいつまでも完了しなくなった。 タブレットでやっていたけれどもステータスバーに「Uploading to imgur/Imgur upload is working」(Imgurへアップロード/Imgurアップロードの作業中)と出て画像が表示されるので、大丈夫そうでも公開するはずが下に「HIDDEN」(隠す)と出ておかしいと感じた。暫く経つと「Upload error/Tap to retry/CANCEL」(アップロードエラー/タップしてやり直す/中止)と出て止まってしまう。タップしてやり直しても二つのメッセージの状態を繰り返すだけでどうにもならないので、中止するとアップロードエラーが確定してさらに用意した画像も後から「Empty Album」(空っ…

インラインSVGのdefsとgかsymbolとuseによる呼び出しのマークアップ

イメージ

サイトに 画像を描画できるインラインSVG は小さくても乱れず、しかもサイト内にマークアップすればサーバーの呼び出しを行わず、迅速に表示できるからアイコンのデザインなどに良く使われる。 Honeycomb by Clker-Free-Vector-Images / CC0 インラインSVGには同じ画像を繰り返して表示するためのマークアップがある。 一つのsvgタグの内側にdefsタグを入れてそこにid付きのgタグかsymbolタグで描画内容を纏めておく。そして内側か、または外側の場合は他のもう一つのsvgタグにuseタグを入れてhref属性でgタグかsymbolタグのidを指定してリンクのように呼び出す。 目次 インラインSVGの二つの呼び出し方 一つのsvgタグの中で呼び出す場合 定義用と表示用のsvgタグを分ける場合 呼び出しのマークアップの長所と短所 SVGのgタグとsymbolタグの違い インラ…

ボタンなどのposition:fixedのHTML要素をサイトの幅に合わせて表示する方法

イメージ

サイトにヘッダーへの戻るボタンなどをスクロールしても変わらない位置にCSSのposition:fixedで普通に貼り付けると大画面でサイトの幅を越えてしまうので、コンテンツからはみ出さず、サイトの表示領域の範囲内に収める方法を考える。 calc()によるposition:fixedの位置の算出 CSSのposition:fixedはtopかbottomで縦、leftかrightで横の少なくとも二つの値で位置を決める。ただし値の基準がサイトではなくて画面になっているからサイズがサイトよりも大きな画面だとコンテンツの表示領域からはみ出してしまう。 position:fixedの振る舞いについて 要素は文書の通常のフローから除外され、ページレイアウト内に要素のための空間が作成されません。ビューポートによって定められた初期の包含ブロックに対して相対配置されますが、祖先の一つに transform, pe…

アドセンスの個人のアメリカの税務情報/W-8BEN納税フォームの書き方

イメージ

アドセンスに利用者の税務情報が必要となり、2021年6月1日以降、YouTubeのサイト広告などで収益を得る場合には税務情報を提出しないとアドセンスの支払いからアメリカの源泉所得税が米国内国歳入法の第三章により、控除される。 Google は、YouTube パートナー プログラム(YPP)に参加しているクリエイターから税務情報を収集する必要があります。税額控除が適用される場合、YouTube における広告の表示、YouTube Premium、Super Chat、Super Stickers、チャンネル メンバーシップを通じて得た収益のうち、米国の視聴者から得た分につき Google が源泉徴収を行います。 YouTube での収益に関する米国の税務要件| YouTube ヘルプ アメリカのアドセンスを運営するGoogleが準拠する税法の一部がアメリカの居住者から収益を得ている国外の利用者か…

mineoのパケット放題の通信速度の使い心地とデータ通信を節約する便利な使い方

イメージ

スマホのデータ無制限の契約プランが各社から出ていてたぶん基本料金と併せて最も安く使えるのがmineoかも知れない。音声通話とデータ通信のデュアルタイプの1GBとデータ無制限のパケット放題で、2021年4月時点、1298円と385円の1683円(税込み)で使い始めた。最も安く纏めるならばデータ通信のみのシングルタイプの1GBの880円とパケット放題で、1265円(税込み)まで下げることができる。 追記:2021年6月1日から従来のパケット放題と価格は変わらず、通信速度が三倍の最大1.5Mbpsとなるパケット放題Plusの提供が開始された。通信データが非常に多いInstagramなどの画像中心のサイトでもさほど待たされず、閲覧できるから本当に使い易くなった。 目次 パケット放題の使い心地は決して悪くない mineoのパケット放題の通信速度の目安 体感速度としての使い心地の四段階評価 パケットの放題の便利…

Bloggerのフォールバックサブドメインについて

イメージ

Bloggerの管理画面が更新されて「設定」の「公開しています」に新しく追加された項目にフォールバックサブドメインがある。 フォールバックサブドメインとは何か 設定|Blogger カスタムドメインの登録と関連してメインとなるドメインの他に(共通する独自ドメインから)一つだけ同じようにブログのサーバーに接続することができるようにする。 フォールバックサブドメインは通常のサブドメインを読み込む間のサーバーの障害への予防策として追加されるサブドメインです。ドメインに一つ以上の使用できるサブドメインがある場合にはドメインの登録済みのサーバーにサブドメインを設定するとメインとなるドメインはフォールバック――無視できるものの微細な低速度状態の閲覧を得られるようになります。 原文 A Fallback subdomain is a subdomain added as a precursive measure …

Juno Downloadで楽曲を購入する方法

イメージ

Juno Download は音楽データの購入サイトで、イギリスでエレクトロを中心にドラムンベースやソウルやヒップホップやハウスやポップなどを取り扱っている。 日本からでもクレジット/デビットカードやオンライン決済サービスの決済で使えるので、楽曲を購入する方法を纏めておくけど、現状は日本語版がないから些か注意を要する。 Juno Downloadでの楽曲購入の流れ 商品ページ|Juno Download 海外のサイトで日本からの購入では商品価格に当時の為替相場が反映する。料金表示がイギリスの£になっているけれども日本の円に変えることができて画面の最上段の右上の人型のドロップメニューの最下段の「My currency」(私の通貨)を使う。最初は「GBP」(イギリスポンド)だけれども押すと他の通貨を幾つか選択できて「JPY」(日本円)がある。選択するとサイトの商品価格が変更される。 商品を選択する フォー…

Bloggerでアドセンスに複数のブログを関連付ける方法

イメージ

normalize.cssを最新バージョンで使おう

イメージ

Bloggerの 2017年の公式テーマ のContempoとSohoとEmporioとNotableのソースコードの冒頭付近に normalize.css が付いている。 normalize.cssはCSSの標準化を意味していてブラウザ毎のサイトのHTMLのデフォルトのデザインの互換性を保つためのCSSの独自のソースコードなんだ。 normalize.cssはデフォルトのHTML要素のスタイルにクロスブラウザを一貫して良く供給する小さなCSSファイルです。それは従来型のCSSリセットへの現代的でHTML5に対応した代替です。 原文 Normalize.css is a small CSS file that provides better cross-browser consistency in the default styling of HTML elements. It’s a modern, …

Search Consoleのrobots.txtテスターでサイトのrobots.txtをしっかり確認しておく

イメージ

サイトのrobots.txtは検索エンジンがサイト内容を把握する検索ロボットのクローラーをブロックするために主に使われるファイルだ。 robots.txtで除外されたページは検索エンジンに読み込まれないので、検索結果に出ない場合が多い。検索避けとは少し違ってどこかにリンクがあるとURLだけでもクローラーに読み取られて検索結果に出る場合もないわけではないので、完全な検索避けとは混同しないように注意して使わなくてはならない。 一般的にログインページなどの検索結果に出すべきではないURLを対象にして設定される。 しかしサイトの検索エンジンからのアクセスアップのSEO(検索エンジン最適化)対策にも役立つ。 というのは検索エンジンのクローラーはサイトにやって来ていつも全てのページを巡回するわけではないし、ページ毎に一度でコンテンツを隅々まで把握するわけでもないらしくて検索結果に不要なページを予め除外してお…

個人サイトのアドセンスのプライバシーポリシーの基本部分の設置について

イメージ

サイト広告の アドセンス を使う場合には様々な規約違反を防がなくてはならない。ペナルティーから一度でもライセンスを失うと取り戻せなくなるかも知れない。サイトにアドセンスのサイト広告を載せたら利用規約やプログラムポリシーに細心の注意を払って運営するのが大切だ。 アドセンスの様々な規約違反の中にプライバシーの項目が含まれている。サイトに載せたサイト広告での訪問者の個人情報の取り扱いについてプライバシーポリシー/個人情報保護方針を設置する必要がある。 サイトにアドセンスのプライバシーポリシーをどのように設置するかの方法には法律が影響するし、個人サイトと法人サイトで記述は幾らか変わると思う。欠かせないアドセンスのプライバシーポリシーの基本部分は同じにせよ、概して後者は前者よりも商取引での制限が社会的にさらに加えられるだろう。 僕は個人サイトを運営しているので、アドセンスのプライバシーポリシーの基本部分をし…

個人サイトのアナリティクスのプライバシーポリシーの基本部分の設置について

イメージ

Google の無料サービスでアクセス解析の アナリティクス をサイトのホームページやブログに使う場合にはプライバシーポリシーを同時に設置するように利用規約で定められている。 法律が影響するから個人サイトと法人サイトで、プライバシーポリシーの捉え方が幾らか変わる。基本部分は同じで――アナリティクスの 利用規約 のプライバシーに示される以外ではない――記述では前者よりも後者に社会的な制限が強い部分が商取引に関連する法律に応じて付け加えられそうだ。僕は個人サイトをやっているからアナリティクスのプライバシーポリシーの基本部分を覚えてサイト運営に取り入れたい。 目次 アクセス解析の個人情報保護の必要性 アナリティクスの利用規約のプライバシー サイトのプライバシーポリシーの設置 アナリティクス用の一般的な記述例 広告向け機能の追加項目の記述例 EUユーザーの同意ポリシーへの対応 アクセス解析の個人情報保護の必要性 サイトで訪…

Google+のコミュニティーに参加するサイトのアクセスアップのSEO対策の恩恵

イメージ

サイト運営で久方振りに人々との交流を積極的に開始した。以前は 詩のホームページ で掲示板を中心にやって大きく盛り上がったけれども自分自分の作家活動に支障を来すから優先順位を切り替えて訪問者とは受け取るメールやコメントに対応する程度の触れ合いしか求めなくなっていた。振り返ると十年くらいは完全に一人でやっているに等しい状態だった。気持ちは変わらないし、同じ過ちを繰り返さないために人々との交流を第一にサイト運営を行うつもりはないにせよ、もうちょっと触れ合いを増やしたいと思い直したんだ。 Google+ (2019年4月にサービス終了)のコミュニティーのBlogger 初心者の集いに参加した 目下、ブログのアクセスアップに四苦八苦する毎日だし、人々との交流は知名度を上げるためにはそれこそ正しく最も効果的な方法だからブログ運営に取り入れなくては勿体ないのは明らかだ。 以前から積極的に開始するべきだと感じていた…

サイトのファビコンとウェブクリップアイコンの汎用的な設定とBloggerでの導入手順

イメージ

サイトでファビコンやウェブクリップアイコンを設定すると訪問者の利便性が上がるから良いと思う。前者はブラウザのタブでサイト名の先頭に付けられる。後者はスマホ/タブレット向けのショートカットアイコンで、ブラウザのブックマークでサイト名の先頭に付けられたり、ホーム画面に追加するとデバイスに貼り付けられたりする。ファビコンとウェブクリップアイコンの何れの画像もサイトの顔みたいに訪問者へどんなサイトなのかを直感的に示すのに役立つ。 ファビコンの汎用的な設定について サーバーに専用の画像をアップロード サイトのhead内にlinkタグで画像URLを記載 ファビコンのサイズ縦横16~64px程度で、綺麗に表示される画像を専用に作成して使用すると良いと思う。 大きな画像を使用してもブラウザが自動的に縮小して表示するから大丈夫だ。 ファイル形式は pngが小さめの画像の画質には崩れ難くて適している けれどもWindows…

サイトのSEO対策のタイトルの文字数は三十文字前後がオススメなんだ

イメージ

detailsタグでサイトに開閉メニューを作る

イメージ

HTML5 のサイトはdetailsタグで開閉メニュー/アコーディオンを簡単に作れると分かった。バージョン5.1から新たに加わった要素らしくて発表されないまま、かつて jQueryを使って難儀に臨むしかなかった 気持ちが嘘みたいに晴れ上がっている。本当にHTMLのマークアップだけで済んでしまうからサイトの表示速度が遅くなる影響も最大限に抑えられる。 details要素は、ユーザが追加情報やコントロールを得ることができるディスクロージャーウィジェットを表す details要素 via HTML Standard 日本語訳 detailsタグのデフォルトの記載と表示 <details><summary>概略</summary>細目<br>細目<br>細目</details> 概略 細目 細目 細目 最初から開いておく <details …

CSSはどう使えば良いのか|タグ自体とidとclassの指定先とstyleタグとインラインstyleの記述法

イメージ

サイト作成でコンテンツのマークアップを行ったHTMLにデザインを付けるのがCSS(Cascading Style Sheets/カスケーディングスタイルシート)だ。記述がHTMLのようにタグで囲むだけではないからちょっと難しい。 僕は基礎を覚えるのに十年くらいかかった。デザインはテンプレートに任せておいて構わないと見向きもしなかったせいだけど、しかし CSSはレベル3から色んな表現が可能だと気付いて から新しく学び出した。サイト作成が創作活動としてさらに面白くなる。 今再び初心へ帰りながらCSSは実際にどう使えば良いのかを入門として簡単に纏めておきたい。 目次 デザインの設置について CSSの三つの指定先 CSSの二つの記述法 CSSの内容の記述について styleタグでデザインする例 インラインstyleでデザインする例 styleタグならではのデザイン styleタグのCSSの複数の指定先 複数の指定先を細か…