Wednesday, September 26, 2012

Serif of Nottingham

An experienced user's own guide to the range of excellent products available from those awfully nice people at the SERIF concern (if that doesn't get me some freebies, I don't know what will!)

I've been using Serif's great software for many a year. Like a lot of other folks, I'm sure I first got introduced to them via the free versions they occasionally used to put on the coverdisks of certain computer magazines. PagePlus, PhotoPlus, MoviePlus - I tried them all out in this way. Of course, the first one is free, then they've got you hooked...
___________________

PagePlus (Desktop Publishing)
This is surely the flagship of Serif's catalogue and the one they're best at! I probably use this application almost daily and so have happily upgraded to the latest version on a regular basis. Currently that means version X6. As a piece of desktop publishing software, it probably has everything you'd ever need, at a tiniest fraction of whatever it is they charge for so-called 'professional' DTP packages these days. It's great 'all-rounder' but its main selling point is the ability to not only save your work in PDF format, but to open most existing PDF files as well. What a boon that's been! Anyone who is still deluding themselves into believing that M****soft Office (Publisher? or even - gawdelpus! - Word?) is a viable way of producing print-ready artwork, should think again and buy this little baby. You'll thank yourself for it and I know a few print shops who would thank you for it too!

Quibbles... None that I've come across! As I say, Serif have been doing the DTP thing longer than most and they're really good at it... actually no! Wait! I've just thought of one! The salesperson who persuaded me to upgrade to the latest version gave the impression that PagePlus would directly import CorelDraw files. This is not the case - you have to convert them to PDFs first.
___________________

PhotoPlus
(Digital photo editing and painting)
It costs a fraction of the price of the industry 'standard' PhotoShop, but this prog gives most image manipulation programs a run for their money (the budget ones and several of the big 'pro' ones as well). If all you want to do is 'process' your digital holiday snaps, this'll do. I'm currently using version X5, which does everything I need it to. It's pretty quick and easy to use and is not too demanding on the hardware, unlike some I could mention. Anyone who has spent an afternoon cropping and optimizing hundreds of pictures to go on a website will know what a strain bitmap editing can put on the old virtual memory! They normally bundle this with a prog called PanoramaPlus as well (you can probably guess what it does), which is a fun diversion for about a morning or so.

Quibbles...
Some of the generative effects, such as 'lens flare' are a little bit feeble. I found I still have to rely on my old friend The GIMP to produce the really spectacular over-the-top effects that I sometimes want. Serif also includes their AlbumPlus for managing your folders full of pictures. It's okay up to a point, but I would welcome the ability, once I've sytematically organised all my pictures into a virtual filing system for easy reference, to be able to output the resulting thumbnail 'catalogue' as some sort of printout or PDF file. Otherwise it's not much good to me.
___________________

WebPlus (Web design)
I'm now up to version X6 of this baby, but I'm begining to feel I've outgrown it a little. I probably wouldn't bother to upgrade any further, thank you very much. If you are a complete novice at designing a website, knowing absolutely zilch about HTML, and simply want a straight-out-of-the-box solution to creating your own internet presence, then I would wholeheartedly recommend it. If, however, you've picked up a thing or two about HTML and CSS over the years, you'll begin to feel its limitations. To their credit, they do continually introduce new features which have got me out of a sticky situation once or twice, such as finding a painless way to add 'social media' buttons to an existing website.

Quibbles... The sales pitch for WebPlus X6 makes great claims for its ability to create mobile websites. BUYER BEWARE! A number of Serif-generated features didn't work on the smartphones that I tested my site on. What works on a desktop (which is probably what you'll be using to preview your 'job' to start with) won't necessarily work on those funny little non-compliant browsers they stick on your 'phone these days. The WebPlus-generated 'redirect' code didn't switch portable devices to the mobile version of the website - in order to do that, I had to write my own script and paste it into the site's main homepage as an HTML fragment. Any animated navigation menus generated by the program didn't function properly on at least two different flavours of mobile. I had to resort to a much simpler text-only approach. It should also be noted that including that (usually helpful) 'TITLE' attribute on any hyperlinks or images is a waste of time if you're designing for mobile, because mobile browsers don't appear to support 'tooltips'. Another thing that I've noticed historically about WebPlus is that, while they contantly introduce new features to entice you to upgrade, they very often get rid of some old ones (some that I might still consider useful) at the same time. Some Dynamic HTML features, such as scrolling marquees, are no longer considered 'fashionable' and so have been dropped since X5. It is possible to work your way around this, if you know some HTML and can insert your own code 'in lieu'. One little quirk, one that is so well established now that I've learnt to live with it, concerns the built-in text editor WritePlus. Though it's a perfectly servicable little app for editing your articles, with all the features you'd expect from a 'word-processor lite', through all the versions I've used, I've never once figured out how you can change the font colour from within the confines of the editor. You have to leave its screen and do it 'on the page'.
___________________

