アメブロをカスタマイズするうえで理解しておくべきHTMLの文章構造を理解し、アイデア検討とその実現について検討したいと思います。
少々苦労をしながら、プロフィールページのデザインカスタマイズをすすめています。
その手法が正しい手続きに沿っているとは言いがたいため(参考記事)、ある程度覚悟はしていましたが、いくつかの不思議な状況や想定外の事象に直面しています。
忘備録として、またこれからプロフィールページをカスタマイズされようとする方への情報として書き留めておきたいと思います。
確認している事象
- ulが認識されない
- グローバルナビ設置時に確認。リストタグとしては機能しますが、ulに対してはスタイルの指定ができません。
- CSSの上書きができないケース
- 先行して読み込まれているCSSファイルと同一の手続を取らなければ、スタイルを上書きできないケースを確認。たとえば、
#rightArea #freeSpace #freeArea{}
の設定を#freeSpace #freeArea{}
という呼び出し方で上書きしようとしてもできませんでした。十分に確認がとれているわけではありませんので、一概にそうとも言えないかもしれません。たとえば、!important
キーワードをつけた場合、width
の上書きは同じ手続を取らなくてもできていますが、margin
は何度やってもできませんでした。 - プロフィールの設定画面にもデザインが適用されてしまう
- 私の場合、最上部タブの下にヘッダ画像が重なっていて、その部分が見えなくなってしまいましたので、クイックリンクを利用しての更新となっています。
その他、グローバルナビのリンク色の上書きが通常の指定方法ではできず、現在インライン指定で対処しているなど、時間がある時に調整したい点を残しています。総じて、スタイルの上書きの際に問題が出てますね。
プロフィールページのHTMLの構成
HTMLはブログ側と違い、冗長さがほとんど見られず単純ですので、その構成の理解とデザインの組み込みに時間はかからないと思います。ただその分、ブログ側で用意されている多重に重ねられた冗長なブロック構成を利用してデザインを組み込んでいる場合、同じようなデザイン適用ができないケースが出てくるかも知れません。
閉じタグのエラーが多く見られます。そうした点では、現在のブログHTMLのほうが優秀といえますね。
もし記事が気に入ったら、クリックいただければうれしいです
またのご訪問、お待ちしております