Where's the HTML and where's the structure?

[haakoo]

Would that apply to all websites?
This would mean that any portfolio of an artist would be shut down as the info is graphical and mostly not textual.
Simply make a redirect-option as one would for flash/mobile sites and have a plain textual page with the acknowledgment and explanation what the site is about.

Hans

[covoxer]

Some good points Ron. Especially regarding accessibility. It's true that there are blind people that use voice readers browsing html. But it's not true that simply adding headers or bullets automatically makes a page perfectly readable by them. It much more depends on the amount of text on the page and number of text blocks. It also depends on the content of the text. It may be explicit and independent of the page layout and graphics or hard to understand. The alt text for images is also important here. So, generally, if you want to produce accessible page (I don't mean technical term but real one), you have to work hard on the correct design in the first place.
As a result, accessible pages are usually not attractive for visual browsing as design is hampered with necessary constraints.
On the other hand, even technically accessible pages are not always easy to understand using text browser. So the best approach is to develop separate versions of the site for text and graphical browsing. You can do both in WD.
Another aspect is that all printed literature (books, manuals, newspapers, magazines e.t.c.) are completely unaccessible by this criteria, since they can't be read by the blind without help of someone else. And in reality, the only really working solution in any conditions is let someone to read the text aloud and explain what's there.

[covoxer]

Sorry, but that's wrong. You should do your homework, because "a growing number of countries around the world have introduced legislation which either directly addresses the need for websites and other forms of communication to be accessible to people with disabilities, or which addresses the more general requirement for people with disabilities not to be discriminated against.

In the UK, the Disability Discrimination Act 1995 (DDA) does not refer explicitly to website accessibility, but makes it illegal to discriminate against people with disabilities. The DDA applies to anyone providing a service; public, private and voluntary sectors. The Code of Practice: Rights of Access - Goods, Facilities, Services and Premises document[8] published by the government's Disability Rights Commission to accompany the Act does refer explicitly to websites as one of the "services to the public" which should be considered covered by the Act." [source: Wikipedia article about Web accessibility]

Remi

And how this applies to the all product information on labels, manuals and documentation? Can blind read them? Is this discrimination too?

Nevertheless, as I say, it all depends on designer. If you want to make a 100% accessible site, you can do it in WD.

[remi]

No, John. Ron's main point in this thread was semantically meaningful HTML. This is an important point if we're talking about Web accessibility. Are you really able to create this in WD?

Remi

[haakoo]

Isn't it possible to create a option for the browser to preview in?
So we could select IE and FF(or others) as FF renders fonts differently as other browsers.
Then we could install LYNX text browser to test the site
Could you build in a browser-detection script in the head-tag?
this to be able to redirect to the textual part of the site?


Hans

[covoxer]

No, John. Ron's main point in this thread was semantically meaningful HTML. This is an important point if we're talking about Web accessibility. Are you really able to create this in WD?
Remi

Sure, why not, put it into a placeholder. Hide it on invisible layer if you don't want it to mess the design. Or create a separate version of the site, which is actually a best solution because pure text predesigned for text reading is much easier to understand than typical design, even if it is technically accessible.
And answer please about the accessibility of all printed materials, information tables in public places e.t.c.

[Charles Moir]

There is nothing in the HTML we create that stops readers working.

The main criteria for Accessibility concerns providing things like alternative text for graphics, links, audio, not using using colour to impart important information etc. All this is possible if you so wish.

And for the 'tag soup' comment you must be looking at some other products or web pages. Our pages are incredibly simple HTML, one line after another and not a lot else. Try looking at the HTML produced by other web authoring tools or indeed look at any typically complex website if you really want to see indecipherable tag soup.

[remi]

A knowledged (X)HTML/CSS expert would use the following simple markup:

<p>The following is an example streaming video. 
It's easy to embed your own YouTube videos, or any of 
the tens of thousands of third party 'web widgets' 
using the Placeholder feature. Most web widgets provide 
a short snippet of HTML that you can attach to a graphic. 
So the following rectangle acts as a placeholder for the 
streaming video. To see the actual HTML snippet used, 
open the Web Properties dialog and look at the Placeholder 
tab.</p>

But, no you're on your WYSIWYG absolute position trip, don't care about semantic HTML and prefer to export a tag soup par excellence:

<div style=" font-size: 12px; font-weight: normal;">
   <div class="tl" style="left: 0px; top: 5px;">The following is an example streaming video. It’s easy to embed your own YouTube videos, or any of the tens of thousands </div>
   <div class="tl" style="left: 0px; top: 22px;">of third party ‘web widgets’ using the Placeholder feature.  Most web widgets provide a short snippet of HTML that you </div>

   <div class="tl" style="left: 0px; top: 39px;">can attach to a graphic. So the following rectangle acts as a placeholder for the streaming video. To see the actual HTML </div>
   <div class="tl" style="left: 0px; top: 56px;">snippet used, open the Web Properties dialog and look at the Placeholder tab.</div>
  </div>

The problem is, you're lost in the idea to export a page the same as it's shown on Xara's canvas (the so often discussed WYSIWYG principle).

Remi

[Hexen53]

Tag Soup? Using standard HTML tags (HTML is a markup language, so without tags there's no markup) should make the page easily readable by humans even within the code. Here is a boring exerpt from one of my pages:

<h1>Writing Your Constitution</h1>

<h2 class="header" id="headings">Constitution Headings (also known as Clauses)</h2>
<p>Below are the headings which appear in most constitutions, with an explanation of what information usually comes under each one. This is only a guide though - only you will know whether it would need to be changed a bit for your individual organisation or group.</p>

<h3 class="sub1less">Name of the organisation</h3>

<p>A straightforward one to begin - just the full name of your organisation or group. It is worth mentioning here though that if your group would like to apply for charitable status in the future, then you should check the Office of the Scottish Charity Regulator's (OSCR) website (www.oscr.org.uk) to make sure that the name you plan to use has not already been taken by another charity.</p>

<h3 class="sub1less">Aims and/or Objectives</h3>

<p>This clause might also seem fairly straightforward, but it is worth taking a bit of time to talk it through. You might have a definite idea of what your organisation or group wants to do now, but could the aims change with time? Once your constitution has been formerly accepted by the membership of the group, it will take more work to try to change it. It is better to take time at the beginning to decide on the aim or aims of the group, both for now and in the future.</p>

<p>If your group is interested in applying for Charitable Status, then you'll need to read OCSR's booklet, "Meeting the Charity Test" which includes a full list of Charitable Purposes under the Charities and Trustees Investment (Scotland) Act 2005.</p>

<h3 class="sub1less">Powers</h3>

<p>This section deals with the specific functions related to the group such as providing services or activities to further the aims and objectives. The Powers clause can also outline the group's ability to:</p>

<ul>
<li>Raise funds</li>
<li>Employ staff</li>
<li>Lease/hire or purchase property</li>
<li>Take out insurance</li>
<li>Liaise with other organisations</li>
</ul>

---

To me, the above seems fairly readable and illustrates the main heading <h1> at the top, with sections at a secondary level <h2> and within that, sub headings at level 3 <h3> Paragraphs are all <p> and I even included a dreaded bulleted list. The formatting of the page is all done from the external style sheet, with a body font size of 90% (so it can be scaled by browsers easily). Remember that some web pages have been around before IE8 and the latest FF arrived.

----

Here's 4 paras from Gary's explanation of the Toolbar:

<div style="">
<div class="tl" style="left: 0px; top: 197px;"><span style=" font-weight: bold;">The Website Toolbar</span>*There are 7 website-specific buttons at the top of the screen on the </div>
<div class="tl" style="left: 0px; top: 211px;">Infobar:</div>
</div>
<div style="">
</div>
<div style="">
<div class="tl" style="left: 0px; top: 239px;"><span style=" font-weight: bold;">1. Export & Preview Website</span>*This button publishes the website to your computer and opens </div>
<div class="tl" style="left: 0px; top: 252px;">a browser preview window in which you can preview your site.</div>
</div>
<div style="">
</div>
<div style="">
<div class="tl" style="left: 0px; top: 280px;"><span style=" font-weight: bold;">2. Export Website</span>*This button creates all the files and folders needed to publish your </div>
<div class="tl" style="left: 0px; top: 294px;">website to your website host. You do this step just before you publish your website to your </div>
<div class="tl" style="left: 0px; top: 308px;">web host’s servers.</div>
</div>
<div style="">
</div>
<div style="">
<div class="tl" style="left: 0px; top: 336px;"><span id="Link" style=" font-weight: bold;">3. Link</span>*This button opens the <span style=" font-weight: bold;">Website Properties</span>*menu but to the <span style=" font-weight: bold;">Links</span>*tabbed section. </div>
<div class="tl" style="left: 0px; top: 350px;">From the Links tabbed section you can add a variety of links both internal and external. You </div>
<div class="tl" style="left: 0px; top: 364px;">can link to a page on your website, an external website, a web image, an anchor, or a popup </div>
<div class="tl" style="left: 0px; top: 378px;">object. A picture is worth a thousand words. Click these links to see what they do.</div>
</div>
<div style="">
</div>
<div style="">

---

Yes you can find the text relatively easily but sentences and paras are broken at odd points and there is nothing to denote the structure.

More in next post.

[Hexen53]

As for the need for printed materials having to meet accessibility requirements. All UK Councils would be expected to be able to produce any of their publications in a format suitable for visually impaired if requested (no you can't just photocopy onto A3).

In Adobe Acrobat there is a tool for making your pdfs accessible - http://www.adobe.com/accessibility/ (there's a bit in there about your US federal govt requirements as well).

In Word it is recommended that you do not use bold, italic etc to format paras but use styles (correctly) as these convey meaning to the text. http://www.webaim.org/techniques/word/

After all this... I am not trying to knock XWD - it is a fantastic tool that can easily produce graphically rich web pages and does things that only Flash could have achieved before. For a band's website or for showing off your artwork it would be great but for many text heavy sites that need structure I don't think it works.

Oh, and I'm no evangelist about disability issues - my pages are far from perfect but I try where I can.

Ron