Sidebar Vectors

With the new design of the main website at extramaster.net, and subsequently the similar redesign of this blog, you may have noticed that the bar that used to be at the top:

...is now on the left...

As such, new logos were created, in order to distinguish and incorporate a more visual and feature-rich feel for the site...

... But, there's no real point in having the vector in some closed source structure (unlike the rest of the site), and so, I'm giving them away, for absolutely nothing...

Licence

CC0 License - Public Domain (applies only for the images and vector code on this blog page only).

To the extent possible under law, Andy Tran has waived all copyright and related or neighboring rights to Sidebar Vectors. This work is published from: Australia.

Tools Icon Vector

Hammer and Spanner criss-crossed in a hybrid and supportive demeanour. Both are tools...

High-DPI PNG

SVG

<?xml version="1.0" encoding="utf-8"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 512 512" enable-background="new 0 0 512 512" xml:space="preserve"> <g> <path fill="#FFFFFF" stroke="#000000" stroke-width="5" stroke-miterlimit="10" d="M213.1,62.6l1,0.2c3.6,1.6,5.7,5.1,8,8.1 c8.6,11.8,16.1,24.2,24.6,36.1c2,3.2,4.9,6.5,4.4,10.6c-1.2,5.1-5.9,8.5-10.4,10.5c-3.7,1.8-8.4,0.4-10.5-3 c-2.6-3.3-5.3-8.6-10.4-7.2c-7.7,2.9-15.5,9-16.4,17.7c-0.5,4.6,1.4,9.1,3.9,12.9c28.4,41.9,56.6,83.9,85,125.7 c3.3-0.1,7.6-0.9,9.7,2.4c31.3,45.2,62.1,90.7,92.7,136.5c3.4,5.2,8.3,9.9,9,16.3l-0.2,1.1c-3,7.2-10.8,9.8-16.6,14.2 c-3.2,2.6-7,4.7-11.2,4.6l-1.6-0.3c-4.5-2.7-6.5-7.8-9.6-11.8c-31.6-45.6-62.4-91.8-93.4-137.7c-2.7-3.6-1.2-8,0.5-11.6 c-27-40.4-54.3-80.6-81.3-120.9c-5.6-7.9-14.5-12.7-23.5-15.7c-10.2-3.3-22.6-0.9-29.6,7.6c-12.8,13.9-16.4,33.3-18.8,51.4 c-1.5-0.9-3.3-1.5-3.9-3.3c-6.7-13.7-7.8-29.7-4.6-44.4c4-19.3,14.8-36.6,28.2-50.9c6.2-6.8,14.4-11.2,21.5-17 c2.3-1.8,4.9-3.1,7.5-4.2c3.7,4.2,7.1,9.4,12.9,10.8c7.2,1.5,14-2.3,19.5-6.5c3.1-2.3,5.1-7,2.8-10.6c-2.3-3.7-5.7-7.9-3.6-12.5 C201.5,66.4,207.3,63.3,213.1,62.6z"/> </g> <g> <path fill="#FFFFFF" stroke="#000000" stroke-width="5" stroke-miterlimit="10" d="M393.3,102.1c3.6,21,8.8,45.3-2.6,64.3 c-21.5,14.7-47,19.9-67.5,36.9c-10.4,9-21.4,17.5-29.5,29.4c-44.8,69.1-89.9,138-135.1,206.8c-8.2,13.8-25.9,11.9-35.8,1.8 c-10.3-8.2-10.8-27.5-3.4-38.3c24-36.1,50.4-69.9,74.4-105.9c21.1-30.6,41.6-61.8,63.5-91.6c15.5-19.7,20.8-47.1,22.3-73.2 c1-13.3-4.2-27.3,2.5-39.4c4.1,1.7,8.1,3.5,12.2,5.3c15.5-17.3,34-31.6,55.5-35.4c-5.8,18.5-12.3,36.8-18.8,55 c10.1,4.7,20.2,9.8,30.1,15.3c9.9-15.9,15.4-34.5,21.5-52.5C387.7,86.5,392.4,93.3,393.3,102.1 M153.1,424 c5.7-22.3-27.9-30.3-28.9-6.2C120.5,438.8,150.9,445.2,153.1,424z"/> </g> </svg>

