豆袋

この広告は30日以上更新がないブログに表示されております。
新規記事の投稿を行うことで、非表示にすることが可能です。

今ふと思いついた。　関係ないけど、一応ここに書いておこう。

ワードプレスの練習とかは、ワードプレス.comを利用してみる。
無料

スティンガーなどを使ってみたいときは
無料のサーバーのエックスドメインを利用してみる。
無料

そしていよいよ満を持して本格的に運営する時になったら
有料のエックスサーバーを借りて、有料の独自ドメインを取得する、
っていう流れが、段階を踏んでいて良さげな気がしてきた。



エックスドメインの無料サーバーはどのくらいのPVに耐えられるか計算してみる
http://dtman.info/post-4339/

WordPressで初めてのブログ作成ならサーバーはロリポップがおすすめ！
http://tamotopi.com/new-wordpress-rentalserver/　　simplicityを使用
巨大ブログのオーナーはXサーバー利用者が多いらしいが、初心者はロリポップで十分だろうか。

サーバー名 　　　　　初期費用 月額費用 転送量(日) MySQL
ロリポップ(ライトプラン) 1,500円 250円〜 5GB　　　　1
ロリポップ(スタンダード) 1,500円 500円〜 10GB　　　30
Xサーバー(X10プラン) 3,000円 1,000円〜 70GB　　　50　将来的には利用したい
ミニバード(プラン変更不可)1,500円 250円〜 150GB(月) 　5


転送量ってのが重要らしい。どれだけのアクセスに耐えられるか、ということ。
ロリポップライトの５GBで、1日当たり6,500PV、月間20万PVまでは耐えられるらしい。
素人ならまずいかないな（笑）

MySQLの数が、ワードプレスのサイトを持てる数。
ロリポライトは１コしか所有できないって事だな。
う〜〜ん・・・
ミニバードは5個持てるようだ。ただ、実際に5個持ったらパンクしちゃうような気もするけど。


サバサバ倶楽部
http://sabasaba-club.com/　keni62使用
サーバーに関する興味深い記事がたくさんある。あとでじっくり読みたい。

レンタルサーバーの転送量の制限を超えてしまったらどうなるか？
2014年9月23日 [よくある疑問]
http://sabasaba-club.com/contents/238/

分かり易い。
GoogleアナリティクスをFC2ブログに5分以内で設置する方法
http://matome.naver.jp/odai/2140867802388971101
ついでに
FC2ブログにGoogleウェブマスターツールを設置する方法
http://matome.naver.jp/odai/2137404850319909101

Googleアナリティクスとは／衣袋教授のGoogleアナリティクス入門講座 コーナーの記事一覧
http://web-tan.forum.impressrd.jp/l/6342


ちょっと古い情報だけれど、この方法は初めて見たような気がする。
Googleアナリティクスで複数のサイトやブログをアクセス解析する方法
2012
http://amaotolog.com/pc-benri/26

複数のサイトにグーグルアナリティクスを設置する場合、アカウントを別に作るべきか、プロパティを別に作るべきかを調べていたら、
なんと、「アカウント」同じ、「プロパティ」も同じ、ビュー（旧プロファイル）の「フィルタ」で区別するようにするっていう技。
便利なのかもしれないが、不都合なケースも出てくるのではないか。
やってみたい気もするが、ちょっと怖い。


これは・・・！
ビュー設定からつかむGoogle Analytics構造
https://www.taga-tame.com/analysis/kaiseki/blog1/index3.html
アドセンスの1アカウントは、アナリティクスの1アカウントとだけ関連付けることができる。もし複数のウェブサイトにアドセンス広告を設置しているのであれば、それぞれのサイトを同一のアナリティクスアカウントに関連付ける必要がある。

ということは、アカウントは一つにすべきなのかもしれないな。
イマイチ、自分が意味分かってないだけなのかもしれないけど。

Google Analyticsのレポート画面説明
https://www.taga-tame.com/analysis/kaiseki/blog1/index2.html

最近のGoogleは進化しているらしいので小手先のSEO対策など無意味なのかも知れないが、h1タグの重要性ｎ関して、ちょっと気になっているので調べてみる。

あとで熟読してカスタマイズの参考にしよう。

titleタグとh1タグは完全同一がいい? 違ってもいい? どう使い分ける? など10+4記事
http://web-tan.forum.impressrd.jp/e/2013/09/06/15972

右クリックできず記事タイトルがコピーできない。
ユーザビリティーが・・・
http://shihouranus.com/wordpress-2/html/h1-title/


h1タグにブログタイトルではなく、記事タイトルをもってきたい。
https://ja.forums.wordpress.org/topic/28107

軽視してはいけない！SEOに効果的なh1タグの4つの使用法
http://viral-community.com/seo/seo-h1-54/

