Dmitry Pashkovets ciases

HTML

target blank (see Security and Accessiblity When Opening Links in a New Window)

<a target="_blank" rel="noopener noreferrer">open in new window</a>

<!-- when open link via javascript -->
<script>
  var newWnd = window.open();
 newWnd.opener = null;

There are also online tools which can help you optimize your pictures with loss of quality, by performing safe automatic tasks:

Yahoo! Smush.it is the most well-know: http://www.smushit.com/ysmush.it/
Kraken is another which at times can give better results, and has Firefox and Chrome extensions: http://kraken.io/
Image Optimizer enables you to also change the size of the file: http://www.imageoptimizer.net/

If you are at ease with command line tools, you can use these:

Pngnq: converts 24-bit PNG files into 6 to 8-bit ones, by only keeping the needed colors. Download:

Use ImageMagick to create optimised and progressive JPGs

Use the following command to optimise a JPG and make it progressive:

$ convert -strip -interlace Plane -quality 80 input-file.jpg output-file.jpg

Batch all the images in a folder like this:

$ for i in source/images/backgrounds/*.jpg; do convert -strip -interlace Plane -quality 80 $i $i; done

	[alias]
	unstage = reset -q HEAD --
	discard = checkout --
	nevermind = !git reset --hard HEAD && git clean -d -f
	uncommit = reset --mixed HEAD~
	save = commit -m
	resave = commit --amend
	invert = revert
	last = log -1 HEAD --format=format:"%Cred%H"
	summary = status -u -s

	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width">
	<title>JS Bin</title>

	<style>

	.path {

	<style>
	.btn-file {
	position: relative;
	overflow: hidden;
	}
	.btn-file input[type=file] {
	position: absolute;
	top: 0;
	right: 0;
	min-width: 100%;

	// Usage:
	// $ npm install gulp browser-sync --save-dev
	// $ gulp serve

	'use strict';

	var gulp = require('gulp');
	var browserSync = require('browser-sync').create();

	gulp.task('serve', function() {

	'use strict';

	var gulp = require('gulp');
	var less = require('gulp-less');
	var sourcemaps = require('gulp-sourcemaps');
	var browserSync = require('browser-sync').create();
	var rigger = require('gulp-rigger');
	var autoprefixer = require('gulp-autoprefixer');

	// variant 1: without `return`

	// https://bolt.cm/

	// MAKE TOPIMAGE SCROLL SLOWER FOR PARALLAX EFFECT
	$(window).scroll(function () {
	$('header').css('backgroundPosition', '0px ' + (posTop() / 2) + 'px');
	});

	// FIX FOR SCROLLPOS IN ALL BROWSERS
	function posTop() {
	return typeof window.pageYOffset != 'undefined' ? window.pageYOffset: document.documentElement.scrollTop? document.documentElement.scrollTop: document.body.scrollTop? document.body.scrollTop:0;