when you find QWERTY imprinted on your cheek - it's time to go to bed.
You can now treat websites as separate applications and even ALT+TAB between apps. By creating an “application shortcut” Chrome allows you to separate instances of itself. The option is under the hamburger icon on the top right:
Settings -> More Tools -> Create Application Shortcuts…
When converting a PSD to HTML/CSS, it’s necessary to get a list of all of the fonts used. There are many tools that help in analyzing the layers of a PSD and Creative Suite has great tools for exporting the information for each of the layers.
However, one problem I’ve run into is finding a list of all of the fonts used in a PSD. Sometimes, I’ll open up a PSD and find that my system doesn’t have a particular font that’s used in the PSD. I then have to go through each layer individually to find the particular text layer with that font.
Another problem I’ve run into is the when preparing a photoshop file for coders to code out, I want to make sure we have the licenses for each of the fonts we’re going to embed. Again, we either have to open up each text layer to inspect the fonts or hope for the best. (A solution to this is to use Character & Paragraph Styles – this helps standardize the look of all of the text in the PSD and I highly recommend it. )
Anyway, I’ve finally found a great Photoshop Script that will loop through each text layer and export the name, content, font name, etc, into a text file. Hooray!
Here’s the direct link to GitHub. I’ve also modified the script slightly to include the name of each layer and PX instead of REM.
Mobile responsive design web design is the new standard. Even Google has announced that they prefer responsive design and weight it as a ranking factor. Sites created with responsive design tend to load slower on mobile devices, however, as they often download both desktop and mobile resources, even though only mobile resources are shown.
Recently read a few excellent articles that discussed this problem. One pointed to a few great methods to selective download content for mobile devices using CSS and media queries.
Here they are:
http://cloudfour.com/examples/mediaqueries/image-test/#t3
http://cloudfour.com/examples/mediaqueries/image-test/#t5
Here’s the original article that referenced these.
http://www.bypeople.com/responsive-design-problems/
Another article mentioned using JavaScript “Window MatchMedia” to conditionally load content. I thought this could be great, especially because it doesn’t rely on JQuery, however, doing actual testing proved that it actually ran much slower.
http://jsperf.com/matchmedia-vs-jquery-width
I’d be very curious to hear what others have experienced on this. Respond in the comments below.