22 replies [Last post]
ScottM2
Offline
Regular
NW Arkansas
Last seen: 15 years 2 days ago
NW Arkansas
Timezone: GMT-1
Joined: 2004-11-18
Posts: 13
Points: 0

Okay... I've got three questions about the following site. Oh, and there is a large flash file that I haven't created a loader for yet so just be patient. It won't take long to show up. I've included the style sheet info at the bottom.

http://www.doxa.biz/capstonetest/index.htm

One – I would like to have the small right flash animation up in the top border.

Two – The large flash file is "float left". Is there a way to have it centered if the user opens their browser a little instead of being static?

Three – When a user closes their browser window or it is narrower than the site, the navigation drops below the large flash file on the left. Is it possible to make it float over the flash file?

Sorry for the dumb questions... still trying to get a grip on the whole CSS thing.

Thank you for your time.
Scott

#rightColumn {
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 10px;
font-weight: normal;
color: #999999;
line-height: 30px;
width: 164px;
float: right;
}

#leftColumn {
margin-left: 10px;
float: left; }

#header {
background-color: #bbc9d6;
height: 100px;
background-image: url(logo.jpg);
background-repeat: no-repeat;
background-position: center center;
margin-bottom: 10px; }

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 1 year 13 weeks ago
Timezone: GMT+1
Joined: 2004-06-30
Posts: 9668
Points: 801

Placement issues

A friendly word of advice.

You REALLY shouldn't be using an entire flash-based site. Not only is it inaccessible to text based browsers, it also requires people to download the flash player, which is annoying.

Also, if you view the page with no styling, your main content shrinks to a tiny size.

From a HCI interface, it's alittle bit silly - I had no idea I was supposed to hover over the shapes.

I would seriously think about changing the site to a text/html layout, and styling it with CSS. You could always use an image map to create that flash interface.

Verschwindende wrote:
  • CSS doesn't make pies

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 6 hours 33 min ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9743
Points: 3822

Placement issues

Oh. Is something in the flash? I have mine turned off. Smile I was trying to use what looks like it should be a menu.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

ScottM2
Offline
Regular
NW Arkansas
Last seen: 15 years 2 days ago
NW Arkansas
Timezone: GMT-1
Joined: 2004-11-18
Posts: 13
Points: 0

Placement issues

Well, the whole Flash issue is due to fonts. I have to use certain fonts on the site that wouldn't be possible with CSS.

Scott

briski
briski's picture
Offline
Elder
London
Last seen: 7 years 22 weeks ago
London
Timezone: GMT+1
Joined: 2004-02-16
Posts: 1066
Points: 0

Placement issues

And these fonts are more important than people being able to actually use the site?

I for one saw nothing at all as I have a nice flash blocker. Smile

ScottM2
Offline
Regular
NW Arkansas
Last seen: 15 years 2 days ago
NW Arkansas
Timezone: GMT-1
Joined: 2004-11-18
Posts: 13
Points: 0

Placement issues

I'm getting the feeling that everyone here hates Flash.

Correct? Smile

briski
briski's picture
Offline
Elder
London
Last seen: 7 years 22 weeks ago
London
Timezone: GMT+1
Joined: 2004-02-16
Posts: 1066
Points: 0

Placement issues

I don't hate it - I just choose not to have it installed cause I can rarely be bothered to wait for it to load.

I would say that using it for almost the ENTIRE site is a little rash though.

Like many non-standart things it has it's place if you use it sensibly.

ScottM2
Offline
Regular
NW Arkansas
Last seen: 15 years 2 days ago
NW Arkansas
Timezone: GMT-1
Joined: 2004-11-18
Posts: 13
Points: 0

Placement issues

Well, I'm not using it for the entire site (at least I hope not). Just on the home page. The rest of the site isn't done yet. They (the client) just want to get the home page up first.

I like Flash but I won't do an entire site with it.

ScottM2
Offline
Regular
NW Arkansas
Last seen: 15 years 2 days ago
NW Arkansas
Timezone: GMT-1
Joined: 2004-11-18
Posts: 13
Points: 0

Placement issues

Can anyone show me a good tutorial for image maps in CSS? I'm willing to try it.

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 6 hours 33 min ago
Dallas
Timezone: GMT-6
Joined: 2004-06-25
Posts: 9743
Points: 3822

Placement issues

Google is your friend.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 1 year 13 weeks ago
Timezone: GMT+1
Joined: 2004-06-30
Posts: 9668
Points: 801

Placement issues

Trust me, HTML and CSS is the way to go.

By using lists, imagemaps, CSS and alt attributes, you can easily replicate that CSS thing, the users without flash will be able to see it, AND it will be accessible for screenreaders/text browsers.

Verschwindende wrote:
  • CSS doesn't make pies

Chris..S
Chris..S's picture
Offline
Moderator
Last seen: 7 years 8 weeks ago
Timezone: GMT+1
Joined: 2005-02-22
Posts: 6078
Points: 173

Placement issues

image replacement can be used to put non-standard (or just nicely rendered) fonts on the users page while still maintaining accessible webpages.

