html
Aias
Every element is an html.
Can I include?
A WebsiteThis site helps you understand which tag you can include in another using the WHATWG HTML specification.
So many little design helper sites!
An Article by Chris CoyierI’m sure y’all find these things just as useful as I do. They don’t make us lazy, they make us efficient. I know how to make a pattern. I know how to draw a curve with a Pen Tool. I know how to convert SVG into JSX. But using a dedicated tool makes me faster and better at it. And sometimes I don’t know how to do those things, but that doesn’t mean I can’t take advantage. Fake it ’til you make it, right?
Element diversity
An Article by Manuel MatuzovicDid you know that there are 112 elements in HTML?!
It would be a bit too easy to only blame JS frameworks [for the overuse of
div
s]; there are several reasons we use divs so much:- Poor knowledge of HTML elements
- Lack of understanding why
- Insufficient CSS skills
- Default styles
- JS frameworks
- We don't care enough about the page
- Some elements are hard to style
Guidelines for Brutalist Web Design
An Article by David Bryant Copeland- Content is readable on all reasonable screens and devices.
- Only hyperlinks and buttons respond to clicks.
- Hyperlinks are underlined and buttons look like buttons.
- The back button works as expected.
- View content by scrolling.
- Decoration when needed and no unrelated content.
- Performance is a feature.
This page is a truly naked, brutalist html quine
An Article by Leon BambrickI decided to make a truly naked, brutalist html page, that is itself a quine. And this page is it.
Viewing the source of this page should reveal a page identical to the page you are now seeing. Nothing is hidden. It's a true "What you see is what you get."
this vs. that
A Website by Phuoc NguyenThe Great Divide
An Article by Chris CoyierOn one side, an army of developers whose interests, responsibilities, and skill sets are heavily revolved around JavaScript.
On the other, an army of developers whose interests, responsibilities, and skill sets are focused on other areas of the front end, like HTML, CSS, design, interaction, patterns, accessibility, etc.
HTML Elements Memory Test
A WebsiteMy first attempt was 54. Not even half!
How many HTML elements can you remember?
Painting With the Web
So much about [Gerhard Richter's painting process] reminds me of designing and building for the Web: The unpredictability, the peculiarities of the material, the improvisation, the bugs, the happy accidents. There is one crucial difference, though. By using static wireframes and static layouts, by separating design and development, we are often limiting our ability to have that creative dialogue with the Web and its materials. We are limiting our potential for playful exploration and for creating surprising and novel solutions. And, most importantly, we are limiting our ability to make conscious, well-informed decisions going forward. By adding more and more layers of abstraction, we are breaking the feedback loop of the creative process.
A constant dialogue
Have you ever seen Gerhard Richter painting?
It is phenomenal to watch. He might start one of his large, abstract paintings by carefully applying oil paint to the canvas with a thick brush. Then, he begins to scrape, smear, or add new layers of paint with a large, home-made squeegee. After each change, Richter pauses, takes a step back, and looks at the result: What did just happen with the picture? What composition has come about? Where have interesting parts emerged? What is the next move that might bring the piece one step closer to completion? And which action would be a mistake? There is a lot of intention and carefulness in this process, yet Richter equally respects the results of accident and chance. He lets go of a certain kind of control to let things happen that are surprising and exciting. But at the same time, Richter always exerts enough control to influence the result. He decides what to keep and what to destroy. It is the ultimate creative process: a constant dialogue.
Constant reflection and refinement
Ask any artist, musician, or writer and they might tell you that this conversation at the heart of the creative process is what makes their work special and so fulfilling. No piece of art exists in its final form in the head of the artist before the first brush stroke is put on the canvas. No musician has a full piece of music in her head without a conversation with instruments or the score. And no novel is done before the first word is put on paper or a computer screen. Constant reflection and refinement are key to creating any piece of work. This is what lets creators of any profession learn and grow, and, ultimately, achieve mastery. And the same is true for any user interface, design pattern, piece of code, or content on the Web.