472,371 Members | 1,598 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

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

Moving code from external stylesheet to internal

Hi
I have this entry in my stylesheet main1.css:

#head {
width: 310px;
height: 60px;
float: left;
display: block;
background-image: url(logo.jpg);
background-position: left top;
background-repeat: no-repeat;
}

I am trying to move it into the web page code for Search Engine
Optimisation purposes, thus:

<div id="head-logo" style="width:310px; height:115px; float:left;
background-position: left top; display:block;"><img src="logo.jpg"
width="178" height="59" alt="Driving Instructor Insurance - Instructor
Cover"></div>

The logo in the revised version comes out an inch or so to the right
of its previous position. What am I doing wrong?

Stapes

Aug 6 '07 #1
14 3052
On 6 Aug, 14:34, Stapes <steve.sta...@gmail.comwrote:
I have this entry in my stylesheet main1.css:
I am trying to move it into the web page code for Search Engine
Optimisation purposes, thus:
Ridiculously pointless, so stop trying to do that.

Just where did you find this crazy piece of wrong-headed voodoo?

Aug 6 '07 #2
Stapes wrote:
"Beauregard T. Shagnasty" wrote:
>Why? Do you think people search for .. "width:310px" ?

No - I am hoping they might pick up the alt text to the image.
The alt text should be in the HTML <imgelement (where it is), and
isn't part of your style sheet, or inline style. They will find it,
regardless of your styling method.

....
Yes - I have not tampered with the original style sheet. So I have
given my div a different name because I am no longer using the css
file version.
It would be less than desirable to fill all your pages with the same
styles. There is a considerable ease to maintenance if you use one
external style sheet, and less of a burden to people downloading the
pages.
>..so it would be best if you could provide URLs to the two test
cases, instead of relying on possibly incomplete code snippets here.
Other things might be the reason, such as the DOCTYPE in use.

The URL is http://www.instructorcover.co.uk/index.aspx. Compare with
Is this a new site/page? If so, it should use a Strict doctype, as you
aren't Transitioning from anything, such as a legacy page.

http://www.w3.org/QA/2002/04/valid-dtd-list.html

You seem to be on the XHTML bandwagon, though most will recommend using
HTML 4.01 Strict.

You will also want to drop the HTML prolog
(<?xml version="1.0" encoding="iso-8859-1"?>)
as having anything preceding the DOCTYPE will throw IE6 into quirks
mode.
http://www.instructorcover.co.uk/about us.aspx, which uses the CSS
file, but has the same heading.
"about us.aspx" not found. Neither was "about_us.aspx",
"about-us.aspx", "aboutus.aspx" or "about".

--
-bts
-Motorcycles defy gravity; cars just suck
Aug 6 '07 #3
On 6 Aug, 15:55, "Beauregard T. Shagnasty"
<a.nony.m...@example.invalidwrote:
Stapes wrote:
"Beauregard T. Shagnasty" wrote:
Why? Do you think people search for .. "width:310px" ?
No - I am hoping they might pick up the alt text to the image.

The alt text should be in the HTML <imgelement (where it is), and
isn't part of your style sheet, or inline style. They will find it,
regardless of your styling method.
Surely not! - where is the alt text in this:

#head {
width: 310px;
height: 60px;
float: left;
display: block;
background-image: url(logo.jpg);
background-position: left top;
background-repeat: no-repeat;
}

>
...
Yes - I have not tampered with the original style sheet. So I have
given my div a different name because I am no longer using the css
file version.

It would be less than desirable to fill all your pages with the same
styles. There is a considerable ease to maintenance if you use one
external style sheet, and less of a burden to people downloading the
pages.
..so it would be best if you could provide URLs to the two test
cases, instead of relying on possibly incomplete code snippets here.
Other things might be the reason, such as the DOCTYPE in use.
The URL ishttp://www.instructorcover.co.uk/index.aspx. Compare with

Is this a new site/page? If so, it should use a Strict doctype, as you
aren't Transitioning from anything, such as a legacy page.

