攻略！サーチエンジン最適化【SEO対策：ページサイズ】
基本的にページ内容やボリュームが充実している方が望ましいですが、文章だけでは読みづらく、長文になると途中で疲れちゃうこともありますよね。やはり画像などを適度に設けて構成すれば内容が伝わりやすいし華やかにもなります。しかし内容が充実していればどんなに大きなページサイズになっても良いというわけではありません。Googleなどではページ容量に制限があります。詳しくは下記をご覧下さい。 SEOだけでなくアクセシビリティ、ユーザビリティにも関係しますが、敬遠されるホームページに開くのが遅い、いわゆる”重い”サイトが上げられます。インターネット利用者の環境は個々によってさまざまです。ダイアルアップもいればＡＤＳＬ、光通信と回線スピードは極端に違います。訪問者にとって重いサイトはストレスになるばかりか開ききる前に閉じられてしまいます。すばやくダウンロードできる快適なサイズを心がけましょう。 ページを”軽
https://support.microsoft.com/ja-jp/help/306527
すべて Microsoft 製品 Microsoft 365 Office Windows Surface Xbox セール サポート ソフトウェア Windows アプリ OneDrive Outlook Skype OneNote Microsoft Teams PC とデバイス Xbox を購入する アクセサリ VR & 複合現実 エンタメ Xbox Game Pass Ultimate Xbox Live Gold Xbox とゲーム PC ゲーム Windows ゲーム 映画とテレビ番組 法人向け Microsoft Azure Microsoft Dynamics 365 Microsoft 365 Microsoft Industry データ プラットフォーム Power Platform 法人向けを購入する Developer & IT .NET Visual Studio
FC2ブログでmeta description、keywordsを設定してみた
meta descriptionやmeta keywordsはそのページの内容やキーワードを示すためのものですが、特に今まで設定していませんでした。 mataタグの必要性って 昔はスパムに悪用されたため現在SEO上あまり効果的ではないといわれているmetaタグですが、影響がないわけではありません。今回このブログにmetaタグを設定しようと思ったのは、Yahooの検索結果に載っている紹介文がひどかったからです。 コードしか載っていなかったりとても内容が分かるものではなかったのです。そこでmetaタグを設定するとその内容が紹介文に載ると思ったからです。では、今回の設定方法を説明しておきます。 本文をそのままdescriptionにする このブログの場合本文は短く内容のほとんどは追記になっているので<%topentry_body>をそのままdescriptionにしてやろうと思いましたが、これだ
FC2ブログでその記事が属するカテゴリの最新記事一覧を表示
で、このrssフィードを読み取って表示させると完成です。どうやって表示するかというとFC2ブログはもちろんphpは使えないのでGoogle AJAX Feed APIを利用します。実際どうするかというと以下のとおりです。以前紹介した「Google AJAX Feed APIでRSSフィードを表示」と同じですね。 <!--topentry--> <script type="text/javascript" src="http://www.google.com/jsapi?key=取得したAPI キー"></script> <script type="text/javascript"> google.load("feeds", "1"); function initialize() { var feed = new google.feeds.Feed("ブログのアドレス/?xml&catego
ACR WEBさんのアクセスランキングのCSSを指定してみた
お気付きの方も多いと思いますが右側にACR WEBさんのアクセスランキングを設置してみました。今回のパーツは背景や文字の色やサイズなどは変更できるのですが設置してみるとどうもしっくりこない。これに限ったことじゃないけどブログパーツが自分のサイトやブログにうまく溶け込まないことってありますよね。 <SCRIPT TYPE="text/javascript" SRC="http://pranking2.ziyu.net/js/???????.js" charset=shift_jis></SCRIPT> で、考えたのが次の方法です。まず、JavaScriptの周りをdivで囲ってあげます。 <div id="side"> <SCRIPT TYPE="text/javascript" SRC="http://pranking2.ziyu.net/js/???????.js" charset=sh
CSSだけでおしゃれな吹き出しを設置してみる
先日紹介したjavascriptで吹き出しを設置するスクリプト一覧で紹介したものの中で個人的に気に入っているものを実際設置してみました。っていうかCSSだけでいいので「javascriptで吹き出しを設置するスクリプト一覧」ってタイトルおかしいですね。 上の画像をアップしてアドレスを指定してあげると後は簡単です。 <style type="text/css"> a.tt{ position:relative; z-index:24; color:#3CA3FF; font-weight:bold; text-decoration:none; } a.tt span{ display: none; } a.tt:hover{ z-index:25; color: #aaaaff; background:;} a.tt:hover span.tooltip{ display:block; po
標準の日本語フォント / もうパンツはかない
各環境でどんな日本語フォントが使えるのか、まとめてみました。 それぞれのOSで標準添付されていると思われる日本語フォントをCSSの指定で表示させたものをキャプチャーしました。小さい方の字は16ピクセル、大きい方は 150% とCSS上で指定しています。使用ブラウザは主に各環境の標準ブラウザ(MacはSafari、WindowsはEdge)です。 Mac Windows Linux macOS Sonoma (14) ヒラギノ角ゴシック (ウェイト:W0〜W9の10段階) font-family: "HiraginoSans-W0","Hiragino Sans","ヒラギノ角ゴシック"; font-weight: 100; font-family: "Hiragino Sans","ヒラギノ角ゴシック"; font-weight: 400; font-family: "Hiragino S
2007-11-21
アクセスレポートが送信されない不具合を修正いたしました 11/8以降、一部ユーザー様のカウンターを対象に、はてなカウンターのアクセスレポートをお受け取りいただけない不具合が発生しており、こちらの不具合を修正いたしました。一部ユーザー様のデータに問題があり、その影響でメール送信処理が途中で止まっていたことが原因です。バックアップデータよりユーザー様のデータを復旧し、正常にメールが送信されるようになりました。またユーザー情報を復旧したユーザー様につきましては、別途メールにてご連絡させていただいておりますのでご確認いただければと思います。 idea:17804でご指摘をいただいておりました。修正が遅くなり申し訳ございませんでした。 各はてなモジュールにクラス名を追加しました（開発者向け） 本日、それぞれのはてなモジュールに対して、クラス名の指定を追加いたしました。こちらの変更により、CSSでのデ
ＦＣ２ブログでちょっとイヤなタグが挿入されてしまう話～日別集計～David the smart ass～
ユーザフォーラムに FC2ブログで設定しているテンプレートやプラグインをこまなくチャックしたのですが、 記述していないはずのタグがHTMLに表示されます。 下記のようなタグが表示されるのです。 <img src="http://58.4.238.20/counter_img.php?id=数字"> という投稿がありました。 → ユーザフォーラム：「＜img src="http://58.4.238.20/counter_img.php?id=数字"＞は何でしょうか」 実はこれはうちのブログにも出ていることを、この投稿以前から知っていました。といっても、同じ日付ですが、ご親切にもRPMさんが記事の中で、挿入されているブログの事例として紹介してくださっていたからです。 → WebとPCのメモ帳：「FC2ブログが勝手に不正な(Invalid)XHTMLに書き換えてしまった件について」 RPMさん
jkondoに憧れて » 超手抜きでウェブサイトをモバイル対応 2008
◆追記 評判良かったので大幅に加筆訂正してみました。 ちょっと昨日、一昨日と携帯向けサイトを作っていたのですが、最近の携帯電話事情がわからず、どういうタグを使えばいいのかとか、CSSは対応しているのかとか、文字コードの問題はどうするのかとかいろいろわからないところが多かったので、ちょっと自分なりに調べてまとめてみます。 間違いが含まれている可能性が非常に高いです。 突っ込み大歓迎。 前提 キャリア別とか2G用にテンプレートを複数作って対応というのは個人で出来るレベルじゃないので、モバイル向けは１ページごとに１枚のテンプレート追加で作る。 なるべくPC向けのテンプレートを大幅に修正しなければいけないようなものは避ける。 長くなるので最初にまとめ ・文字コードはUTF-8。 ・マークアップ言語はXHTML Basic。 ・画像はJPEGかGIF。 ・CSSはインラインで書く。
はてなブックマーク用にカスタマイズしたCSS - masakanouの日記
はてなブックマークにスタイル適用第1弾完成。 http://b.hatena.ne.jp/masakanou/ 結局、以下のようなCSSになりました。 スタイルシート /* 全体の背景色指定 */ body{ background-color: #ff9; } /* 背景画像を非表示にする 背景色指定 ボーダー指定 */ div.body { margin: 0px 10px 10px 10px; margin-left: 5%; margin-right: 5%; padding: 0px 1em 1em; border-color: #fc6; border-width: 10px; border-style: dashed; font-family: Georgia, 'Times New Roman', serif; background: #ffc none no-repeat
はてなブックマーク - Hamachiya2のブックマーク
そこそこまとめました。 基本的にはそれぞれの創業社長が直前の所属を参照した形。 設立順にしたり合併先やIP譲渡先を書いたりすると より有意義だと思うけど、力尽きたので今はここまで。 〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜〜 電友社 ┃ スクウェア ┣ゲームデザイナーズスタジオ ┣サクノス ┃┣ノーストリリア ┃┗ノーチラス ┃ ┗スタジオ ワイルドローズ ┣ポンスビック ┣K2 ┃┣クロガネ ┃┗エスピーアーツ ┣モノリスソフト ┣ネイヴ ┣フォレストエンターテイメント ┣ブラウニーブラウン ┃┣1UPスタジオ ┃┣福福 ┃┣さよならおやすみ ┃┗ブラウニーズ ┣ミストウォーカー ┃┗KENEI DESIGN ┃ スクウェア・エニックス ┣Luminous Productions ┃┗JP GAMES ┣スクウェア・エニックス モバイルスタジオ ┃┗スタジオセム ┣Tokyo RPG Fact
tech.nitoyon.com@hatena - はてブのCSSをカスタマイズしてみた
hatena毎日使っているのにデフォルトのスタイルのままになっていた「はてなブックマーク」の CSS を変えました。こんな感じです。 b:id:nitoyon「はてブ」の何となく分かりにくい部分を、分かりやすく見せることを目標に作ってみました。以下では、今回のデザインでこだわった「タイトル部分のアイコン」と「コメントのふきだし」について簡単に説明してみたいと思います。 タイトル部分のアイコンまずは、タイトル部分。デフォルトのタイトル部分のアイコンや数字の羅列は意味が分かりにくいですよね。マウスを乗せたらツールチップで説明が表示されるのですが、なんか直感的じゃない。この部分の数字の意味を分からずにはてブを使ってるひとも多いのでは…。 なので、画像を書き換えて分かりやすくしてみました。RSS の青くてかっこ悪いアイコンも、オレンジ色のおしゃれなやつに。いろんな人にお気に入りにいれてほしいので、
FC2ブログのエントリーの日付をおしゃれに表示2
以前「FC2ブログのエントリーの日付をおしゃれに表示」ということで紹介しましたがこのブログのように設置するにはどうしたらよいかという質問をいただいたので具体的に紹介してみます。 <!--topentry--> <div class="date0"> <p class="date1"><%topentry_month></p> <p class="date2"><%topentry_day></p> </div> <h2><a href="<%topentry_link>"><%topentry_title></a></h2> <div class="entryblock"> 次にスタイルシートの内容を記述します。画像についてはこちらのものを使っていますので右クリックで保存し各自のサーバにアップしてお使いください。くれぐれも直リンクしないでくださいね。 .date0{ background-
CSSのfont-family：ヒラギノとＭＳ Ｐゴシックとメイリオの悩ましい関係 : webデザイナーのナナメガキ
CSSでのfont-familyの指定がとても悩ましい。文字コードによって表示が変わったりするし、イレギュラーケースまで想定すると煩雑なコードになってしまう。ちょっと整理しながら考えてみる。 まず、font-familyを何も指定しないと、だいたいのブラウザではデフォルトで設定されているフォントで表示されるのだが、文字コードがUTF-8だとWindowsのIE6で英数文字が「Times New Roman」になってしまう。※文字コードがShift_JISやEUC-JPの場合はデフォルトのフォントで表示される。 それでは例えば総称ファミリー名（generic-family）である「sans-serif」のみ指定してみると、WindowsのIE6では文字コードがShift_JIS・EUC-JPの場合は「Lucida Sans Unicode」で、UFT-8の場合は「Arial」で表示されてしま
ビースティーノカジノ - Beastinoで最高のオンラインカジノゲームをプレイ
ビースティーノカジノ- Beastino Casinoであなたの内なる獣を解き放ちましょう。何千ものトップスロットの中から選び、テーブルゲームで順番を決め、ライブカジノで動物のアクションを楽しむことができます。 カジノを見る ビースティーノカジノ ビーストモードで行こうBeastinoは、最大のゲームコレクションを持つカジノの獣です。アカウントを作成するのに時間はかかりませんし、唯一の問題は、最初に何をプレイするかを決めることでしょう。 Microgaming、NetEnt、Yggdrasil、Pragmatic Play、その他多数のトップクラスのゲームプロバイダーがここにあります。Beastinoでプレイすれば、いつでもジャングルの王様になった気分になれるでしょう。 Beastinoで何千ものゲームをプレイスロットが欲しいなら、私たちにはスロットがあります！正確には3000台です。次の
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
[ホームページ作成] All About｜HP制作の基礎や便利な情報を解説
Obra de Sobra よしなしごと
http://www.nextindex.net/web/CSS/index.html
河久保同行の部屋：バリアフリーサイト：バリアフリーのご案内