When I look back with hindsight now I can see how stupid I have been not to try and learn more about web design. The idea of coding had always scared me.
Several years ago had my first dabble with Dreamweaver, it didn’t last long, I hated it. About three years years ago a friend encouraged me to give it another go and showed me the basics of using Dreamweaver tables to build a site. I still hated it, for a WYSIWYG I certainly didn’t get what I saw. The idea of learning to code HTML and CSS was something I had never contemplated. I did things visually I wasn’t a programmer, to me a tag was something you put on a Christmas present 
.
I think I still had visions of trying to write BASIC unsuccessfully when I was a kid on our “Home Computer” and it taking about 2 weeks to try and specify code to draw a simple shape. Before my Dad retired he was an electronics engineer designing microchips and he thought being able to “draw” on the computer would be fun for me 
.
So it took me until the last few months to actually try to start learning HTML (or should I say XHTML) and CSS. What I realised and other non coding designers might want to know is that its much easier if you don’t think of it as code. Think of it as shorthand or an abbreviated way of marking up a page:
HTML: img src means image source, li means list, p means paragraph
Think of CSS like your style sheets in Quark on acid.
I have a long way to go and wish I had started much sooner, I don’t know if I ever will try Dreamweaver again. I guess I feel that if I use Dreamweaver, I am trying to learn too many things at once, not only am I on a huge learning curve with XHTML and CSS but also with the programme. CSSEdit has been an amazing find though and is incredibly intuitive to use and ideal for a newbie like me to try and edit CSS.
If you are a graphic designer who works in print thinking about having a go at learning to code I would definitely recommend you give it a go. I would make some of you experienced web developers laugh as I end up with a huge grin on my face when I manage to do something that you guys would find simple.
Some learning resources I would recommend are
- http://www.online-learning.com
- Build Your Own Website The Right Way Using HTML & CSS (sitepoint book)
- http://www.w3schools.com/
- http://www.alistapart.com/
When I finally get to grips with CSS and XHTML I’d love to learn PHP, but I think that may be a few years away!
Twitter
RSS
23 Comments
Hi Tara,
I come from an IT background so the coding syntax I can get my head round, it’s the design and creativity that’s new to me.
How do you put a website together without knowing xhtml and css? I use dreamweaver but the amount of features it has can over complicate things.
Hi Daniel
Interesting point, I guess I had never though about the problem from the other way round. Have you seen the book the priciples of beautiful web design (from sitepoint), it takes a creative look at websites as well as the technical side?
I taught myself HTML in 1997 so have always built sites through the markup. I would say it is impossible to truly “design” a site through some kind of WYSIWYG, purely because what you see is very rarely what you actually get. What you do get is very messy and inconsistent markup.
Personally I design sites by building flat visuals in Photoshop and then manually recreating them with HTML. I do use Dreamweaver but I only use the text editor part of it. I just find it convenient the way it colour-codes the markup and predicts what tags you are writing. I’m sure there are cheaper or free text editors that can do the same though.
Hi Aaron
I have never tried using Dreamweaver purely as a text editor, I had heard it adds in superfluous code, but is that just if you use it in design view (and let it write code for you)?
Thanks Tara I’ll check the book out and maybe add to my amazon wish list. I’ve just ordered ‘How to Have Creative Ideas: 62 Exercises to Develop the Mind’ to give me a helping hand.
Tara
If you just use the text editor view Dreamweaver doesn’t fiddle with the code – not in my experience anyway. I think you should brave it again and give it a bash
Hi Daniel
I hope you like How to have creative ideas, I am going to try and use it on a “real project” when I have suitable one. I was even thinking of trying to come up with some ideas for my blog with it. Let me know how you get on.
Thanks Aaron, I will give it a go.
Another excellent article!
I can see how coding would appear really intimidating and your article does take some of the “edge” off it. Nicely done!
Thanks Michael
Hi Lauren, I rescued you from the depths of Akismet
Thanks for the links.
CSS is pain in ass.
I too use photoshop to build the website, then shift to Expression Web Designer (formerly Frontpage), or Dreamweaver.
Adding to coincedence like always… I just started with a CSS tutorial from ‘Lynda’.
Great way of explaining it – and hey, everybody’s gotta start somewhere right?
DW hasn’t stuck junk into the source code since MX was released (er, in 1999 I think) – although everybody seems to think it does!
The CS3 version is solid, reliable, helps to optimise and format your source and coding, tests for standards compliancy, and produces a reasonably accurate WYSIWYG representation for the majority of designs!
Hi Paul, thanks, I think
When you say that Dreamweaver tests for standards compliancy do you me it flags up problems?
My WYSIWYG definitely didn’t work when I tried before though it was using tables(in design mode) (YUK!) everything lined up on the previews but was all over the place when live.
BTW – will try and have another look at Britster at the WE
Yeah – you can tell DW which browsers to test for, and it flags up potential problems AND tells you what they’re caused by and how to fix them!
Why don’t you grab a 30-day trial from the Adobe site..? I think you’ll find it’s massively improved since you last tried it! If you get stuck with it then I’m at the end of an email, Skype or mobile!
Meant to say… Any time you can spare to the testing would be greatly appreciated! The more input the better!
Cheers Paul,
I have DW 8, maybe I need to upgrade.
Definitely!
You should be fine running a full DW8 at the same time as the CS3 demo version – to give you a chance to decide if you like it enough to shell out for it!
I second Lauren’s recommendation for CSS Zen Garden. The website is great to visit so that you can see how a simple piece of text and HTML can be transformed into myriad design ideas using CSS and nothing more.
I use Dreamweaver. It took me a bit of time to get my head around it, but I was grappling with the concepts behind CSS at the same time. I’m still waiting for my upgrade copy of DW CS3 (hurry up Adobe!) so I’m very interested by the browser checking functions on offer, because that’s far and away the trickiest part of building a website IMO.
My reading list recommendations: Head First HTML, which gave me a really good understanding of how CSS works; and Don’t Make Me Think by Steve Krug, which is an invaluable reference guide on what people expect from a website when they visit.
Hi Tracey,
Let me know how you get on with the new dreamweaver when it arrives, I may dowload the demo as Paul’s suggestion, I have version 8 at the moment.
I have Head First HTML, and agree its a good book too I’ll take a look at the “Don’t Make Me Think” book too, thanks for the recommendation (oh my Amazon list gets even longer)
Hi Tara,
I come from a publishing background, designing mags in London. It was on;y when I wanted to create a site for my pyrographic work that I decided to dabble with coding. I must say that I love it! I actually hand code even though I have Dreamweaver, as you say if you see it as code it’s great! CSS is also just perfect if you are used to graphic design. Give it a go! You’ll never look back!
Hi Jo
Thanks for the words of encouragement, I’ll give it a go
Hey Paul,
I am graphic designer for very long time now..I wish i could do coding and make beautiful websites also the idea is great but like othere coding scares me i tried working on dreamweaver and kinda like it.
I want to know if all the major sites are design in dreamwever or no if not then wat is mostly use to make websites ? and learning DW, Flash & Html is enough to make a good website or need somthing else.
I am well verse with the designing software so no problem there.
help