Learning Website Design

G'day Everyone

I have a little bit of HTML and Website Management knowledge, but I am wanting to take it to the next level, where I can actually design and develop a website from scratch.

Where would you reccomend that I start? Should I enroll in a course somewhere, should I try and learn it online?

Also, what are the topics that I should be focusing on, there is so much out there such as HTML, XTML, CSS, WordPress etc.

Any advice that you are able to provide, in order to point me in the right direction, would be much appreciated.

 

Validate every page you created.
Test every page you created in every kind of browser you got.
Study the HTML and CSS code of every site you like.

 

there are alot of helpful tutorials online. checkout htmldog.com there are alot of helpful tutorials there on html and css.

 

Good day Jake,

If you're willing to seriously work as a web designer/coder (webdeveloper), first of all, you need to practice.
Taking classes isn't necessary. If you already know a little of HTML, try to build a simple website with 3-4 pages, do not use CMS or something for that - just your own knowledge and skills.
During the process, search for helpful info on related sites, ask questions on forums (that's what DP is for).
And only when you will be working on your site, having practice, you will get that great experience and skills.
On this stage you will be studying basic HTML/CSS.

Once your site is completed and works well, you can move on to next stage: work with php and scripts.
Get a good hosting account with support of latest technologies and start your experimentation.
I recommend you to setup WordPress, as it's the most popular CMS nowadays.
Install new features, customize its look, make your own template also (try to code it compliant with w3c xHTML/CSS standards as well).
On this stage you will be studying xHTML/CSS, a little of PHP/AJAX and a lot of website maintenance, updating and work with WordPress.

And on the third stage you will choose on your own what you'd like to do next, as you will already know all the main things, that know around 90% of skilled webmasters, coders and designers here on DP.

As for now, start with HTML (or xHTML) and CSS.

The best source you could ever find for that is w3schools:
http://www.w3schools.com

And don't forget to ask questions here on DP

I wish you luck and hope you will get great results soon!

-Artimmi

 

There are many sources, but if you want to learn web designing then its possible to learn using websites. But programming you should have some logic. You should think yourself. You can get many tutorial online you can copy paste them for some of your problems. But other problems you should solve it yourself into the programming.

 

Thank you so much for the responses, they are greatly appreciated.

I guess my problem at the moment, is that I understanding the basic HTML, I have purchased domain names before for work, I have updated sites before through both HTML and NVU. I have transferred files through an FTP application in order to update the site. I have produced mock ups for websites, done some basic website marketing, building links etc. However even with all of the above, I have never created my own site from scracth, and that is what I want to learn to do.

I have a mock up of exactly how i want the site to look, however I dont quite know where and how to start developing it. I did the mock up in Excel.

Do I have to try and find an exisitng template that is similar to the layout I want or do I simply create it myself.

If I create it myself, should I be doing it through HTML, or site builder application like Dreamweaver, or do i need to use CSS?

Where exactly do I start? I know what I want it too look like, and through www.w3schools.com I have been brushing up on my html skills, but I am just unsure as to exactly where I start, in terms of turning to mock up into a website.

Can i start by just using Notepad, or do I need to arrange hosting first.

 

Hi Jake,

While everyone here has given you some great advice I'm curious as to why you want to learn web design?

I mean aside from the obvious. Do you want to design sites for yourself or for others?

Cheers!

 

To begin with, I would like to have a go at designing a site myself. Depending on how that went, I may look to build sites for friends and family.

 

Go back to w3 site and click on the html verification tool there - check your html ( for free ) and use Tidy HTML when you do, the TIDY is a nice tool to use to see your mistakes - we learn from our mistakes

A very good book that many of the "big dogs" started off with is Creating Web Pages - by Master Visually. Don't buy the dummies series - they stink! This book has helped a lot of people

 

Ok, let's see...
The mock up and the design itself created in graphic editor (usually Photoshop).
However, the most important part for you is code now and design goes second.
I recommend you to get a Photoshop (buy or download 30-days trial version), or you can also try GIMP - free graphic editor, great for beginners.
As for the HTML editor, I think you should try this free one, it's 100 times better than usual notepad, as it sorts code and highlight your errors.
You can also get Dreamweaver - it's a professional one and you can also try it with photoshop in Adobe CS3 pack.
BUT: never use visual mode too much. Always check the site with bowser.
Because, even the page looks good in html editor, it may have 10 errors in browser.
So you should work with code only and don't use visual tools of editor - code is the only thing that matters.

Now, when you have software and ready for a work, you can start with creating simple page with headline, a few images and text.

Next, create a simple layout in graphic editor, separate it on 3 parts: header, content and footer.
Use gradient background, pictures in header, experiment with colors (btw, one great site to create color schemes: http://kuler.adobe.com).
But don't do that too much: your site could have just 2-3 base colors and not more than 3 types of font (with different sizes and colors of course).
Slice the layout to get separated pictures (for header, for background etc) and code an HTML page using these pics.

BTW, CSS is Cascade Style Sheet, and it's a part of HTML, just coded as an additional file.
You could not use it, but you will need to set style parameters of each element for each page then, instead of doing it once for all pages.

And hosting isn't required for that: you can see html pages in browsers right on your local computer.

 

if i am beginner then can i learn web design on internet

 

you mentioned Wordpress and it certainly rocks so I would recommend using it. However as far as learning html and CSS the W3c has free material online that you can use to study and learn. Aside from that sure you could check into some college courses as an option.

 

yes, you can.
Just search for info and ask questions here.
First of all, you need to learn about HTML and start to study it.
Read the posts above, especially about w3schools.

 

I would recommend learning PHP after you practise XHTML/HTML, CSS because that is where your going to be able to design a website completely from scratch.

That is where originality comes in. Today there are numerous websites which use open cms like joomla, wordpress and etc, they don't look very effective because it looks like the webmaster was trying to save himself the time to actually make a original and unique website design and functionality.

 

I'd recommend enrolling in a web design class at your local junior college. I did that about 5 years ago. Fees were less than $50, and then as a student your able to purchase DreamWeaver, etc. at student prices.

 

Thank you all for your support, it has been much appreciated.

I decided to bite the bullet and just have a go. I am currently using Front Page, as it is all I have access too, however I understand that I am somewhat limited as to what I can acheieve by not using code, so i am trying to learn the code at the same time.

If you want to take a look at my site so far, you can view it here. I just transferred it across to my work server just to get some experience in transferring it all accross.

Here it is

As you can see, it is a work in progress, and I have struggled with a couple of things. Hoping that some kind members, might be able to provide advice on the following.

Website Shrinks: Whenever I minimise the browser, or shrink the browser, the website itself shrinks up, and all the text and menue's shrink accordingly. How do I make it so that this doesnt happen?

Thickness of Site: The site currently might be a bit too skinny. What is the average width of a website in Pixels?

Images: I am having some trouble with the images. First of all, can I use Bit Map images, or do the have to be jpeg or gif? Secondly, how do i go about transferring the images over, do I have to transfer them over into a specific file, or can i just transfer them anywhere, and the home page will be able to find them.

Thanks for all your help and if you have any further feedback on the site, please let me know.

Cheers

Jake

 

your progress goes well

First of all, the images. You should save them as .jpeg (for photos) or .gif (for graphics), .png is also fine for combined pictures (photos with graphics).
You need to place your files like that:
folder/index.html
folder/images/pic.jpeg
and specify in index.html picture adress like that: "images/pic.jpeg".
And never use spaces in picture names - it may cause lots of troubles.

As for "website shrinks" problem - you need to set fixed width. Specify width attribute for your tables, as you did that for height.

Text underlined: specify text-decoration: none in style attribute to look like that:

<a style="color: #ffffff; text-decoration: none;" href="http://www.visionarysolutions.net.au">HOME</a>

Code (markup):

BTW, there is no attribute "bordercolordark" or bordercolorlight" - just "bordercolor".
And use HEX codes instead of rgb: (#ffffff instead of rgb(255, 255, 255) etc - that's more useful).

Hope that helps.

Will be glad to help you in next.

 

Thanks Artimmi

In regards to the shrinking and setting a fixed width, are you referring to setting an actual figure like 90, as oppossed to setting it as a percentage like 65%?

If not, how do i do it?

 

ya settin it terms of percent is always better...n give proper left right margins too in percent only..so tat all pages look uniform..

 

Formula:

w3schools
work at it
eat
sleep
repeat