HTMLとCSSだけで作るFacebookの「いいね！(like)」ボタン : web memo.Ver.2
Facebookを利用するようになって各種サイトにおいてある「いいね！（like）」ボタンを自然に押すようになった。ボタンをおいてないところもlike bookmarkletなんかで押せるから問題ないと言えば問題ないものの、やはりサイトにおいてあった方が目に付くし押しやすいという事実はどうしても感じてしまう。 ところが先日記事ごとに「いいね！」ボタンをおいていたサイトにアクセスしたら、ボタンが消えてしまっていた。話によると「（ページ自体が重いので）軽くするために外してしまった」らしい。確かにいいね！ボタンはiframeかJavaScript（XFBML）を使って表示するしかなく、インラインフレームの読み込み時間も相まって少々重いパーツになってしまっていると思う。 しかしこれで納得してしまっては面白くないので、フレームを使わない簡単なHTMLとCSSだけでブログなどに設置できるいいね！ボタン
SEO TOOLS
NEW! 2020/04/07 「SEO一括見積もり」のサービスを終了致しました。 これまでのご利用、誠にありがとうございました。 2017/10/31 提供サービスの整理に伴い、「おしえて！SEOTOOLS」のサービスを終了致しました。 これまでのご利用、誠にありがとうございました。 2016/06/20 17日より発生しておりましたツールの解析スピードの低下を修正いたしました。ユーザの皆様にはご迷惑をおかけしてしまい、申し訳ございませんでした。 2016年04月 ツールの利便性アップのため、「SEOアクセス解析ツール」と「VERSUS」において、以下の項目を削除しました。 ・Yahoo!関連情報 ・トラフィックランキング ・カテゴリ登録状況 ・PRサービス利用状況 よりシンプルに洗練されたSEOアクセス解析ツールをご活用下さい。 2016/04/21 15日～18日の間で、サービス
HTML5は難しくない? XHTML1.0とHTML5のコーディングの違いを確認してみよう！【初級編：HTML5のマークアップ】 | HTML5でサイトをつくろう
HTML5は難しくない? XHTML1.0とHTML5のコーディングの違いを確認してみよう！【初級編：HTML5のマークアップ】 先日のエントリーでもHTML5で作成されたサイトが増えてきていることから、そろそろHTML5の勉強をそろそろしなければと思っている人も多いと思います。 グーグルの特設サイトなどがトリッキーなことをやっているのでHTML5＝難しいと思っている人もいると思いますが、あのような動的なサイトやAPI関連をいきなりやるのはなかなか大変ですし難しいです。それよりほとんどの人ですぐ必要になるのが通常のページをどうマークアップするかだとおもいます。 構造の考え方が全く変わりましたが、マークアップだけでしたらXHTMLとHTML5はいままでxhtmlでマークアップしていた人にとっては簡単に乗り換えられるとおもいます。 xhtmlではブロックレベル要素とインライン要素という分類に分
JPEG画像をより美しく、より軽量に最適化するテクニック
JPEG画像をより美しく、より軽量に最適化するテクニックをSmashingMagazineから紹介します。 Clever JPEG Optimization Techniques 1. 「8ピクセル」のグリッド 2. カラーの最適化 3. JPEG最適化の一般的なTips 1. 「8ピクセル」のグリッド JPEG画像は、あなたが既に知っているように8x8のピクセルのブロックから成り立っています。画質を低くするとよく分かります。 この8x8ピクセルを利用して、JPEG画像を最適化します。 画質10で作成したサンプル 二つの正方形は同じ大きさ（8x8ピクセル）です。左上のはきれいに見え、右下のは汚く見えると思います。 これらは、それぞれ8x8のグリッドに並べたもので、左上はグリッドに揃えたもの、右下はグリッドに揃っていないものです。 保存する際に画像は、8x8ピクセルのブロックに分けられるため
jQueryでWebサイト内を無限にスクロール出来るようにする
ちょっと語弊があるかもですけど、無限に スクロール出来るように見せる、みたいな 方法です。これが何の役に立つんですか とか言われると困っちゃうんですけど・・・ こういうのがあってもいいかなと思ったの でちょっと作ってみました。実装にはjQuery を使います。 土曜日なのでちょっとネタ的な話題です。 数日前に「スクロールに応じて要素がアニメーションする、視差効果（パララックス）を取り入れたWebデザイン例とTipsいろいろ」っていう記事を書いたんですが、この中に App Galaxy by Googleっていうサイトとunfoldっていうサイトがありまして、ここが無限に縦スクロールできるようになってます。 これを実装しよう、という誰得な話です。 Sample 以下サンプルです。 Sample コード$(function(){ $("body").height($(window).heigh
Movabletypeで携帯サイト作成
Movabletypeで作成したサイトを、Movabletypeの機能を利用して、携帯向けにも公開した。その方法を紹介する。 ※今回はMT3.xを利用した方法。考え方だけ理解できれば、MT4.xにも適用できるはず。 参考）本ブログの携帯版http://www.web2-labo.com/m/ MT4iの致命的な弱点 当初はMT携帯サイト化用の超有名なスクリプト「MT4i」を利用した。 だが、MT4iは、MT最大の利点である「静的htmlファイル生成」を行わないため、携帯からアクセスするとメチャクチャ重くて却下。 MTの機能をフル活用 良く考えてみたら、Movabletypeの機能を上手く使えば、PC/携帯両方向けのhtmlファイルを同時に生成できる。 ※当方法は、画像サイズ変換にPHPを利用するため、ご利用のサーバーがPHPを利用できることが前提。 1)携帯サイト用テンプレートを追加 携帯
サービス終了のお知らせ - NAVER まとめ
サービス終了のお知らせ NAVERまとめは2020年9月30日をもちましてサービス終了いたしました。 約11年間、NAVERまとめをご利用・ご愛顧いただき誠にありがとうございました。
サイトリニューアル時に見直したい、見落とされやすいSEO7つのポイント
『MarkeZine』が主催するマーケティング・イベント『MarkeZine Day』『MarkeZine Academy』『MarkeZine プレミアムセミナー』の 最新情報をはじめ、様々なイベント情報をまとめてご紹介します。 MarkeZine Day
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
