The Importance of Getting The Width Right
Everyone always says, “make sure you get the width right in photoshop before you start designing”, and I always have. So much so, that I’ve never actually designed a site without figuring out the width first and getting it right from the get go… well there’s a first time for everything (as they say) and a week ago I ran into a problem.
I wanted a site who’s main content was about 990px wide, but which had vectors and other pretty bits extending all the way around the about 1200-1300px wide. So I made my photoshop canvas 1600px wide to give myself some room to play with. A week of work later, and last night I decided it was time to start coding, which naturally, first involves slicing up the layout into usable images… which was around the time that I discovered I’d made my main content area 1200px wide.
Now, had I thought of this beforehand, at the beginning of the design process, it would have been a relatively quick fix. I would have simply drawn some new rectangles, and moved about 3 layers. Now however, about 150 layers later, changing something like the width – throws the entire layout out of proportion and effectively makes my life very very difficult.
It leaves me with two viable options
- Slice the layout to be dynamic width
- Lots more markup
- I don’t need a dynamic width
- Lots more code work
- Edit the layout in photoshop and slice normally
- Hours of fiddly clicking
- Could lose an have to redo several vectors
- No real benefit of the additional work
I still haven’t decided which I’m going to do, to be honest they’d probably take the same amount of time, the only difference would be that if did option 1 then I would have actually accomplished something in that I would be able to make a fluid layout, but I would most likely have to lose the drop shadows on my main content boxes, which would be a shame. Then there’s also the issue of two electrical connectors that I have ‘connecting’ my content boxes, I’m not sure how they would stretch as they go across both content area and background area…….. looks like I’m probably going to end up using a whole lot of transparent PNG’s.
Now where did I leave that transparent png IE6 Hack?
Best Coding Software for a Web Designer
When I started learning html it was simple, I opened notepad, I saved the file as a .html – and then I previewed with internet explorer – and that was that! A couple of years later I expanded to learning a little bit of php and building full websites, but I was still doing it in notepad! Then I got a little mac application called JEdit, which colour coded all my tags and attributes (which I thought was the bees’ knees!) it crashed frequently though and to be honest was a bit of a pain.
Later still as I progressed further with my ’skills’ I moved over to dreamweaver, which colour codes, autocompletes tags, and gives you a live preview of what you’re coding as well as having a user interface to generate code for you. At first I hated it, it felt a lot like front page, you make something in the design view and it generates a whole LOAD of unecessary code. Then I learned to ignore the design view and code properly, (this transition took about 5 minutes) and to this day I still use dreamweaver to code.
But its clunky.. it feels like a lot of badly strung together electrical components that don’t quite work as smoothely as you’d like them to… so I’ve been looking for alternative software. Is it ‘the best’ coding software? To be honest I don’t know yet, but these little programs have impressed me a lot so far, and are certainly if nothing else, a far cheaper alternative to Dreamweaver.
Amaya is the first that impressed me, which fully supports W3C standards and CSS, it has a relatively nice interface, though the ‘design icons’ annoy me a little as there are quite a lot of them. I just want coding, no WYSIWYG.
http://www.w3.org/Amaya/User/BinDist.html
The next one that I found was NVU, which is innovative because its mac, linux, and windows compatible – which is especially nice given that I use all three. The interface is nice, and it has a built in FTP client – which is always very nice, but again its very heavily ‘design view’ based.
http://nvudev.com/download.php
The next editor that I found was Komposer, which again has the added bonus of a built in FTP client, and again the added drawback of being primarily aimed at the ‘non-technical’ user, weighted towards the design view. The user interface isnt particularly nice and the code view looks terrible, don’t think this one is for me.
http://www.kompozer.net/download.php
Second to last on the list is Smultron, which impressed me a lot – its built for Mac OSX 10.5 (Leopard) so its probably the most recent software of the lot, and thankfully this one’s description isnt geared towards ‘non-technical’ users (something that I am certainly not) Smultron takes advantage of Leopard features like Quicklook and executes them flawlessly, it also allows you to split your code window into two to view multiple source files side by side, a feature of JEdit that I always liked that I lost with the transition to Dreamweaver. My only critiscism is that the user interface is a little TOO simple.
http://prdownloads.sourceforge.net/smultron/Smultron-3.4.zip?download
Finally I arrived at Taco Html Edit, which impressed me about as much as smultron – very good all round with facilities to check your code for errors, and autocomplete tags (always a plus), and again my only complaint is that the user interface is a little too simplistic. I want the depth of dreamweaver without all the stuff I don’t need!
http://tacosw.com/htmledit/download.php
Overall, are any of them better than Dreamweaver? Quite possibly….
Are any of them ‘the best’ coding software, perhaps, but it needs a lot more attention and a more in depth look at the capabilities of each. If I had to pick one right now to switch to, then it would probably be Smultron, which seemed to be the most complete package overall, but I’m still not 100% convinced. Perhaps its just me clinging on to what I know best though!
What The Hell is Web 2.0 ?
Its a term that you hear all the time these days, generally because its used to excess, complete and utter excess. Everyone is talking about web 2.0 this, AJAX that, and JQuery theother. You need to configure your API with your Multiplatform WebApp and GeoTag your Network ID.
Pardon?
Web 2.0 is essentially a term that was invented by a couple of boys sitting around in horse stables who decided that their site was so much better than anyone else that they had invented a new version of the internet, their middle names were certainly not ‘modest’.
Here’s where the glitch comes, there was never a web 1.0 – so there can’t be a web 2.0
There is no ‘release’ of the world wide web, you have html4.01 because there are different versions of html code that are released, updated, and made use of by browsers. The same is true for xhtml, php, MySQL, etc etc. But the web does not consist of any elements that can be updated or changed, the web is NOT a piece of softwar or code, it is not a program, it is not an entity. The web is simply a network.
Put it this way, would you take someone seriously if they told you that their office was runing LAN 2.0 ?
No.
I think we need to take the web 2.0 boys and put them back in their stables.
And leave them there.
The Ultimate Web Designer Rig
For me, there is no question about what my ultimate web designer rig would be (should I one day have the budget to afford it). The Mac Pro is the most dribblingly awsome machine of recent times, and really does encompass everything that a computer should be.
Just the standard spec of this tower comes with two quad-core intel processors, and room enough to expand for several years to come, with upgradeable RAM to 32GB, and space for 4Terabytes worth of hard drives. It really is a monster.
Now obviously these sophisticated electrical components and stupidly powerful specs aren’t all necassary for something as relatively humble as web design. Depending on one’s workload and client base you only really need 4 gigs of RAM, and 1 terabyte to play with for disk space. The point here is that this machine runs even these low specs to absolute perfection, far more efficiently than the majority of other machines out there.
Now once you’ve pimped your Mac Pro to the perfect specs, the next question is how are you going to look at your designs. (with screens obviously, but which ones?) Sadly, Apple hardware is not cheap, not at all, so the screens are likely to set you back as much as the computer itself. We are of course talking here, about the 30″ Apple Cinema Displays,
These displays are the pinacle of all screens, displaying a gorgeous 2560 x 1600 pixel resolution, I also have an Asus Eee PC, and the Mac Cinema Display resolution is equivalent to 16 of my Eee screens stacked in a 4 x 4 square! Sadly, the closest that I’ve come so far to owning one has been staring at them in the London Apple Store with glazed eyes and a tickling sense of guilt at my desire to rob the place outright.
As for the rest of the rig, you’ve got your standard Apple keyboard and mighty mouse, or if you prefer those can be swapped out for logitech equivalents. Naturally you’ll also need a Time Capsule (don’t want to lose all those hours of work if you have any problems) and a surround sound system, because poor quality music while working is offcially* bad for your health.
*not scientifically proven, probably not even true.
Design Inspiration
Sometimes being a web designer is fun, the relatively flexible hours (apart from close to deadlines) the fact that you can access your work from pretty much anywhere in the world, and the fact that you don’t need an office are all big positives in relation to the web design career.
Other times however, it can be a chore, the deteriorating eyesite, the long hours sat in one position, and the sometimes infuriatingly naive and narrowminded clientbases that arise.
So where do you turn for some inspiration?
Currently I’m working on a site for a company offering private GP services and the design inspiration is lacking a bit to be honest… financial sector and overly corporate organisations do little for my creative side. Or to put it in another way, they slaughter my inner child with a rusty boat anchor before trampling on it profusely.
Thankfully I do have a place I can go when I feel that pang of rust being roughly shoved down my throat, Smashing Magazine is one of the best blogs I’ve ever read and provides me SO much inspiration in every post its unreal. If they started charging a subscription fee – I would happily pay it! And thats something that I very very rarely say about anything internet related.
Leopard Review – Is Time Machine a Good Idea?
Not strictly a web design related post as my first entry to this new blog, but as an active freelance web developer this is still very relevant.
So this week, Apple set their latest creation upon the masses; the newest version of the OSX operating system, OSX Leopard, which comes with one of Apple’s most talked about new pieces of software that automatically backs up all your files. Clearly I understand the benefits, but have the cons of this new software been considered?
Now don’t get me wrong, I’m a relatively honest type of guy, but I’m not overly enthusiastic about not being able to COMPLETELY delete something off my computer.
A quick browse through Time Machine by your partner and that old msn conversation could be unearthed that you thought was long gone. That sort of stuff can end a happy relationship completely. Conversely, knowing that you can root through your partner’s past extremely easily is far too much of a temptation. “Not if you trust eachother” I can hear you saying already, but that’s not true, human’s are born suspicious and we will die suspicious. I would rather not know, than have the option to find out staring at me every time she goes out and leaves her computer on.
Similarly, you may have once (or twice) ‘accidentally’ downloaded some dodgy videos, that naturally, you deleted instantly. But these, and a log of any associated websites could now come back to haunt you, not so good.
Naturally being able to recover lost files is a great thing, but I can’t honestly say I’ve ever needed to. So in my mind, a manual system that could back up all your current files would be a great idea, but a system that keeps track of every single file you’ve had on your computer? I have to say I’m not that keen.
If you haven’t yet bought Leopard, it might be an idea to fully delete anything incriminating on Tiger before you do head out to the shops.
