Skip to content

Instantly share code, notes, and snippets.

@mbostock

mbostock/.block

Last active February 9, 2016 01:22
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save mbostock/2941604 to your computer and use it in GitHub Desktop.
Save mbostock/2941604 to your computer and use it in GitHub Desktop.
Download ZIP
W3C Validation Errors
Raw
.block
height: 1910
license: gpl-3.0
Raw
README.md

Source: W3CLove.

Pie charts are intended to show how one value compares to the whole. Since validation errors are not mutually exclusive (a single page can fail validation for multiple reasons), and the top 10 (or 100) reasons constitute an arbitrary whole, a bar chart is more suitable.

Raw
errors.json
[
{"name":"required attribute \"alt\" not specified","value":1392075},
{"name":"& did not start a character reference. (& probably should have been escaped as &.)","value":764450},
{"name":"end tag for \"img\" omitted, but OMITTAG NO was specified","value":663765},
{"name":"end tag for \"br\" omitted, but OMITTAG NO was specified","value":502366},
{"name":"an attribute value specification must be an attribute value literal unless shorttag yes is specified","value":463999},
{"name":"an attribute value must be a literal unless it contains only name characters","value":337970},
{"name":"required attribute \"type\" not specified","value":293050},
{"name":"document type does not allow element \"div\" here; missing one of \"object\", \"applet\", \"map\", \"iframe\", \"button\", \"ins\", \"del\" start-tag","value":274987},
{"name":"document type does not allow element \"p\" here; missing one of \"object\", \"applet\", \"map\", \"iframe\", \"button\", \"ins\", \"del\" start-tag","value":202423},
{"name":"document type does not allow element \"li\" here; missing one of \"ul\", \"ol\", \"menu\", \"dir\" start-tag","value":196060},
{"name":"an img element must have an alt attribute, except under certain conditions. for details, consult guidance on providing text alternatives for images.","value":164988},
{"name":"end tag for \"input\" omitted, but OMITTAG NO was specified","value":160066},
{"name":"end tag for \"p\" omitted, but OMITTAG NO was specified","value":142452},
{"name":"end tag for \"ul\" which is not finished","value":142081},
{"name":"end tag for element \"a\" which is not open","value":115545},
{"name":"document type does not allow element \"div\" here; missing one of \"applet\", \"object\", \"map\", \"iframe\", \"button\" start-tag","value":115358},
{"name":"end tag for \"li\" omitted, but OMITTAG NO was specified","value":101451},
{"name":"element \"div\" undefined","value":98741},
{"name":"reference to entity \"action\" for which no system identifier could be generated","value":93877},
{"name":"document type does not allow element \"link\" here","value":91422},
{"name":"document type does not allow element \"a\" here","value":84233},
{"name":"reference to entity \"id\" for which no system identifier could be generated","value":82970},
{"name":"document type does not allow element \"div\" here; missing one of \"object\", \"ins\", \"del\", \"map\", \"button\" start-tag","value":82761},
{"name":"end tag for element \"div\" which is not open","value":82144},
{"name":"document type does not allow element \"input\" here; missing one of \"p\", \"h1\", \"h2\", \"h3\", \"h4\", \"h5\", \"h6\", \"div\", \"pre\", \"address\", \"fieldset\", \"ins\", \"del\" start-tag","value":80011},
{"name":"document type does not allow element \"li\" here; missing one of \"ul\", \"ol\" start-tag","value":77854},
{"name":"character data is not allowed here","value":73051},
{"name":"there is no attribute \"width\"","value":72246},
{"name":"attribute property not allowed on element meta at this point.","value":72024},
{"name":"end tag for \"meta\" omitted, but OMITTAG NO was specified","value":71601},
{"name":"document type does not allow element \"style\" here","value":70476},
{"name":"reference to entity \"nbsp\" for which no system identifier could be generated","value":69629},
{"name":"reference to entity \"widgetid\" for which no system identifier could be generated","value":69565},
{"name":"syntax of attribute value does not conform to declared value","value":66937},
{"name":"element meta is missing one or more of the following attributes: http-equiv, itemprop, name.","value":65735},
{"name":"document type does not allow element \"meta\" here","value":64134},
{"name":"reference to entity \"cat\" for which no system identifier could be generated","value":60781},
{"name":"there is no attribute \"height\"","value":60035},
{"name":"end tag for \"div\" omitted, but OMITTAG NO was specified","value":59892},
{"name":"an attribute specification must start with a name or name token","value":59374},
{"name":"bad value category tag for attribute rel on element a: keyword category is not registered.","value":58762},
{"name":"consecutive hyphens did not terminate a comment. -- is not permitted inside a comment, but e.g. - - is.","value":57425},
{"name":"document type does not allow element \"div\" here","value":56466},
{"name":"reference to entity \"widgettype\" for which no system identifier could be generated","value":54850},
{"name":"document type does not allow element \"option\" here","value":54802},
{"name":"reference to entity \"sectionid\" for which no system identifier could be generated","value":53532},
{"name":"value of attribute \"align\" cannot be \"absmiddle\"; must be one of \"top\", \"middle\", \"bottom\", \"left\", \"right\"","value":52637},
{"name":"element \"g:plusone\" undefined","value":50184},
{"name":"end tag for \"link\" omitted, but OMITTAG NO was specified","value":50006},
{"name":"reference to entity \"postid\" for which no system identifier could be generated","value":48854},
{"name":"character \"/\" is not allowed in the value of attribute \"id\"","value":47406},
{"name":"document type does not allow element \"script\" here","value":47169},
{"name":"document type does not allow element \"p\" here; missing one of \"object\", \"ins\", \"del\", \"map\", \"button\" start-tag","value":47167},
{"name":"element \"br\" undefined","value":46530},
{"name":"NET-enabling start-tag not immediately followed by null end-tag","value":45105},
{"name":"there is no attribute \"src\"","value":44667},
{"name":"end tag for element \"p\" which is not open","value":44416},
{"name":"document type does not allow element \"tr\" here","value":44374},
{"name":"there is no attribute \"href\"","value":43999},
{"name":"there is no attribute \"target\"","value":43848},
{"name":"the width attribute on the td element is obsolete. Use CSS instead.","value":43173},
{"name":"element \"a\" undefined","value":42579},
{"name":"end tag for \"a\" omitted, but OMITTAG NO was specified","value":42486},
{"name":"the frameborder attribute on the iframe element is obsolete. Use CSS instead.","value":42393},
{"name":"there is no attribute \"allowtransparency\"","value":41756},
{"name":"the align attribute on the td element is obsolete. Use CSS instead.","value":41471},
{"name":"end tag for \"option\" omitted, but OMITTAG NO was specified","value":41181},
{"name":"there is no attribute \"property\"","value":40952},
{"name":"document type does not allow element \"td\" here","value":40645},
{"name":"there is no attribute \"name\"","value":39828},
{"name":"there is no attribute \"border\"","value":39069},
{"name":"end tag for element \"td\" which is not open","value":38553},
{"name":"reference to entity \"type\" for which no system identifier could be generated","value":38548},
{"name":"element \"iframe\" undefined","value":38229},
{"name":"end tag for element \"span\" which is not open","value":36688},
{"name":"the valign attribute on the td element is obsolete. Use CSS instead.","value":35955},
{"name":"element \"noindex\" undefined","value":35183},
{"name":"document type does not allow element \"li\" here","value":34723},
{"name":"element \"td\" undefined","value":34008},
{"name":"element \"variable\" undefined","value":33992},
{"name":"the cellspacing attribute on the table element is obsolete. Use CSS instead.","value":33090},
{"name":"the cellpadding attribute on the table element is obsolete. Use CSS instead.","value":32300},
{"name":"end tag for \"variable\" omitted, but OMITTAG NO was specified","value":32142},
{"name":"the scrolling attribute on the iframe element is obsolete. Use CSS instead.","value":31772},
{"name":"reference to entity \"w\" for which no system identifier could be generated","value":31699},
{"name":"reference to entity \"h\" for which no system identifier could be generated","value":31497},
{"name":"reference to entity \"itemid\" for which no system identifier could be generated","value":31319},
{"name":"character \";\" not allowed in attribute specification list","value":31139},
{"name":"end tag for \"tr\" omitted, but OMITTAG NO was specified","value":30930},
{"name":"there is no attribute \"type\"","value":30620},
{"name":"there is no attribute \"align\"","value":30159},
{"name":"element \"font\" undefined","value":29676},
{"name":"the name and vi delimiter can be omitted from an attribute specification only if shorttag yes is specified","value":29542},
{"name":"end tag for element \"options\" which is not open","value":29330},
{"name":"reference to entity \"title\" for which no system identifier could be generated","value":29229},
{"name":"element \"embed\" undefined","value":29099},
{"name":"there is no attribute \"size\"","value":28937},
{"name":"element p not allowed as child of element span in this context. (suppressing further errors from this subtree.)","value":28691},
{"name":"end tag for \"td\" omitted, but OMITTAG NO was specified","value":28528},
{"name":"reference to entity \"mibenumid\" for which no system identifier could be generated","value":26944}
]
Raw
index.html
<!DOCTYPE html>
<meta charset="utf-8">
<title>W3C Validation Errors</title>
<style>
text {
font: 10px sans-serif;
}
rect.value {
fill: #aaa;
}
rect.value:hover {
fill: steelblue;
}
text.name {
fill: black;
text-shadow: 0 1px 1px #fff;
pointer-events: none;
}
.axis {
shape-rendering: crispEdges;
}
.axis path {
fill: none;
}
.x.axis path {
display: none;
}
.x.axis line {
stroke: #fff;
stroke-opacity: .8;
}
.y.axis line {
stroke: black;
}
</style>
<body>
<script src="//d3js.org/d3.v3.min.js"></script>
<script>
var margin = {top: 30, right: 10, bottom: 10, left: 30},
width = 960 - margin.left - margin.right,
height = 1950 - margin.top - margin.bottom;
var x = d3.scale.linear()
.range([0, width]);
var y = d3.scale.ordinal()
.rangeRoundBands([0, height], .1);
var svg = d3.select("body").append("svg")
.attr("width", width + margin.left + margin.right)
.attr("height", height + margin.top + margin.bottom)
.append("g")
.attr("transform", "translate(" + margin.left + "," + margin.top + ")");
d3.json("errors.json", function(error, errors) {
if (error) throw error;
errors.sort(function(a, b) { return b.value - a.value; });
// Set the scale domain.
x.domain([0, d3.max(errors, function(d) { return d.value; })]);
y.domain(d3.range(errors.length));
svg.selectAll(".value")
.data(errors)
.enter().append("rect")
.attr("class", "value")
.attr("y", function(d, i) { return y(i); })
.attr("width", function(d) { return x(d.value); })
.attr("height", y.rangeBand());
svg.append("g")
.attr("class", "x axis")
.call(d3.svg.axis()
.scale(x)
.orient("top")
.ticks(12)
.tickSize(-height));
svg.selectAll(".name")
.data(errors)
.enter().append("text")
.attr("class", "name")
.attr("x", 6)
.attr("y", function(d, i) { return y(i) + y.rangeBand() / 2; })
.attr("dx", -3)
.attr("dy", ".35em")
.text(function(d) { return d.name; });
svg.append("g")
.attr("class", "y axis")
.append("line")
.attr("y2", height);
});
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment