473,395 Members | 1,797 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,395 software developers and data experts.

Styling title element

Although http://www.w3.org/Style/LieBos2e/enter/ say "The title of a
document does not show up on the canvas, so it is not affected by CSS
styles", there is a note by Seamus P. H. Leahy on styling the title
element in CSSPlay
http://moronicbajebus.com/wordpress/...title-display/
When I tried this to add a background image, the Jigsaw validator
http://jigsaw.w3.org/css-validator/validator-upload didn't complain.

The CSS I used was-
head, title{ display: block; }
title{ height: 0; padding-top: 240px; overflow: hidden;
background-image: url(images/test.jpg); background-repeat: no-repeat; }

While I didn't find much about this by Googling, images and background
colours worked in the first three browsers I tried (Firefox, Opera,
Safari).

Is there any reason not to use this?

--
http://www.ericlindsay.com
Dec 15 '06 #1
4 19593
Eric Lindsay <NO*************@ericlindsay.comwrote:
>Although http://www.w3.org/Style/LieBos2e/enter/ say "The title of a
document does not show up on the canvas, so it is not affected by CSS
styles", there is a note by Seamus P. H. Leahy on styling the title
element in CSSPlay
http://moronicbajebus.com/wordpress/...title-display/
When I tried this to add a background image, the Jigsaw validator
http://jigsaw.w3.org/css-validator/validator-upload didn't complain.

The CSS I used was-
head, title{ display: block; }
title{ height: 0; padding-top: 240px; overflow: hidden;
background-image: url(images/test.jpg); background-repeat: no-repeat; }

While I didn't find much about this by Googling, images and background
colours worked in the first three browsers I tried (Firefox, Opera,
Safari).

Is there any reason not to use this?
It can cause User Agents to render the same content twice. It may
prevent a speaking UA's ability to be configured to speak the title or
not. IIRC the specs specify that title content must not be rendered in
the viewport.

CSS allows people to do many things that shouldn't be attempted. A CSS
checker will at best only check the code syntax, it can at best only
guess and warn about whether something is good authoring practice.

The question however is: why on earth would you want to do this?

--
Spartanicus
Dec 15 '06 #2
In article <qo********************************@4ax.com>,
Spartanicus <in*****@invalid.invalidwrote:
Eric Lindsay <NO*************@ericlindsay.comwrote:
Although http://www.w3.org/Style/LieBos2e/enter/ say "The title of a
document does not show up on the canvas, so it is not affected by CSS
styles", there is a note by Seamus P. H. Leahy on styling the title
element in CSSPlay
http://moronicbajebus.com/wordpress/...title-display/
When I tried this to add a background image, the Jigsaw validator
http://jigsaw.w3.org/css-validator/validator-upload didn't complain.

The CSS I used was-
head, title{ display: block; }
title{ height: 0; padding-top: 240px; overflow: hidden;
background-image: url(images/test.jpg); background-repeat: no-repeat; }

While I didn't find much about this by Googling, images and background
colours worked in the first three browsers I tried (Firefox, Opera,
Safari).

Is there any reason not to use this?

It can cause User Agents to render the same content twice. It may
prevent a speaking UA's ability to be configured to speak the title or
not. IIRC the specs specify that title content must not be rendered in
the viewport.

CSS allows people to do many things that shouldn't be attempted. A CSS
checker will at best only check the code syntax, it can at best only
guess and warn about whether something is good authoring practice.

The question however is: why on earth would you want to do this?
The title element seemed to me to be a perfect place to put an otherwise
irrelevant graphic element that was indicative of the type of web site,
rather than the specific content of any page.

The text in the title element still appears as usual in the browsers, so
I would hope most speaking UA would still cope with it.

My architect neighbour thought he should have a web site. After I
gathered some text material for SEO, he sent a list of web sites he
really liked (all of which were invalid, had a splash page with no text
content, and needed Javascript for navigation). They don't appear in the
first hundred or so search results for their areas. However they were
very pretty indeed.

It just seemed to me that a background graphic in the title element was
the perfect place for something pretty that had nothing to do with the
actual page contents. I am looking at using several background graphics
on the site. I imagine I could get the same visual effect in several
other ways, so if it turns out to be a really bad idea I will look
elsewhere.

I am not at all used to doing pages with anything except text, so I am
sort of scratching about with which way to approach a site that has to
look fancy as well as getting into the top two or three search engine
positions.

--
http://www.ericlindsay.com
Dec 15 '06 #3
Eric Lindsay <NO*************@ericlindsay.comwrote:
>The question however is: why on earth would you want to do this?

The title element seemed to me to be a perfect place to put an otherwise
irrelevant graphic element that was indicative of the type of web site,
rather than the specific content of any page.
Why do you think that specifying a background image on the title element
would be any different than using a background image on a body element?
>My architect neighbour thought he should have a web site. After I
gathered some text material for SEO, he sent a list of web sites he
really liked (all of which were invalid, had a splash page with no text
content, and needed Javascript for navigation). They don't appear in the
first hundred or so search results for their areas. However they were
very pretty indeed.

It just seemed to me that a background graphic in the title element was
the perfect place for something pretty that had nothing to do with the
actual page contents. I am looking at using several background graphics
on the site. I imagine I could get the same visual effect in several
other ways, so if it turns out to be a really bad idea I will look
elsewhere.
Its a really daft idea and the above is no justification. You should
also consider that IE doesn't support this. For page authoring SEO is
almost always synonymous with nasty spamming tricks that degrade the
quality of the content considerably.
>I am not at all used to doing pages with anything except text, so I am
sort of scratching about with which way to approach a site that has to
look fancy as well as getting into the top two or three search engine
positions.
Create good quality content, mark it up properly, style it so that it
looks good, forget about SEO completely. When you are finished making
the site, get good quality inbound links to the site, that will do much
more for SE ranking than any "SEO".

--
Spartanicus
Dec 15 '06 #4
In article <cp********************************@4ax.com>,
Spartanicus <in*****@invalid.invalidwrote:
Eric Lindsay <NO*************@ericlindsay.comwrote:
Why do you think that specifying a background image on the title element
would be any different than using a background image on a body element?
Once the head element was included in the display, I didn't think the
title element would be treated any different to a background image on
any other body element. But if that was the case, then I didn't see any
particular reason not to use it.
>
Its a really daft idea and the above is no justification. You should
also consider that IE doesn't support this. For page authoring SEO is
almost always synonymous with nasty spamming tricks that degrade the
quality of the content considerably.
IE doesn't support allowing head to display? I guess that is a good
enough reason not to.

I am resisting anything that approaches SEO spamming tricks. One problem
is the architects are very visually oriented, and basically want the
text left out (or not visible). I have been deliberately not styling the
pages until I get enough content from them, because I know they are
going to be much more interested in the appearance than the content.
I am not at all used to doing pages with anything except text, so I am
sort of scratching about with which way to approach a site that has to
look fancy as well as getting into the top two or three search engine
positions.

Create good quality content, mark it up properly, style it so that it
looks good, forget about SEO completely. When you are finished making
the site, get good quality inbound links to the site, that will do much
more for SE ranking than any "SEO".
Good advice. I won't have much problem getting the search engine
position I want, as long as I keep picking on the architect folks for
more and more material I can use. At least, as long as I can keep them
from wanting to imitate sites with no content. The good inbound links
will initially be more of a problem, as usual, although I'll get a few
early ones.

Thanks for the usual helpful comments. When I stop experimenting and
start styling, I'll probably ask for help again.

--
http://www.ericlindsay.com
Dec 15 '06 #5

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

3
by: D. Alvarado | last post by:
Hello, I am trying to find the <TITLE> element of my document. Normally alert(document.title); works just fine, but when this statement is within a page that is a frame in a larger document,...
5
by: Dawn Ojanpera | last post by:
Hello, Call me crazy but I can't figure out why my TITLE text will not display in the title bar of my browser window. Here are the contents of my html file: <HTML> <HEAD> <TITLE>My first...
50
by: MozillaCensorsMe | last post by:
Hello, While I haven't finished my wonderful tutorial to save the world, I do have a simple question. What's the difference between h1 and the title tag? For me it seems as though both can...
4
by: DU | last post by:
I am looking for opinions on the issue of length of title attribute. First of all, the current HTML 4.01 spec is rather vague on this issue... at least, it isn't explicit nor normative. The HTML...
3
by: Andy Dingley | last post by:
We've all seen this structure many times: <ul> <li><a href="..." >Click here</a></li> <li><a href="..." >Click here</a></li> </ul> Now it's obvious good practice to have sensible link texts,...
4
by: laredotornado | last post by:
Hello, How do I use Javasript to get the <TITLE> element of a web page? If anyone can supply a cross browser way (IE 5.5+, Firefox 1+), it is most appreciated. Dave
3
by: musosdev | last post by:
Hi guys I'm using a MasterPage for my website rebuild (vs2005, .net2, c#). I want to be able to control the Title element, both on the MasterPage and the Content pages. For example, on each...
3
by: Ed Jay | last post by:
I have a text-type form input element that I'd like to style as follows: Before the visitor enters text, I'd like the value that is shown in the text field to be gray, and when the visitor enters...
15
by: Steve B | last post by:
Is there a way to manipulate the <TITLEin the csharp code?
0
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
0
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.