Articles by Denis Potschien

Google Profile: http://plus.google.com/108355723592614585569/posts

Development

SweetAlert.js: A Prettier and More Flexible Alternative to alert(0)

July 10th, 2015
by
sweetalert

Websites have become more comprehensive and complex applications over time. Website interactions are often confirmed with an alert. The browser’s standard warning suffices for most cases; however, it looks pretty terrible. With SweetAlert, you can easily create animated alerts that, additionally, provide more functions than the boring standard. Include SweetAlert and Get Started SweetAlert comes from the digital pen of the Stockholm-based developer Tristan...

Development

Easy Typography Animations: How to Manipulate Texts with Blast.js and jQuery

July 3rd, 2015
by
blastjs-teaser_EN

CSS and JavaScript provide access to all the elements of an HTML document – of course also to texts; however, this is limited to titles and paragraphs. Accessing single sentences and words is not that comfortable; unless they are wrapped, for example, with “<span>” elements.  The JavaScript library Blast.js makes sentences, words, and single characters accessible through CSS and JavaScript. This is a real...

Development

Textures.js: SVG Textures in All Shapes and Colors

June 26th, 2015
by
texturesjs-teaser_EN

The SVG format provides various options for realizing complex graphical content. Among other things, you can create textures and add them to shapes using the <pattern> element. Especially when using simple and common textures, the effort marking them up via SVG is, compared to the result, unreasonably high. Hence, the JavaScript library Texture.js provides such textures that mostly consist of lines and dots for...

Design

Chartist.js Creates Responsive, Animated Charts with SVG

June 12th, 2015
by
chartistjs-teaser_EN

Numbers and statistics are usually bone-dry and sometimes not really clarify but obscure even more. By visualizing data with charts, you can attract much more attention. The JavaScript library Chartist.js from Zurich turns as many numerical sequences as you like into easy to understand bar, line, pie, or other charts. They not only look good but are also responsive and can be jazzed up...

Design

Lining.js: Controlling Text Lines per CSS Selector

May 30th, 2015
by
Lining.js: Controlling Text Lines per CSS Selector

The numerous available CSS selectors let us easily access almost each and every HTML element on any given page. The pseudo-element ::first-line even allows us to apply CSS properties to the first line of text in a document, no matter whether the line is automatically or manually wrapped. Unfortunately, besides ::first-line there are no selevtors to manipulate the second, third, last or whichever line. The...

Business Online

How Does Google’s New Ranking Factor Mobile-Friendly Affect Your Website?

May 29th, 2015
by
mobilefriendly-teaser_EN

Google has been changing its search algorithm time and again to deliver better search results. Factors like keywords, link building, and loading performance play a key role in how Google ranks a website. On April 21st Google officially issued a new ranking factor: the mobile-friendliness of a website. How is this going to affect site operators and what does mobile-friendliness mean from Google’s point...

Design

Stitches: Free CSS Sprite Generator

May 22nd, 2015
by
stitches-css-teaser_EN

As we know, less files to download mean better loading performance and page reproduction. Therefore, icons and other images, particularly small images, are often combined into a sprite. A sprite is a collection of several images put into one image file. Creating a sprite manually requires some work. The images are arranged in an image file and their position, width, and height need to be...

Boilerplates & Other Tools

WebAnimator Plus: Sophisticated HTML5 Animations Made Easy

May 18th, 2015
by
webanimator_landingpage

Not too long ago, Flash was an established element of the web. Did you need anything related to animation, you were more or less doomed to use it. Of course Flash was the top dog – the alpha male – and alternatives didn’t exist. But that was only one-half of its success. The second half was its ease of use. Flash videos were created...

Development

Animsition: User-Friendly jQuery-Plugin for Animated Page Transitions

May 15th, 2015
by
animsition

JavaScript along with CSS3 make it easy to create website animations. Some use CSS3 animations to pimp page transitions within a website. The current Cascading Stylesheets version allows you to create simple fade-in and slide-in effects as well as 3D transitions to other pages. The fairly new jQuery plugin “Animsition” helps to easily integrate such animated page transitions into your web project. Incorporate Data,...

Design

HTML5: Screen Orientation API Uses Javascript to Rotate the Screen

May 8th, 2015
by
html5-screenorientationapi-teaser

Media queries allow websites to adjust their layout depending on the screen orientation of a smartphone or tablet. But sometimes you may want your website locked to a particular orientation, portrait or landscape. The format of native apps can be specified in such a case. The app will then only be displayed in the preset format – independently from the actual device orientation. By...