http://www.w3.org/QA/2002/04/valid-dtd-list.html

You seem to be on the XHTML bandwagon, though most will recommend using
HTML 4.01 Strict.

You will also want to drop the HTML prolog
(<?xml version="1.0" encoding="iso-8859-1"?>)
as having anything preceding the DOCTYPE will throw IE6 into quirks
mode.
http://www.instructorcover.co.uk/aboutus.aspx, which uses the CSS
file, but has the same heading.

"about us.aspx" not found. Neither was "about_us.aspx",
"about-us.aspx", "aboutus.aspx" or "about".
http://www.instructorcover.co.uk/about%20us.aspx
>
--
-bts
-Motorcycles defy gravity; cars just suck

Aug 6 '07 #4
On 6 Aug, 15:51, Andy Dingley <ding...@codesmiths.comwrote:
On 6 Aug, 14:34, Stapes <steve.sta...@gmail.comwrote:
I have this entry in my stylesheet main1.css:
I am trying to move it into the web page code for Search Engine
Optimisation purposes, thus:

Ridiculously pointless, so stop trying to do that.

Just where did you find this crazy piece of wrong-headed voodoo?
Just about everyone but you.

Wrong-headed voodoo saint.
Aug 6 '07 #5
Stapes wrote:
On 6 Aug, 15:55, "Beauregard T. Shagnasty"
<a.nony.m...@example.invalidwrote:
>Stapes wrote:
>>"Beauregard T. Shagnasty" wrote:
Why? Do you think people search for .. "width:310px" ?
No - I am hoping they might pick up the alt text to the image.
The alt text should be in the HTML <imgelement (where it is), and
isn't part of your style sheet, or inline style. They will find it,
regardless of your styling method.

Surely not! - where is the alt text in this:

#head {
width: 310px;
height: 60px;
float: left;
display: block;
background-image: url(logo.jpg);
background-position: left top;
background-repeat: no-repeat;
}
Nowhere, it'd be in the <div id="head"><img src="" alt =""></div>
if you had one.

You misunderstand Beauregard, but he misunderstood you. I think you
misunderstood him through either careless reading or a lack of
experience. I reckon he misunderstood you because you want something so
weird, and your initial explanation didn't make it clear.

You want a logo to be in the markup (instead of being a BG image) so
that you can provide an alt image, in the rather twisted belief that
search engines will see the alt property and drive traffic to your site
and you will become rich beyond your dreams. Or something.

Don't do that. It's perverted. You're messing up (and bulking up) the
markup when the logo is really just decorative. It's not content, so
leave it out of the content (HTML). It belongs in the CSS, so leave it
there.

"Driving Instructor Insurance - Instructor Cover" is terrible (morally
invalid) alt text anyway. I'm blind to the image in question, and this
alt text is wholly inadequate to convey to me what the missing image
represents.

BTW, you can omit the background-position: left top; display:block; in
your first inline attempt (your OP). You've got no background image in
that case, so background-position is meaningless. And the div is
probably display:block by default, so skip that too.

Best of all, though, leave the logo as a BG image in the CSS.
>...
In future, please trim content unnecessary to your response.

--
John
Pondering the value of the UIP: http://blinkynet.net/comp/uip5.html
Aug 6 '07 #6
On 6 Aug, 16:28, John Hosking <J...@DELETE.Hosking.name.INVALID>
wrote:
Stapes wrote:
On 6 Aug, 15:55, "Beauregard T. Shagnasty"
<a.nony.m...@example.invalidwrote:
Stapes wrote:
"Beauregard T. Shagnasty" wrote:
Why? Do you think people search for .. "width:310px" ?
No - I am hoping they might pick up the alt text to the image.
The alt text should be in the HTML <imgelement (where it is), and
isn't part of your style sheet, or inline style. They will find it,
regardless of your styling method.
Surely not! - where is the alt text in this:
#head {
width: 310px;
height: 60px;
float: left;
display: block;
background-image: url(logo.jpg);
background-position: left top;
background-repeat: no-repeat;
}

Nowhere, it'd be in the <div id="head"><img src="" alt =""></div>
if you had one.

You misunderstand Beauregard, but he misunderstood you. I think you
misunderstood him through either careless reading or a lack of
experience. I reckon he misunderstood you because you want something so
weird, and your initial explanation didn't make it clear.

You want a logo to be in the markup (instead of being a BG image) so
that you can provide an alt image, in the rather twisted belief that
search engines will see the alt property and drive traffic to your site
and you will become rich beyond your dreams. Or something.

Don't do that. It's perverted. You're messing up (and bulking up) the
markup when the logo is really just decorative. It's not content, so
leave it out of the content (HTML). It belongs in the CSS, so leave it
there.

"Driving Instructor Insurance - Instructor Cover" is terrible (morally
invalid) alt text anyway. I'm blind to the image in question, and this
alt text is wholly inadequate to convey to me what the missing image
represents.

BTW, you can omit the background-position: left top; display:block; in
your first inline attempt (your OP). You've got no background image in
that case, so background-position is meaningless. And the div is
probably display:block by default, so skip that too.

Best of all, though, leave the logo as a BG image in the CSS.
...

In future, please trim content unnecessary to your response.

--
John
Pondering the value of the UIP:http://blinkynet.net/comp/uip5.html- Hide quoted text -

- Show quoted text -
Well John,
we paid for a report from Neutralize: Independent Internet Marketing
Services, who say this:

The present top header should be seperated so that the logo can be
used as a home page link, this would enable the optimisation of the
page with added alt text; alt tag and link can then be applied.

What exactly do you mean by 'morally invalid'? Is there anything
morally valid about car insurance?

Stapes

Aug 6 '07 #7
Stapes wrote:
"Beauregard T. Shagnasty" wrote:
>Stapes wrote:
>>"Beauregard T. Shagnasty" wrote:
Why? Do you think people search for .. "width:310px" ?
>>No - I am hoping they might pick up the alt text to the image.

The alt text should be in the HTML <imgelement (where it is), and
isn't part of your style sheet, or inline style. They will find it,
regardless of your styling method.

Surely not! - where is the alt text in this:
I was referring to the: alt="Driving Instructor Insurance - Instructor
Cover" in your sample in your first post.
#head {
width: 310px;
height: 60px;
float: left;
display: block;
background-image: url(logo.jpg);
background-position: left top;
background-repeat: no-repeat;
}
You can't place alt text on a *background* image, no matter how you call
it.

Try changing
margin-left: auto;
to
margin-left: 0px;
in
#Heading { ...

Hopefully, you will study the rest of my points.

--
-bts
-Motorcycles defy gravity; cars just suck
Aug 6 '07 #8
Stapes wrote:
On 6 Aug, 15:51, Andy Dingley <ding...@codesmiths.comwrote:
>On 6 Aug, 14:34, Stapes <steve.sta...@gmail.comwrote:
>>I have this entry in my stylesheet main1.css:
I am trying to move it into the web page code for Search Engine
Optimisation purposes, thus:

Ridiculously pointless, so stop trying to do that.

Just where did you find this crazy piece of wrong-headed voodoo?

Just about everyone but you.

Wrong-headed voodoo saint.
I agree with Andy.

As stated (or implied), Google will read the external style sheet for
every page it attempts to index. It does not need to be within the
separate page code itself. (Another SEO scam bites the dust?)

--
-bts
-also a wrong-headed voodoo saint?
Aug 6 '07 #9
There is no such thing as alt text in CSS
.................................................. .................................................
"Stapes" <st**********@gmail.comwrote in message
news:11**********************@o61g2000hsh.googlegr oups.com...
>
Surely not! - where is the alt text in this:

#head {
width: 310px;
height: 60px;
float: left;
display: block;
background-image: url(logo.jpg);
background-position: left top;
background-repeat: no-repeat;
}

>>
...
Yes - I have not tampered with the original style sheet. So I have
given my div a different name because I am no longer using the css
file version.

