Saturday, 20 April 2013

Test the load speed of a page and all of its elements

This tutorial uses Scrutiny or Reactivity. The page test is a component of Scrutiny, but is also built as a standalone app called Reactivity.

You can get the same results from this online demo, which runs the same app but it doesn't have the user interface and the results are presented on a web page.

1. If you're using Reactivity you'll be presented with this window. If you have Scrutiny, call this window with Window > Page analysis,  command-2 or switch to the SEO tab and press 'Full Page Analysis'.

2. Type the address of the page that you'd like to test and press Go. To test more than one page at a time, simply open another window - In Scrutiny repeat step 1. In Reactivity use File > New or command-N

3. The app will find all elements that make up your page - the html file, the images, javascript files and css files. It will load each element separately without multi-threading so that you get the most accurate timings.

4. Remember that the response time and load time will reflect the server's response time and speed, but will also be affected by the speed of your own internet connection.

5. You will see a total weight for the whole page. (The one in the example is a bit hefty). You will be able to spot any elements on your page which are particularly big, and you'll also be able to spot any elements which are slowing your page down -  third party code or plugins often cause such problems and affect your page's response - maybe even your Google page rank.

6. If your site uses compression, then you'll see the compressed as well as the uncompressed size for each element as well as totals, and see how effective that is being.

Wednesday, 17 April 2013

How to generate an XML sitemap using Scrutiny

[Updated 6 March 2017 in line with Scrutiny v7]

1. First you need to scan your site. If you don't already have a configuration for your site, at the Sites screen, press the + button and type your starting url. 


2. Press Scan now. When that's finished, choose Sitemap from the list of tasks. Check that this list contains your pages as you expect. See the manual for more information about how to exclude pages or why some might not be appearing

3. 'Change frequency' indicates to Google how often you feel that you update your pages. This doesn't oblige them to crawl your site any more or less regularly. If you generally update your pages more regularly or less regularly than weekly, you might like to change the default setting and press 'Update all'.



4. The 'Priority' you give your pages is a measure of how important you think each of your pages. Priority must be a value beetween 0.0 and 1.0. I suggest that you mark your home page as 1.0, one important page as 0.9, slightly less important pages as 0.5 and then decreasing from there. If you choose the 'Automatic' setting, Scrutiny will mark your starting url as 1.0 and then calculate the others based on the number of clicks from the home page, and use a logarithmic scale. ie one click from first page = 0.5, two = 0.3, three = 0.2 with all other pages = 0.2

4. For more specific control, you can set up some 'rules' to specify priority and update frequency for certain pages or sections of your site. You don't need to enter a full url - like the black and white lists on the front settings screen, you only need to enter a partial url. This way it is possible to specify a particular url or a section of the site, eg "/engineering/"



5. When you're ready, go to Export > XML  and choose where you save the sitemap file.



6. See the search engine's own help for details of how to submit your sitemap.

Sunday, 7 April 2013

ScreenSleeves screensaver - Installing and setting preferences

It's a shame that the Lounge screensaver seems to have disappeared. It displays only the currently playing album cover with some details in a very neat, easy-on-the-eye-way (a la Front Row). Being a screensaver it just kicks in if you leave your computer or mouse to your hot corner.

So I set about writing a similar app. But with Spotify support too, which I would have liked in Lounge - I use both iTunes and Spotify equally.

Screensleeves detects which is playing and displays cover art and details for the currently-playing track:



As with most screensavers there are some options, and it's not always obvious how to find these options. So here's a quick tutorial.

[4 Aug 2014 - this page updated to reflect the new options. If you don't have all of the options below, please download and install the current version]

Installing

Simply double-click the package icon from within the downloaded dmg. System Preferences will open and confirm that you'd like to install the saver. It'll do so and show you a preview. Note that with earlier systems you may need to click the saver's name in the left-hand list if you want to switch to it.

Accessing options

After you've installed, you can get back to the options via System Preferences > Desktop & Screen Saver > Screen Saver   and press 'Options'



What those options mean

1. Theme: Choose from Classic, Text, Mosaic, Full-Screen or Random. Random chooses one of the graphic themes (not Text) each time the screensaver kicks in. Preview window in System Prefs will not be the same theme as the one chosen when the saver kicks in for real.

2. Artwork size: The artwork and text size will adjust itself to be suitable for your screen size, but you can make the default size larger or smaller.

3. 3D effect: The cover can be displayed flat or at an angle. This slider adjusts the angle of the effect. Works with Classic and Full-Screen themes

4. Font size: Adjusts the size of the text. With some themes the font size may also be sized relative to the artwork size.

5. Rating / Popularity: If iTunes is playing, your star rating will be displayed and you can press keys 0-5 to change the rating. If Spotify is playing, the Spotify popularity will be shown. You are unable to change this except by playing the tune which is a vote for it.

6. A Progress bar can be displayed showing the position within the current track.

7. Show Total track time / Time remaining: If progress bar is showing it can display a counter showing either of these things.

8. Keep centred and static: If you are sure your screen isn't burnable, you can fix the position of the artwork and text. It will only fade when the track changes.

9. If no artwork available: These buttons choose what Screensleeves does. It can display a default image, or no image. Since v3.4.3 it's been able to very sucessfully fetch album art from the web. The last box about Snowtape is there because Snowtape currently provides artwork which is low-quality and often not the correct cover. With the box checked, SS will try to override the artwork Snowtape provides with a cover fetched from the web.

10. Always find from the web with Snowtape / Rdio: Depending on the type of music you're listening to, Snowtape may not provide the best album cover for the track playing. In both cases, these players provide lower-res images than is desirable when Screensleeves is displaying larger artwork sizes. This option forces Screensleeves to source a better quality and perhaps more appropriate image from the web.

11. ScreenSleeves can default to any of the other screensavers if necessary. Just choose your favourite from the list.  Note that the alternative won't show in the preview window. You'll need to press 'Test' or Preview' or use your hot corner

12. This box allows you to choose whether the alternative saver cuts in if there's no music playing, or if no music player is running. Checking this box means that if there's a player available, but paused, ScreenSleeves will display a 'Paused' message and allow you to start the player using the spacebar.

13. If both players are running but paused, these buttons allow you to choose which one starts playing when you press the spacebar.

14. Setting a modifier helps to prevent the rating of a track being changed accidentally. 'none' means that you can just press keys 0-5 to set the rating. 'control', 'alt', or 'cmd' mean that you have to press that key along with 0-5 to change the rating.

15. If you're going to sleep to music, or for some other reason want the screen to black out when the music stops or after a delay, here are the options.

Triggering the screen saver

As per any screensaver, it'll kick in after a preset time, or you can trigger it manually by setting up a Hot Corner. While your System Preferences window is showing, you can use the 'Test' or 'Preview' button for a full-screen preview.


Supporting ScreenSleeves

I'm sorry that this is necessary. The screensaver has taken many many working days (and I will spend more improving it). You can get your ScreenSleeves key here. Enter it in the 'Key' box below 'Licence' and the 'Please Support' message will be removed.


Download

In case you missed it at the top of this post, the ScreenSleeves download is here

Tuesday, 2 April 2013

How to find and display a website's broken links

This tutorial uses Scrutiny or Integrity

1. First you need to crawl your site. Integrity: Type the address of the website's home page into the Starting url box and press Go.


Scrutiny v5: At the Sites screen, press 'New' and type your starting url. Press 'Next' to see the default settings, press 'Next' again to accept those settings. Press 'Go' beside 'Check for broken links'.


The application will start at your home page, find all of the links on it, check those links and then for each of those which is another page on your site, check for links on those pages too, and so on. This will all happen surprisingly quickly.

2. When the crawl has finished, you'll see a list of the links on your site. Each link may appear just once or appear on many pages (for example a 'home' link may appear on every page of your site).

3. If the resulting list of links includes urls you don't expect or don't want, you may need to look at your settings and preferences.

4. We're interested in just the bad links so in Scrutiny, tick 'Bad links only'. In Integrity, find 'Bad links only' under the View menu, or its button in the toolbar if you have it showing, or command-B.



5. If you're interested in seeing which links are bad and then seeing a list of pages that link appears on, you want the 'By link' view. If you're interested in seeing a list of pages which need attention and then seeing which links need attention on that page, you want the 'By page' view. The Flat view shows each occurrence of each link on a separate row.


You can sort any of these tables by clicking on a column header.

6. If you see none, good news! If you see some bad links, the Status column will tell you the reason.

7. Double-click a link to see more information about that link, including the pages that it appears on. From there you can click a page to either visit that page or highlight the link on that page.



Thanks for your interest in these applications. Please use the comments box for any questions, comments and suggestions.