briski
briski's picture
Offline
Elder
London
Last seen: 7 years 22 weeks ago
London
Timezone: GMT+1
Joined: 2004-02-16
Posts: 1066
Points: 0

Placement issues

Ok Curiosity got to me so I looked in my flash enabled browser - and I hav to say I was annoyed. That is not a friendly interface.

Problems are

It's not obvious that the shapes are active in anyway.
When you hover the box in the middle changes and has a "download our free buyers guide" bit that looks a lot like a link - only you can never get to it because as soon as you mouse off to get to it it's gone! Wether it's a link or not it's annoying cause it looks like one.
As you hover over the shapes it seems like you can click em - you can! alas it only seems to change the text to that of when you hover over the main box...

None of these things are major problems in themselves but they do add up to quite an annoying interface.

I assume the navigation links will be on the right but are just not active yet?

Tisnew
Tisnew's picture
Offline
Enthusiast
MissOuri
Last seen: 14 years 24 weeks ago
MissOuri
Timezone: GMT-6
Joined: 2005-06-04
Posts: 200
Points: 0

Placement Issues

I. some relatively valuable image replacement sites

a. - http//www.wpdfd.com/wpdnav3.htm

b. - http//www.htmldog.com/articles/suckerfish/dropdowns/

c. - http//sunsite.iisc.ernet.in/virlib/html/example/ch12.htm

d. - http//www.pmob.co.uk/

II. The Centering Question....I've tried Stu's solution to centering my latest page solution; as well as several others posted here. Any other ideas? I bet the answer is simple (like stumbling over pea gravel)...to get this page centered.

Vanilla Page with Left-Alignment that works fine http//beta-154104.server1.dotnetsandbox.net/Default3.aspx

Experimental IE6-Centering with Centering not happening http//beta-154104.server1.dotnetsandbox.net/TryIE6Centre.aspx

III. An Equate Question...in Assembler we have an Equate that looks like this

ALIGNMENT EQU -50

and a receiving field that looks like this

RESULT DC F'0'

Then, some code can look like this

A RESULT,=A(1*ALIGNMENT) Result becomes -50
A RESULT,=A(2*ALIGNMENT) Result becomes -150
A RESULT,=A(3*ALIGNMENT) Result becomes -300
A RESULT,=A(4*ALIGNMENT) Result becomes -500

Question inasmuch as I'm seeing alot of hardcoding of numbers in css example text (and web development in general), is there not a similar concept in css to the Assembler Equate?

Here's a concrete example from http//beta-154104.server1.dotnetsandbox.net/Default3.aspx

These statements were (seemingly) mandatory to force the pics to the designed spot on the screen.

style="left0px
style="left-50px
style="left-100px
style="left-150px
style="left-200px

Is there a practice or methodology that would work; on the order of?

style="left0*ALIGNMENT_value
style="left1*ALIGNMENT_value
style="left2*ALIGNMENT_value
style="left3*ALIGNMENT_value
style="left4*ALIGNMENT_value

A crust eaten in peace is better than a banquet partaken in anxiety --- Aesop

roytheboy
roytheboy's picture
Offline
Guru
North Wales, UK
Last seen: 6 years 16 weeks ago
North Wales, UK
Timezone: GMT+1
Joined: 2004-09-18
Posts: 2233
Points: 41

Placement issues

One hugely important issue that is being overlooked here is that of search engine optimisation. Some months ago, our beloved leader, Tony, brought to my attention how important keywords on your home page are because this is the page that normally accrues page-rank with Google (and possibly other SEs too). If you don't have *text* keywords on your home page that people will be searching for, you will be wasting any page-rank that you manage to accrue by inbound links from other sites.

Don't worry if you don't understand what I'm saying, just do as I suggest and fill your home page with meaningful *text* keywords (in context and without going so mad that you get penalised for taking the p*55). I am indebted to Tony for this tip as it has made a huge difference to many of my clients' SE rankings.

Back to TPH's original point: to use flash for anything other than an ancillary element such as an animated picture or advert is pure folly. It makes the site illegal (in the UK at least) as it discriminates against the disabled; it makes it impossible for search engines to find any text to index; and it creates barriers to users who don't have the correct plugin or who use dial-up connections. Using flash on your home page is not quite as bad as using it for the whole site, but it's not far off and it's still crazy if you want the site to be legal and effective.

I weep sometimes when I see the amount of money that is spent with top-line agencies that produce complete sites in flash. Take this one for example > http://www.a1gp.com ...a lovely piece of design with impressive effects. But completely inaccessible (and hence illegal), invisible to search engines, slow to download and therefore not only ineffective but a darn-right liability! I wonder how much the client paid for this site?

If you want further evidence of the risk you run by using flash, read about the disabled guy who successfully sued the Sydney Organising Committee for the Olympic Games. The Olympic site was predominantly text-based but had a few minor issues over 'alt' text and the results tables. Now try and look your client in the eyes when you tell him you're going to produce his/her site or home page in flash.

Life's a b*tch and then you die!

