Pattern | Problem | Improvement | Workshop Activity
--- | --- | ---
Huge images (or auto-playing videos), especially in the header / hero section. | Uses up lots of data: expensive and slow. | Heavily optimise images, don't auto-play video. Be aware of the cost (in data and time) of your images. | Use image optimisation tools. Get ideas from Lara Hogan's [Optimizing Images chapter of Designing for Performance](http://designingforperformance.com/optimizing-images)
Parallax | Janky: processor-intensive, especially on mobile.  | Don't use it. Have static images breaking up the content instead. | Make a plan for ditching parallax.
Off-canvas navigation | Hides your content from users, removes information scent. | Review your IA, use a different style of navigation. | Review the IA, sketch new navigation styles.
Low contrast text | Not very readable or legible in low light, or for users with poorer eyesight. | Up the contrast. | Use some colour contrast checking tools. (e.g. [Lea Verou's contrast ratio](http://leaverou.github.io/contrast-ratio/), )
Carousels, especially auto-playing ones. | People often ignore them (like they do with ad banner blindness), seldom interact with them. Many have accessibility issues. | [Don't use them!](http://shouldiuseacarousel.com/) Or at least let the user move the slides, and [provide labels that give them a reason to use it](http://uxmovement.com/navigation/why-users-arent-clicking-your-home-page-carousel/). | Make a plan for how to ditch your carousels, and how to explain it to the bosses.
Share Widgets | Interactive widgets slow down a page, and can block loading of the rest of it. Share buttons add weight to a page and are seldom used. | Remove social media sharing widgets entirely, or replace them with simple link versions. | Make a plan for what to do in own work.
Relying on custom fonts in your design | Custom fonts can be slow to load, or fail to load at all. | Make sure your site works great with the generic `serif` or `sans-serif` system fonts. | Remove custom fonts from your site and see what changes you need to make.
Loading screens | Hides a bigger problem: your site is too slow! | Conduct a thorough performance review of your site. | Use [WebPageTest](http://www.webpagetest.org/) and [Google's Page Speed Insights](https://developers.google.com/speed/pagespeed/insights/) to get some ideas for improvements.
Single Page websites | Can result in large, heavy, pages. That means slow and expensive, especially on mobile. More difficult for people to share a specific part of the page. | Split it into several pages. | Make a plan for splitting it into several pages.
Ghost buttons | They don't offer proper affordance as a button, and often aren't visually distinct from other interface elements. | Make buttons look like buttons. | Redesign some existing buttons in your work.
Responsive Web Design | :troll: | Make separate sites for: mobile, tablet, desktop, watch, and fridge.  | Figure out that this one is a joke.

Add a whole bunch of ideas
Add a whole bunch of ideas
