For many designers and front-end developers, another hot topic of conversation is the @font-face CSS declarations which now allow us to use any font we like in our websites as if it was installed on the users computer.

Before we were restricted in which fonts we could use, relying solely on the fonts which most users would have installed on their computers; Arial, Verdana, Times New Roman, Courier New – to name just a few.

Now we can upload the required font files to our server, reference them in our CSS and we are all set.

I bet I know what you are thinking – what about browser support? It goes without saying that everything we do is affected in someway or another by the browser support of the features we want to use. The good news is that @font-face is currently supported by all major browsers: Firefox 3.5+, Chrome 4+, Safari 3.2+, Opera 10.1+, even Internet Explorer 6+.

But hang on, isn't Internet Explorer 6 (IE6) over 10 years old? Yes it is, and even though @font-face is officially a new declaration within CSS3, it was originally planned for CSS2 and therefore was implemented by IE6 – when it came to @font-face being removed from the spec (for reasons I am not quite sure of), support was never removed from IE6.

For more information on the code required and how to create a bulletproof @font-face declaration which is cross-browser, check out Paul Irish's article on 'Bulletproof @font-face syntax'.

However, though in theory @font-face allows us to use any font we like – we are restricted by the font's licenses whether font embedding or sharing is permitted. This is mainly down to the fact that if we are linking to a font file in our code, it means anybody can just download the font and then is it on their computer.

Therefore, it is important to check if the font you want to use is permitted to be used on the web.

Alternatively, there are a few resources which I have come across and found extremely useful in getting @font-face fonts and making sure they are permitted to be used.

• Font Squirrel

  The Font Squirrel website lists 'hundreds of @font-face font kits' which are 100% free for commercial use. The kits provide all the necessary fonts and code needed to be implemented.

• Fontspring

  If you wish to have even more of a selection of font, and have a more unique feel to your website - Fontspring provides purchasable fonts along with @font-face licenses, all very reasonable prices.

• FontDeck

  Whereas the last 2 services allowed you to select individual fonts, and in the case of FontSpring, purchase @font-face licenses, FontDeck allows you to pay a subscription and have full access to their library of fonts to use on your website. Great alternative if you want to use a lot of fonts, or as a freelancer you love to use unique fonts for all your clients' websites.

• TypeKit

  Like FontDeck, TypeKit allows you to pay a monthly subscription allowing access to their library of fonts and use them on your website. The higher level your account type is, the more fonts you can use and the more website domains you can use the fonts on.

So when you are next designing a website, or even as a client looking to have a website designed, look into the possibility of using more custom fonts to get more aesthetics and edge on the web. Stand out, be at the forefront of new technologies and trends.

 

The answer to this question will be dependent on a number of parameters. Are you an in-house agency within a corporate environment? Are you a freelancer constantly on the move? Or are you stifled by the powers that be who believe the walls should be magnolia?

 

You also have to look at the individuals. Do you like to share ideas and visuals with your colleagues? Does the thought of an open critique on the work you have produced make you shudder? Are you open to suggestions, comments and opinions from colleagues?

 

We believe that the answer is about displaying your work, whether in a draft or finished state, for all to see and allow opinion from all that pass by, should they wish to give it. You never know there could be a nugget in the suggestions which help develop your solution further. 

 

It also can give you a broad snapshot of a running project and allow you to visually trackback, potentially using earlier ideas to enhance your current version. By keeping your past visuals piled up on a table, never to be seen again, you are not allowing yourself to fully appreciate where your creative journey has come from… and alas never taking the positive elements along for the ride.

 

Having worked in offices where the walls were kept bare (for all sorts of reasons), the amount of life generated from designs placed on magnolia is great. It creates a creative buzz and allows all of your colleagues to see what you are working on and how a project is taking shape.

 

The individual is another barrier. Some creatives don't feel too comfortable placing their wears on show. This could be down to confidence or having an insular personality where cards are kept very close to their chest. Unfortunately carrying these traits can be detrimental in aiding a successful project solution.

 

People who lack the confidence need to remember the phrase 'no idea is a bad idea', every solution is valid. To those who want to keep everything to themselves then the only way to really progress your visuals and your own creative skills is to share. Your colleagues are the best tutors, plus they are free!

 

 

 

 

By using a pack of Post-It notes it's pretty fantastic how much feedback you can glean from fellow colleagues. The other thing is you get yourself an organic, evolving wallpaper for your office.

 

So go on, stick your work on the walls!

 

A well deserved winner this week who is the first to receive the hat-trick of awards. This time his excellence has been achieved by delivering 60 templates in 2 days - impressive by any standards, but he also worked on other projects and even took work home to complete.

 

Thanks for all the hard work - again!

 

Ben MacGowan

 

 

 

Summer is here and there are a few things that you can be sure of; there will be rain, you will sweat in your office and your days will be filled with the sound of sniffing and sneezing.

 

