Applied art for the web

Tools of the trade

Nothing will ever beat pen and paper :) No matter how good or bad your drawing skills are right now – continue or start using your sketchbook for notes, doodles and design drafts. You will find that the best approach is to capture your idea immediately and without distraction on paper. It is quicker and easier than any other tool :)

graphic/design apps

Affinity Designer
graphic design software • vector
by Serif
PC / MAC

Affinity Photo
graphic design software • bitmap
by Serif
PC / MAC

Sketch
digital design toolkit • vector
by Bohemian B.V.
MAC

Figma
collaborative interface design tool
by Figma
PC / MAC

Inkscape
graphics editor • vector
open source
PC / MAC / LINUX

gimp
GNU Image Manipulation Program • bitmap
open source
PC / MAC / LINUX

JPEGmini
image optimisation tool • jpg
by Beamr
PC / MAC

RIOT
image optimisation tool • jpg / gif / png
by RIOT
PC / MAC

imageOptim
image optimisation tool • jpg / gif / png
by Kornel Lesiński
MAC

ImageAlpha
image optimisation tool • png
by Kornel Lesiński
MAC

SVGOMG
SVG optimisation tool • svg
by Jake Archibald
online

code editors

Espresso
"More productive than caffeine"
by Kangacode Pty Ltd
MAC

Nova
"The beautiful, fast, flexible, native Mac code editor."
by Panic Inc
MAC

Atom
"A hackable text editor for the 21st Century"
open source (via GitHub)
PC / MAC / LINUX

Brackets
"A modern, open source text editor that understands web design."
open source (via Adobe)
PC / MAC / LINUX

Sublime Text
"A sophisticated text editor for code, markup and prose"
by Sublime HQ Pty
PC / MAC / LINUX

Visual Studio Code
"Code editing. Redefined."
open source (via Microsoft)
PC / MAC / LINUX

Notepad++
"free source code editor"
by Don Ho
PC

BBEdit
"It doesn’t suck.®"
by Bare Bones Software, Inc.
MAC

GEdit
"GNOME text editor."
a GNOME Project
PC / MAC

dev apps

Cyberduck
FTP :: "Connecting to every server."
by iterate GmbH
PC / MAC

FileZilla
FTP :: "FileZilla®, the free FTP solution."
open source
PC / MAC / LINUX

Transmit
FTP :: "Upload, download, and manage files on tons of servers with an easy, familiar, and powerful UI."
by Panic Inc
MAC

MAMP
local server :: "Your local development solution."
by MAMP Gmbh
PC / MAC

GitHub Desktop
Version control :: "... a unified cross-platform experience that’s completely open source and ready to customize."
open source (via GitHub)
PC / MAC / LINUX

Tower
Version control :: "Version control with Git - made easy. In a beautiful, efficient & powerful app."
by fournova
PC / MAC

Sourcetree
Version control :: "Simplicity and power in a beautiful Git GUI"
by Atlassian
PC / MAC

Dash
"Dash is an API Documentation Browser and Code Snippet Manager."
by Kapeli Apps SRL
MAC iOS

browsers

Firefox
"Fast for good. Powerfully private."
by Mozilla
PC / MAC / LINUX / android / iOS

Waterfox
"Free, open and private."
by Alex Kontos
PC / MAC / android

Brave
"Secure, fast & private web browser with adblock."
by Brave Software Inc.
PC / MAC / LINUX

Edge
"The faster, safer way to get things done on the web."
by Microsoft
PC

Edge Chromium
"It’s time to expect more..."
by Microsoft
PC / MAC / LINUX / android / iOS

Chrome
"Now more simple, secure, and faster than ever - with Google’s smarts built-in."
by Google
PC / MAC / LINUX / android / iOS

Tor
"Anonymity Online"
open source
PC / MAC / LINUX / android / iOS

maxthon
"Fast, secure and ad-free."
by Maxthone
PC / MAC / LINUX / android / iOS

Vivaldi
"Your browser matters. Take control…"
by Vivaldi Technologies™
PC / MAC / LINUX

Safari
"The best way to see the sites."
by Apple
PC / MAC / LINUX / android / iOS

