I am new to web design. I have a few questions. I want to build a site in Corel X3, Is this a cool program to use for web sites? Also what is the average pixle size for a website? 760 x 480?
Monitor sizes vary, but most people are now using larger monitors,
so a typical browser width might be 1024 pixels wide. Google is the
best place to find examples of page design that is either fluid or fixed
in width.
Most of us do all of our coding by hand (using Notepad). Most web pages
are now dynamic and require PHP/MySQL. XHTML/CSS and coding to
W3C standards are important too ... making sure pages render the same on
all browsers.
Good luck and don't forget to use Google for getting quick answers to questions.
I used Dreamweaver to code my websites and its quite user friendly even for novice. There are also many tutorials on using dreamweaver you can googled. For graphics editting, you cay use Adobe photoshop or Corel Draw cos this is essential in creating your own icons, buttons, etc. You can also browse for free icons to save time.
You could just use a fluid layout instead. A fluid layout adjusts it's size depending on the users resolution/browser size.
With a fixed layout, in the CSS you should see something like:
Code:
width: 400px;
height: 200px;
These set the width and height to a fixed number. It will always be that size.
However if you replace the exact measurements with percentages like this:
Code:
width: 40%;
height: 20%;
then it will change when the browser size or resolution is changed. The height of the object will be 20% of the browsers height, and the width will be 40% of the browsers length.
Also, don't use a WYSIWYG editor to design your website. Design your site in a photo editing suite, then split it up into lots of images (Slicing), and handcode the site with XHTML and CSS. Don't forget to validate!
I used Dreamweaver to code my websites and its quite user friendly even for novice. There are also many tutorials on using dreamweaver you can googled. For graphics editting, you cay use Adobe photoshop or Corel Draw cos this is essential in creating your own icons, buttons, etc. You can also browse for free icons to save time.
For the records I do have to add that “tutorials on using Dreamweaver” is the worst way a web developer can go. You don’t need tutorials on how to use Dreamweaver (in fact, you don’t need Dreamweaver at all), you need to study tutorials on how to write (X)HTML and CSS manually by yourself. Then any plain text editor will do the job.
As for graphic design whatever graphic program you have and which does the job is cool. But I also have to add that despite Photoshop being the most popular (and I have no idea why…) Adobe’s Fireworks is actually much better suited for website design as it’s specifically made for that.
I agree with VIPStephen, you should actually learn XHTML and CSS. Your website will benefit alot. Loading times will decrease, it will hopefully be standard compliant, and it willl look a darned lot nicer! By all means use Dreamweaver, but only to help you with your handcoding.
I used Dreamweaver yesterday, to be honest, I prefer handcoding. It is so much more flexible.
I imagine that WISYWIG type interfaces are frowned upon in this arena.
I remember throwing my computer programming book up against the wall when I was a freshman in college back in 1980.
I have mad respect for you programmers; you're a very patient lot.
I imagine that WISYWIG type interfaces are frowned upon in this arena.
I remember throwing my computer programming book up against the wall when I was a freshman in college back in 1980.
I have mad respect for you programmers; you're a very patient lot.
Alright, all of you can start hammering away at a novice. Please explain handcoding to me. Is that where you open up a WISYWIG then go into the html folder and start writing your website and adding the codes where you want instead of using the WISYWIG? Like the
<a href="http://www.give--me--a--break.com">Give Me A Break BCuz I'm a Newbie?</a>
And you can add the <b> followed by </b> and all that other stuff like tables, font size, etc.
Alright, all of you can start hammering away at a novice. Please explain handcoding to me. Is that where you open up a WISYWIG then go into the html folder and start writing your website and adding the codes where you want instead of using the WISYWIG? Like the
<a href="http://www.give--me--a--break.com">Give Me A Break BCuz I'm a Newbie?</a>
And you can add the <b> followed by </b> and all that other stuff like tables, font size, etc.
Is that handcoding?
Not really. Handcoding is where you type out all of the code by hand in a text editor. Open Notepad, and do it from scratch.
Alright, all of you can start hammering away at a novice. Please explain handcoding to me. Is that where you open up a WISYWIG then go into the html folder and start writing your website and adding the codes where you want instead of using the WISYWIG? Like the
<a href="http://www.give--me--a--break.com">Give Me A Break BCuz I'm a Newbie?</a>
And you can add the <b> followed by </b> and all that other stuff like tables, font size, etc.
Is that handcoding?
Well, kind of. Except you’re not caring about the WYSIWYG mode of those editors at all and do everything in the code view. If you wanna see how it looks like you preview it in a real browser.
So yes, you would be writing stuff like <a href="blah">text here</a> by hand but if you’re really coding manually you usually do know that tables are not meant for page layout and font sizes etc. are set in a stylesheet which is written in CSS (and you would avoid the <b>-element because it’s not very semantic). If you’re hand coding you’re having much more control over what you actually want to achieve and you would be writing clean, semantic, cross browser compatible HTML, not a pile of crap like WYSIWYG editors would write for you.
Not really. Handcoding is where you type out all of the code by hand in a text editor. Open Notepad, and do it from scratch.
That's handcoding.
Might I just add for the inquirers that it's not as bad as it seems.
Sure, "all of it from scratch" may sound like a scary prospect, but it's not a true one.
9/10, at least I know, I won't write my own layout, I'll use free ones, or use one I've made before that suits my needs. As with all the coding and such. If you use something that's been made before, and then just alter it, it'll work just as well, if not better because it's quicker, and proven to work, so you don't have the hassle of nitpicking for errors.
Your best idea, as a novice, is not to jump in cold feet. Read, read, read, read, and read some more. As you read, trying out what you read is essential, eventually it'll just click, and you'll understand it. Using a pre-made program to write it is only hurting you in the long run, as you're not developing the skills you'll need to get faster at coding, or maintain any website.
Swing by there, check out their step-by-step tutorials, and try doing something in notepad. It's simple, easy, and a great way to start. When you're ready, google on.
When you're ready to develop, find something free on the net... (layouts, images, everything of the like). Grab it all, read everything, change certain values, see what it does, and go from there. Learn the standards, learn the ideals, and in a month, I bet you could understand xhtml, css, as good as the next person. (You may not have their experience, or ability, but you could still read it all the same ).
Good luck!
E: While writing this, I thought back to my first days learning to code. A small tear ran down my cheek, and a scary thought of "What if I had given up" crossed my mind. God, learning to program, even novice, is such an accomplishment XD!
Last edited by Deacon Frost; 12-26-2008 at 11:36 AM..
I recommend Dreamweaver, but you're going to want to invest time & some $ (books?) in learning as much as you can about how to do your main coding via CSS. The goal is to separate your content (images and text) from your code (CSS) as much as possible. Sitepoint.com has some good beginner CSS tutorials for free on their site.
Inserting images and hyperlinks can be done much more swiftly and without error using a tool like Dreamweaver. Just make sure that you stay in "split mode" so you can see what you're typing and how the underlying HTML is building it in your pages. You can actually learn a lot this way. And you can use Dreamweaver to help code your CSS.
A cheaper alternative would be to use an open source HTML editor, like Kompozer (instead of Dreamweaver). You can install this from Kompozer.net, for free to start playing around.
I'm also a fan of Fireworks for photo imaging and graphics work, but Gimp.org provides a free, openSource photo editing program, if you want to start on a shoestring.
HTML Editor-
Dreamweaver ($$$, better support and features)
Kompozer.net (free)
Image Editor
Photoshop ($$$)
Fireworks ($$, great for web design)
Gimp.org (free)
Last edited by VickyAustin; 12-26-2008 at 04:49 PM..
Before you post, read our: 
).
