Connect With WRD
feed via e-mail
feed via e-mail

Posts Tagged ‘HTML5’

HTML5 Please is an interactive compatibility chart of HTML5/CSS3 features to find out "in which browsers they are supported (or not)".

Using a smart search bar, it is possible to filter the results with browser or device support, type (HTML5 or CSS3 elements/properties) and more.

Every item is described shortly and an opinion on whether they should be used with fallbacks or polyfills (with links to them) are shared.

The site is simply a must-bookmark for anyone designing with the new web technologies and need a guide for quickly checking the support for each property/element.

HTML5 Please

  • Tags:
  • Filed under: Extras, Info, No License
  • 3 Comments
  • You'll remember the 2 previously shared and popular resources for quickly developing websites: Twitter Bootstrap and Foundation.

    Here is a powerful alternative named HTML KickStart which is a HTML5, CSS and jQuery-powered toolkit for easily creating any type of layouts with web elements in-rhythm.

    It has styles for grids, typography, forms, buttons, tables or lists and cross-browser eb elements like a JavaScript gallery, lightbox, breadcrumb navigation, menus with sub-menus and more.

    HTML KickStart

    HTML KickStart is focused on providing a clean, standards-compliant and cross-browser mark-up (for HTML,CSS and JS).

    The project is documented in detail, has examples for all elements and it is improved regularly.

    Loading screens are a part of almost any application (softwares, games, etc.) since forever.

    We also see them in HTML5 apps informing us that the resources to be used for the application is being downloaded and the status of the overall progress.

    PxLoader is a JavaScript library, that is built for the popular Cut The Rope game's HTML5 version, for downloading images, sound files or any other resource before any defined action (like activating the whole app).

    PxLoader

    It enables us to monitor download status with the help of progress + completed events and also lets us to prioritize the order in which items are downloaded.

    Such features make PxLoader not only a library to manage the download of resources but also a good fit for creating visual preloaders for HTML5 apps.

    Info: The demos of the resource don't work as the source video files are unavailable.

    Acorn Media Player is a jQuery plugin for creating a customizable HTML5 media player with support for accessibility.

    The player can be completely controlled with keyboard (with standard tab-based navigation), has screen-reader support + accessible themes and various other accessibility tweaks.

    There is also support for closed captions and a dynamic transcript generated from the selected captions is provided.

    Acorn jQuery Media Player

    Acorn Media Player can be themed with ease, can display videos in fullscreen, informs users on loading processes with loading + buffering indicators and can even remember the volume level used with HTML5 localStorage.

    The sliders (seek and volume) can either use jQuery UI's widgets or a custom one is provided as well and few other options exist (like the direction of the volume slider) for further customization.

    Few months ago, a WRD article: "9 Free JavaScript Libraries & Templates For Beautiful Web-Based Presentations" has shared great presentation engines built by web technologies.

    A new presentation framework is released recently -named Impress.js- which enables us to build very beautiful outputs.

    Slides can be by positioned, rotated and scaled on an infinite canvas with zoom in/out and 3D effects by making use of CSS3 transforms and transitions to create the awesomeness (which makes it only compatible with WebKit and the latest Firefox + IE browsers).

    And, for older browsers, Impress.js fallbacks to a standard presentation without the effects but by keeping the functionality.

    Impress.js

    Spine Mobile is a JavaScript framework, built on top of SpineJS, for building mobile web apps that look and feel native.

    The framework comes with specialized controllers, panel layout, hardware accelerated transitions and touch events.

    Apps are developed with HTML5-CSS3 and the easiest way of building Spine Mobile apps is with Hem, Spine.app, GFX and jQuery. Also, you'll need Node.js.

    It is well documented and there are open sourced examples to easily get started.

    Spine Mobile

    In the beginning of the web 2.0 trend, tag clouds were one of the most popular items of web design. And, they were (and still are) very useful in helping readers to easily locate the most-used tags.

    Afterwards, the Flash-powered animated tag canvas came and it conquered many websites. The Flash -kinda- died, HTML5 is now everywhere and the animated tag cloud is still here for the new web built without Flash.

    TagCanvas

    TagCanvas is an HTML5 canvas powered and animated tag cloud that has both standalone and jQuery plugin versions.

    It has support for text +images and can be shaped as a sphere, hcylinder or vcylinder.

    The resource has so many settings for maximum customization and works even in IE (thanks to ExplorerCanvas).

    Stitches is an open source HTML5-powered application for creating CSS sprites on the fly.

    With the help of a couple HTML5 APIs, images can be drag 'n' dropped and the sprite image + CSS rules are instantly generated.

    It uses Modernizr to check for drag-and-drop, FileReader, and canvas support (which are currently available only in Firefox and Chrome).

    A must-bookmark tool for saving time on creating sprites specially when there are too many images to merge.

    Stitches CSS Sprite Generator

    Player Framework is an open source video player framework for HTML5, Silverlight, Windows Phone and other platforms.

    It offers a JavaScript API for controlling the player where the API methods are the same on both the HTML5 and Silverlight versions.

    Such a consistency is very handy for using any of the versions as a fallback of the other with almost no extra coding.

    HTML5 Player Framework

    The framework has support for playlists using an array of media items or using a link to a media RSS feed.

    W3C timed text (TTML) for captions can be used and there are controls like volume, mute, fullscreen, poster-displaying.

    Player Framework is modular, can be extended easily and its look/feel can be customized using CSS.

  • Tags:
  • Filed under: Goodies, Media, Other License
  • 3 Comments
  • Lungo.js a framework, powered with HTML5, CSS3 and JavaScript, for creating mobile web apps.

    The applications created with it works in all of the popular platforms (iOS, Android, Blackberry and WebOs).

    It has support for touch events like tap, double-tap or swipe and doesn't use images (including the icons) as everything is vectorized.

    Lungo.js

    HTML5 features like WebSQL, geolocation, history or device orientation can all be used.

    A well-documented JavaScript API has methods for handling all the major stuff and Lungo.js is modular + completely customizable.

    Uptime Robot
    feed-holder
    FeedBurner
    • PSD to HTML
    • PSD to HTML
    • aXmag - Flash Page Flip Magazine Software, PDF to Flash Converter
      ManageWP