Dice Icon Vector

A dice from a different perspective.

High-DPI PNG

SVG

<?xml version="1.0" encoding="utf-8"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 512 512" enable-background="new 0 0 512 512" xml:space="preserve"> <g> <g> <ellipse transform="matrix(-0.9781 0.2079 -0.2079 -0.9781 605.6925 211.2279)" cx="291.7" cy="137.4" rx="17.7" ry="10.6"/> </g> <g> <ellipse transform="matrix(-0.9781 0.2079 -0.2079 -0.9781 505.5779 201.8674)" cx="242.2" cy="127.5" rx="17.7" ry="10.6"/> </g> <g> <ellipse transform="matrix(-0.9781 0.2079 -0.2079 -0.9781 553.5987 360.3081)" cx="257.9" cy="209.2" rx="17.7" ry="10.6"/> </g> <g> <ellipse transform="matrix(-0.9781 0.2079 -0.2079 -0.9781 361.9751 332.0905)" cx="163.5" cy="185.1" rx="17.7" ry="10.6"/> </g> <g> <ellipse transform="matrix(-0.9781 0.2079 -0.2079 -0.9781 706.803 217.8937)" cx="342" cy="146.1" rx="17.7" ry="10.6"/> </g> <g> <ellipse transform="matrix(-0.2599 0.9656 -0.9656 -0.2599 690.6201 1.5862)" cx="344.7" cy="265.4" rx="18.2" ry="10.9"/> </g> <g> <ellipse transform="matrix(-0.26 0.9656 -0.9656 -0.26 652.1984 -122.3714)" cx="373" cy="188.7" rx="18.2" ry="10.9"/> </g> <g> <ellipse transform="matrix(-0.2599 0.9656 -0.9656 -0.2599 726.8503 124.2141)" cx="315.8" cy="340.6" rx="18.2" ry="10.9"/> </g> <g> <ellipse transform="matrix(0.6832 0.7303 -0.7303 0.6832 232.5709 -41.0011)" cx="163.5" cy="247.5" rx="18.2" ry="10.9"/> </g> <g> <ellipse transform="matrix(0.6831 0.7303 -0.7303 0.6831 326.1418 -70.5652)" cx="244.4" cy="340.5" rx="18.2" ry="10.9"/> </g> <g> <ellipse transform="matrix(-0.9781 0.2079 -0.2079 -0.9781 457.104 346.0951)" cx="210.4" cy="197.1" rx="17.7" ry="10.6"/> </g> <path fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" d="M355.7,133.4"/> <path fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" d="M253.6,114.4"/> <line fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" x1="262.3" y1="238.6" x2="389.3" y2="131.2"/> <line fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" x1="389.3" y1="131.2" x2="402.9" y2="286.5"/> <line fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" x1="402.9" y1="286.5" x2="297.1" y2="405.4"/> <line fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" x1="297.1" y1="405.4" x2="155.6" y2="340.6"/> <line fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" x1="155.6" y1="340.6" x2="109.2" y2="197.1"/> <line fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" x1="262.3" y1="238.6" x2="297.1" y2="405.4"/> <line fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" x1="262.3" y1="238.6" x2="109.2" y2="197.1"/> <line fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" x1="109.2" y1="197.1" x2="242.2" y2="106.6"/> <line fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" x1="242.2" y1="106.6" x2="389.3" y2="131.2"/> </g> </svg>

Binary SmartPhone Vector

iPhone-inspired vector (Read: does not represent an iPhone, but a generic SmartPhone).

High-DPI PNG

SVG

