◆最近のブログのお手入れと参考サイト+CSSスタイルシート | 15分早く帰れる!【オフィス仕事術】

15分早く帰れる!【オフィス仕事術】

仕事悩みに即効のヒント満載。効率よい仕事の進め方は? 机周りの片づけと整理整頓のコツとは? 使える職場の人間関係対処法は? 楽な仕事術で自分の時間が増える増える!

丘村奈央子@15分早く帰れるオフィス仕事術です。→うちの本業はこちら




先週ほぼ初めて、意識的に「この日は更新しない!」という日を作ってみました。緊張するんですよこれが。1日1記事ペースとはいえ、今までコンスタントに更新していたのを止めてしまうのは、何かががっくり来てしまうような気がして。




でも実際は思っていたよりも落ち込みが少なかったので、少し安心しました。




大体朝9時に更新するので、そのときにある程度のアクセスが集中します。でも昼休みに掛けて読まれる山と、夜になってから読まれる山が必ずあって、それは更新してもしなくても来て下さる。挨拶




お気に入りに入れている場合と、検索から来る初訪問の方が更新頻度に関係なく流れてくる時間帯とが重なっているみたいです。でも更新記事タイトルの引きが弱いということでもあるので、まだ課題です。




● やっと目標キーワードに近いモノでヒットしてきた


うちのキラーコンテンツは、正直「ほぼ日手帳」です。ここから来られる方が多い。でもそれに混じって、今までより仕事関連、悩み関連でのキーワードでも引っかかりやすくなりました。記事タイトルに入れているのと、ページ紹介の内容を変えてからかも。




● 少しレイアウトを替えることにした


PCからだと分かるのですが、トップページのメッセージボードとサイドバーを極力シンプルにしてみることに。後々足してみたい内容があるのですが、それがキレイに映えるように本当に基本的な内容だけになっています。


○メッセージボードの点線


トップページの点線は、スタイルシートに以下の記述を加えています。


p.sen {
border-bottom: 2px dotted #999999;
padding-bottom: 1px; /* 内容と線との間隔量 */
}


2ポイントのドットの線を、薄いグレーで、行から1ポイント下に引く、という指示です。同時に以下の内容をメッセージボードのhtmlに書き加えています。


<p class="sen" width="95%">●●</p>



編集画面上では見えないのですが「表示を確認」を選んだり、実際に保存した後の画面では点線が入るのを見ることができます。




○ 写真(img)に枠線を付ける



以下の内容をスタイルシートに書き込んでいます。


.waku{
background-color:#ffffff;
padding:6px;
border: 1px solid #666666;
}


同時に写真をアップした後のhtmlにこれを追記。


<img class="waku"  ……>



これは、『物欲道』というパワーブログをされているあっきさんの説明を参考に加工しました。ここは2000人以上の読者さんがいて、毎日コンスタントに総合ランキング300位や200位台を記録しています。




シンプルでモダンなデザインと、豊富なモノ情報がキレイにレイアウトされていて、内容とともに写真の扱い方なども参考になります。皆さんもこの写真の見せ方の質問をされるようで、詳しい設定方法がこちらに書かれています。





○ サイドバーの左上に囲みを作ってみた



これもスタイルシートと連動させています。


table.ta {
padding:1px;
width: 95%;
border-collapse: collapse;
border: solid 2px #999999;
}

td, th.ta {
padding: 2px 4px 2px;
}



で、htmlには以下の記述。


<center><table class="ta"><tr><td>

(書きたい内容を入れる)

</td></tr></table></center>






誰かの何かを見ると「あ、やってみたいな」と思うことが多くて、できるだけブログで試してみようと思っています。




もっと知りたい?

携帯でコンパクトに知りたい?