New look to site
I'd be grateful if you guys could look at [edit] link now removed[/edit ]the draft new home page for my site - using Firefox or Opera, not IE. [[edit] link now removed[/edit ]The old one needed revamping in the light of comments I have been reading. What I really want comment on is the h1 and the nav bars since the look will eventually sweep across the site.. Still having problem with the site navbars in IE - I'll have to dig around to cure that. One know issue is the form - I'll be looking at that later.
At this stage, I really am after just a narrow look at this page - not the whole site - which is till very much work in progress. On that basis, if I have dropped this into the wrong section, I'm very happy for a mod to move it.
Last edited by kiwibrit on 23 Mar 2006 03:04 pm; edited 1 time in total
Share: 
Oh, that's a lot easier on the eye. Reducing the ALL CAPITALS SECTIONS makes it look a lot friendlier, too. 
| Code: |
| <h1>SHY <abbr title="United Kingdom">UK</abbr> makers of outstanding quality sealed, cassette, roller and rooflight blackouts blinds and screens</h1> |
| Code: |
| <h1>SHY <abbr title="United Kingdom">UK</abbr></h1>
<p id="tagline">Makers of outstanding quality sealed, cassette, roller and rooflight blackouts blinds and screens.</p> |
Last edited by Ben Millard on 18 Mar 2006 02:13 pm; edited 1 time in total
Share:
Gosh, that was quick response so late in the evening. Thanks. Guilty as charged, I think, on keyword spam. Looked at what another company was doing to feature higher up the ratings on a particular keyword - and did likewise. But it is a mouthful, Google my well hone its algorithm - and it is a bit unfriendly. So it will have to go.
I like the idea of a meaningful tagline, though. I am a bit surprised that you gave the <p> an id (tagline) - is that just so the paragraph can have a prominent styling?
Glad you like the lower case. I felt I had to add the background, because, in lower case, I felt that the links needed highlighting as nav bars.
Hmm. I'm rambling. It's getting a bit late
Share:
Just a quick note on the "Combined-SHY-Zip-Obscura-Sunfacta-Logo.gif" file.
I don't have any kind of visual imparement but I find it difficult to see/ read. This is due to it's small text size and a lack of contrast.
Also, Instead of a <p> on that tagline you could argue that a <h2 id="tagline"> could be used (although it may be styled differently from other h2's) as this is technically a subheading of sorts. Although, as always, thats open to interpretation. Just would give you more weight than a <p>.
Other than that, and the stuff pointed out by Ben, it looks ok.
Share:
Thanks for the advice, so far.
I've now sorted the left-hand navbars to work in IE as well - at the expense of some nasty hacks (see #sidenavbar stuff in the CSS). Have I ever told you how much I dislike IE?
I think this page is coming along though.
Next stage is to sort out the Form label thing - then get the MD's approval, and roll the new look across the site. After that, I'll see if I can up the tempo in converting all the pages to strict code. Things have come a long way since the whole site was written in tables.
Share:
Hi Kiwi, few thoughts
You might want to consider providing <abbr>'s for items like BBSA.
I trust all the inline coding will disappear into CSS before too long
How about providing a different background colour for the focus attribute of <a> helps keyboard users identify the link trhey are on.
Mike Abbott
Accessible to everyone
Share:
Mike,
I'll be running through the CSS, of course. That said, the home page is a bit of a one-off. Most pages are more like this though of course I hope to get rid of the upper case stuff.
So there is some unique styling for the home page. I have never been quite sure why I should not use in-line styling in such a case. Does it throw readers such as JAWS? If so, I'll drop the unique CSS into <head>.
Thanks for the tip about the focus for <a>.
And for the reminder about BBSA - it's tucked into a php include for the standard page footer. I remembered to update the copyright date on year change - but missed the lack of <abbr>
[edit] In fact I'll go for alt="" for the BBSA logo. I'll also be upping the contrast on the heading logo. [/edit]
Share:
Blocked navbars can usually be sorted out for IE using the height: 1% semi-hack. Alternatively, careful use of the width property without any padding and margin will make the blocked links behave correctly without rendering at different sizes. All devices I know of expand unpositioned element heights so at least one line of text is visible. I'm not sure if that's the specified behaviour in CSS but it seems to be what they all do.
All the sites in my sig using the height: 1%; method. Feel free to look at their CSS and see how it works.
I think that the tagline is a paragraph since it is a sentence of prose, not the title to a sub-section of the page. And yes, the id was so you could give it a unique ruleset using #tagline {}. You could use a selector like #header p {} if you prefer, which will be fine as long as you don't put any more paragraphs in your header container.
Share:
If you have a different styling for the home page you only need to copy a CSS from another page, alter it to suit the main page, save under another name and link the page to it. In this way you are not creating tag soup and keeping the main page clean for when you want to modify or edit it
I use this principle of different style sheets for the UK National Work Stress Network just look at the source coding
Mike Abbott
Accessible to everyone
Share:
Thanks, Mike. I'll do that. One or 2 things to sort out still, then everything will go into a home-page style sheet.
By the way, I particularly like your accessibility statement. Brief, clear, and cogent. Just one thing though. I hate tag soup because its a pain to wade through as a coder. And it must slow down rendering a little. But how does it affect accessibility? Not arguing it doesn't - just wanting to learn.
Share:
| Cerbera wrote: |
| I think that the tagline is a paragraph since it is a sentence of prose, not the title to a sub-section of the page. And yes, the id was so you could give it a unique ruleset using #tagline {}. You could use a selector like #header p {} if you prefer, which will be fine as long as you don't put any more paragraphs in your header container. |
Just to play devils advocate I would say take a look at Simplebits
| Code: |
|
<h1>Hand-crafted web sites, pixels and text.</h1> <h2>SimpleBits is a <strong>tiny web design studio</strong>... <h3>Featured Work</h3> |
Now, I think this is the exception rather than the rule, but it could be argued that this is a good way of representing how important certain text is on a certain page which is surely the point of heading tags?
| HTML 4.01 Specification wrote: |
| A heading element briefly describes the topic of the section it introduces. |
I'm not saying I totally agree but I can see where Dan Cederholm is going with his interpretation. Some may say its wrong, some may say its more correct than using a p tag.
I would like to get other peoples comments on this. Anyone suggesting uses for keyword spam will be ignored obviously.
I think we all know Simplebits doesn't need to keyword spam to get a good google ranking so there must be some legitimate thinking about the semantics of the document.
Share:
| asaxton wrote: |
| ....I think we all know Simplebits doesn't need to keyword spam to get a good google ranking so there must be some legitimate thinking about the semantics of the document. |
Well, to be fair, a site by Dan Cederholm is going to do a lot better, that a site like mine, say, that is targeted to a narrow audience (the British Blind trade, and architects, mainly). That said, with many keywords important to us, we do well. For example, enter "electric roller blinds" into Google, and today we are number 2 on page 1 - after the paid links, of course.
My thanks to everybody who helped in this thread, and in the site building and testing section. Today my MD OK'd the page look shown in the first link of this thread. I hope to go live with it, and all the accessibility improvements that are built in, by the end of this week - though that does depend on other work commitments.
Share:
| asaxton wrote: | ||
I would like to get other peoples comments on this. |
As the h2 includes a link to the About SimpleBits page, it could be argued that it does briefly describe the topic of the section it introduces; it's just that the section it describes is on a different page.
Edit: Of course this doesn't explain its use on other pages that don't include a link.
Last edited by ectoplasm on 18 Mar 2006 02:01 pm; edited 1 time in total
Share:
A tagline doesn't make sense as a section heading, doesn't entitle a section. It is usually a coherent sentence, so the <p> element seems much more appropriate to me. This would allow the page title to descend directly from the website title, or for article subheadings to descend directly from the article title (depending on what the <h1> contains).
The end result of having the tagline as a title are clearly unbeneficial (misrespents structure of the document, unecessaryily slows down heading jumps in ATs, etc). Having the tagline as a paragraph means it will be pronounced as regular prose in screen readers (which is good, since it tends to be a sentence), won't be mistaken as an empty document section by search engines (and possibly identified as keyword spamming) and makes the page outline more logical. This is beneficial.
The structure of pages on SimpleBits generally don't include a tagline. The first <h2> is just a verbose subheading of the article title (given in the <h1>). A summary paragraph follows this weird subheading, and then the rest of the article descends from this. Since there isn't a tagline, it is a different case.
| Code: |
| <h2>SimpleBits is a tiny web design studio founded by designer and author, Dan Cederholm. We create simple, readable interfaces balanced with a standards-based methodology. Learn more</h2> |
Last edited by Ben Millard on 18 Mar 2006 02:15 pm; edited 5 times in total
Share:
All comments are true so far, would like to get a few more points of view if possible though...
Share: