355468 - Minimo project webpages to meet m.o. guidelines (HTML 4.01 strict, markup, style, semantic, etc)

Status: VERIFIED FIXED

(www.mozilla.org :: General, defect)

Description

[Gérard Talbot]

Related mozilla.org guidelines:

mozilla.org Markup Reference
http://www.mozilla.org/contribute/writing/markup

mozilla.org Documentation Style Guide
http://www.mozilla.org/contribute/writing/guidelines

WebPages to be upgraded:
http://www.mozilla.org/projects/minimo/FAQ.html (17 errors; 17 errors with
strict)

http://www.mozilla.org/projects/minimo/build-cross.html (6 errors; 111
errors with strict)

http://www.mozilla.org/projects/minimo/customizing.html (26 errors with
transitional DTD; 26 errors with strict)

http://www.mozilla.org/projects/minimo/ipaq_screenshots.html (7 errors
with transitional DTD; 8 errors with strict; images missing width and
height; <th> instead of <td><span style="font-weight: bold;">; avoid
width="100%" that creates over-constrained tables;
http://bugzilla.mozilla.org/show_bug.cgi? needs to be redirected to
https://, so link need tuning; etc.)

http://www.mozilla.org/projects/minimo/palmtop-configs.html (48 errors
with transitional DTD; 48 errors with strict;
http://www.sharp-usa.com/images/clear.gif everywhere; 105 <br>, 66 &nbsp;,
51 <font>, 59 style="vertical-align: top;", 119 bgcolor, etc.)

http://www.mozilla.org/projects/minimo/WinCE/build.html (20 errors with
transitional DTD; 20 errors with strict)

Comment 1

[Gérard Talbot]

-> me

Comment 2

[Gérard Talbot]

Attachment: Patch 1.24

Checking in mozilla-org/html/projects/minimo/FAQ.html;
/cvsroot/mozilla-org/html/projects/minimo/FAQ.html,v  <--  FAQ.html
new revision: 1.24; previous revision: 1.23
done

Comment 3

[Gérard Talbot]

Attachment: Patch 1.25 (checked in)

Checking in mozilla-org/html/projects/minimo/FAQ.html;
/cvsroot/mozilla-org/html/projects/minimo/FAQ.html,v  <--  FAQ.html
new revision: 1.27; previous revision: 1.26
done

Tuned 3 "search bugs" links; device matrix link now points to the redirected wiki webpage, not to the old http://www.mozilla.org/projects/minimo/WinCE/device_matrix.html link.

Comment 4

[Gérard Talbot]

Attachment: Build-cross compiling v.1.14 (checked in)

Checking in mozilla-org/html/projects/minimo/build-cross.html;
/cvsroot/mozilla-org/html/projects/minimo/build-cross.html,v  <--  build-cross.html
new revision: 1.15; previous revision: 1.14
done

Converted to HTML 4.01 strict; removed 111 validation markup errors; code indentation is about 70 characters; many <tt> have been replaced with <code> and there are still many left. Many <blockquote> have been replaced with <pre class="code">

Comment 5

[Gérard Talbot]

Attachment: Customizing Minimo v.1.16 patch (checked in)

Checking in mozilla-org/html/projects/minimo/customizing.html;
/cvsroot/mozilla-org/html/projects/minimo/customizing.html,v  <--  customizing.html
new revision: 1.17; previous revision: 1.16
done

Converted to HTML 4.01 strict; corrected 26 validation markup errors; removed class sec and class section since they were not applied anyway; nested list items should be correct now; the last part of the document was mysterious somewhat (class="minimo.jar" does not exist). 

Code indentation (before line-wrapping) is now ~= 70 characters. 
Removed all empty anchors. 
<p><b>...</b></p> were converted into <h3>...</h3>. 
Most <pre class="code"> which were too wide were narrowed down to avoid horizontal scrollbar to appear.

Comment 6

[Gérard Talbot]

To do:

- Remove 
<link rel="stylesheet" type="text/css" href="../support.css">
in 
http://www.mozilla.org/projects/minimo/FAQ.html
since the file does not exist (404)

- Update
http://www.freedesktop.org/software/pkgconfig/releases/pkgconfig-0.15.0.tar.gz redirected to
http://pkgconfig.freedesktop.org/releases/pkgconfig-0.15.0.tar.gz
in http://www.mozilla.org/projects/minimo/build-cross.html

- Update
<link rel="author" title="Andrew Henry" href="contact">
The link to contact is not resolved as contact.html in several files. So the server does not find 
http://www.mozilla.org/projects/minimo/contact
but will find
http://www.mozilla.org/projects/minimo/contact.html

- Remove
<a href="#acrobat"></a>
in the FAQ file

- Update
http://www.slashdot.org/ redirected to
http://slashdot.org/

and several other links needs to be updated.

In http://www.mozilla.org/projects/minimo/customizing.html
the  
   #minimo_jar_pane {
    	display: none;
    }
must be referring to the 
<ul class="minimo.jar">

Comment 7

[Gérard Talbot]

I did all the changes announced in comment #6. Now, I realized that (I guess) I should have used the more recent/updated pkgconfig-0.18.tar.gz

pkgconfig-0.15.0.tar.gz  15-Sep-2003 06:01  596K  

pkgconfig-0.18.tar.gz    27-Jun-2005 13:12  946K  

Comment 8

[Gérard Talbot]

Question:
Should the broken link
http://www.mozilla.org/projects/minimo/customization/xulrunner/minimo/application.ini.txt
be updated to use instead
http://lxr.mozilla.org/mozilla/source/xulrunner/examples/simple/application.ini
in the file
http://www.mozilla.org/projects/minimo/customizing.html ?

In the file minimo/customizing.html, I have replaced 
<ul class="minimo.jar"> 
with
<ul id="minimo_jar_pane">

I am also trying to replace href="javascript:
<a href="javascript:" onclick="showFolder(this); return false;">
with
<button type="button" onclick="showFolder(this);">Show Minimo.jar content</bu
tton>

Comment 9

[Gérard Talbot]

In the file minimo/customizing.html, I have replaced 
<a href="javascript:" onclick="showFolder(this); return false;">
with
<button type="button" onclick="showFolder();">Show Minimo.jar content</bu
tton>

Comment 10

[Gérard Talbot]

Attachment: Patch 1.2 Ipaq screenshots

Checking in mozilla-org/html/projects/minimo/ipaq_screenshots.html;
/cvsroot/mozilla-org/html/projects/minimo/ipaq_screenshots.html,v  <--  ipaq_screenshots.html
new revision: 1.2; previous revision: 1.1
done

Comment 11

[Gérard Talbot]

Checking in mozilla-org/html/projects/minimo/palmtop-configs.html;
/cvsroot/mozilla-org/html/projects/minimo/palmtop-configs.html,v  <--  palmtop-configs.html
new revision: 1.2; previous revision: 1.1
done

Converted to HTML 4.01 strict; removed 48 validation markup errors;
/images/clear.gif, 105 <br>, 66 &nbsp;, 51 <font>, 59 style="vertical-align: top;", 119 bgcolor: all removed. The main table is now accessible and easier to maintain. Breadcrumbs navigation added.

Comment 12

[Gérard Talbot]

Attachment: Patch for build.html v1.21

Checking in mozilla-org/html/projects/minimo/WinCE/build.html;
/cvsroot/mozilla-org/html/projects/minimo/WinCE/build.html,v  <--  build.html
new revision: 1.21; previous revision: 1.20
done

Corrected 20 validation markup errors; replaced 1 list with <h>eadings.

Comment 13

[Gérard Talbot]

Doug, could you check this page:

http://www.gtalbot.org/BugzillaSection/MinimoMainCorrected.html

If you compare the source code of 

http://www.gtalbot.org/BugzillaSection/MinimoMainCorrected.html

with

http://www.mozilla.org/projects/minimo/

you'll see 
- 8 validation markup errors when in HTML 4.01 strict, 
- strange closing "/>" tags, 
- imgs[imgcnt++] = 'images\/release_screenshots\/9.jpg'; is repeated twice,
- align="center" and <center> which could be replaced with CSS
- 20 br>

In the MinimoMainCorrected.html file,

I have defined 
all the width and height for images, 
replaced "javascript:" pseudo-links with command buttons, 
<link rel="prefetch"> 5 images,
thisimg = 8; replaced thisimg = imgcnt-1;
used text-align: center to replace <center>
etc.

If that's ok with you, I would make these changes to 

http://www.mozilla.org/projects/minimo/

Also, I will later upgrade

http://www.mozilla.org/projects/minimo/develop.html (2 validation markup errors, using transitional DTD).

Comment 14

[Gérard Talbot]

Attachment: Patch for develop.html version 1.11 (checked in)

Checking in mozilla-org/html/projects/minimo/develop.html;
/cvsroot/mozilla-org/html/projects/minimo/develop.html,v  <--  develop.html
new revision: 1.11; previous revision: 1.10
done

Converted to HTML 4.01 strict; fixed several validation markup errors; added breadcrumbs (intra-site) navigation; removed many &nbsp;; document structure (<h>eadings) has been improved.

I may (will?) need to check the links in that page again.

Comment 15

[Gérard Talbot]

Attachment: Patch for netcat_ce.html v. 1.12 (checked in)

Checking in mozilla-org/html/projects/minimo/WinCE/netcat_ce.html;
/cvsroot/mozilla-org/html/projects/minimo/WinCE/netcat_ce.html,v  <--  netcat_ce.html
new revision: 1.2; previous revision: 1.1
done

