2 replies [Last post]
Streetproject
Streetproject's picture
Offline
newbie
Last seen: 3 years 9 weeks ago
Timezone: GMT-4
Joined: 2010-09-08
Posts: 10
Points: 14

Worldhelp.net

I am the web developer for this company, and we have a button on our navigation that sends the user to a new page (the blog). I want to add some sort of visual cue that this link will open somewhere else, but I'm not sure what exactly I should do. I was just interested to see what people here would say.

thepineapplehead
thepineapplehead's picture
Offline
Guru
Milton Keynes
Last seen: 6 weeks 2 days ago
Milton Keynes
Timezone: GMT+1
Joined: 2004-06-30
Posts: 9668
Points: 801

Site discussion is for

Site discussion is for discussion of THIS site, but never mind Laughing out loud

External links are sometimes marked as such on some sites. Normally they are prefaced by a small icon - in a lot of cases, it's a small box with a stylized arrow "escaping" the box.

You could do it with the content property, or add a class and use a background image.

There's always the rel=external attribute, but I'm not sure if that's any use whatsoever. It seems to be used in conjunction with JS for opening new windows, while still validating as xhtml, but you should never open new windows. That's up to the user.

Verschwindende wrote:
  • CSS doesn't make pies

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 2 weeks 6 days ago
London
Timezone: GMT+1
Joined: 2004-06-06
Posts: 15650
Points: 2788

Of course icons placed as

Of course icons placed as backgrounds are bog all use to screen readers etc so the boring way is plain text stating what will happen but that doesn't necessarily sit well with designs, so an icon perhaps in a span either as a background overlaying text or with a tile attribute to read or icon placed as inline with alt attr. You could add generated content :after using the [rel=ext] to trigger for any elements with the attribute, not sure what screen readers would do with that though.

I would use attributes such as rel and any other microformat/microdata atts as these are going to become increasingly important and already are being widely used by many apps such as WP, as for them validating it's not worth worrying about.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me