DrawPlus
(vector drawing and tracing)
This is an excellent vector drawing program which, I would go out on a limb and say, gives CorelDraw some stiff competition (at about a sixth of the price). Having said that, I don't use it that much myself, as PagePlus' own built-in drawing tools do pretty much everything I need these days, so I've not upgraded this beyond version X4. I occasionally use it for drawing quick buttons to put on (non-WebPlus) websites. What DrawPlus is very VERY good at is tracing bitmaps and turning them into vectors. It's so fast and tweakable, it has completely pushed my old version of CorelTrace to the back of the cupboard.

Quibbles... I probably don't use it enough to have noticed anything annoyingly wrong with it. I wish that its rulers would stay set on pixels, as I mainly use the prog for creating elements for websites... but everytime I boot up DrawPlus, it has defaulted to inches again! Maybe that is an issue that they've addressed with more recent versions, but it's such a small thing and not worth me upgrading just to find out if they have!
___________________

MoviePlus (video editing)
I first purchased this as a free 'starter edition' download and then, having been suitably impressed by that (at the same time realising its limitations), upgraded to the full X3 download version. I should point out that I have no serious 'need' for this program. I frequently resist any of Serif's nags to upgrade to the latest edition. I've experimented with it a couple of times and produced some reasonable results (see CC:PP videos), but I don't own a any other sort of digital video equipment, so it's just a bit of harmless fun. But if you do need an editing suite to go with your spiffy new video camera, then you can't go wrong at this price.

Quibbles... It makes huge demands on the hardware, so it can get pretty slow at times. But this is not a specific 'quibble' about MoviePlus, that's true of all video editing software. You need a pretty powerful computer to edit video, or else you will run out of steam quite quickly. Digital moviemakers at the professional level tend to quote things in terabytes rather than in megs and gigs! I have to say (and this is true of all of Serif's stuff) that MoviePlus doesn't make as heavy a demand on your system as similar progs I've tried out, providing you don't get too ambitious. I've probably not used it enough to notice too many minus points just yet.
___________________

One General Quibble... Throughout their existence, Serif have stubbornly refused to include any online one-touch registration facility in their software. When you want to register their software (and you have to do this to stop those annoying nag screens everytime you boot up), you have use the telephone. The call is free, but it can involve you being kept waiting for fifteen minutes while you listen to some icky synthesized Mozart. When you finally get to talk to a human being, they will probably try to sell you another upgrade while you wait for your registration code to be generated. One registration code will unlock all of the Serif software on your computer... but should you need to upgrade your system at any time, when you've finished reinstalling everything, it means "The Return Of The Nag Screens" - and you have to do it all over again!

www.serif.com

Comments from over there - A couple of people have 'corrected' me over on the Serif Forums, for which I am grateful (at least it proves that someone out there is actually reading this crap)...

AP - That's an interesting article, but just to pick up on a couple of points... the Serif animated marquee doesn't use DHTML/JavaScript, it uses Java. I'm sure it wasn't dropped because scrolling marquees are no longer considered 'fashionable'; I think it was dropped because Java is often a vehicle for malware nowadays... They want you to think that you have use the telephone, but you can also register online.
re: Dynamic HTML - ...people have now pointed this out "it doesn't use DHTML/JavaScript, it uses Java". I think what I was meaning is that these kind of dynamic effects are what we used to do using Dynamic HTML (I 'grew up' using FrontPage, for my sins), but that DHTML has fallen out of 'fashion' in favour of other ways of doing this. Then again sometimes these don't always work on 'certain' browsers because folks don't let them allow Java content for 'security' reasons. Catch 22!
re: online registering - Yes, I happened to stumble over the online option the other day. You're right, it's there, but they don't exactly draw attention to it (eg; by actually telling you this on the nag screen itself!). As I've found whilst digging around these forums (fora? fori?) over the last couple of days, there's a lot of 'work it out for yourself' involved with Serif's products.

