Some SEO fixes.
This commit is contained in:
thednp
parent
cb48bf3c90
commit
92060dcaab
|
|
@ -9,8 +9,8 @@
|
|||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="About KUTE.js performance, project, code and a short glossary with most used terminology in Javascript animation.">
|
||||
<meta name="keywords" content="kute,kute.js,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="description" content="About KUTE.js performance, also about the KUTE.js project, code and a short glossary with most used terminology in Javascript animation.">
|
||||
<meta name="keywords" content="kute,kute.js,animation,javascript animation,tweening engine,animation engine,about kute.js,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="author" content="dnp_theme">
|
||||
<link rel="shortcut icon" href="./assets/img/favicon.png"> <!-- TO DO -->
|
||||
|
||||
|
|
|
|||
|
|
@ -9,8 +9,8 @@
|
|||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="A detailed API documentation on KUTE.js public methods.">
|
||||
<meta name="keywords" content="kute,kute.js,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="description" content="A detailed API documentation on KUTE.js public methods on how to create tween objects or how to control the tween animation.">
|
||||
<meta name="keywords" content="kute,kute.js,animation,javascript animation,tweening engine,animation engine,public methods,tween control,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="author" content="dnp_theme">
|
||||
<link rel="shortcut icon" href="./assets/img/favicon.png"> <!-- TO DO -->
|
||||
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="The Attributes Plugin for KUTE.js enables animation for any numeric presentation attribute.">
|
||||
<meta name="keywords" content="kute,kute.js,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="keywords" content="kute,kute.js,animation,javascript animations,tweening engine,animation engine,presentation attributes,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="author" content="dnp_theme">
|
||||
<link rel="shortcut icon" href="./assets/img/favicon.png"> <!-- TO DO -->
|
||||
|
||||
|
|
|
|||
|
|
@ -9,8 +9,8 @@
|
|||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="The CSS Plugin for KUTE.js extends the core engine with additional box model, color, border-radius and other properties.">
|
||||
<meta name="keywords" content="kute,kute.js,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="description" content="The CSS Plugin for KUTE.js extends the core engine with additional box model properties, color properties, border-radius, text properties and others.">
|
||||
<meta name="keywords" content="kute,kute.js,animation,javascript animation,tweening engine,animation engine,css,css3,border-radius,border-color,clip,background-position,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="author" content="dnp_theme">
|
||||
<link rel="shortcut icon" href="./assets/img/favicon.png"> <!-- TO DO -->
|
||||
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="A detailed API documentation on KUTE.js main methods, options and easing functions.">
|
||||
<meta name="keywords" content="kute,kute.js,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="keywords" content="kute,kute.js,animation,javascript animation,tweening engine,animation engine,easing,easing functions,cubic bezier easing,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="author" content="dnp_theme">
|
||||
<link rel="shortcut icon" href="./assets/img/favicon.png"> <!-- TO DO -->
|
||||
|
||||
|
|
|
|||
|
|
@ -9,8 +9,8 @@
|
|||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="Animation examples for KUTE.js core engine with most essential CSS properties and easing functions.">
|
||||
<meta name="keywords" content="kute,kute.js,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="description" content="Animation examples for KUTE.js core engine with most essential CSS and CSS3 properties, as well as all easing functions.">
|
||||
<meta name="keywords" content="kute,kute.js,animation,javscript animation,tweening engine,animation engine,css3 transform,box model,color,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="author" content="dnp_theme">
|
||||
<link rel="shortcut icon" href="./assets/img/favicon.png"> <!-- TO DO -->
|
||||
|
||||
|
|
|
|||
|
|
@ -9,8 +9,8 @@
|
|||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="A quick start guide for KUTE.js, CDN sources, NPM.">
|
||||
<meta name="keywords" content="kute,kute.js,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="description" content="A detailed guide how to extend or customize the functionality KUTE.js, with an example for a box-shadow plugin.">
|
||||
<meta name="keywords" content="kute,kute.js,animation,javascript animation,tweening engine,animation engine,extend,box-shadow animation,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="author" content="dnp_theme">
|
||||
<link rel="shortcut icon" href="./assets/img/favicon.png"> <!-- TO DO -->
|
||||
|
||||
|
|
|
|||
|
|
@ -9,8 +9,8 @@
|
|||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="The KUTE.js features overview.">
|
||||
<meta name="keywords" content="kute,kute.js,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="description" content="An in-depth overview with all KUTE.js features, browser compatibility and performance.">
|
||||
<meta name="keywords" content="kute,kute.js,animation,javascript animation,tweening engine,animation engine,kute.js fetures,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="author" content="dnp_theme">
|
||||
<link rel="shortcut icon" href="./assets/img/favicon.png"> <!-- TO DO -->
|
||||
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="KUTE.js is a minimal Javascript animation engine">
|
||||
<meta name="keywords" content="kute,kute.js,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="keywords" content="kute,kute.js,animation,javascript animation,tweening engine,animation engine,morph svg,draw svg,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="author" content="dnp_theme">
|
||||
<link rel="shortcut icon" href="./assets/img/favicon.png"> <!-- TO DO -->
|
||||
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="KUTE.js tween options refference on most common options as well as property or plugin specific.">
|
||||
<meta name="keywords" content="kute,kute.js,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="keywords" content="kute,kute.js,animation,javascript animation,tweening engine,animation engine,kute.js tween options,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="author" content="dnp_theme">
|
||||
<link rel="shortcut icon" href="./assets/img/favicon.png"> <!-- TO DO -->
|
||||
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="The complete list of supported CSS properties, presentation attributes and other DOM animations for KUTE.js.">
|
||||
<meta name="keywords" content="kute,kute.js,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="keywords" content="kute,kute.js,animation,javascript animation,tweening engine,animation engine,css properties,css3 animation,kute.js supported properties,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="author" content="dnp_theme">
|
||||
<link rel="shortcut icon" href="./assets/img/favicon.png"> <!-- TO DO -->
|
||||
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="A quick start guide for KUTE.js, CDN sources, NPM.">
|
||||
<meta name="keywords" content="kute,kute.js,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="keywords" content="kute,kute.js,animation,tweening engine,animation engine,getting started with kute.js,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="author" content="dnp_theme">
|
||||
<link rel="shortcut icon" href="./assets/img/favicon.png"> <!-- TO DO -->
|
||||
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="The SVG Plugin for KUTE.js enables animation for path morphing, drawing stroke, as well as some SVG specific CSS properties.">
|
||||
<meta name="keywords" content="kute,kute.js,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="keywords" content="kute,kute.js,animation,javascript animation,tweening engine,animation engine,morph svg,draw svg,svg animation,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="author" content="dnp_theme">
|
||||
<link rel="shortcut icon" href="./assets/img/favicon.png"> <!-- TO DO -->
|
||||
|
||||
|
|
@ -80,10 +80,10 @@
|
|||
|
||||
<div class="content-wrap">
|
||||
<h2>SVG Plugin</h2>
|
||||
<p>The SVG Plugin for KUTE.js extends the core engine and enables animation for various CSS properties specific to SVG elements as well as morphing path shapes. We'll dig into this in great detail as well as provide valuable tips on how to configure your animation for best performance and visual aesthetics. The SVG Plugin is very light, maybe one of the lightest out there, still, you will find it to be very powerful and flexible.</p>
|
||||
<p>The SVG Plugin for KUTE.js extends the core engine and enables animation for various SVG specific CSS properties, as well as SVG morphing of path shapes. We'll dig into this in great detail as well as provide valuable tips on how to configure your animation for best performance and visual aesthetics. The SVG Plugin is very light, maybe one of the lightest out there, still, you will find it to be very powerful and flexible.</p>
|
||||
<p>Keep in mind that older browsers like Internet Explorer 8 and below as well as stock browser from Android 4.3 and below <a href="http://caniuse.com/#search=svg" target="_blank">do not support inline SVG</a> so make sure to fiter out your SVG tweens.</p>
|
||||
<h3>Shape Morphing</h3>
|
||||
<p>One of the most important parts of the plugin is the shape morphing capability. It only applies to inline <code><path></code> and <code><glyph></code> SVG elements, with closed shapes (their <code>d</code> attribute ends with <code>z</code>). On initialization or animation start, depending on the chosen KUTE.js method, it will <a href="http://phrogz.net/SVG/convert_path_to_polygon.xhtml" target="_blank">sample a number of points</a> along the two paths based on a default / given sample size and will create two arrays with these points, the arrays that we need for interpolation. Further more, with a set of options we can then rearrange / reverse these arrays to optimize and / or maximize the visual effect of the morph:</p>
|
||||
<h3>SVG Morphing</h3>
|
||||
<p>One of the most important parts of the plugin is the SVG morphing capability. It only applies to inline <code><path></code> and <code><glyph></code> SVG elements, with closed shapes (their <code>d</code> attribute ends with <code>z</code>). On initialization or animation start, depending on the chosen KUTE.js method, it will <a href="http://phrogz.net/SVG/convert_path_to_polygon.xhtml" target="_blank">sample a number of points</a> along the two paths based on a default / given sample size and will create two arrays with these points, the arrays that we need for interpolation. Further more, with a set of options we can then rearrange / reverse these arrays to optimize and / or maximize the visual effect of the morph:</p>
|
||||
<ul>
|
||||
<li><kbd>showMorphInfo: true</kbd> when <code>true</code> the script will log valuable information about the morph such as default/current sample size, number of points based on sample size, the recommended index for points rotation, or if one of the shapes require to be reversed. By default this option is <code>false</code> for performance reasons. This option will also show you the first point for both shapes so you can visualize how the settings affect the morph.</li>
|
||||
<li><kbd>morphPrecision: Number</kbd> option allows you to set the sampling size of the morph. The lesser value the better visual but the more power consumption and less performance. The default value is 25 but the <a href="http://bl.ocks.org/mbostock/3081153" target="_blank">D3.js example</a> uses 4.</li>
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="The Text Plugin for KUTE.js enables string manipulation.">
|
||||
<meta name="keywords" content="kute,kute.js,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="keywords" content="kute,kute.js,animation,javascript animation,tweening engine,animation engine,text plugin,Javascript,Native Javascript,vanilla javascript,jQuery">
|
||||
<meta name="author" content="dnp_theme">
|
||||
<link rel="shortcut icon" href="./assets/img/favicon.png"> <!-- TO DO -->
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue