The IE 10 browser joins hands with hit fm to launch a new official website based on html5. the new official website provides visual effects including Live Streaming real-time listening and paging Parallax, as well as new features such as immersive interfaces for touch. Early official website problems:
- The previous hit fm official website was designed with monotonous features and low response efficiency.
- In the face of almost becoming a standard multi-touch screen and Touch Experience Requirements, the new hit fm official website needs to fully consider the optimization of user touch operations from the design perspective.
- In today's chaotic device resolutions, in addition to traditional desktop computers, more and more users are starting to use smartphones, tablets, and other mobile devices to browse webpages, traditional fixed-style pages cannot meet such requirements.
Solution:
Due to IE10's support for HTML5 standards and hardware acceleration features, the revised official website can be listened online with only a minimum bandwidth of kbps, related Software Engineers converted MMS streaming media into HTML5-supported Audio streaming media formats, and used the <Audio> tag supported by html5, this allows the audience to listen to mainstream desktop or mobile platform browsers such as IE 10, Safari, Chrome, and Firefox without any browser plug-ins, solved the problem that WMP plug-in must be used to listen to broadcast stations online. The Optimization for touch operations is not only manifested in the use of high-definition big charts and large-size icons on the entire page, but also fully considered in some slide operations and special effects, access from different devices (smartphones, tablets, and ultrabodes) is optimized one by one. At the same time, IE 10 further reduced the screen area occupied by its own interface, and reduced the pixel area occupied by windows and controls to 0, the entire browser window can be used to display webpage content completely without borders, buttons, and input columns. Smooth touch operations are also improved in terms of visual effects. Webpage engineers use the Transform and Transition deformation processing in CSS3 to achieve the website Transition effect, so that the website has smooth and fast loading performance. The HTML5 standard and the Media Query attribute in CSS3 are used to implement responsive design for the page. The entire layout can adapt to the screen and resolution, and provide the same friendly Web interface for different users. To ensure continuous listening, engineers have adopted the newly added History API feature in the HTML5 webpage standard to implement full-site AJAX. When users click content, the page only loads the content to be updated without loading the outer frame, which reduces the user traffic consumption in the mobile data network. The preceding solution is based on the Windows platform. With IE10 and HTML5 standards, Web browsing is as smooth as opening a local application. At the same time, IE10 allows Web applications to take advantage of the unified and cross-platform advantages.