Monday, September 24, 2012

Stuck inside of Mobile...

I hate mobile phones. I hate all phones, but I particularly hate the wretched little pocket variety. I hate the demands they make on your wallet and the fact that, even though you never stop paying for them (The Gift That Keeps On Taking), they are virtually obsolete the minute they leave the box. I hate their piddly little keys. I hate the fact that my head gets microwaved every time I use one.

I don't need one in my life. I do have one, but it is an obsolete Nokia 2310, which does nothing except make phone calls and allow people to call me. It's nothing more than a glorified pager. That's what I expect my phone to do. I don't want to use my phone to take pictures, or play games, or surf the internet, or listen to music, or watch telly. I already have a perfectly good camera. I watch telly at home, not on the bus. I already have several MP3 players. I already have a near-state-of-the-art PC. I don't play games.

It's a generational thing, but I also don't text much. I hate the fact that these horrid objects have gone some way towards reducing the written English language to a sequence of monosyllabic grunts.

But, for my sins, I'm trying to design web pages and I need to move with the times (bah! humbug!). Having lived through the years when all computers were shackled to chunky great monitors which had a screen definition of 800 x 600 pixels (if you were lucky), it was liberating as a designer to be able to do MORE with a web site. Screen resolutions and connection speeds had reached the point where near-cinema quality pictures are now possible. Web browsers also became more and more sophisticated, with cross-platform standards (with the exception of M****soft's Internet Exploder, hahaha) that could never have been possible before. It has been a golden time to play with computers.

Except that now, the Sinister Marketing Forces have decided that the future of the internet is mobile devices. I'm having to rethink everything I held to be true because, for reasons I cannot fathom, public demand is that the internet should now be squinted at through smaller and smaller screens.

_____________________________________ 

CASE STUDY
This website, built for a friend of mine who is something of a big cheese in the world of digital and 3D broadcasting, is several years old now. I recently bought the latest version (X6) of Serif's WebPlus software, so this seemed like as good a time as any to drag the site screaming by the scruff of its stylesheets and bring it up to date a little.

Looking at the site on my chum's enormous high-definition widescreen, I was struck by how small it all looked nowadays. I therefore rejigged the master pages and tweaked the whole of the website to suit today's larger monitors, at the same time not making it too big, so that those without the benefit of big screens won't have to resort to horizontal scrolling (another pet hate of mine!).

Among the spiffy new features introduced by Serif for this version is the ability to add 'social network' buttons. We'll have some of those, says I! You can now tell all your friends on Twitface and Booker about the site, at the click of a 'share' button. You can bookmark the site on Google and 'Plus One' it on GooglePlus. I've also updated some of the content (overdue), as some of the links went to websites that have moved or don't exist any more!

Another heavily-touted new WebPlus feature is the facility to create a version of your website to fit on these new-fangled mobile doobries. This seemed like an ideal opportunity to do just that with the HDDC site. It is perfectly possible to view an existing 'desktop' website on a mobile device, but really, when laying out pages, one needs to think "portrait" rather than "landscape". My existing website is very much in the "landscape" camp, with that navigation menu running down the side and some of the pages having more than one column. I'd have thought that cramming all that into something mere inches across would ruin eyesights the world over. Serif will allow you the option of integrating 'mobile' versions of the pages into your existing site or creating two completely separate versions of a website. You then include a "redirect" script which determines what browser you are using to look at the website, and then switch to the page size to suit you. I decided that creating a separate parallel mobile site, rather than mixing all the pages together in one project, would make it easier (for me) to navigate.