It would be less than desirable to fill all your pages with the same
styles. There is a considerable ease to maintenance if you use one
external style sheet, and less of a burden to people downloading the
pages.
>..so it would be best if you could provide URLs to the two test
cases, instead of relying on possibly incomplete code snippets here.
Other things might be the reason, such as the DOCTYPE in use.
The URL ishttp://www.instructorcover.co.uk/index.aspx. Compare with

Is this a new site/page? If so, it should use a Strict doctype, as you
aren't Transitioning from anything, such as a legacy page.

http://www.w3.org/QA/2002/04/valid-dtd-list.html

You seem to be on the XHTML bandwagon, though most will recommend using
HTML 4.01 Strict.

You will also want to drop the HTML prolog
(<?xml version="1.0" encoding="iso-8859-1"?>)
as having anything preceding the DOCTYPE will throw IE6 into quirks
mode.
>http://www.instructorcover.co.uk/aboutus.aspx, which uses the CSS
file, but has the same heading.

"about us.aspx" not found. Neither was "about_us.aspx",
"about-us.aspx", "aboutus.aspx" or "about".

http://www.instructorcover.co.uk/about%20us.aspx
>>
--
-bts
-Motorcycles defy gravity; cars just suck

Aug 6 '07 #10
Stapes wrote:
Well John,
we paid for a report from Neutralize: Independent Internet Marketing
Services,
Oh no... hope you didn't pay too much.
who say this:

The present top header should be seperated so that the logo can be
used as a home page link, this would enable the optimisation of the
page with added alt text; alt tag and link can then be applied.
"Seperated" ?

<http://www.neutralize.com/internet_marketing_services/search_engine_optimisation.htm>

Typical buzzword fluff:

"Our full service organic search engine optimisation (SEO) packages
ensure ROI through indexability and maximum visibility within
algorithmic search engines such as Google, MSN & Yahoo! Search."

<gag>

The only true SEO techniques I've run across are offers to rewrite a
site's code and content, using real (hopefully unique) keywords within
the visible content.
What exactly do you mean by 'morally invalid'? Is there anything
morally valid about car insurance?
It costs way too much?

--
-bts
-Motorcycles defy gravity; cars just suck
Aug 6 '07 #11
On 6 Aug, 17:18, "Beauregard T. Shagnasty"
<a.nony.m...@example.invalidwrote:
"Our full service organic search engine optimisation (SEO) packages
Organic? You mean, cheap interns?
"Organic Search Engine Optimisation is People!"

Aug 6 '07 #12
On 7 Aug, 09:33, Stapes <steve.sta...@gmail.comwrote:
Would you say the same regarding the top header here:http://www.hotel-victoria.co.uk/, which uses /Portals/0/Hotel/Flash/
Banner.swf in flash?
Flash is problematic for accessible content, pretty good for eye
candy.

The hotel site you cite is an interesting example. Usually Flash
headers like this are terrible: a hefty download to a trivial thing
that isn't worth it, and often ugly too. This one though is better
done than the usual and is an attractive and valuable addition to the
site.

It's still eye candy though. It's a scrolling wallpaper that no-one
can focus on, no-one can understand and it's just there to look good.
If it did have alt text, the text would be "Opulence. Now believe us".

It's not content. Nor is its _function_ to drive search engines. So
don't worry about in that sense. If you do need content (real content)
about the rooms shown on the banner, then write some content and some
proper <img>s to describe them, and treat that as accessible and
spiderable content.

Aug 7 '07 #13
On 2007-08-07, Stapes wrote:
Would you say the same regarding the top header here:
http://www.hotel-victoria.co.uk/, which uses /Portals/0/Hotel/Flash/
Banner.swf in flash?
The flash is the least of the problems on that page; it's just
distracting. See how the page looks in my browser:
<http://cfaj.freeshell.org/testing/hv.jpg>.

--
Chris F.A. Johnson <http://cfaj.freeshell.org>
================================================== =================
Author:
Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)
Aug 7 '07 #14
Andy Dingley wrote:
On 7 Aug, 09:33, Stapes <steve.sta...@gmail.comwrote:
>Would you say the same regarding the top header here:http://www.hotel-victoria.co.uk/, which uses /Portals/0/Hotel/Flash/
Banner.swf in flash?

Flash is problematic for accessible content, pretty good for eye
candy.
And on dialup for more than a minute all I saw was a pretty white rectangle!

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com
Aug 8 '07 #15

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

Similar topics

11
by: Douglas Reith | last post by:
Hi There, Can someone please tell me why the XML spec states that an attribute value with an external entity is forbidden? Or point me to the appropriate document? Or better still, perhaps you...
3
by: allard poldermans | last post by:
How can I make a reference to an external CSS or JS file that is relative to the XSL stylesheet, and not relative to the XML data? If you simply put : <link rel="stylesheet" type="text/css"...
1
by: Razvan | last post by:
Hi What is the difference between an internal and an external entity ? The first one is defined in the internal subset (not in a separate DTD file, but in the XML file itself - in...
6
by: Christopher Benson-Manica | last post by:
Just FMI, if an external stylesheet is linked to a page (with <link>), will subsequent <style> tags override the values in the external stylesheet? -- Christopher Benson-Manica | I *should*...
2
by: Markus Ernst | last post by:
Hi I build a small content management system. I use different external stylesheets for the admin section and the frontend, called admin.css and frontend.css. Now I would like to preview some...
12
by: relaxedrob | last post by:
Hi All! I have a page with with the following style information: <link rel="stylesheet" type="text/css" href="/eEmployment/eTech.css" /> <style type="text/css"> DIV.Application {...
3
by: al.cpwn | last post by:
do static and inline functions or members have internal linkage? I have been reading this newsgroup on google and found conflicting ideas. Can someone please help me understand why in some places...
14
by: rabbitrun | last post by:
Hi Everyone, I work for a financial company. I am planning to give a presentation to rest of the development team (15 people) here on moving server side logic to client-side javascript for an...
10
by: Stefan Weber | last post by:
Hi, I'm trying to access the JavaScript code contained in a <scripttag via its "text" attribute. This works well, if the code is embedded in the HTML page. However, when the code is in an...
0
by: Naresh1 | last post by:
What is WebLogic Admin Training? WebLogic Admin Training is a specialized program designed to equip individuals with the skills and knowledge required to effectively administer and manage Oracle...
0
hi
by: WisdomUfot | last post by:
It's an interesting question you've got about how Gmail hides the HTTP referrer when a link in an email is clicked. While I don't have the specific technical details, Gmail likely implements measures...
0
Oralloy
by: Oralloy | last post by:
Hello Folks, I am trying to hook up a CPU which I designed using SystemC to I/O pins on an FPGA. My problem (spelled failure) is with the synthesis of my design into a bitstream, not the C++...
0
by: Carina712 | last post by:
Setting background colors for Excel documents can help to improve the visual appeal of the document and make it easier to read and understand. Background colors can be used to highlight important...
0
by: Rahul1995seven | last post by:
Introduction: In the realm of programming languages, Python has emerged as a powerhouse. With its simplicity, versatility, and robustness, Python has gained popularity among beginners and experts...
2
by: Ricardo de Mila | last post by:
Dear people, good afternoon... I have a form in msAccess with lots of controls and a specific routine must be triggered if the mouse_down event happens in any control. Than I need to discover what...
1
by: ezappsrUS | last post by:
Hi, I wonder if someone knows where I am going wrong below. I have a continuous form and two labels where only one would be visible depending on the checkbox being checked or not. Below is the...
0
by: jack2019x | last post by:
hello, Is there code or static lib for hook swapchain present? I wanna hook dxgi swapchain present for dx11 and dx9.
0
DizelArs
by: DizelArs | last post by:
Hi all) Faced with a problem, element.click() event doesn't work in Safari browser. Tried various tricks like emulating touch event through a function: let clickEvent = new Event('click', {...

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.