|
| |
|
|
zoom
Posts: 129
Joined: 4/2/2004
Status: offline
 |
overwhelmed - 4/19/2006 14:02:52
please bear with me if i sound stupid.....
i was spending the day reading up on all of the changes and what is required to make my web compliant. I have just started so i figured i was in a good place but the site will be huge, its an online store for car sterios.
it seems like many times more work, i have to have a text page as well as the page with images? Larger font availabilty? All pages are required to contain a bookmark link to skip navigation that has the specified text in either the link text or the 'title' attribute value.
Skip Navigation Text:
i did that accessability test and it came back with a ton of stuff.
is it easier than i think??
thanks
Lisa
_____________________________
www.planethi-fi.com
www.skytopdesigns.com
|
|
|
|
jaybee
Posts: 14175
Joined: 10/7/2003
From: Berkshire, UK
Status: offline
|
RE: overwhelmed - 4/19/2006 14:32:58
Yes and no. 
If you look at one of your current sites you'll see that in the code Each page has the same stuff in it over and over again. Each header has a font colour, each table has layout info, each picture has border info and so on.
The idea is that css removes all of that into a separate file so what is in your page is the table, the picture, the H1 text.
You call the css file in at the top of each page so if you suddenly decide to change all your H1 from red to blue, you just change one line in the css file rather than every page on the site.
Now, it's also possible to get rid of tables completely and use css for the layout. As you have a very large site to do, and I assume a deadline, I'd work with the tables and just style the page with css.
You're using Dreamweaver and I'm not sure but I think 2004 has a css capability. Take a look through your help files and see if it's there, if so, turn it on and do a test page.
Here's an example of a fairly short page I did for a client. Take a look at the source code behind the page. I've laid it out using css as well as styled it. There are no tables only divs. There are no font sizes or colours, they're all in the css which is called at the top with
<link rel="stylesheet" type="text/css" href="css/main.css"/>
this is what's in the css. It also contains stuff for all the other pages on the site.
html {height:100%; max-height:100%; overflow:hidden; padding:0; margin:0; border:0; background:#2d73b9; font-size:80%; font-family:verdana, tahoma, arial, sans-serif; color:#000080;}
body {height:100%; max-height:100%; overflow:hidden; background:#2d73b9; padding:0; margin:0; border:0;}
#head {position:absolute; margin:0; top:0; left:30%; display:block; width:65%; height:95px; background: #fffdda; background-repeat:no-repeat; font-size:4em; z-index:4; color:#fffdda; margin-top:20px;text-align:center;}
#foot {position:absolute; margin:0; bottom:0; left:0; display:block; width:95%; height:20px; background:#2d73b9; font-size:0.8em; z-index:7; text-align:right; color:#000080;}
* html #left1, * html #left2 * html #left4{height:100%; top:0; bottom:0; border-top:20px solid #2d73b9;}
* html #left3 {height:97%; top:0; bottom:0; border-top:80px solid #2d73b9;}
* html #left4{height:100%; top:0; bottom:0; border:0;}
#left1 {position:absolute; top:20px; bottom:30px; left:0; width:15%; font-size:1em; z-index:6; overflow:auto; background-image: url('../images/Image3.jpg'); background-repeat: no-repeat;}
#left2 {position:absolute; top:20px; bottom:30px; left:15%; width:15%; font-size:1.1em; z-index:6; overflow:auto; background:#2d73b9;}
#left3 {position:absolute; top:90px; bottom:30px; left:30%; width:65%; font-size:1em; z-index:3; overflow:auto; background:#fffdda; padding-top:20px; text-align:center;}
#left4 {position:absolute; top:20px; bottom:30px; left:95%; width:5%; font-size:1em; z-index:6; overflow:auto; background:#2d73b9;}
.inner {display:block; padding:0 10px 10px 10px;}
.innernav {display:block; padding:100px 0 0 0;}
.innerright {display:block; padding:0 0 0 0;}
.bold {font-size:1em; font-weight:bold;}
.backwards {unicode-bidi:bidi-override; direction: rtl; color:#c00;}
a:link {color:#fffdda;}
.navigation a {display: block; color:#fff99d; padding-bottom:10px; padding-left:9px; text-decoration: none; font-weight:bold;}
.navigation a:link.current, .navigation a:visited.current {color:#2d73b9;}
.navigation a:hover {background-color:transparent; color:#000080}
.navigation a:hover.current {background-color:transparent; color:#2d73b9; cursor:default}
.imgleft {float:left;}
.imgright {float:right;}
img{border:0;margin-top:15px;}
ul {font-weight:bold;}
em {font-size:0.8em;}
h5 {margin:0;}
table{text-align:center;width:75%; font-size:1em; margin-left:auto;margin-right:auto;}
.formtab{text-align:center;}
td{font-size:1em; font-weight:bold;text-align:left;}
.coltd{font-size:1em; font-weight:bold;text-align:right;border: 0;}
#left3 a {color: #2d73b9;font-weight:bold;font-size:0.9em;}
#left3 a:visited {color: #000080;font-weight:bold;text-decoration:none;font-size:0.9em;}
#left3 a:hover {color: #ff9900;font-weight:bold;text-decoration:none;font-size:0.9em;}.inner a {color: #2d73b9;font-weight:bold;font-size:0.9em;}
The styles are applied in the code using id= or class=
The complex part is layout with css so stick to tables or whatever Dreamweaver decides to do if 2004 handles it.
< Message edited by jaybee -- 4/19/2006 14:43:50 >
_____________________________
If it ain't broke..... fix it until it is.
GAWDS
Now where did I put that Doctype?
| |
|
|
|
Tailslide
Posts: 6121
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline
|
RE: overwhelmed - 4/19/2006 14:43:01
Well you know it depends.
This is difficult for me to be unbiased about because I basically believe that all sites should be as accessible as we can make them.
That said, it would be counter-productive to frighten people with the sheer amount of possible work to the point that they don't bother with any improvements at all. Some improvements have got to be better than none.
So bearing that in mind.
I'd try to get at the very least the following done.
1. If you have to use tables for layout (and ideally you shouldn't) then try not to use too many nested tables as they are confusing for various assistive devices.
2. Don't use px or pts for font-sizing. Use % or ems so that people can resize the text in their browsers. Also make sure you're layout doesn't break if they do.
3. Use <label>s on forms (google accessible forms or check out links in this forum) they are very helpful.
4. Make sure that images have alt text.
5. Check your site with images turned off and see if it still makes sense.
6. Try "Linearise Tables" in Firefox web developer toolbar and see if your site still makes sense.
7. Don't rely on Flash or Javascript too much as it can be turned off.
8. Try to ensure the text contrast against the background is good.
That's a very basic list and it won't guarantee your site is accessible but it will help and I think it's achievable for everyone without too many problems.
(Skip links are useful - they usually appear at the top of the page and depending on your page structure usually link to your main contents so people using text readers don't have to have the whole nav bar read to them on every page)
_____________________________
"My strategy is so simple an idiot could have devised it"
Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project
| |
|
|
|
zoom
Posts: 129
Joined: 4/2/2004
Status: offline
|
RE: overwhelmed - 4/19/2006 15:29:04
thanks, i feel better already,
what do you mean,, skip the links?
i guess my site would still make sence with the images turned off since the name of the item is right below it and it is in rather large font.
DW MX does have CSS, when i optimized it from PS i made sure it went in css, not html.
im new at css, though,
i have the first page done and all of the others will come from only one or 2 page layouts so if i get the first ones done im okay.
the site is www.planethi-fi.com. see what you think as far as making more accessable
thanks so much
Lisa
_____________________________
www.planethi-fi.com
www.skytopdesigns.com
| |
|
|
|
zoom
Posts: 129
Joined: 4/2/2004
Status: offline
|
RE: overwhelmed - 4/19/2006 16:22:20
quote:
ORIGINAL: jaybee
OMG!!!! OK, you're using css but crikey! did Dreamweaver put all that lot in? It seems to have given you a class for every line.
It's using Divs which is great but it also has a bucketload of javascript in there which could be done with css on the mouseovers anyway.
It takes the page ages to load on my fast broadband dial-up will be excruciating.
Otherwise the page layout is nice but it needs to be speeded up which shouldn't be too tough.
YEAH I KNOW
when i got it into dreamweaver and looked at the source therewas a ton of it.
i did all of the rollover effects in photoshop
i am not good yet at css so im not sure what to do next
also, why is it that the sites i look at that are for accessability have such TINY font
_____________________________
www.planethi-fi.com
www.skytopdesigns.com
| |
|
|
|
zoom
Posts: 129
Joined: 4/2/2004
Status: offline
|
RE: overwhelmed - 4/19/2006 21:41:45
ill check out the list link you had.
so, using javascript causes problems? i need to put in some user end searches, how else can i do that.
thanks
Lisa
_____________________________
www.planethi-fi.com
www.skytopdesigns.com
| |
|
|
|
Kitka
Posts: 2515
Joined: 1/31/2002
From: Australia
Status: offline
|
RE: overwhelmed - 4/19/2006 22:04:09
quote:
i need to put in some user end searches, how else can i do that.
I have used iSearch for a few years. It is a free PHP script for site search - it doesn't use any JS, but does require a database.
http://www.isearchthenet.com/isearch/
_____________________________
Kitka
**It is impossible to make anything foolproof because fools are so ingenious.**
| |
|
|
|
zoom
Posts: 129
Joined: 4/2/2004
Status: offline
|
RE: overwhelmed - 4/19/2006 22:08:44
thanks kitka
so i can make the search tool search anything i want it to?
thats perfect
thanks
_____________________________
www.planethi-fi.com
www.skytopdesigns.com
| |
|
|
|
Kitka
Posts: 2515
Joined: 1/31/2002
From: Australia
Status: offline
|
RE: overwhelmed - 4/19/2006 22:17:36
quote:
so i can make the search tool search anything i want it to?
Basically - yes. And you can also tell it what you don't want it to search, which can be very useful.
_____________________________
Kitka
**It is impossible to make anything foolproof because fools are so ingenious.**
| |
|
|
|
zoom
Posts: 129
Joined: 4/2/2004
Status: offline
|
RE: overwhelmed - 4/19/2006 22:29:23
[
Basically - yes. And you can also tell it what you don't want it to search, which can be very useful.
[/quote]
thats great, thank you so much. you just saved me so much time.
Lisa
_____________________________
www.planethi-fi.com
www.skytopdesigns.com
| |
|
|
|
Tailslide
Posts: 6121
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline
|
RE: overwhelmed - 4/20/2006 3:24:59
BTW - it's not that you can't use Javascript, it's just a case of having a fall-back position in case it's switched off, inaccessible or unavailable.
_____________________________
"My strategy is so simple an idiot could have devised it"
Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project
| |
|
 New Messages |
 No New Messages |
 Hot Topic w/ New Messages |
 Hot Topic w/o New Messages |
 Locked w/ New Messages |
 Locked w/o New Messages |
|
Post New Thread
Reply to Message
Post New Poll
Submit Vote
Delete My Own Post
Delete My Own Thread
Rate Posts
|
|
|
Printable Version 