Converted to HTML 4.01 strict; corrected a few errors; removed several &nbsp; and <br>; added a [bread]crumbs (intra-site) navigation

Comment 16

[Doug Turner (:dougt)]

looks fine.  thanks for the fixups!!

Comment 17

[Gérard Talbot]

Attachment: Patch for index.html version 1.47 (checked in)

Checking in mozilla-org/html/projects/minimo/index.html;
/cvsroot/mozilla-org/html/projects/minimo/index.html,v  <--  index.html
new revision: 1.47; previous revision: 1.46
done

On top of all other changes announced in comment #13, I added 5 meta-data to describe bibliographical details about this webpage; I styled a few links with class="ex-ref". 

I removed <li><a href="/">Home</a></li> in the footer... and I now realize I should not have. I'll put it back in the next upcoming patch.

I now realized I forgot to float 2 images (minimologo and mytreo) on the left: will fix that in the upcoming patch.

Comment 18

[Gérard Talbot]

Doug, I believe filesize of installers (.exe = 3.6MB; .cab is 8.1MB) in that main entrance index.html webpage are welcomed and desirable info for users to get/see before actually downloading a file. Users on modem-slow-56KB connexion usually appreciate this as they can estimate how long download will take. I am letting you know about this since I don't want to overstep the scope of this bug.

Comment 19

[Doug Turner (:dougt)]

the flux a bit, but i can change it when we get a new release.  would you mind adding the sizes?

Comment 20

[Gérard Talbot]

I'll add the filesizes with coming patch.

> I styled a few links with class="ex-ref"

I should not have done that since usual m.o. stylesheets are not fetched. Removing with coming patch.

Comment 21

[Gérard Talbot]

I'm leaving this bug open for a few days. There are still issues to be addressed.

in index.html
- link rel="prefetch" will fetch the images but *I believe* href values must be exactly the same; either all relative or all absolute referencing. I need to test+verify this.
- the minimo.css could be improved and optimized in many ways
  o   font-size: 11px; : this makes the font-size rigid in many user agents (e.g. MSIE 6, MSIE 7): "avoid absolute length units for screen display Do not specify the font-size in pt, or other absolute length units for screen stylesheets. They render inconsistently across platforms and can't be resized by the User Agent (e.g browser). (...) Use relative length units such as percent or (better) em" 
http://www.w3.org/QA/Tips/font-size
  o font-family: Lucida Grande, Verdana, sans-serif;
should be
    font-family: "Lucida Grande", Verdana, sans-serif;
  o overall, the minimo.css over-declares, over-defines (margin, padding, text-align): that stylesheet can be optimized, compressed 

In the minimo project webpages, there are about 15 links with the link text: "click here", "here", "there". e.g. develop.html has 3 "here" links. Most of them  could be improved:
W3C Quality Assurance tip for webmasters
Don't use "click here" as link text
http://www.w3.org/QA/Tips/noClickHere
"Begin Link Names with the Most Important Keyword"
http://www.useit.com/alertbox/20020512.html
In another article, J. Nielsen recommends to provide predictive information in the link text itself.

Comment 22

[Gérard Talbot]

>   o   font-size: 11px; : 

Another reason: "Avoid overriding the user's default font size. (...) 
Strive to find font settings that are readable on the majority of systems for a cross section of users with the default settings.
As a result of the above, reduce the complexity and file size of the style sheets to allow for less troublesome maintenance in the future."
http://www.mozilla.org/projects/website/index.html

Comment 23

[Gérard Talbot]

Doug,

I'm resolving this bug. I've made the prefetched links relative in the main project page.

What else/more needs or would need to be done?

1- optimize the file minimo.css: there are many good articles available on the web for this. Reducing the markup (DOM tree) in the main project page is doable.

2- make the minimo.css more accessible e.g. avoid rigid font-size
Mobile Web Best Practices 1.0, Basic Guidelines
W3C Proposed Recommendation 2 November 2006
"Do not use pixel measures and do not use absolute units in markup language attribute values and style sheet property values. (...) check the values of font-size are not absolute or pixels."
http://www.w3.org/TR/mobile-bp/#iddiv4126745624

Making small devices look great
"Be careful with the use of colors, font sizes, and alignment"
http://my.opera.com/community/dev/device/

Making Small Devices Look Great
Authoring for Small-Screen Rendering
http://my.opera.com/community/dev/device/ssr/

3- improve/upgrade some 15 link text (like "here", "click here") so that they become more self-explanatory, intuitive, more predictive.

The decision is yours.

Resolving as FIXED

Comment 24

[Doug Turner (:dougt)]

i would love to have a small screen css applied across m.o.  I will email you direction.  This bug as it is written is done. :-)