Responsive and Accessible WebGL Text

Read the article Code All demos

THREE.JS

RESPONSIVE AND ACCESSIBLE TEXT

THIS TEXT IS STYLED TO LOOK LIKE A TYPICAL BLOCK OF TEXT ON A STANDARD WEBSITE. BUT UNDER THE SURFACE, IT’S BEING RENDERED WITH WEBGL INSTEAD OF TRADITIONAL HTML.

THIS OPENS THE DOOR TO CUSTOM SHADER EFFECTS AND INTERACTIONS THAT GO BEYOND WHAT’S POSSIBLE WITH TRADITIONAL HTML.

WE KEEP THE UNDERYLING HTML STRUCTURE PRESENT IN THE DOM. RATHER THAN CREATING MESHES DIRECTLY IN THREE.JS, THE SCENE IS BUILT BY READING FROM THE EXISTING HTML CONTENT. THIS WAY, SCREEN READERS, SEARCH ENGINES, AND OTHER TOOLS CAN STILL INTERPRET THE PAGE AS EXPECTED.