Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What about creating the whole website within a CANVAS?

I am designing a new website from scratch and wondered what cons could have in developing the whole site within a <canvas> element.

I am aware of compatibility issues with IE6/7/8 but that's not important for this project. But I do care, for example, the Google search engine behavior and mobile compatibility.

The main reason why I chose this way is to have the possibility to code advanced effects and animations over elements and pictures which are not possible with pure HTML5/CSS.

like image 402
Pablo Armentano Avatar asked Aug 13 '12 03:08

Pablo Armentano


People also ask

How do you make a whole page in canvas?

Code to make canvas occupy full page :innerWidth; canvas. height = window. innerHeight; //Done! Enjoy full page canvas!

Can I embed a website in canvas?

You can embed a webpage inside a Canvas page. See this exampleLinks to an external site., which is a webpage from the CK12 webpage, which features text with links and embedded videos. If you don't have embedding code for what you want to embed, you can use the iframe code below to create your own embedding code.

What is canvas used for website?

<canvas> is an HTML element which can be used to draw graphics via scripting (usually JavaScript). This can, for instance, be used to draw graphs, combine photos, or create simple animations.


1 Answers

Canvas is an element for raster graphics. It's good for parts of the page, but not for whole page. Page is document. It needs to be machine readable too. If your whole website consists of canvas, then search engine bots, screen readers, browsers plugins, and other bits of software won't be able to access it. Creating a website with canvas is like preparing a document with paint program instead of word processor. It's possible but not practical. Could be a good idea for an experiment, but if you are doing this for production, then you should re-consider.

like image 85
valentinas Avatar answered Oct 05 '22 09:10

valentinas