drhowarddrfine
Offline
Leader
Last seen: 9 years 50 weeks ago
Timezone: GMT-6
Joined: 2005-05-21
Posts: 764
Points: 0

Placement issues

Yeah, but one of the most popular sites on the 'net is budweiser.com and it's all flash.

IE7 is 10 years behind the standards or wrong.
But it works in IE!
IE is a cancer on the web -- Paul Thurott

roytheboy
roytheboy's picture
Offline
Guru
North Wales, UK
Last seen: 6 years 16 weeks ago
North Wales, UK
Timezone: GMT+1
Joined: 2004-09-18
Posts: 2233
Points: 41

Placement issues

drhowarddrfine wrote:
Yeah, but one of the most popular sites on the 'net is budweiser.com and it's all flash.

Oh; that's okay then. Forget everything I've just said because if the designers of the Budweiser site think a flash-only site is okay then I must be wrong. Obviously I haven't a clue what I'm talking about; search engines don't matter to the success of a site; and the disability discrimination laws are there to be ignored :roll:

Serious response > like I said: "I weep sometimes when I see the amount of money that is spent with top-line agencies that produce complete sites in flash." Just because a global company does something, does not make it right.

Life's a b*tch and then you die!

Tisnew
Tisnew's picture
Offline
Enthusiast
MissOuri
Last seen: 14 years 24 weeks ago
MissOuri
Timezone: GMT-6
Joined: 2005-06-04
Posts: 200
Points: 0

Placement issues

This one could be re-titled, "the assembler guy trying to figure-out css stuff" )

A friend provided this example, where the "left" is adjusted on the fly in a loop, providing a moving menu. Almost what I was looking for; now needs some re-jiggering.

http//www.the-cool-place.co.uk/javascript/tutorial/javascript2.html

A crust eaten in peace is better than a banquet partaken in anxiety --- Aesop

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 1 year 13 weeks ago
Timezone: GMT+1
Joined: 2004-06-30
Posts: 9668
Points: 801

Placement issues

Sorry, but JavaScript is just as bad, if not worse, then flash for menus.

Disable JavaScript and view that page. The menu is rendered useless.

Verschwindende wrote:
  • CSS doesn't make pies

roytheboy
roytheboy's picture
Offline
Guru
North Wales, UK
Last seen: 6 years 16 weeks ago
North Wales, UK
Timezone: GMT+1
Joined: 2004-09-18
Posts: 2233
Points: 41

Placement issues

Because javascript can carry out unrequested actions on the user's PC, many corporate users have it disabled by default. Never use Javascript for anything other than non-essential 'niceties'.

Life's a b*tch and then you die!

Anonymous
Anonymous's picture
Guru

Placement issues

thepineapplehead wrote:
From a HCI interface, it's alittle bit silly - I had no idea I was supposed to hover over the shapes.
Ah, this is known as "Mystery Meat Navigation"

http://www.webpagesthatsuck.com/mysterymeatnavigation.html

Laughing out loud

Tisnew
Tisnew's picture
Offline
Enthusiast
MissOuri
Last seen: 14 years 24 weeks ago
MissOuri
Timezone: GMT-6
Joined: 2005-06-04
Posts: 200
Points: 0

Placement issues

Resurrecting the original question, but re-worded

A css example looks like this, where these are five text strings

style="left0px
style="left-50px
style="left-100px
style="left-150px
style="left-200px

Assembler provides equates where you can dynamically do adjustments at assembly time to produce different strings.

C provides #define which can be used to generate adustments at compile time to produce different strings.

Is there a piece of css, a command, a declaration, that would generate different text strings; something like these? So, when you copy this web page to make a similar web page, you can simply #define ALIGNMENT_value and the code takes care of itself.

style="left0*ALIGNMENT_value
style="left1*ALIGNMENT_value
style="left2*ALIGNMENT_value
style="left3*ALIGNMENT_value
style="left4*ALIGNMENT_value

This 1995 draft spec suggested define as a css piece to be included.

http//marc.merlins.org/htmlearn/arena/draft.html

I'm finding aftermarket vendors with tools that "adjust" css text.

As well as advice to use "find-replace" in a text editor to change values.

So, my question is do you physically do math in your head or on a calculator and change every hardcoded number value in most every css text line you write by hand? Or is there a better way?

A crust eaten in peace is better than a banquet partaken in anxiety --- Aesop

roytheboy
roytheboy's picture
Offline
Guru
North Wales, UK
Last seen: 6 years 16 weeks ago
North Wales, UK
Timezone: GMT+1
Joined: 2004-09-18
Posts: 2233
Points: 41

Placement issues

Other than a few very simple features that could loosely be classed as 'dynamic' (with limited browser support), CSS is just a static presentation tool. There are exciting plans for future versions but for now, you'll either need to produce the stylesheet dynamically if you want to do any maths prior to outputting your styling instructions, or you can write in-line styles into the document head or element tags as the page is served. See this thread for more details > http://www.csscreator.com/css-forum/ftopic9988.html

Life's a b*tch and then you die!