The first prototype of the mobile version of the site doesn't look that different to the desktop one. All the content is same, but I've now laid out each page in one single scrolling column. I based the dimensions on the screen size for the original iPhone, a visible width of 320 pixels. I believe Blackberries and Androids and Symbians are all about the same width, so that seemed like a size to plump for (Serif's own manual pages about designing for mobile were most unforthcoming on such specifics).


The main headscratcher with this project was this - How do I include a navigation menu on every page? The site has ten or more pages, some of which have sub-pages of their own. A text-based list in a reasonably legible font fills the entire screen! The obvious solution would appear to be a dropdown navigation menu, normally hidden away but which appears under the page's 'home' button when you point at it. I designed one using Serif's own tools...


Now remember, I don't have a smartphone of my own on which to test this ruddy thing, so I rely on feedback from those that do! Having made the first prototype go 'live', I discovered that the Serif script which directs phone users to the mobile version of the site... didn't! I had to type a much simpler javascript fragment of my own and paste it into the homepage's 'head', which apparently did work. The Serif one was a lot more complicated; it has an 'include' list of all the various flavours of mobile phone, with the option of specifying screen sizes. It might be customizable to get it to work, but why bother? Mine (gleaned from the net and then tweaked to suit) was a lot easier - All I ask is that screens bigger than 700 pixels wide (that would include tablets 'n' pads) use the desktop version, and anything smaller than 699 pixels (the majority of existing mobiles) redirect to the mobile site.
###THIS GOES IN <HEAD> PART OF MAIN HOMEPAGE###
<script type="text/javascript">
<!--
if (screen.width <= 699) {
document.location = "http://www.hddc.co.uk/mobile/m-index.html";
}
//-->
</script>
Now having done all that and got the connections working... it was reported that the dropdown navigation menu doesn't work on my chum's Samsung. What a palaver! Me being an ignorant newbie, I don't know whether this is just a 'thing' with touchscreens, or whether his browser in particular has an objection to javascript-based menus in general (it's a mystery to me how you can adjust the software settings on these things. Perhaps they don't expect you to?). When he points at the home button, instead of a nice dropdown menu (tested by me on every flavour of desktop browser) he sees an orange error box. At this point (well, shortly after I'd finished with the head-banging-on-wall routine), I mentioned all this in a MySpace update, hoping that I might get some feedback from a few other chums...

...otherwise, it's time for a rethink. A Serif-generated menu, while it works jez dandy on a PC, won't necessarily be compatible with all them other devices. I needed a non-java solution, just using good old HTML and CSS. Now those I understand! Prototype number two looked like this:-


The 'rainbow' of coloured bars running down the side of the screen does away with the need for any sort of obtrusive real-estate-hogging text... but it quickly became obvious to me that a purely 'graphic' approach might not be clear in its purpose for the user. I added a 'title' attribute to each of the bitmap buttons so that there would be pop-out text 'tooltips' telling the user where the buttons link to. But the browsers' own tooltips aren't particularly pretty and they appear rather slowly and relative to the pointer, rather than alongside the buttons themselves. I also wearied of the rainbow theme, which doesn't fit the 'corporate identity' of the site.


As a standalone HTML project, I've built a set of menu buttons that look like this (above), with a little window that is fixed in one place, displaying the tooltips for each button. But I haven't had any success incorporating it into the 'real' site yet - I fear it might clash with the site's own existing CSS and that a few overriding !important;s may be needed for everything to work properly... yep! you guessed it! It's a "WORK IN PROGRESS"!

The current "working"(?) version of the site looks like this (at least temporarily), with plain buttons more in keeping with the sites own colours. It still relies on the browsers' own tooltips though, so I'm waiting for the 'field testers' to let me know if it is actually practical as a navigation solution.*


STOP PRESS - * No, it isn't. The tooltips don't show up at all on the mobile browsers we've tried. We've now plumped for a homepage-sized text-based navigation instead. Ho hum. So the ultimate answer to the question "How do I include a navigation menu on every page?" is... I don't! (By the way, the arty homepage picture of Peter, which I had to remove in order to make room for the 'menu', has now been moved to the "Principal" biog page...)


_____________________________________

Far too many websites today look to me like kitchen appliances. Many 'designers' seem to go for a standard, clinical shiny-white-with-grey-buttons scheme.

Why don't they try to inject a much needed splash of colour? My own attempts at trying to do just that, especially with certain social media sites, are well reported within these very pages.

It takes a lot of effort to 'design' a website from scratch. As I've found, it takes even more effort to adapt an existing website for mobile viewing. Nowadays, because you have to make it look 'good' on any device, not just your favourite desktop internet browser, it means building more than one version of the website... or going for the lazy option and keeping it really simple, making everything look as generic as possible. Boring.

Not content with destroying the written language, I believe that mobile phones have now turned graphic design back several decades as well.