CSS検証実験：賢威テンプレートカスタマイズはなぜ難しい？微調整CSSの真実

賢威テンプレートのCSSを眺めていて愕然としました。なるほど、全ての元凶はCSSの細部に渡るCSSに問題があったという事。この問題とは欠陥的な問題ではなく、賢威テンプレートカスタマイズを行っていく上で障害となっていた部分という意味です。まさか・・こんなごりおしをしていたとは・・驚愕のCSSの内容・・

久しぶりの深い考察で、たぬきちの本領発揮です(笑)
短刀直入でいきます！
(　￣～￣)ノ━*( ゜ロ゜)プス

賢威テンプレートのCSSはごりおしです
ただ、これはあくまでも『賢威カスタマイズ目線のユーザー』からみて・・という意味

もし、これが『賢威テンプレート作成者からの目線』であれば
これ以上ない至高の完成された美しいHTML&CSSのテンプレートといえます

極論からいえば
賢威テンプレートってそのまま、一字一句文字数を変更せず（内容は変える）
サンプル画像とまったく同じサイズの画像を用意して入れ替える事で
『完全なSEO対策済みテンプレート』として生かせます

ちょっと検索すれば、こんな文言にヒットすると思います※今はどうかわかりません

賢威テンプレートはデフォルト状態でHTML構文チェック100点

当時はこの言葉がかなりのキャッチコピーでしたけどね(笑)
まさに、その『100点という数値を出す大変さ』を私は知っています

なぜなら、過去に挑んだから・・1週間という時間をその検証全てに費やして・・

→　HTML構文チェック　結果は忘れた頃にやってくる

検証当時は、これによって

『HTML構文チェックに関する大いなる嘘』にたどり着きましたが・・

今回、その考え方とは違う答えにたどり着きました
賢威テンプレートがなぜ美しいHTMLソースを保てるのか？

賢威テンプレートを利用している人の多くは
間違いなくレイアウト崩れによる苦戦を強いられたことがあるはずです
それも、文字がちょっと多くなったくらいで・・

これは全ての部分ではなくある特定の部位ごとに設定してあるワード限定です

テンプレートはあくまで雛形
自分で利用する時は、自分で準備したキーワードやテキストを入れて利用します。
しかし、その際にちょっとした事でレイアウトが崩れてしまうケースがあります

これは文字数がちょっとオーバーしただけでメニューが折り返してしまった例です
CSSに詳しい人なら、CSSを開いて「じゃ、ここ調整するか」って感じで直せますが・・
雛形のテキストを入れ替えて利用できると思っていた人にしてみれば
パニックを起こしてしまうには十分な理由

なんで？、なんでメニューが二段になった？？
ぁゎゎ ヽ(ﾟ○ﾟ ;ヽ)三(ノ; ﾟ□ﾟ)ノ ぁゎゎ
　
HTMLになれてる人でも『レイアウト崩れ＝<div>の閉じ忘れ』という認識が強いため
<div>を触ってもいないのにレイアウトが崩れる訳がない・・
と頭を悩ませてしまいます

実際、私も賢威テンプレートには相当泣かされてます(-公- ；)

だけど、今回その原因がはっきりとわかりました
まさに賢威テンプレートは職人が作り上げた彫刻といっていいでしょう

そのくらい各エリア事のCSSが微調整されています
それも文字表示一文字レベルで・・

荒削りして、作った作品を仕上げして、仕上げして
さらに研磨剤でピッカピカになるまで磨き上げて
最後にほこりを(ﾉ´з｀)ﾉふぅ～っと吹き飛ばすくらいな仕上げっぷり

それを表しているCSSがこちら

賢威テンプレートのグローバルメニューって『均一の広さじゃない』という事

ほとんどのユーザーはたぶん均一の長さだから、いかにテキストを入れようか
そんな感じで考えていたと思います

つまり、テンプレート全体の幅を決められていたのはいいとして
そのブロックごとの区切りの広さも限定されていたという事

しっかりと計算されていますよね
きっちりかっちりとテンプレート幅に合わせるために整理整頓されてます
だけど・・こんなきっちりかっちりめんどくさい事をしなくても・・

たったこれだけで同じ効果を得られます

また、％にする事で全体の何％という自動割り振りになるので
若干の伸び縮みの幅も得られるので自由度が上がります
CSSの記述って同じ意味の違う言葉ってたくさんありますからね

賢威テンプレートのHTMLソースが美しい・・その理由は
CSS内でごりおしに近いくらいブロックエリアごとに微調整がされている点です
水面を優雅に泳ぐ白鳥（HTML）の海中でのバタ足（CSS）って感じですね(笑)

最初にも結論いいましたが
サンプル画像とまったく同じサイズの画像を用意して入れ替える事で
『完全なSEO対策済みテンプレート』として生かせます

だけど、自分で利用する際に、ちょっとしたカスタマイズするだけで
驚くほど融通の利く賢威テンプレートにも生まれ変わります

賢威テンプレートを生かしたい方向けに現在実践・検証中
次回もしばらく考察は続きますのでお楽しみに(　＾∀＾)

→　賢威購入特典はこちら

ツイート