Opera
"Fast, secure, easy-to-use browser"
by Opera Software
PC / MAC / LINUX / android / iOS

Yandex
"…the browser that's fast and secure"
by Yandex
PC / MAC / LINUX / android / iOS

Avast
"Secure, fast, and private."
by Avast Software
PC / MAC

browser add-ons

Design
bookmarklet : utilities for grid layout, measurement and alignment.
by SpryMedia
any browser

What font
"The easiest way to inspect fonts on webpages."
by Chengyin Liu
any browser

Awesome Screenshot
"Capture, Annotate and Share"
by Diigo Inc.
Firefox/Chrome

Full Page Screen Capture
"... a simple way to turn a full web page into an image."
byFull Page, LLC
Firefox/Chrome

Web Developer Toolbar
"The Web Developer extension adds various web developer tools to a browser."
by Chris Pederick
Firefox / Chrome / Opera

Web Developer Checklist
"Analyses any web page for violations of best practices"
by Mads Kristensen
Firefox / Chrome / Edge

Empty Cache Button
"Cache clearing made easy. One click."
by mvm
Firefox

Clear Cache
"Clear cookies, history and cache with a single click."
by Armin Sebastian
Chrome

search engines

DuckDuckGo
"The search engine that doesn't track you."
by DuckDuckGo

ecosia
"The search engine that plants trees."
501(c)(3) non-profit

Qwant
"The search engine that respects your privacy."
by QWANT.

swisscows
"Privacy safe WEB-search."
by Swisscows AG

Internet Archive
"Our mission is to provide Universal Access to All Knowledge."
by Ecosia GmbH

Wikimedia
"…a global movement whose mission is to bring free educational content to the world."
by Wikimedia Foundation

Wolfram Alpha
"Compute expert-level answers using Wolfram's breakthrough algorithms, knowledgebase and AI technology"
by Wolfram Alpha LLC

creative commons
"Find your inspiration."
Flickr by Yahoo

webopedia
"Online Tech Dictionary for Students, Educators and IT Professionals"
by QuinStreet Inc.

Yahoo!
"...helps you find exactly what you're looking for."
Yahoo / Verizon Media

Bing
"more than simple search"
by Microsoft

Google Search
"Our mission is to organise the world’s information and make it universally accessible and useful."
by Google

testing tools

Responsively
"Develop responsive web apps 5x faster!"
by Manoj Vivek

Responsinator
"... quickly get an indication of how their responsive site will look on the most popular devices."
by Tama Pugsley and Andy Hovey

WAVE
Web Accessibility Evaluation Tool
by WebAIM

AChecker
Web Accessibility Checker
by ATRC

Check my colours
Colour contrast checker
by Giovanni Scala

Am I responsive
"A time saving exercise by @justinavery for RWD Weekly Newsletter"
by Justin Avery

W3C Markup Validation Service
"Check the markup (HTML, XHTML, …) of Web documents"
open source (via W3C)

Nibbler
Insights into key areas, including accessibility, SEO, social media and technology
by Silktide

GTmetrix
"… gives you insight on how well your site loads and provides actionable recommendations on how to optimize it."
by GT.net

web page test
"… test from multiple locations around the globe using real browsers and at real consumer connection speeds."
open source (via Google)

Site 24x7
"Free Network and Site Reliability Engineer Tools"
by Zoho Corp.

MX Toolbox
"... free, fast and accurate network diagnostic and lookup tools."
by MXToolBox, Inc.

PageSpeed Insights
"... analyzes the content of a web page, then generates suggestions to make that page faster."
by Google

Resizer
"An interactive viewer that helps designers test material design breakpoints across desktop, mobile, and tablet."
by Google

ethical alternatives

Laura Kalbag gave an excellent talk titled 'Defying the mainstream: building technology that respects our rights' at New Adventures Conference 2020. This really gave me a boost to continue my mission to promote small tech and alternatives. I'd highly recommend having a look at Laura's slides and watch the video of the talk - and check out the list of resources!
Thank you, Laura :)

text: switching software, ethical, easy-to-use and privacy-conscious alternatives switching.software is an ongoing and brilliant project to follow! You'll find lists of alternatives to well-known software ~ worth considering and trying out!