There are hayfever sufferers everywhere, in fact 1 in 4 of the population experience hayfever and it isn’t hard to spot them.

 

They are the ones continuously sniffing and sneezing like they are working in a pepper mill, with red-streaming eyes usually found on weepy rom-com attendees. 

 

Basically, annoying for all parties involved! The Hayfever sufferer can take a range of antihistamines including tablets such as Piriton, Clarityn, Benadryl, supermarkets own, nasal sprays, lozenges and anticholinergic sprays.

 

But they have to face side-effects such as drowsiness, dizziness and headaches oh and there is also the small problem that they really don’t work! 

 

Hayfever is the body’s way of fighting the ‘harmful’ pollen, when the immune system goes into overdrive and triggers chemicals from certain cells in the nose, throat and eyes; culminating in the above effects.

 

There are the usual hints and tips to prevent hayfever, but one that is often overlooked is the cleanliness of a work station!

Keyboards and drivers can harbour dust, pollen and a whole host of nasties, make sure you keep your area as clean as possible. Here are a few tips:

 

• Never eat or drink near a computer – this is just sensible, if wheezing and sneezing wasn’t bad enough munching through several packets of crisps and sucking tea is just as gross!

• Turn off - When cleaning a component of the computer turn it off –no shocks or pieces of cloth getting lost in the machinery that way

• Keyboard - usually the most infected item, containing more bacteria than a toilet seat! Use compressed air to blow away debris from between the keys, then spray disinfectant onto a cloth and wipe.

• Cotton swabs- with rubbing alcohol or water to get into those hard to reach places.

• LCD – the screen attracts debris and pollen and will need a gentle clean to remove those static monsters. Use a soft cotton cloth, which won’t damage the screen

• Mouse – a mouse with a ball can hide a whole lot of yuck! Removing all components and disinfecting them is the best way to ensure your mouse is clean.

 

With a high majority of workers being office bound, what else can be done to prevent the sneezing, coughing and wheezing? Here are a few more general tips:

• Keep doors and windows closed

• Wear wraparound sunglasses to keep pollen out of eyes – pretty cool!

• Put Vaseline on the inside of your nose to prevent pollen getting in

• Create your own air conditioning; get a battery operated fan and spray some water through occasionally for a bit of freshness

• Try not to rub itchy eyes; washing your face and hands can help.

 

If, after all that, you are still annoying your co-workers maybe it’s time to picket for your own hayfever survivors office!

 

 

 

Where to begin??

I recently received the company ipad to stack full of goodies and other little treats for presentations and events.

I have to say… wow! This little thing is a great device for showcasing and presenting work on. The screens incredibly crisp and picks up on every detail within the design.

Any way I'm not writing a ipad review here…

I'm writing to talk about my nightmare with integrating video into a publication to use within ibooks.

I'll firstly explain that I'm a creative designer with a long history of building front end development for websites too and that I'm pretty new to this ipad business!

Coming from the creative side of things I first fired up indesign cs4 and went to work with a case study, looked great, exported as a pdf and dropped it on the ipad using itunes. Took no time at all to transfer, quick swipe of my finger and a tap to load up the ibooks app. There and behold my pdf in all its glory! Tapped to open the pdf up to view the contents, simple easy to use dragging left and right to switch pages and using the multitouch pinching to zoom in and out.

Using indesign was a simple and effective way of getting PDF's onto the ipad in exactly the way you exported them as. The only gripe are the covers, my PDF was all landscape therefore creating a very small landscape book cover. The only way round this was to rotate the cover of the book or redesign the cover as portrait.

So how do I add video into this PDF?
Simple answer is you cant. (Adobe, Apple, sort your life out and make it happen!)

Hours and hours of hunting high and low on the web and reading various forums and blogs I came up with nothing, I tried absolutely everything. The only viewer that allows you to view video within PDF's is adobe's own acrobat reader which isn't available on the ipad. The apple ipad uses it's own rendering system therefore not allowing videos to be displayed. Within adobes acrobat reader the video is prompted with a potential security risk dialog which you have to trust to view. This might be another factor in apple leaving video out of PDF's, plus that acrobat uses quicktime.mov and flash.flv files to render the video is another issue that we all know about (flash support).

So how did I get video into the ibooks app?
Using html5 of course!!

This stage took me a while to get to, hours of exporting files and building files from indesign to realise that indesign doesn't attach the video on export no matter what you try.

So closing indesign and opening up TextEdit was the next step, yes I was going to create an ebook from scratch.

 

Epub files are nothing but a compressed wrapper holding the ebook together, within this epub file you'll find all the chapters, images, css and contents. Change the .epub filetype to .zip then extract the zip file to view all the contents.

 

I created my chapter using dreamweaver with html5 video keeping the code incredibly simple. Updated the opf and ncx with the chapters details. Converted the folder back to an epub by compressing and changing the filetype again. Dragged and dropped this over to the ipad using itunes, quick swipe of the finger and tap brought up the ibooks app. There it is!! The epub book I created, tapped it to view the contents… fail… either I got prompted with an unknown error or that was there was only text no video?

