The site has just received a new design. The old one was looking a little dated and the blog design didn’t exactly match the main site design.
The content is still the same for the moment but over the next month the portfolio is going to be updated and some new features will be added.
This is all part of a number of big changes happening at mjcpk. So watch this space!
The term Web Designer is quite loose. You might be a designer who never codes, a coder who dabbles in design or, more often, someone who is a jack of all trades. Freelance Web Designers can often be a one person band. The client expects you to handle everything to do with their website: domain registration, hosting, email, design, coding, databases, seo, site submissions, promotion, visitor statistics and more.
So how do you handle all these extra jobs and keep your clients happy? The trick is to use a number of free services and applications to take the load off. Here’s 10 to get you started.
1. Dynamic Drive Favicon Generator - http://tools.dynamicdrive.com/favicon/
It is the little details that are important in site design. Professional sites have a favicon and so should yours. This tool creates a favicon from a image that you uploadand provides the .ico file and code to use it.
2. Stripe Generator – http://www.stripegenerator.com/
A single colour background can be flat and unimpressive but making your own tiling striped background isn’t always a quick and easy process. This tool allows you to create them quickly, preview your results and even try out a number of different ideas.
3. Background tile generator – http://bgpatterns.com/
If stripes aren’t your thing how about a patterned background (with or without a texture)? Again, it is quick and easy leaving you time to worry about the bigger issues.
See http://singlefunction.com/15-online-background-generators/ for more background tools
4. Google Webmaster Tools – www.google.com/webmasters/tools/
For essential info about your site Webmaster Tools is a must. Register for a Google account and sign your site up for free. Highlights include: number of inbound links to your site, submit a sitemap to ensure Google finds your pages, any errors Google found while indexing your pages, what people are searching for when your site appears in the listings, keywords on your site and much more. All of this is collected for you and in one easy place. It will take a bit of time and learning to be able to make use of some of the data but it is worth the effort.
5. Google Analytics – www.google.com/analytics/
How many visitors has your site had? Which sites did they come from? How long did they stay? What were they searching for? Did they perform any specific tasks while they were there? What browser did they use? What language do they speak? Which country do they come from?
If you want to know the answers to these questions and, more importantly, be able to tell your clients then you need Google Analytics. Add a small bit of code to every page on your site and then Google does the rest and displays pretty graphs and statistics for your viewing pleasure.
6. Google Adwords + Adsense - http://adwords.google.com/ and www.google.co.uk/adsense
These tools build on the previous two. Once you have reliable data about your site you can do something with it. If the number of visitors is low then maybe you could use an Adwords campaign to bring in more traffic. If you have lots of visitors maybe you can use Adsense to generate some income. With statistics to back you up it is far easier to sell an idea to a client (or even yourself).
Like all the Google tools they save you time and money which are both precious to a freelancer. Google also provides a lot of information on how to use their tools effectively. This includes written and video tutorials and guides.
7. W3 Schools validator – http://validator.w3.org/
Ensure you have kept to the standards with this tool. It is a good way to improve the standard of your code. Don’t just validate at the end of a project though. Check repeatedly as you go and fix errors as you find them. Most importantly try and understand why something was an error and learn from the experience.
8. FireFTP – http://fireftp.mozdev.org/
FireFTP is a plugin for the Firefox browser that lets you transfer files to your website by FTP. There are lots of FTP clients out there but this one is always with me, in my browser. It is quick and simple to use and it is easy enough to transfer the FTP account details between computers if you use lots of different ones.
9. FireBug – http://getfirebug.com/
I first started using Firebug to check for errors in javascript but I quickly learned that it could do so much more. One of the handiest features is the ability to edit the CSS of a page directly and see the results in the browser. The is helpful both to learn how things work and tweak your designs without having to go back and forth to a text editor and then refresh the browser every time. It can also edit HTML in the same way.
10. Rank Checker http://tools.seobook.com/firefox/rank-checker/
Rank checker allows you to enter a number of search terms and to check where your site ranks for those terms on a number of different search engines. I routinely check the rankings for multiple sites across 5 search engines. With about 20 keywords each, checking them would nearly be a full time job without Rank Checker. The results can be exported as a spreadsheet for conversion into graphs and charts to show clients if you want.
So there we have it, 10 tools I wouldn’t be without. They’re all free to use and save me a massive amount of time. Not only will using these tools help you do your job but they will also teach you new things on the way. The only way to be a good Web Designer/Developer is by continuing to discover and understand new things. The web changes quickly so it is important not to be left behind.
Working on computers everyday, as I do, I worry about eye strain. In fact, I only started to need glasses when I began using a computer everyday at college. To keep your eyes healthy they recommend that you take a break from the screen every 15 minutes and, ideally, look out of a window. It is important to get your eyes focusing at different distances to keep the focusing muscles in shape.
The only problem with this is that it isn’t easy to take a break every 15 minutes. When I’m in the flow I can lose hours just like that. For a while I had solved the problem by having my desk in front of a view that looked out towards the North Downs in Kent. It was a pleasant view that drew my eyes away from the screen often enough to give my eyes a work out. Unfortunately I now have to work in a room with no window. There is a rooflight window for natural light. Now that I’ve lost my view I have started to worry about my sight again.
I’ve always though it a shame that we can’t just put a photo of a nice view next to the screen to achieve the same results. Obviously that won’t work as there is no depth to a photo and your eyes only need to focus at the same distance as the screen. Then I hit on the next best thing!
A very basic diagram of how it works.
I call my little invention the psuedo-view. I haven’t had a chance to make one and anyone is welcome to take my idea and market it if they want to. If you do could you please send me one or two of the finished product and token payments are always welcome!
The idea is that for each eye there is a tube to look into. They are separate from each other and contain three transparent plates in them. A foreground image is printed on the closest plate to the eye, a mid-ground one on the second and the furthest one has the background on it. The three images combined show a photo of a nice view. Both eyes see the same images.
Here’s the clever bit. By adjusting the positions of a pair of plates (left and right) we can make it so the eyes have to refocus to go from looking at the foreground to looking at the midground or background. Just like in real life.
I haven’t been able to test this but it seems like it should work given my meagre understanding of how the eyes work. Essentially I was envisioning a set of binoculars with adjustable images inside them. It would be more practical (and possible I think) to slim them down to a pair of glasses you could pop on and off easily for a break now and then. You could even sell executive versions that play you soothing music.
If you have and comments or suggestions I’d be happy to hear them.
Distributed Denial of Service (DDOS) attacks have been in the news a lot lately. Wikileaks was attacked and then their supporters launched attacks of their own in retaliation. It seems to be an increasingly popular way of hitting out at your enemies online. A number of news article have made mention that it is now often used as a way to censor human rights groups. DDoS Attacks Aim to Censor Human Rights Groups – InfoSec Island
ddos - distributed denial of service
Weathering the storm of a DDOS attack can be a costly business and is often beyond the budget of Human Rights Groups and charities. Hosting companies don’t like their servers to be battered due to the knock on effect on their other customers. Groups can be asked to switch from shared service to a dedicated server or find alternative hosting.
The whole problem stems from having a single point of failure. Any server, no matter how well prepared, can only deal with so many requests. Expensive load balancing set ups can alleviate the problem but, ultimately, faced with sufficient numbers they too will be overwhelmed.
The standards for DNS allow for multiple IP addresses to be assigned to a domain name. It has always been considered a poor man’s equivalent of load balancing due to the fact that there is no analysis of server load before giving out the IP address. Addresses are dispensed in a round robin method. Whilst this doesn’t suit conventional load balancing I believe it can be used effectively to reduce the impact of DDOS attacks.
To ensure that their message wasn’t lost in the DDOS barrage Wikileaks duplicated their content on over 500 other web severs world wide. The main site went down but the information still remained available elsewhere. If we combine this approach with round robin IP addresses we have a method spreading the load of a DDOS attack across many servers and, thus, reducing its impact. Hackers from Anonymous had to give up their revenge attacks on Amazon, Mastercard etc. because they didn’t have the numbers to be truly effective. The more servers involved and the harder it becomes for the attacks to mount an effective attack.
What is required to make this suitable for charities and other groups to use is an organisation to provide them with a single ftp upload point and the rest is dealt with for them. The organisation would need to rent server space from as many hosts as they can (using basic reseller plans this would be easy to do), manage the DNS details and duplicate the content across the servers.
There are many people looking at other methods of managing DNS. The Distributed DNS project is an example. Any change to the DNS infrastructure of the web is a major undertaking and requires the agreement of many groups and organisations but, in the meantime, this looks like something that can be done to mitigate the effects of online attacks on free speech.
For the last week I have been working my way through the challenges on www.HackThisSite.org.
HackThisSite has a number of ‘missions’ where you are required to hack into websites to achieve your goals. However, all of the challenges are simulated and hosted on the HackThisSite servers so it’s all legal and above board. To complete the tasks you have to learn a number of different methods of hacking and improve your general knowledge of programming, cryptography and internet protocols.
There are many reasons to want to do this. It’s fun but it is also educational. It is hard to design secure websites and applications without any understanding of how others may try to exploit them. Some of the ‘basics’ challenges on the site seem almost laughable but it is surprising how often you see some of these vulnerabilities in the wild.
For me it has been a real eye opener. Now I can’t even look at one of my own sites without thinking: ‘How can I exploit this?’ I’m looking for ways someone would hack my sites and it makes me all the more careful not to leave gaping holes in my own security.
I’ve often said that a good understanding of photography aught to be compulsory for designers. Well, likewise, working through the missions on HackThisSite aught to be compulsory for developers so that they can understand some of what they are up against.
Forewarned is forearmed!
Occasionally I have to use a Windows PC at a client’s offices and for the most part I don’t mind. However, now and then I really want the familiarity of a Linux system and some specific functionality of it that I am used to.
I have a laptop and a netbook, I have live CDs, DVDs and USB sticks but none of those provide the ability to immediately swap into a Linux environment.
Enter Tiny Core Linux. Or more specifically enter Windows Virtual PC running a version of Tiny Core Linux. Windows Virtual PC is a freely downloadable virtual environment where you can run virtually any other Operating System on top of Windows.
The problem with virtualisation is that the guest operating system usually runs very slowly and often this makes it unworkable. Furthermore, it also takes up afair amount of system resources so you wouldn’t want it running in the background ‘just in case’.
So, again we return to Tiny Core Linux a Linux distribution small enough to run quickly when virtualised and to sit in the background ready for action without cramping my style.
It also has a number of other features like its very different but effective package management system and its seeming immunity to degradation over time.
All in all this is a fantastic Linux distribution especially when you want something to run side by side with Windows. This can make browser testing much easier. Thanks Tiny Core Linux!
We have to keep reminding ourselves that the web is still in its infancy. Due to its rapid rate of change we’ve yet to really nail down some real best practices for using the web. This is especially true when it comes to privacy.
There are obviously issues with any number of web services but I’d like to talk about a rather small and niche area: staff photos on company websites.
Companies often put photos of staff on their bio pages but what’s the risk? It’s important to remember that due to historical archiving anything we put on the web is likely to be there for the foreseeable future. A simple search for someone’s name in Google could throw up any amount of personal information which includes that photo from their employer’s website.
I’m not about to suggest that we never put photos on the web but I would rather we didn’t make it easy for someone to produce a police state type dossier on us via a simple Google search.
Whilst a .htaccess file can be used to prevent hotlinking and, therefore, someone seeing the full image from a search it doesn’t prevent the image being indexed and the thumbnail showing up in an image search.
So, about all we can do for the moment to mitigate this is to add no-archive and no-index to the rel attribute. Links images should also be no-follow. This way legitimate users of the company website can view the images but Google wont keep copies.
Focusing just on this small area has show me how complicated the whole area of privacy is when you expose yourself to a global network that is indexed in one place and backed up in massive archives.
There are a lot of issues to sort out with regards to privacy and, for me, there aren’t any easy answers. There will always have to be a trade off between privacy and ease of communication.
So what do you think? Am I right or just paranoid? What solutions do you have?
As of today I have switched my blog to WordPress. I had writen my own blog engine that was working very well but I needed a few more featured and I really didn’t have the time to write them, test them and support them.
There are lots of SEO benefits to switching to WordPress and it is a lot easier to add to and maintain.
So now I have all the things that people expect these days from a blog like RSS, themes, plugins and lots more besides.
The change over process has been a bit of a rush and at the moment the older posts all have today’s date and have yet to be categorised but I hope to sort that out when I have a free moment.
I got a new computer a year and a half ago and it came with a fast multi-core processor and a fancy 3D graphics card. I was excited by the prospect of some serious 3D goodness and I wasn’t disappointed. Compiz did all sorts of whizzy and imoressive things. However, after my excitement had died down and I settled in to do some real work I ended up turning off Compiz because it offered not real productivity gains and was chewing up resources just looking pretty.
Not being a gamer I have no real use for my fancy 3D card other than my occasional renderings using Blender. So for me, and many other users, 3D is a gimmick in search of a practical use. It needs a killer app or apps that make use of the 3D to do something other than make things look pretty.
What about a 3D file manager? With a conventional 2D file manager it is often difficult to get an good impression of file system usage and the layout of directories. Using a 3D representation it would be easy to get an overview of the file system whilst also being able to inspect things more closely.
My suggestion, and I’m sure there are other equally valid choices, would be to see the file system as a city (or even a country) where directories could be at first displayed as districts, then sub-districts, housing estates, blocks of flats and down to individual flats and houses. This would enable the user to fly around the file system and to see, at a glance, how space is distributed. Bigger directories would be relatively bigger houses, buildings or districts. It would also be possible to see sub-directories within a number of directories at the same time as you could be looking at a number of buildings within a sub-district and see the flats within them.
Using could coding it would be easy to see it a directory contains many small files or just a one or a few big ones, for example. There are also a number of ways that the view could be displayed depending on the depth of the file system. Deep file systems could start at a country or even world map and go down to individual rooms withing flats or houses if necessary. The trick is to use the 3D experience to make it intuitive for a user to navigate and to get information that he or she wouldn’t be able to easily get from a 2D representation.
There must be many ways where 3D can be used to make information more readily accessible in a way that works well fo0r our brains. We just need to think outside of the box and stop thinking of 3D as something to make things pretty. Afterall we live in a 3D world and interact with things daily based on their position within three dimensions so it can be that hard to think of ways of using that to display data meaningfully.
12 years ago I trained as a music studio engineer and worked exclusively on a Mac. That was the only time I have ever used a Mac and I imagine they’re very different these days. This post really isn’t about Macs but it is about something I remember liking on the Macs I used.
There was a simple feature, that may well still exist on Macs today, and that was the ability to colour folders on the desktop or in the file manager. I was thinking about this recently and it got me on to a whole load of little additions I would like to see in a file manager.
Files are most often arranged in trees using directories and sub-directories for organisation but I often find it annoying when either things have to be deeply nested within the file tree so that they are in their relevant sub-directory or they end up mixed up all together in one big directory. Neither is very helpful and neither are the usual display options. The ability to order things by type, date and position in the alphabet are ok but inflexible.
What I would like is the ability to define groups within a directory and assign files to a group. Groups could have a colour assigned to them so that it is easy to see which group a file or directory is in. You could then order files by group and see files/directories at a glance without having to navigate into different directories to see all the files.
As an addition to this I would like to divide a file manager window up into group areas so that I could easily drag and drop files into groups ( this would also work for cut, copy and paste). If I could then order files within the group by time, date or name that would be really useful.
Whilst we’re adding information to files (the group name) then we may as well add other metadata too that can be displayed in the file manager as necessary. It would often be handy to be able to add descriptions, notes or a revision number to a file. Maybe a warning feature would be useful whereby a warning dialogue box would pop up if a file or directory was accessed.
I’m sure that there are many more ideas that could be incorporated too. The easier it is to handle and understand large amounts of data the better in my book and it would certainly stop me have files dotted around my drive in a disorganised mess like I do now. If these features exist in any form in any current file managers it would be nice to know and if not it would be nice if someone tried to add them.
