Web design as a hobby

Riddell

Riddell

Riddell

Associate
Joined
23 Apr 2011
Posts
416
Hi all,

I'm looking for a new hobby which I can really get stuck into and seeing as I spend so much time on computers already I thought web design might be quite interesting.

I've done a small amount of research and I'd be interested in learning HTML(5?) and CSS (and potentially java) and have been recommended the following websites as a good place to start:
HTML Dog & W3Schools

For anyone how does Web Design for their job (or a hobby) what would you say are the pro's and cons? Also, what software would you recommend?

Thanks.
:)
 
welshdragon said:
I've been doing the same lately. Great recommendation from here were two books, head first html/css and creating a website:the missing manual.

The headfirst book was greta at getting me started but the missing manual book is really good for moving forwards.

Cheers fabieno for that link by the way!
Click to expand...

Thanks for that I'll look into it.

I've so far been following the tutorials on W3schools to get me up to speed with the basics. It's pretty fun and interesting so far.
 
billysielu said:
I'm a professional / guru -

You can take this as far as you want to take it, I learnt as a hobby, it turned into a degree, and then into a career. The most important lesson isn't HOW to achieve something, it's WHY you achieve it a SPECIFIC WAY and not another.

Consider:
- Someone with IE6
- Someone blind
- Your gran
- Your child
- Someone on a mobile

In terms of software - you need a text editor, a graphics package, a bunch of browsers to test with, and the following firefox extensions help a ton:

- Colour Picker
- Web Developer Toolbar
- Firebug

People are fussy over their choice of text editor, but as someone who's taken this from a hobby to a job, I'd suggest you start with Notepad++ until you find the need to build dynamic content - then switch to Visual Web Developer. That'll take you into ASP.NET for your dynamic content, rather than PHP - this is a smart choice should it end up becoming a career you'll get paid better!

For graphics, I have a copy of Photoshop, I'm aware of something called GIMP which is free - but I don't rate it - perhaps Photoshop Elements if you're a by-the-book kinda guy.

Books!
- (motivational first read) Designing with web standards - jeffrey zeldman
- (javascript best practice) DOM Scripting - jeremy keith
Click to expand...

Thanks for that. I've been using Notepad++ so far and it seems quite nice. I use paint.NET instead of GIMP but I'm not sure if it's a bit simple? At what point do you need to start using something like Dreamweaver or do pro's hard-code all their websites?

Thanks.
 
Ok, I've been working my way through the HTML Dog tutorials and I've come across my first problem.

It might just be that I haven't learn about something yet, but if it's an easy fix just let me know.

Basically, I can't work out why I have an extra red box/border below my h1 tag. For some reason, the white space between my h1 and h2 tags is using the h1 css style. Any ideas?

Problem.png



HTML Snippet:

<title>My first web page</title>
<link rel="stylesheet" type="text/css" href="web.css" />

</head>

<body>
<h1>My first web page<h1>

<h2>What this is</h2>
<p>A <em>simple</em> page put together using <strong>HTML</strong></p>

<h2>Why this is</h2>
<ul>
<li>To learn HTML</li>
<li>To learn HTML</li>
<ol>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ol>
<li>To learn HTML</li>
</ul>
Click to expand...

CSS Snippet:

body {
font-family: arial, helvetica, sans-serif;
font-size: 80%;
color: black;
background-color: #ffc;
margin: 1em;
padding: 0;
}

h1 {
color: #ffc;
background-color: #900;
font-size: 2em;
margin: 0;
margin-bottom: 0.5em;
padding: 0.25em;
font-style: italic;
text-align: center;
letter-spacing: 0.5em;
border-bottom-style: solid;
border-bottom-width: 0.5em;
border-bottom-color: #c00;
}

h2 {
color: white;
background-color: #090;
font-size: 150%;
margin: 0;
padding: 0.1em;
padding-left: 1em;
}
Click to expand...
 
I was always under the impression that Wordpress was really aimed at people wanting to make blog sites as apposed to actual dynamic web pages.
 
ashatron said:
One thing that was unclear in your post is weather you want to get into web development OR web design. It sounds like you want to learn how to build websites not so much learn about interface and web design.

If it is web development (building) your interested in it seems there is sound advice given here. Just make sure you learn the right way (abiding to W3C standards) at the start, rather than learning it the wrong way first and having to re-learn the code later.
Click to expand...

It's definitely the development aspect that I'm more interested right now; learning the code and the mechanics of building websites.

The actual design part will probably be my weakest area, but I'll be willing to learn once I solid foundation.
 
Update time:

I've now been learning about HTML/CSS for one week and this is what I've put together this afternoon. I realise it's really basic, but I'm quite impressed with how much I have learned in a week and I'm looking forward to getting stuck into more difficult stuff.

I'm still getting my head around how to make div's and containers do what I want them to and I'll probably start taking a better look at HTML5 soon.

Anyway, here's the link:

http://dl.dropbox.com/u/5522970/Web.png

Any initial thoughts/feedback appreciated.
 
Last edited:
welshdragon said:
Hey dude , how you getting on?
Click to expand...

I think I'm about ready to start work proper on my website although I'm still trying to iron out some details. I'm not very good at the design aspect so I'm considering using a simple psd design and turning it into html/css. I'm still learning about html/css but I will probably start digging into javascript shortly.

How about you? I see you've added some new stuff to your site; do you have any more plans?
 
AHarvey said:
But a licence for Sublime 2 is $59 and notepad++ is free, is it really that good, i doubt it's worth paying for over n++ for someone starting out.
Click to expand...

It has an untimed evaluation period but to be honest, I'd happily pay the £40 considering how much time can be saved.
 
You must log in or register to reply here.
Back
Top Bottom