Why's this? It's all correct, or isn't it? Going over all my code again, trying multiple versions till everything was streamlined and perfect but still no video or unknown errors.

It turned out to be the smallest, most overlooked thing I could of possibly imagined. The Mac compression of the folder back to a zip then epub file, the mac threw in all sorts of code and files like '.DS_Store' which the epub just went mental over.

I came across this little gem online ePub Zip 1.0.2.app.zip [mobileread] dragging and dropping my folder onto this applescript removed the dirt from the epub file allowing it to run on the ipad.

Another transfer to the ipad, swipe, tap, loading…

I couldn't believe it, finally working video within the epub ibooks application. It looked amazing, the video looked stunning using full screen.

I hope this shed some light on creating publications for ibooks on the ipad, I'll go into detail on my next post about all the files needed to hand create your own epub publication.


Robski

Another well deserved person has received his second Most Excellent Person, for outstanding work and commitment to the projects the winner is:

Simon Sturgess

 

I've been watching developments at the Times with interest. On the face of it, it doesn’t appear that the pay wall is working for the Times...

 

http://www.guardian.co.uk/media/2010/jul/20/times-paywall-readership

 

But here’s something to think about...

 

http://mediatel.co.uk/newsline/2010/07/14/the-publishing-model-is-dead-and-has-been-for-years/

 

When the move to a subscription model on the website was first announced, it appeared to be a desperate last throw of the dice from an outdated organisation in its death throes. News International was swimming against the flow of consumer demand and Rupert Murdoch didn’t understand the online medium. The naysayers were quick to pronounce that both were doomed.

 

Then, as the launch of the iPad was announced, The Times was one of the first publishers to release a paid for App. This made a lot more sense because tablet devices are the future for publishers. By setting expectation from the start that content on the shiny, new iPad platform is paid for, it gives publishers the chance to regain some control ceded to web users with their "free content” mindset and generate revenue from the high quality journalism at their core.

 

If the iPad (and other tablet devices) do represent the future, and this is what underpins the publishing strategy for The Times, free content on the web would have been an anomaly, so it's a smart – if unpopular -- move to erect a pay wall and eliminate this problem. The question will be how quickly consumers adopt tablet devices and how long News International can sustain this controversial strategy.

 

Rupert Murdoch has form in this regard. He has bet everything on a high risk strategy before. In the nascent digital TV market, he gave away free set top boxes and dishes to consumers to drive uptake of Sky digital, weighing up this initial outlay against the life time value of a customer.

 

He backed himself and bet the business on the fact that once people experienced Sky’s premium, multichannel TV offering with sports and movies, they would not want to go back to the dark old days of terrestrial TV.

 

Now 21 years old, Sky now has nearly 10 million customers and returned an operating profit of £780 million for the 12 months to 30 June 2009.

 

Is history about to repeat itself? It looks like Mr Murdoch may be playing a canny long game, so it would be foolish to write him off just yet. 

I am now free of contract and in the market for a new phone. But which way do I go…? I currently own a 2nd gen 3G iPhone, and I must say I absolutely love it! So, the obvious next move would be to treat myself to the iPhone 4… Or is it?

With the recent news surrounding the antenna problems should I hold fire? More to the point, can I actually get my hands on one at the moment?

To add to this quandary my wife decided to boycott the 'designers' essential must have piece of iKit, opting for an alternative solution. Admittedly she picked up a bargain and now sports the new Samsung Galaxy S… which actually looks very similar to iPhone (until you handle it that is). 1GHz processor for fast internet connection; 5 megapixel camera and full HD video, running on the Android platform. More annoyingly it supports flash!!! Grhhh.

I guess I'll just have to wait and see what gives at Apple's surprise news conference tomorrow before I make a decision.

Ole, Wilkommen, Salut and hello - Friday saw the CJ team dress up and enjoy an awesome BBQ in the sweltering heat!

 

Before the World Cup started the company got involved in a sweepstake to see who would win, and as the end of the World Cup was imminent CJ that it would be fun to do a theme celebrating this! The theme was to dress up as whatever country you picked!

 

As it was such a nice day, we all went outside to eat sausages and burgers and ice creams; thank you everyone who put in the effort and thanks to Sian and Frankie for the ice creams!

 

Now, what are we going to dress up as next!? 

 

Sorry for the lateness this week!

 

It was a tense week, would creative get a winner or would tech pull another excellent person out the bag... or would Martyn get his beloved hat trick?

 

The Creative Jar team found themselves standing in a hot, airless room at the end of the day at the end of a long week... waiting, hoping for their chance to be most excellent person. But there was only one winner, one who stood above all others this week; for her tenacity and determination for her projects.

 

This weeks winner was

 

Ally Tolhurst