TE
TechEcho
Home24h TopNewestBestAskShowJobs
GitHubTwitter
Home

TechEcho

A tech news platform built with Next.js, providing global tech news and discussions.

GitHubTwitter

Home

HomeNewestBestAskShowJobs

Resources

HackerNews APIOriginal HackerNewsNext.js

© 2025 TechEcho. All rights reserved.

Periodic Table of the HTML Elements

105 pointsby cdlalmost 12 years ago

10 comments

staredalmost 12 years ago
Please, don&#x27;t use periodic table to visualize anything by elements. For elements it works great and is one of the most beautiful and useful visualization ever created (as it&#x27;s form is related to fundamental relation between elements).<p>For everything else (unless having a similar structure to elements), it&#x27;s awful, misleading and pointless. If I see such I am always wondering, is it: a tasteless designer, wannabe data scientist who know no other visualizations, or a science ignorant having no clue why Mendeleev&#x27;s table is structured in that particular way, or a salesman wanting to give it extra legit and make it sound more fundamental.<p>Just please, don&#x27;t.<p>Hint: just group things, in their own structure.
评论 #6291802 未加载
评论 #6291788 未加载
评论 #6291958 未加载
评论 #6291448 未加载
jloughryalmost 12 years ago
The author put some thought into arranging elements according to their relationships, something too often overlooked in &#x27;periodic table of $x$&#x27; mash-ups.<p>The more I look, the more I find. I am impressed.
评论 #6291028 未加载
jnealalmost 12 years ago
I&#x27;ve seen periodic tables like this in the past that were just, blah...But I still reluctantly clicked through and was amazed. This is beautiful and organized very well. I find myself clicking through various newer HTML5 elements I&#x27;ve never used.
pessimizeralmost 12 years ago
I can&#x27;t figure out what relationships this is supposed to be showing me, other than the color labeling a particular type of element according to the key on the bottom.<p>Why is it 18 columns wide? Why the asymmetry? What does it mean for an element to be on top of another?<p>I&#x27;m clicking around and I&#x27;m not seeing it.
评论 #6292556 未加载
jloughryalmost 12 years ago
It gives you something like a heat map of any web page. Cool! I keep finding little surprises hidden here.
mistercowalmost 12 years ago
That&#x27;s pretty cute. I was kind of hoping that singletons would be over on the far right in the &quot;noble gases&quot; column, as an analogy to reactivity, or perhaps some other analogy about nesting relationships.
TheBivalmost 12 years ago
As a biology and genetics grad, I can safely say that I never memorized the periodic table, but this looks like something I can commit to memory! Awesome, awesome work!
评论 #6290526 未加载
tantaloralmost 12 years ago
The arrangement could be improved in a few places,<p>1. i and em, and b and strong, should be related. They should appear in two column? e.g., i over em, b over strong<p>2. The most common form elements (input, select, textarea, button) should be near the top. select should be directly over option.
dnauticsalmost 12 years ago
what&#x27;s periodic about it? Isn&#x27;t it just a table?
评论 #6292156 未加载
评论 #6292075 未加载
评论 #6292440 未加载
pattlealmost 12 years ago
I get &quot;Error establishing a database connection&quot; in big letters when I try to visit your blog