<?xml version="1.0" encoding="utf-8"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 512 512" enable-background="new 0 0 512 512" xml:space="preserve"> <path fill="#FFFFFF" stroke="#000000" stroke-width="5" stroke-miterlimit="10" d="M356.1,455.1H155.9c-6.6,0-12-5.4-12-12V68.9 c0-6.6,5.4-12,12-12h200.3c6.6,0,12,5.4,12,12v374.1C368.1,449.7,362.7,455.1,356.1,455.1z"/> <circle fill="#FFFFFF" stroke="#000000" stroke-width="5" stroke-miterlimit="10" cx="256" cy="418" r="28.6"/> <g> <path d="M207.7,150.1h-0.1c-1.9,3.9-8.2,8-11.9,8.4v-1.2c4.8-1.3,8.4-4.1,11.5-8.4h1.9V197h-1.4V150.1z"/> <path d="M240.4,150.1h-0.1c-1.9,3.9-8.2,8-11.9,8.4v-1.2c4.8-1.3,8.4-4.1,11.5-8.4h1.9V197h-1.4V150.1z"/> <path d="M272.3,197.9c-10.1,0-13.3-8.6-13.3-24.5c0-14.1,2.6-24.5,13.3-24.5c10.9,0,13.3,10.2,13.3,24.5 C285.6,189.3,282.4,197.9,272.3,197.9z M272.3,196.6c9.8,0,11.9-9.8,11.9-23.3c0-14.9-2.6-23.3-11.9-23.3c-9,0-11.9,8.5-11.9,23.3 C260.4,186.8,262.5,196.6,272.3,196.6z"/> <path d="M305.6,150.1h-0.1c-1.9,3.9-8.2,8-11.9,8.4v-1.2c4.8-1.3,8.4-4.1,11.5-8.4h1.9V197h-1.4V150.1z"/> <path d="M207,279.5c-10.1,0-13.3-8.6-13.3-24.5c0-14.1,2.6-24.5,13.3-24.5c10.9,0,13.3,10.2,13.3,24.5 C220.3,270.9,217.1,279.5,207,279.5z M207,278.2c9.8,0,11.9-9.8,11.9-23.3c0-14.9-2.6-23.3-11.9-23.3c-9,0-11.9,8.5-11.9,23.3 C195.1,268.4,197.2,278.2,207,278.2z"/> <path d="M239.7,279.5c-10.1,0-13.3-8.6-13.3-24.5c0-14.1,2.6-24.5,13.3-24.5c10.9,0,13.3,10.2,13.3,24.5 C252.9,270.9,249.7,279.5,239.7,279.5z M239.7,278.2c9.8,0,11.9-9.8,11.9-23.3c0-14.9-2.6-23.3-11.9-23.3c-9,0-11.9,8.5-11.9,23.3 C227.8,268.4,229.9,278.2,239.7,278.2z"/> <path d="M273,231.7h-0.1c-1.9,3.9-8.2,8-11.9,8.4v-1.2c4.8-1.3,8.4-4.1,11.5-8.4h1.9v48.1H273V231.7z"/> <path d="M305.6,231.7h-0.1c-1.9,3.9-8.2,8-11.9,8.4v-1.2c4.8-1.3,8.4-4.1,11.5-8.4h1.9v48.1h-1.4V231.7z"/> <path d="M207,361.1c-10.1,0-13.3-8.6-13.3-24.5c0-14.1,2.6-24.5,13.3-24.5c10.9,0,13.3,10.2,13.3,24.5 C220.3,352.5,217.1,361.1,207,361.1z M207,359.8c9.8,0,11.9-9.8,11.9-23.3c0-14.9-2.6-23.3-11.9-23.3c-9,0-11.9,8.5-11.9,23.3 C195.1,350,197.2,359.8,207,359.8z"/> <path d="M239.7,361.1c-10.1,0-13.3-8.6-13.3-24.5c0-14.1,2.6-24.5,13.3-24.5c10.9,0,13.3,10.2,13.3,24.5 C252.9,352.5,249.7,361.1,239.7,361.1z M239.7,359.8c9.8,0,11.9-9.8,11.9-23.3c0-14.9-2.6-23.3-11.9-23.3c-9,0-11.9,8.5-11.9,23.3 C227.8,350,229.9,359.8,239.7,359.8z"/> <path d="M273,313.3h-0.1c-1.9,3.9-8.2,8-11.9,8.4v-1.2c4.8-1.3,8.4-4.1,11.5-8.4h1.9v48.1H273V313.3z"/> <path d="M305.6,313.3h-0.1c-1.9,3.9-8.2,8-11.9,8.4v-1.2c4.8-1.3,8.4-4.1,11.5-8.4h1.9v48.1h-1.4V313.3z"/> </g> <line fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" x1="143" y1="380.5" x2="367" y2="380.5"/> <line fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" x1="144" y1="122.5" x2="368" y2="122.5"/> <line fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" x1="232" y1="93.5" x2="280" y2="93.5"/> <circle fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" cx="256" cy="73.5" r="5.5"/> </svg>

Blog/Blogger-inspired Icon Vector

"B" text wrapped in a comment box.

High-DPI PNG

SVG

<?xml version="1.0" encoding="utf-8"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 512 512" enable-background="new 0 0 512 512" xml:space="preserve"> <g> <path fill="#FFFFFF" stroke="#000000" stroke-width="5" stroke-miterlimit="10" d="M268.2,391.4c0.2,0,0.3,0,0.5,0 c0.1,0,0.2,0,0.4,0c0.2,0,0.3,0,0.5,0c1.1-0.1,2.1,0,3.1,0.6c0.2,0.1,0.4,0.3,0.6,0.4"/> <path fill="#FFFFFF" stroke="#000000" stroke-width="5" stroke-miterlimit="10" d="M316.6,400.6h5.9c24.8,0,45-20.3,45-45V101.7 c0-24.8-20.3-45-45-45h-133c-24.8,0-45,20.3-45,45v253.8c0,24.8,20.3,45,45,45h75.9"/> <path fill="#FFFFFF" stroke="#000000" stroke-width="5" stroke-miterlimit="10" d="M314.4,393.7"/> <line fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" x1="264.6" y1="400.3" x2="367" y2="455.1"/> <line fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" x1="315.8" y1="400.3" x2="367" y2="455.1"/> <g> <path d="M223.2,117.5h60.1c42.1,0,53.7,22,47.3,54.6c-4.9,21.3-20.4,41.5-43.3,47.3L287,220c25.9,5.2,35.1,25.9,29.3,54.3 c-8.2,38.1-36.9,61-78.4,61h-59.8L223.2,117.5z M201,318.8h36.3c33.5,0,53.4-14.9,59.5-44.5c6.1-29.6-7.6-44.5-41.2-44.5h-36.3 L201,318.8z M222.9,213.3h30.8c33.9,0,51.2-14,57-39.6c5.8-29.3-6.7-39.6-37.2-39.6h-34.2L222.9,213.3z"/> </g> </g> </svg>

anotherOS/OS Icon Vector

Fun grid-like "OS" vector

High-DPI PNG

SVG

