Simple Responsive Video CSS Method

If you are serving video headers or heros or any large videos, you can use this or a version of this to serve Desktop, Tablet and Mobile versions. Tweek per your needs. iPhone X in landscape gets tablet video. Other phones get the mobi vid. Make three copies of your video. I made 1080p (desktop),…

Simplify Your Responsive CSS with Orientation

Make your responsive css easier by using orientation. They way I see it, anything ‘portrait’ is a mobile device or at least, not a laptop or desktop, since those devices don’t get turned on their sides for viewing. So basically, orientation:portrait in your media query handles everything up to a tablet viewed in portrait. One…

FOUC Fixer

Stumbled across this looking for solution to FOUC (flash of unstyled content) for a site I’m developing using the awesosme fullpage.js. There is a lot of css and the site was loading unstyled (FOUC). This is great solution by <a href=”https://github.com/mehtaculous”>mehtaculous</a> that is simple as can be. Make sure your are pulling jQuery lib to…

SPAM must be filtered for accurate Google Analytics

This is one of those tips where you might think “isn’t that supposed to happen automatically?”. One would think that adding Google Analytics to your website would give you data in your analytics account that is…from your website. Unfortunately, that’s not always the case. Spammers and hackers can use your website for advancing their own…

How to Build a Brand Iconographic

From https://creativemarket.com/blog/2016/03/16/how-to-design-a-brand-identity-visual-recap Finally. Something we can all understand. Check out Creative Market. Good newsletter for Photoshopping/Creative types. Free fonts.

Tremendous Read for Email Marketers

Litmus.com’s 2016 State of Email Marketing report is a great read for designers and marketers alike. Here it is: 2016_State_of_Email_Report_Litmus Props to Litmus.com for providing some of the best tools and intel for email marketing. Like this great article: https://litmus.com/blog/the-ultimate-guide-to-styled-alt-text-in-email

Great DNS tool.

Sick of waiting for DNS changes, not knowing whether it’s your connection or your DNS updating? Use this: http://downforeveryoneorjustme.com/. It checks your url outside of your network by checking thru other backbones throughout the world. Nice.

Google responsive page tester

Test your site for mobile. https://www.google.com/webmasters/tools/mobile-friendly/ Google is going to crush your site ranking like a little bug unless it passes the test on the link above. Don’t lag. If you don’t pass, your page rank could go down. According to Google, it should go down so take it from the horses mouth, you have…

Update on Tel links and Facetime links

Creating the correct format for your telephone number links is important because different devices react differently. I prefer to use the folowing format. Tel: <a href=”tel:+18057460079″>805-746-0079</a> <a href=”facetime://8057460079″>Facetime Us</a> I add the Facetime link, not because I want to be contacted via Facetime but, because clicking the default tel format on a Mac causes the…

Online Phone Number Formats Test

Which numbers work for which mobile devices when clicked? Please pull this page up on your mobile and test each to see if it launches your phone app with the number populated :) My results below. FYI: clicking these numbers and links in a browser on non-mobile device or even tablet might give you an…

NextGEN Photo Gallery Plugin Watermark Fix

I love NextGEN Photo Gallery Plugin and all the other addons. I have noticed that getting an image to work as a ‘watermark’ can be buggy, but the fix is easy. I searched Google and found never ending threads with no answers so I thought I would post what works for us and hope someone with the…

Device Monitor and/or Screen Sizes

It’s hard to find a good list of screen sizes without all the grousing about this and that brand etc. If you just want the list, this is a good one. http://en.wikipedia.org/wiki/List_of_common_resolutions

Clickable Phone Number HTML

I get a lot of questions about phone numbers on websites and making them click-able to dial on a mobile device. Some devices see the phone number in the link, but what if you want to use “click here” or something to that effect? There are several syntax(s) out there, but I recommend using tel.…