スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
ブログランク - FC2 Blog Rankingブログ村
--.--.-- [--] - --:-- | スポンサー広告

ブログのタイトルを頑張って画像にしたリリィさんへ

ついったーでやけに迷走しちゃってるジャイがいたんだ。
リリィさんがブログのタイトルを何時間も頑張って画像に変えたようだ。
だが、超ドSなピーチが数分で奈落の底に突き落としてやるんだぜ...hehe...
うちのブログのソースをガン見レイプした挙句、lightboxをまるパクリした報いじゃー!(何

まず、リリィさんのブログのヘッダーのソースを見てみます。

突っ込みどころが多すぎて楽しいな(。´艸)クスッ

まずは基本中の基本から。

emoji致命的な問題その1 - なぜリンクタグの中にリンクタグを挿入したし。
問題部分

<a>を<a>~</a>内に書くことは出来ません。
つまり<a><a>~</a></a>という記述はやってはいけない。
それと http://reemabinogi.blog7.fc2.com//
なんでurlの最後にスラッシュ2つあるん?

emoji致命的な問題その2 - 開けたドアは閉めなさいって言われたでしょ!?
タグを開始したら必ず閉じなければなりません。それが何であっても。
・ <a>が2つあるのに閉じタグの</a>が1つしかない。(上に書いたようにそれ以前の問題でもあるけど。)
・ 改行タグも閉じなければならない。閉じ方は<br />
・ 改行タグと同様、<img>も閉じなければならない。閉じ方は<img src="~" />
だけど最近のブラウザさんはお利口さんで、閉じ忘れがあっても閉じたように解釈してくれます。だからと言ってブラウザに甘えてはいけません!きちんと閉じましょう。

emoji致命的な問題その3 - タグに大文字を使う男の人って・・・。
xhtmlのタグは小文字で書かなければならない。
大文字で書いていいのは古き良き時代のhtmlだけです。

emoji致命的な問題その4 - そこに</BODY>がなぜ湧いた。
そのまま言葉の通り。
htmlの基本は<html><body>~ページの内容~</body></html>です。
ページの内容部分に</body>が湧く意味が(ry

emoji致命的な問題その5 - ないようがないよう。
<p></p>
内容が無いタグは意味がありません。ビジュアル的な関係の一テクニックとして空タグを使われることはあるけれども、あまり良いものではない。

emoji致命的な問題その6 - ヘッダーなのにHeadingがねぇぞコラ。
Heading=見出し。レベルは1~6まであります。<h1(~6)>のこと。
h1が一番大きな見出しになるのだが、ページの題名、つまりブログではブログのタイトルにあてられる(ことが多い)。なので<h1>がない状態で<h2>以下を書くことは記述的に間違い。

さて、他にも突っ込みたい部分はまだまだあるが、もう十分リリィさんを精神的に追い詰めたはずだ。何時間もかけて頑張ったのにね。マップの数値まで入力したのにね。泣いてもいいんじゃよ?

そして、じゃーどうすればいいんだよ!って思ってることだろう。
そんなリリィさんに100テラバイトの笑顔で

ググレカス

なんてのはほんの些細な冗談です(。´艸)フフ
なんだか殺意を感じたが気にしないでおこう。

えっとね、タイトルを画像に変えるやり方は色々あるのだけれども、うちのソース見てもわかんなかったみたいだし手順を書いておくよ。うちのとは少し違うけど、まぁ方法はほぼ同じ。解説はしないから知りたいならググレカs(まだ言うか

1.ヘッダー画像の左上からタイトル部分の右下までを切り取った画像を作って自分のブログの画像鯖にうpする。
2.htmlのヘッダーを全部を消す。
3.次に消したヘッダー部分に↓を貼る。

※「タイトル部分を切り取った画像のURL」の部分は画像のURLに書き換える。
4.CSSの↓の部分を消す。

5.CSSの消した部分に↓を貼る。
おわり。

左上からは(´・д・`)ヤダって時は、CSSの#header a imgのmarginとpaddingに上下左右の位置の数値を入れて調節すれば出来るお。と言っても分からないだろうから難しいかも。CSSはブラウザによるバグまで考慮しなきゃいけないし。

うちはHTMLもCSSも全てネットで調べただけで、誰かに直接教えてもらったわけでも本を読んで勉強したわけでもないから偉そうなことは言えないよ。そういった職業は一切したことがないからうちがやってるのはあくまで趣味の範囲。田舎だからそういう会社もないしね・・・。

趣味ながらW3Cの仕様書を読んだり、詳しそうな人が書いてるブログを読んで自分でも試しながらやってるよ。最近は出来てないけど一応現在進行形で。多分仕事だとここまでやってなかったかもしれないねw

とりあえずHTMLを触ったらまず先にやることは、Another HTML-lint gatewayでHTML文書の文法をチェックするよ。
そしてステキな赤点を頂いては泣かされるのであります。

FC2のようなレンタルブログはブログパーツのせいもあったりで点数がマイナスになってしまっても仕方ないけれども、自分で直せる部分はなぜこうしたらいけないのかというのを理解しながら少しずつ直していけば勉強になる。

(X)HTMLは奥が深いね!
CSSは更に奥が深いよ!

まぁ、最初から仕様書どおりに完璧に出来ちゃう人なんていないだろうし、それでメシ食ってる人でもわかってない人はいたりする。FC2の中の人とかw
タグの閉じ忘れなんてよくやっちゃうミスだしね。人間だもの。

ただ、知ってるけどやっちゃううっかりミスと知らなくてやっちゃうミスは違うよ。
自分も最初は間違いだらけで見られたもんじゃねぇーみたいなものだったし、今でも間違って解釈している部分はあるかもだけれど、少しずつ少しずつでいいと思うんだ。

それにしても、ここまで教えてあげちゃうなんてピーチ優しい(

関連リンク
* World Wide Web Consortium - Web Standards
* XHTML2 Working Group Home Page
* W3Cの仕様書等の文書の日本語訳集
* Another HTML-lint gateway
ブログランク - FC2 Blog Rankingブログ村
2009.10.04 [Sun] - 17:32 | 日常 | TB(0) | CO(9) - Open&Close
<< 殴られ名人タイトルHOMEスパムコメントを運営に報告しまくろうぜ! >>

コメント

迷走した終着点はここだった!  --- posted-by, リリィ

>>うちのブログのソースをガン見
ガン見ジャナイヨ!ちら見だよー。ちら見の時間はめっちゃ長いけどね!w
そしてlightboxは、ピーチさんとこでいいなーって思って、まずその「lightbox」という単語がわからなかったから適当な検索かけて実は探したんだw lightboxの存在をやっと見つけて、設置しようとしたらわからず、何度も挫折・・・w

そしてピーチさんとこのソース見ればわかるんじゃない?!って思い、見て、でもわからずw あきらめたり。また調べ出したり、ソース見てってしてたら、lightboxを探し出してから3ヶ月くらいかかって設置したんだw

その時の経験から「やればなんとかなるw」的な勘違いをしているっw

精神的に追い詰めた?
なんのこれしきっ。って別にhtmlのなにを知ってるわけじゃないからさw Mでもないからね!

ていうか思いっきり私信だよねこれw
ありがとー。
丸っとコピーして貼り付けて試してみよう。

Re:  --- posted-by, えのき2

まー時代ですよね
HTML知らなくてもホームページくらいビルダーあれば簡単に
作れちゃうし、ブログにしてもツールそろってるから
「続きを読む」なんてボタン1発で設置できちゃう。
多少凝ったものを作るときもネットに資料やソースたくさんあるから簡単に引っ張れるしねえ
いい時代になったものだ
ぶ厚い教本片手にメモ帳でHTML書いてた頃が懐かしい。

Re:  --- posted-by, ピーチ

★リリィさん
ガン見とかSとか精神的にどうのって話は記事の遊び的なもんだから気にしなくていいよw
この記事書いたのは、タイトルを画像に変えるやり方ってのを書きたかっただけであって、リリィさんに対する私信でもあるのだけれども、他にも迷走しちゃってる人がいるならばヒントにしてくれればいいなーみたいな感覚。

lightboxなんかは自分が便利だな~と思って入れてるからこそ、うちが見てるブログの人が入れてくれると有難いんだよね。画像拡大するのにいちいち別ページ開かなきゃいけなかったり、新しいタブが開いちゃったりするのは面倒だもん。

やってみようとする姿勢はとてもいいことなのだけれども、偶然が重なればブラウザがクラッシュしちゃう可能性があったりもするので出来るだけ正しい文法で書くように心がけてみるといいと思うよ!

★えのさん
メモ帳書きは今でもよくするよw
でもやっぱり閉じ忘れとかスペルミスは出てきちゃうんだよねぇ。

うちの場合ソフト使うと閉じ忘れとスペルミスはなくなるけど、いらないものがくっついたりしてそういうものを消していく作業で逆に時間かかったりで。使いこなせてないだけなのだろうけどw

あ、でもソフトを使ってないわけじゃないよ!
むしろカナリ使ってるw
テスト的に簡単なページ作って試したい時はメモ帳で十分だけどね。

ブログは便利だよね。
勝手に日付つけてくれたりカテゴリーに分けてくれたり記事の検索が出来たり、画像挿入もボタン一つ。記事書いてボタンポチればネット上にアップしてくれるんだもん。HTMLのタグなんて知らなくても自分のサイトが持てちゃうっていう。

ほんと便利な時代になったもんだよね~。
ってうちも不便な時代のネットを知らなかったΣ(゚ロ゚ ;)

管理人のみ閲覧できます  --- posted-by, -

このコメントは管理人のみ閲覧できます

管理人のみ閲覧できます  --- posted-by, -

このコメントは管理人のみ閲覧できます

え゛!?  --- posted-by, Tabriz

今は改行タグも閉じなきゃいけなくなってるんですね~
自分の頭の中にあるのも古き良き時代のhtmlだけのようです。

Re:  --- posted-by, ピーチ

★秘コメさん
本家の存在は知ってはいたけど英語だし・・・。
表示されてるラインを見ればわからなくもないけど、説明は読むのが面倒で時間かかるからリンクしたとこのがうちは使いやすいー。

★タブリズさん
xhtmlはそうなってますねぇ。
でも古き良き時代のレトロなhtmlで仕上がってるサイトは結構好きですよw

Re:  --- posted-by, kino

未だにHTMLもCSSも全く理解できず
人様のテンプレ等々拝借してる私です(○o●;)
もう、無理だろうなぁ・・・
勉強しようと思っても頭に入ってこない><;

Re:  --- posted-by, ピーチ

簡単なところから始めるといいですよ。
文字の色や背景の色を変えてみたりとか。
いっぺんに全部理解しようとすると頭から煙が出てきますw

コメントの投稿

>> 禁止ワード <<
管理者のみ表示

トラックバック

http://castleofpeach.blog57.fc2.com/tb.php/1485-ee488533
この記事にトラックバックする(FC2ブログユーザー)

最近の更新記事

カレンダー

10 | 2017/11 | 12
- - - 1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 - -

過去の記事

全ての記事を表示する

管理人@ピーチ

マビノギ樽鯖8ch在住 : 神出鬼没
ゲームキャラ * 中の人

このサイトについて

ピーチのお城へようこそです。
このサイトは管理人ピーチの自己満足なサイトです。宣伝や荒しなどのコメントやトラックバック、非人道的なコメントや他の閲覧者の気分を害するようなコメントなどは、管理人の自己判断で消すことがあります。ご了承ください。なお、当ブログはフィクションです。それではごゆっくりとどうぞ。

携帯から読む

QRコード

訪問ありがとう

ついったー

FC2Ad

  .

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。