<?xml version="1.0" encoding="utf-8"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 512 512" enable-background="new 0 0 512 512" xml:space="preserve"> <g> <line fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" x1="109.6" y1="455.8" x2="404.9" y2="160.5"/> <line fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" x1="109.6" y1="56.8" x2="404" y2="351.1"/> <line fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" x1="404" y1="351.1" x2="300.3" y2="454.9"/> <path fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" d="M262,301.6"/> <path fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" d="M167.1,206.8"/> <line fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" x1="317.6" y1="56.3" x2="107.1" y2="266.8"/> <rect x="109.6" y="56.8" fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" width="295.3" height="399"/> <g> <path d="M222.3,107.4c21.9,0,30.7,16.9,22.8,55.3c-8.3,38.4-24,55.3-45.7,55.3c-22,0-30.6-16.9-22.6-55.3S200.3,107.4,222.3,107.4 z M201,210c15.1,0,27.3-12.4,34.5-47.2c7.2-34.8,0.3-47.2-14.8-47.2c-15.3,0-27.1,12.4-34.3,47.2C179.1,197.5,185.7,210,201,210z" /> </g> <g> <path d="M322.7,298.4c2.8-13.2-1.7-21.1-14.8-21.1c-13,0-22.2,8.5-24.1,19.2c-6.5,31.9,48.9,14.4,40.9,52 c-4.3,20.8-19.2,31.3-38.8,31.3c-20.3,0-28.9-10.6-24.6-31.8l0.6-3.1h9.6l-0.8,4c-2.8,13.8,2.3,22.8,16.5,22.8 c13.6,0,24.6-6.7,27.6-21.7c6.5-31.9-48.9-13.6-40.9-52.5c3.6-16.8,16.8-28.3,35.4-28.3c19.9,0,27.1,10,23.1,29.2H322.7z"/> </g> </g> </svg>

Bonus: Settings Cog Vector

Not a part of the side bar, but have fun with this settings cog!

High-DPI PNG

SVG

<?xml version="1.0" encoding="utf-8"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 512 512" enable-background="new 0 0 512 512" xml:space="preserve"> <g> <path fill="none" stroke="#000000" stroke-width="5" stroke-miterlimit="10" d="M139,195.1 M140.1,191.1 c-3.4-3.9-7.7-7.8-11.4-11.4c4.9-6.7,9.6-13.6,14.7-20.1c10.5,5.3,21.2,10.4,31.9,15.5c5.5-5.1,11.3-9.8,17.3-14.2 c-2.6-11.2-6.1-22.2-8.3-33.5l0.4-1.1c7.1-3.7,14.6-6.6,21.9-9.9c6.4,9.8,13.2,19.4,19.6,29.2c7.3-1.5,14.8-2.8,22.2-3.4 c3.4-11.3,6.6-22.8,9.7-34.2c8.3,0.7,16.6,1.5,24.8,2.6c0.7,11.8,1.6,23.6,2.6,35.4c7.2,2,14.1,4.7,20.9,7.8 c8.5-8.3,17-16.4,25.4-24.8c6.8,4.7,13.4,9.7,20.1,14.3c-4.9,10.8-10.4,21.4-15.4,32.2c5.1,5.4,9.8,11.1,14,17.2 c11.7-2.6,23.1-6,34.8-8.5c3.2,7.5,6.6,14.9,10,22.3c-9.7,7-19.7,13.4-29.5,20.3c1.7,7.2,2.9,14.5,3.5,21.9 c11.3,3.5,22.8,6.5,34.2,9.8c-0.7,8.2-1.6,16.4-2.4,24.7c-11.9,1-23.8,1.5-35.7,2.8c-2,7.2-4.7,14.1-7.8,20.9 c8.3,8.4,16.5,16.9,24.8,25.4c-4.7,6.8-9.6,13.4-14.5,20.1c-10.7-5.2-21.3-10.3-31.9-15.5c-4.3,4-8.8,7.8-13.5,11.2 c-1.5,1.3-4.3,2.6-3.2,5.2c2.1,10.8,5.3,21.4,8,32.1c-7.4,3.6-15.1,6.9-22.6,10.3c-6.8-9.8-13.3-19.8-20.2-29.5 c-7.3,1.9-14.7,2.9-22.1,3.8c-3,11.3-6.4,22.6-9.4,33.9c-8.3-0.6-16.5-1.5-24.8-2.3c-0.9-11.8-1.7-23.7-2.6-35.5 c-7.1-2.1-14.1-4.7-20.8-7.9c-8.8,8-17.1,16.6-25.7,24.8c-6.7-4.8-13.3-9.7-20-14.4c4.7-10.6,10.3-20.8,14.9-31.4 c-3.6-6.5-9.9-11.7-13.9-18.2c-11.4,3-22.8,5.9-34.3,8.8c-3.4-7.6-6.9-15.1-10.1-22.8c9.9-6.4,19.6-13.2,29.3-19.8 c-1.8-7.3-2.9-14.8-3.6-22.3c-11.2-3.2-22.5-6-33.5-9.6c-0.4-8,0.7-16.5,2.3-24.5c11.6-1.2,23.2-1.8,34.8-2.6 c2.5-7,4.9-14.2,8.3-20.8c-3.7-4.3-20.6-22-24.9-25.8 M139,195.1 M244.1,169.7c-29.9,3.9-57,24.3-68.4,52.3 c-10.3,22.1-9.1,48.5,1,70.5c15.4,34.7,55.7,56.7,93.2,49.4c29.5-4.5,55.8-25.6,66.6-53.5c15.9-36.1,1.6-81.8-30.9-103.7 C288,172.3,265.6,166.3,244.1,169.7z"/> </g> </svg>

NB

The "+e" logo is not a part of this release. At ALL!

New site design

Scroll down to the comments section to comment!

The web will continue to innovate and inspire new technology to impact on how we view the web and the world.

Familiarity

The current site template is focused on consistency and functionality, with interactive user interface elements given a clear distinction amongst other interfaces. A highlight of this new design consistency focuses on links. The idea of having links look like buttons, because the idea of hypertext being just a "link" is over. Buttons provide the gateway to more interactivity and content, and so why can't links convey the same meaning?

New web standards

HTML5 isn't new. It's been out there for a few years now. However, each second of time passed will see more new features added to HTML5, which makes it unique. This site design seeks to establish the new HTML5 tags with meaning and intent, with the <header>,<section> and <footer> tags reiterating meaning with site structure, and this is visually emphasised with CSS3.
SVG graphics are also featured in this new design. With most of the visual icons in an embedded SVG format. Vector graphics are at the hallmark of 2013-2014 web development, yet, major sites still rely on .jpg, .png and .gif for delivering graphical content. No more blocky graphics here! SVG aliases lines so they look good at any resolution!
Oh, and as of the time of this post, the site is also valid HTML5, but it might not be true from time-to-time (due to updates, e.t.c..) and isn't worthy of mentioning on the site itself.

Content-rich

Being a site that focuses on feature-rich content, the new site design is focused on making content as readable and interactive as possible. Scrolling triggers a mini parallax effect that is both used to indicate the position on the page, but also to increase the level of interactivity that this site has to offer.

One-size fits all, responsiveness

We should have to push you off to mobile-optimized versions of websites when mobile devices can only do so much in 2014. Whether it be a HDTV, 4K TV or a 300DPI "smartphone", the website will scale appropriately and still be readable... This coupled with the SVG graphics detailed above, leads to a crisp and clear browsing experience.

So, what do you think? Is it a little bit too over-the-top? Or is your experience stuttered by lag?
Comment here!

deMobilify

Recently, I got sick of having to deal with mobile webpages when I bookmarked a link on my phone to read on a desktop computer.
The interface works well on mobile where you've got low screen estate, but on a desktop computer, mobile websites are absolute torture!!

Fortunately, sites like vimeo and youtube automatically deal with the smartphone vs desktop issue and redirect you to your correct destination, but how about Wikipedia?
Sites that refuse to give in and automatically redirect you to your desired non-mobile website are annoying.

and this Google Chrome extension seeks to solve that.

It works passively in the background; no data is transmitted when using this extension and you have pretty much nothing to lose when installing it.

And allows you to make full use of the desktop versions of websites, and not plain old crappy mobile websites..

Install it here! https://chrome.google.com/webstore/detail/demobilify/bpipmbekabalflpojmlifpoelndhfhpe

Aligning two objects together to centre in Illustrator

Illustrator allows for the quick alignment of objects using the icons featured in the toolbar above the artboard.