Denis Potschien

  • Coming to a Screen Near You: CSS3 Animations and The New JavaScript Method Animate()

    With CSS3 animations in HTML documents have become fairly easy to achieve. Using the "@keyframes" rule various properties such as position and size of an HTML element get defined. Then the property "animation" cares for getting the keyframes up and running according to their definitions. Without the need for JavaScript and plug-ins we are able to create even complex animations, that run most flawlessly in all modern browsers. Problems occur as soon as you need to get JavaScript to enter the game of creating CSS3 animations. We all know, JavaScript is more often than not unavoidable as we need to calculate individual values or an animation process as a whole.

    Read more 
  • CSS3: Viewport Units – New Units for Responsive Designs

    Developing web designs that adjust to the width or – if needed – the height of a browser window is easy with percentage-based values. You will probably be doing this on a daily basis, optimizing your website for tablets and smartphones. No matter the element, text blocks, images, everything adjusts to the size given.

    Read more 
  • Adobe’s Snap.svg: Animations With HTML 5, Without Flash

    Flash has long been the standard for vector-based web animations. Some say for too long. The rise of mobile clients led to an acceleration of web standards such as HTML5. Thanks to the SVG formats, which is widely supported by modern browsers, we are able to embed vector-based graphics into our web projects without the need for a plug-in. Adobe’s JavaScript library Snap.svg even allows for the creation of vector-based animations with SVG.

    Read more 
  • Styling SVG with CSS: Capabilities and Limitations

    SVG is the new standard for vector images in the browser. Vector editors such as Adobe Illustrator allow to directly save to that format and modern browsers have no problems to properly display SVG. As SVG graphics consist of markup, they can be created and maintained using your favorite text editor, just as you do with your HTML. It is even possible to style SVG with CSS, though you’ll need to know about quite a few differences in doing so, compared to styling HTML.

    Read more 
  • SVG and JavaScript: What Is Possible, What To Consider?

    SVG has been around for quite some time now, waiting. Waiting for proper browser support. The wait is now over as all modern browsers support the format today. With Flash being on the decline, SVG has grown even more popular. Just like the proprietary Flash format, SVG is vector-based and can even contain animations. You need not even miss out on scripting, as SVG supports JavaScript right inside its own format. Think of an open ActionScript, only more commonly known.

    Read more 
  • HTML 5 and SVG: Providing a PNG Fallback with PHP and ImageMagick

    Using SVG in web design has many advantages. Being a vector format is the biggest and has it standing out from the crowd of other image formats. You could have guessed, though, that while modern browsers do already support SVG, the good ole Internet Exploder doesn’t, at least not below version 9. As older versions of Internet Explorer are still out there in the wild, you should always consider implementing a fallback solution. Using PHP and ImageMagick makes it a snap to provide a fallback to PNG..

    Read more 
  • Codeblock.js: Edit and Run JavaScript Directly from Within Your Browser

    Talking about introducing JavaScript frameworks, libraries or just step by step tutorials, it is always useful, if you are able to support all your words by a handful of fitting live examples. So, instead of just posting dead code snippets, would it not be far better, if you could embed JavaScript in a way that it can be edited and run by your readers, without forcing them to download examples and what not first? That’s what Codeblock.js offers…

    Read more 
  • HTML5: FileSystem API – Create Files and Store Them Locally Using JavaScript and Webkit

    The FileSystem-API allows the creation of files and folders as well as their local storage using JavaScript. Files can be simple text files, but even more complex files such as images are possible. Modern Webkit browsers with HTML5 support are already able to handle the FileSystem-API. We show you how you can benefit from the new possibilities.

    Read more 
  • Let It Snow: Festive Resources to Santa up Your Website

    In these special times we tend to not only decorate houses, streets, the whole country, basically. We don’t even leave our websites untouched. Christmassy looks are mandatory these days. If you are on the lookout for a bunch of effects to implement on your blog, portfolio, whatever, look no further. We have compiled a small collection of just what you need to bring that Santa sparkle to the eyes of your visitors.

    Read more 
  • CSS3: InDesign-Like Text Formatting with Exclusions and Regions


    It’s Adobe again. They made two proposals to a coming standard, which would lead to the possibility to format and present texts on websites just as we already know it from DTP software such as InDesign. With Exclusions we will be able to let text flow in any shapes and forms, while Regions will allow us to split texts between two or more HTML elements.

    Read more 
search form
image description image description