WordPressのタイトル・H1の個別設定編集とSEO
https://www.allegro-inc.com/seo/2898.html
やはり、ブログタイトルについているh1をはく奪してるな・・・


Seesaaブログの記事タイトルをh1に変更する方法
http://www.memorou.com/2014/10/seesaah1.html

シーサーブログの見出しタグ「hタグ」の最適化
http://affiliate150.com/tag-optimization
WordPressでは記事タイトルに「h1」が使われているテンプレートが多い、と書いてあるな。

h1 h2 h3などの見出しタグの重要性と正しい順序
http://www.lykaon-search.com/seo/whole/post-133/

この画像がカッコイイ。
グーグル検索

http://desinx.com/free-stock-photos-3/

http://01.gatag.net/tag/%E7%95%91/

これもかっこいい。ドイツの風景。
http://gahag.net/001472-hamburg-canal/

2015年07月08日
Seesaaブログをレスポンシブ化するために参考になる記事と方法まとめ
http://araccoonathome.seesaa.net/article/421975132.html
ここに、参考文献がいっぱいリンク。
↓
シーサーブログユーザーはスマートフォンでもPCサイトを表示させよう
http://freesoft.0hs.org/4169.html

初心者も分かる！レスポンシブ・デザインの作り方
https://syncer.jp/how-to-create-responsive-web-design


レスポンシブデザインサイトの作り方。たった2つのことを覚えておけば簡単に作れますよ！
http://www.panzee.biz/archives/4059

ウインドウ幅に合わせて画像サイズを変化させる方法
http://allabout.co.jp/gm/gc/400630/

----------------------------------------------------






-------------------------------------------------------------

Seesaaブログで、スマホから見てもPCと同じデザインで表示させるようにするカスタマイズ。

もっとはやく探せば良かった。
ただ、素人にはちょっと難しいな。ぜったいに自分では無理。

こうして、試行錯誤してレスポンシブ化に挑戦し、その方法を紹介してくれる方々にはホント感謝だな〜。

在宅ワークで生計を立てたい
2015年07月08日
Seesaaブログをレスポンシブ化するために参考になる記事と方法まとめ
http://araccoonathome.seesaa.net/article/421975132.html


とある秘密ブログの更新うぇぶろぐ
Seesaa ブログ レスポンシブ計画始動
2014年05月30日
http://www.myweblogblog.net/article/398289658.html

これが超気になる。
スーパー超シンプルSeesaaテンプレート
http://supersimple-template.seesaa.net/
現在はダウンロードできなくなっているようだけど、使ってみたい。

Seesaaブログの複数コンテンツを結合して高速化を図る
2015年09月13日
http://www.myweblogblog.net/article/399456920.html



