Flash has not been available on multiple platforms for a long time. With this is mind, we thought it might be useful to write an article about the basics of replacing Flash. At its core, the following article deals with the following question: What is HTML5 (important technology in the creation process of a 3D configurator) and what are its components?
First of all, we have to mention that HTML5 Creative is nothing new, because the industry has been using HTML5 Creative for many years. The difference lies in the advanced capabilities of the latest HTML5 specification, which represents a big leap forward to HTML4 and can replace Flash. A few major differences to HTML5 are that it enables animation and responsive/adaptive design.
HTML5 vs. Flash files.
A major difference between a Flash and HTML5 file is that a .swf file was just one file that contained all the image files in that file (except for .flv Flash video files that were obtained externally).
Image components.
HTML5 file package consist of an .html file that points to the source of each image that you need. Different types of image files are used depending on the requirements of each image component. Many graphics such as boxes and shadows can be created with HTML code to minimize file size. Choosing the right image formats to optimize creative work is both art and science.
Video components.
If the HTML5 contains Creative Videos, it is necessary to use multiple video file formats such as .mp4 and .webm, as these formats are supported by different browsers. If you are using an external player such as YouTube or Vimeo, you don`t need to worry about that as they will do the conversion for you.
The .html file.
HTML5 includes animation and responsive/adaptive design features that require CSS and JavaScript. The CSS and JavaScript can be included in the .html file or obtained externally from .css and .js files. Since every external call from the .html file slows down loading times, it may be better to include this code in the .html file.
HTML5 Design Tools.
HTML5 Design tools such as Flexitive can help designers and developers get creative faster. For example, our platform has a drag and drop interface that requires no code and automatically optimizes images, sizes, and code to achieve the best possible creative quality with the smallest possible file sizes.