Useful Links: Designers, Assumptions, WordPress, New Students

Designers shouldn’t code is the wrong answer to the right question. A quick and interesting read from Josh Seiden’s blog, More Than This.

Assumptions. At least some of the time guys notice it when they marginalize women.

HTML5 Support in WordPress Core. Some HTML5 improvements in the comment and search form are explained.

Teaching Web Design to New Students in Higher Ed is by Jen Kramer at Smashing Magazine. I don’t agree with every point made in this lengthy article, but it’s important reading and provides some thought-provoking ideas for anyone teaching web design. If this describes you, it’s must reading.

Moto X (video)

Google and Motorola have been advertising the heck out of Moto X. It responds to voice commands, uses gestures, is customizable and more. The feature that appeals to me the most is fast access to the camera. Here’s the ad for that.

I live in the Apple universe, not the Android universe, but seeing Glass the other day and looking at the features for this new phone make me think about developing a split personality.

Are you impressed with these features? What do you want your phone to do?

Useful links: Shadow DOM, social media & Myers Briggs, CSS examples

What the Heck is Shadow DOM? Indeed.

Here’s a fun infographic relating Myers Briggs results to the way you use social media.

Web Design Inspiration: 45 examples of CSS. I normally don’t link to stories like this, but these examples were selected by Jenn Lukas from Happy Cog and are more interesting than the usual list of this type.

Geeky Highlights from BlogHer 13

Untitled

The Girls Code panel that I was on went well. Kimberly Bryant from @blackgirlscode had to miss BlogHer because of a family emergency, but the other three of us forged ahead and we had a good discussion.

Untitled

Automattic was in the Expo hall and it was fun to talk WordPress with them. Here I am with Automattic Happiness Engineer Karen Alma.

Untitled

Sheryl Sandberg was a keynoter. She was inspiring! She arranged for Lean In circles to take place after the keynote with her there participating.

Untitled

I got to meet Majora Carter and have a brief conversation with her. She’s someone who has done so much good in the world, someone I really admire.

Untitled

Adria Richards brought Glass. She let lots of people try it on, play around with taking video or photos, learn how to scroll through the menus, and just generally see why Glass is cool.

Untitled

She told me she brought her Glass to Chicago just for me to get to see it, and she did let me try it out several times. Thank you, Adria!

Virginia and Glass. Cool!

I did two sessions in the Geek Bar, which I wrote about yesterday in The Whys and Hows of Two Step Verification.

Although I shouldn’t rightfully count them as geeky, Queen Latifah and Gale Ann Hurd (from The Walking Dead) were awesome.

You can see all my BlogHer 13 photos on Flickr.

The Whys and Hows of Two-Step Verification

Untitled

I spent the weekend in Chicago at BlogHer13. One of my jobs there was to do a couple of sessions in the Geek Bar on two-step verification. While I have the information at my fingertips, here are the whys and hows of two-step verification

Why

Why is every big company bringing in the opportunity for users to sign up for two-step verification? Horror stories of hacked accounts, mostly. All these companies have made it possible for you to use two-step verification.

  • Google
  • LinkedIn
  • Facebook
  • Twitter
  • WordPress
  • Evernote
  • Apple
  • Dropbox

Two-step verification adds a layer of security to your account and makes it harder for your account to be hacked.

Once your account has been breached, it can be used to broadcast spam or malicious links. Your password can be changed. Your information can be changed or removed (and there’s no way to get it back). If it is a Twitter or Facebook password that someone has figured out then all the sites that you sign into using Twitter and Facebook have been compromised as well.

How

You still need a strong password, even if you opt in to two-step verification. Remember that.

If you use two-step verification, here’s how you do it.

  • Sign in to your account on Facebook or Gmail or whatever service you are using. Find the settings in your profile.
  • Sign up for two-step verification and provide your mobile phone number
  • Now, when you go to the site and enter your password to sign in, you may be required to enter a second access code, which is sent to your mobile phone

On Facebook, for example, enable ‘Login Approvals’ from the ‘Account Security’ section of the account settings page

facebook opt in

On Twitter, visit your account settings page. Make sure you have provided a phone number. Check the “Require a verification code when I sign in” box

twitter opt in

Unless a hacker has your phone in his hand, he may have guessed your password, but he won’t have the code that gets sent to your mobile phone.

It depends on which company you are using whether you are asked to enter the second code every time you sign in. If you are signing in from a recognized device, you may not be asked for the second code.

4 Useful Tools for Testing Page Load Speed

When it comes to maximizing the user experience, the importance of speed cannot be overstated. A slow website, no matter how great the content, no matter how aesthetically pleasing, will test users’ patience. Speaking of which, if there’s one user whose patience you don’t want to test, it is Google.

The search engine giant made it official in 2010 when it announced “we’re including a new signal in our search ranking algorithms: site speed.” Indeed, there is a direct correlation between page load speed and time spent on site. All things equal,the faster site will achieve higher rankings. For anyone whose business model depends on high search engine rankings, speed is an absolute must.

Fortunately, there are 4 very useful tools for testing page load speed.

Firebug’s Net Panel

Firebug is a preferred tool for most web developers, and one reason for this this awesome little plugin makes life so much easier when it comes to analyzing almost any aspect of a page, including load time.

To test load time with Firebug, navigate to the page in question. Next, enable the “Net Panel” by selecting the “Net” tab and then clicking “enable.”

enable net tab

Now reload the page and watch as Firebug displays load times sequentially on a graphical timeline, be it for CSS, JavaScript or image files.

page load speeds

You can click the “+” sign to the left of any item to drill down into other sub-processes, such as headers, response, cache, cookies, etc.

plus menu

PageSpeed Firefox Plugin

PageSpeed is a Firefox plugin that extends the functionality of Firebug. Once you’ve installed PageSpeed, access it by opening Firebug and then clicking on the “PageSpeed tab. Next, navigate to the web page in question. Once it has finished loading, click “Analyze Performance.”

page speed

Once the process is complete, you’ll see a list of performance affecting factors, each hyperlinked to a “best practices” help page for developers. A PageSpeed score is assigned to the page as a whole.

page speed score

Click the triangle to the left of each item to expand it.

image012

YSlow, by Yahoo!

YSlow is a tool developed by Yahoo! that suggests analyzes webpages and ways to improve speed. Once installed, the YSlow icon will appear in your Add-Ins bar at the bottom of your browser. Click to launch YSlow.

launch

Once launched, the panel expands. Click “Run Test.”

YSlow

YSlow will crawl the DOM to find all page components, such as images, scripts, CSS stylesheets, and so on. It looks at the HTTP response headers and then crunches page load data according to built-in rules. It then assigns a grade to each rule, in addition to an overall grade for the page. An “Overall performance score” is represented as a numeric value. You can click on any rule to learn why the page received a particular grade.

overall score

WebPageTest

WebPageTest is a web-based tool that tests page load speed from
multiple locations around the world using real browsers. It displays results in
a waterfall chart format, and provides diagnostic information, as well as suggestions
for improvements. Grades appear at the top of the Performance Test Results,
which you can click on to access a Full Optimization Checklist that goes into
detail about the specific findings.

web page test

Waterfall results are displayed, in addition to pie charts that show a content breakdown represented as percentages of requests made, and bytes sent.

results charts

Guest author Mike Woods is a part-time author and real estate broker specializing in helping buyers find homes for sale in Indianapolis and the surrounding area, and understand the complex home-buying process.