{
margin-left:1em;
text-indent:-1em;
}
※テキストテキスト
テキストテキストテキスト
ってなる。
こういったテキスト形式をあまり書いたこと無かったので、あれですが。
関心しました。
たぶん自分じゃ思いつかない。
凄く地味だけど、上手いな～って思いました。
margin-left:1em;
text-indent:-1em;
}
※テキストテキスト
テキストテキストテキスト
ってなる。
こういったテキスト形式をあまり書いたこと無かったので、あれですが。
関心しました。
たぶん自分じゃ思いつかない。
凄く地味だけど、上手いな～って思いました。
心地良く動いてくれるアコーディオンライブラリ。
tabAccordion
設置方法等は出揃っているし、オフィシャルを見れば問題なく設置できる。
注意点を何個か
非常にいいライブラリなんだけど、スクリプトを<head></body>に書かなければいけなかったり、プリセットのCSSに#wrapperが設定されてたり（変更可能だけど書き直さなきゃ使えない。。）微妙な点も少しあり。。。
tabAccordion
設置方法等は出揃っているし、オフィシャルを見れば問題なく設置できる。
注意点を何個か
- xml宣言をしているとIE6では動作しない。（コンテンツは見れる）
- ネスケだと動かないどころか、コンテンツが表示されない。
- デザイン段階からIE6で動作しない場合の見た目も視野に入れておく。
- トリガーになる部分がdivで囲んであると、ページを開いてから一度クリックしないとコンテンツが表示されなかった。
- <head>内にスクリプトを記述。
- </body>前にもスクリプトを記述。
非常にいいライブラリなんだけど、スクリプトを<head></body>に書かなければいけなかったり、プリセットのCSSに#wrapperが設定されてたり（変更可能だけど書き直さなきゃ使えない。。）微妙な点も少しあり。。。
wordpressだと、ループ内で呼び出した記事タイトルやコンテンツは、カテゴリーページ内ではそのカテゴリーに属する投稿が呼び出される。
でも、今日作業していてその仕様通りに動いてくれなくてなぜかと思っていたらなんのことはなく、そのループよりソース上で早いところで特定カテゴリーの新着記事を全ページで読み込んでいたからでした。
ループの設定は同一ページ内では最初の設定が後続のものにも適用されてしまうのでカテゴリーの記事が呼び出され無かっただけだった。
テンプレ自体をシンプルに作りたかったので、分岐等で対応するのはやめて、マークアップ的にもページ下部でも論理的に問題は無かったのでモジュールをソース下部で読み込んで、CSSで表示位置を設定した。
備忘録程度に。。。
でも、今日作業していてその仕様通りに動いてくれなくてなぜかと思っていたらなんのことはなく、そのループよりソース上で早いところで特定カテゴリーの新着記事を全ページで読み込んでいたからでした。
ループの設定は同一ページ内では最初の設定が後続のものにも適用されてしまうのでカテゴリーの記事が呼び出され無かっただけだった。
テンプレ自体をシンプルに作りたかったので、分岐等で対応するのはやめて、マークアップ的にもページ下部でも論理的に問題は無かったのでモジュールをソース下部で読み込んで、CSSで表示位置を設定した。
備忘録程度に。。。
SEOとは「サーチエンジン最適化（Search Engine Optimization）」の略で、検索エンジンの検索結果にホームページが上位に表示されるようにキーワードやソースを整える他、被リンク（他サイトからのリンク）を強化する手法をいいます。
目的を持って特定の情報を探しているターゲットユーザーをウェブサイトに誘導、アクションを誘うSEM手法です。
- リスティング広告とオーガニック検索の違い
ヤフー、グーグル、MSNの検索エンジンで調べたい単語を検索したときに色が変わって上位に表示されているものがリスティング広告で、検索キーワードに該当したページの一覧が表示されている「検索結果」部分がオーガニック検索結果となります。
双方良い点はたくさんあるのですが、オーガニック検索の方が70％以上のクリック率があるというデータもでているようです。
- SEO対策手法
私どものSEO対策手法は、お客様からご相談を受けた後にサイトの分析、キーワードのご提案、HTMLソースの改善案、被リンクの状況分析を行った上で対策を行っております。やはり検索件数が多く、単体ワードなどとなると多くの費用がかかってしまいます。
- アクセスアップ後のさらなる将来性
対策後、実際のアクセス数がアップし、多くのサイトからリンクを受けることで対象サイトの「信頼度」もアップします。
ここにでてくる「信頼度」とは、情報を的確にすることで得るユーザー様からの信頼度と、検索エンジンからのサイトへの評価の事を意味しています。
sripemania
バックグラウンド等でよく使われるストライプをオンラインで作成できるサイト。
バックグラウンド等でよく使われるストライプをオンラインで作成できるサイト。
- stripwidthで線の太さ
- spacingwidthで線と線の間隔
- stripeorientationでストライプの方向
- backgroundcolorで背景色
- stripecolor(s)でストライプの色を設定左右で色を変えてgradientをonにするとグラデーションの線でストライプを作れます。
概要
- ソースにはテキストを書くが、ブラウザで出力されるのは画像。
- <h2>heading01</h2>がソースは<h2>heading01</h2>のまま<h2><img src="heading01" /></h2>として出力される
メリット
- ソースは<h2 id="heading01" class="jqir">javascriptでソースを汚さずテキストを画像へ</h2>のようにテキスト情報を入れられる。
- 従来のCSSで背景で実現するものとは違い、印刷時にも問題なく、ブラウザで画像を表示しないようにしていてもテキストが表示される。
- idで画像のファイル名を適応させていくので同一ページ内に同じものを使うとidが重複してしまってvalidにならない。
- jqueryライブラリ・JQIRをダウンロードしてきて、解凍し任意のフォルダに置く。
- htmlのheadに
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery-jqir.js"></script>
のように記述し、jqueryライブラリ・JQIRを読み込む。 - jquery-jqir.jsの最後に$(function(){
$(".jqir_jpg").jQIR("jpg", "img/");
});
のように記述する。
$(".jqir_jpg")は任意のCSSクラス名
.jQIR("jpg", "img/")の
"jpg"は適応させる画像フォーマットPNGに適応させる場合"png"となる。
"img/"は画像までのパスを記述。
例えば、JQIRを同階層のimgというフォルダの中にあるpngにjqir_pngというクラス名で適応させたい場合は
$(function(){
$(".jqir_jpg").jQIR("jpg", "img/");
$(".jqir_png").jQIR("png", "img/");
});
となる。 - html側への記述は
<h2 id="welcometoboplog" class="jqir_jpg">welcome to boplog</h2>
とする。
classを入れることでjqirが適応される。
idで画像を指定するので、上記の場合welocometoboplog.jpgという画像がこのh2に対して置換される。
例えば、helloboplog.pngという画像に置換したい場合は、
<h2 id="helloboplog" class="jqir_jpg">hello boplog</h2>
という形になる。