（旧）URAKOTA BLOG
2015年02月19日
seesaaブログをレスポンシブ化のメモ書き
http://urakota.seesaa.net/article/414332450.html
2015年05月14日
ロリポップ！は重いのかもしれない。ページ読み込み速度とプラグイン｜Seesaaブログから移転するかも(しないかも
http://urakota.seesaa.net/article/418922840.html

簡単な方法と、より細かくカスタマイズできる方法、2通り。

簡単なのは、シンプルにヘッダーの背景にCSSで画像を設定するだけ。
気を付けるのは画像の高さや、乗っかる文字の色、

ヘッダー背景を画像にする
http://10plate.blog44.fc2.com/blog-entry-28.html

#header {
background: #ffffff;
background-image: url(http://〜);
height: 300px;
}

リピートさせるのかどうか。
横幅ピッタリの画像を作って、センターに配置するのが一番いいのかな。
#header {
background-image: url(http://〜);
height: 300px;
background-repeat: no-repeat;
background-position: center;
}




ちょっと難しい方法。大変そうだけど、挑戦してみたいな。

basic_whiteテンプレート ヘッダー全体に背景画像を入れる
http://fc2blogtemplate.com/blog-entry-16.html

div id="head-img"をこしらえて、headerの中に入れる。

CSSでhead-imgのほうを細かくカスタマイズすれば分かり易い。

ウインドウに合わせて画像を表示する方法
#head-img {
background-size: cover !important;
padding: 20px 0 80px 0; min-height: 1px;

興味深いサイト見つけた。
そもそも、アメブロに見えない。
表示も早いし、何かコツみたいなのがあるんだろうか。

後で時間がある時に熟読しよう。

上位表示対策！アメブロでSEO集客する方法とは？
http://ameblo.jp/seoisland/


seesaa(シーサー)ブログ上位表示で実践した事
http://ameblo.jp/seoisland/entry-12059131329.html
■パンくずリストの最適化
初期状態では、トップページに戻るリンクテキストが「TOP」でしたので、トップページのメインキーワードである「染み抜き」の文字を入れ「染み抜き TOP 」に変更した！内部リンクといえどもSEO的に重要だろう
■その他
スマホ版サイト記事上下に目次ページへのリンク
Googleカスタム検索の設置
記事タイトルの上に目次ページのリンクナビを設置
コピーライト表記の追加

ヘッダーナビはどうしても設置したいパーツだ。

一時的に設置方法を覚えても、次のブログを始める時にはいつも方法を忘れている。
物忘れがひどくて最近はホント大変だ。

わざめーばさん
ヘッダーメニュー(グローバルナビ)を設置する方法(V4)
http://ameblo.jp/wazameba/entry-11773998603.html

ワケ分からなくなりがちなz-indexの整理法
http://blog.katty.in/2043

らぼ
ヘッダーメニューをカスタムしてみる。
http://ameblo.jp/tesblo1/theme-10086876375.html

CSSレイアウトを学ぶhttp://ja.learnlayout.com/toc.html

レスポンシブECサイトのレイアウトで使える！position:「absolute」「relative」の違いとは
http://www.aiship.jp/knowhow/archives/18053

CSSでフッターを画面下部に固定する
http://webnonotes.com/css/footer/

position:fixed; コンテンツの固定表示 ◆
http://www.neconote.jp/neconote/dojo/html/css_fixed.html

右下に「TOPに戻る」を表示する時に使えそう
CSS : positionの「absolute」「relative」「fixed」のリファレンス
http://www.css-lecture.com/log/css/037.html

いつかは使いこなさなければならないツールだ。
少しずつでも扱い方を覚えていこう。

Googleアナリティクスの基本の見方
http://www.sukinamonote.com/entries/2015/04/11


2014.08.26Web制作
Googleアナリティクスの用語の意味と基本的な使い方をおさえよう
http://liginc.co.jp/web/seo/107795

2015.05.07 Googleアナリティクス
まるで教科書！初心者のためのGoogleアナリティクスの使い方【絶対保存版】
http://junichi-manga.com/google-analytics-manual/
2015.04.22 Googleアナリティクス
Googleアナリティクスで主な４つの流入元を調べる方法
http://junichi-manga.com/google-analytics-influx-source/
2015.04.23 Googleアナリティクス
Googleアナリティクスで、どのページが何回見られているか知る方法
http://junichi-manga.com/google-analytics-how-many-pages/

初心者のためのGoogle Analytics(ｱﾅﾘﾃｨｸｽ)講座！
http://analytics.gary01.com/

編集

用意する画像のサイズ
16x16
32x32
48x48
だいたい、この3サイズ用意すれば、それほどゆがみも発生しないだろう。

まずは１６の倍数で大きい画像を作成、
今回は192px四方のサイズで元の画像を作成。
それをコピーして、各サイズに縮小。
あとは、それをそれぞれ透過させる。（減色するので注意）
あとは、サイズ違いの各画像を
ファビコン作成サイトで投入。


ファビコンを作成できるサイト

背景が透過したファビコンを作ろうと思って
こっちのサイトで作成してみた
↓
半透過マルチアイコンfavicon.icoを作ろう!　
http://ao-system.net/alphaicon/index.php

・・・結果、うまく表示されない。
真っ黒な感じになってしまった。
使用した画像は、
3種類の大きさの画像で、
背景を透過させたpngの画像。
何がいけなかったのか・・・？
サイトには、
PNG36(PNG24アルファチャンネル付き)画像を使用してください
と書いてあるのだが、その規格の意味がよく分からないし、
自分が使っている画像加工ソフトでは多分指定できないっぽい。

ということで、結局、ダメもとで
その同じ画像を使ってこっちのサイトでつくってみた。
↓
ファビコン favicon.icoを作ろう!
http://ao-system.net/favicon/index.php

htmlに記入する時の厳密な指定はコチラを。
↓

お気に入りアイコン（ファビコン）を指定する
http://www.tagindex.com/html_tag/page/link_favicon.html

例えば、ファビコンで使用する画像がICO形式で作成されている場合は、以下のように記述します。
type="image/vnd.microsoft.icon"

<link rel="shortcut icon" href="favicon.ico" type="image/vnd.microsoft.icon">

結果、一応ちゃんと背景が透過したファビコンをつくることができた。
そもそも、
ファビコンになる以前に輪郭の処理がイマイチだったのだが、
まぁ、実際に表示されているものを見ると
まずまずの出来栄え。
もっと完璧にしたければ、
ペイントソフトで背景を透過させるときに、
「許容値」の設定をもっとシビアにすべきなのかもしれない。
自分は、許容値４０でつくってみたが、
もっと高い数値にすれば良かったのかも知れない。
まぁ、とりあえず、今回はこれで良しとする。


参考文献

シーサーブログにファビコンを設置しよう
http://gazocustomize.blog.fc2.com/blog-entry-23.html

ファビコン用の画像を綺麗に見えるように作る。　たりほん
http://talihon.seesaa.net/article/412279491.html