Where to begin in web design/development?

Posted:
in General Discussion edited January 2014
Hi.. I'm interested in web design and development, and I don't know where to begin. I have tried some demos, like Dreamweaver, but I am lost in that program.. All the terms like CSS and templates and layers, are making my head spin. I know there are a lot of designers that visit this forum, so I plead for your help..



What software is needed?



Should I buy books on the subject or can I find the information on the internet? (links r good) Should I think about classes?



How did you start out? I am not trying to build Rome is a day, and I don't expect any miracles, but a little help would be appreciated greatly. Thanks

Comments

  • Reply 1 of 16
    I'd recommend the following:



    #1 Familiarize yourself with the HTML standard(s). Buying a book is always the best thing IMO...of course, there are also a lot of ressources on the web you can use. I can dig up some links...



    #2 Start off in a non-visual editor (BBEdit for example. It's a big hit with many AI members...and for a good reason! Download the Lite version and check it out). That's the best way for you to begin understanding the basic structure in html, the tags, the syntax etc.



    #3 You mention web development, so you might wanna stay with BBEdit, buy the full version and code away. There's also a very powerful editor on the OS X developer CD, if I'm not mistaken. If however you do decide to work in a visual environment I'd recommend Adobe GoLive, which I think is the best out there. Nice UI, good features.



    My experience with people who start off in a visual editor like GoLive right away is that they produce sloppy code. And when things get a little complicated and they need to do some tweaking in the source code they're completely lost. This is why you don't wanna jump into a visual editor straight away!



    #4 Other than that...Surf the web, check out the source code and see how certain things were done. Steal & learn



    Good luck!
  • Reply 2 of 16
    pevepeve Posts: 518member
    there are many ways to design and publish websites.



    i start out with pencil/paper and try to wright down the structure of my website (how many pages, how many buttons with what titles, what kind of content comes where etc.



    then i scetch my design on paper (i found out that when i start designing on my computer i limitate myself).



    then i design my scetch in photoshop with a size of 750x450 pixel (this should be a viewable size for people with small displays), rgb-color (not cmyk - because displays work with rgb) and with a resolution of 72 dpi (displays work with 72 dpi).



    once i finished designing the website, i cut it into peaces and use software like dreamweaver to put it back again in a internet-usable manner (html-files, jpeg-pics) and insert text and other media (animated buttons, sound, film, flash etc)



    then i start to make my html-code "skinnier" (delete everything that i don't need) and add the small things dreamweaver and co can't do (little tricks and stuff)





    if i was you i would start by looking at websites on the internet - downloading the sourcecode (html) and opening the sourcecode in dreamweaver.



    you will see how these sites are "cut apart" and built.

    maybe a book about html would be good to learn html-tags (the "language" you use to build static websites)



    playing around with dreamweaver and trying to understand "how they did it" is the next step.

    once you get it - it isn't that complicated.



    it gets complicated if your website should be viewable in different browsers (versions) and plattforms (mac/pc) and this you can only master by trying and trying.



    allways remember: keep it simple and "tidy".



    if you master all these skills - you can go to the next step:



    -flash (for animated/rich content)

    -dynamic websites

    -and, and, and





    good luck!
  • Reply 3 of 16
    I would definitly start out with HTML. no matter what you do if your serious about getting a job in web design (or development) you HAVE to learn HTML. Javascript would be good too. and you have to learn to code it by hand. not with dreamweaver. Then i would move to dreamweaver (this is assuming you already know photoshop, illustrator (or freehand). If you want to get into development ive found coldfusion to be a good start. its easy once you learn HTML and its easy to get into other languages such as ASP or JSP once you understand coldfusion. Dreamweaver is a good tool to code on. Flash is also a good bonus.
  • Reply 4 of 16
    cubedudecubedude Posts: 1,556member
    <a href="http://www.echoecho.com"; target="_blank">EchoEcho</a> has some great tutorials on HTML, CSS, Flash, JavaScript, Java, etc. I learned CSS at that site.



    As for editors, I do my HTML in <a href="http://www.omnigroup.com/applications/omniweb/"; target="_blank">OmniWeb</a>, CSS in TextEdit(though most of mine is done in the &lt;head&gt; section of my pages). I use <a href="http://www.lemkesoft.com/us_gcabout.html"; target="_blank">GraphicConverter</a> and <a href="http://caffeineSoft.com/"; target="_blank">PixelNHance</a> to edit pics. <a href="http://www.KineticCreations.com/eclick/index_mac.html"; target="_blank">eClick</a> is great to make buttons(none of its presets are Aqua though). BBTidy, a BBEdit extension, tidies up your code and validates it. I use WebPics/WebPhotos to make photo galleries.



    It seems like a lot, but is everything I need for under $60. Everything there is either freeware, or costs $30~ dollars. Everything I didn't provide links for can be downloaded at VersionTracker.com.
  • Reply 5 of 16
    synoticsynotic Posts: 151member
    [quote]#2 Start off in a non-visual editor (BBEdit for example. It's a big hit with many AI members...and for a good reason! Download the Lite version and check it out). That's the best way for you to begin understanding the basic structure in html, the tags, the syntax etc.



    #3 You mention web development, so you might wanna stay with BBEdit, buy the full version and code away. There's also a very powerful editor on the OS X developer CD, if I'm not mistaken. If however you do decide to work in a visual environment I'd recommend Adobe GoLive, which I think is the best out there. Nice UI, good features.



    My experience with people who start off in a visual editor like GoLive right away is that they produce sloppy code. And when things get a little complicated and they need to do some tweaking in the source code they're completely lost. This is why you don't wanna jump into a visual editor straight away!<hr></blockquote>I don't remember any powerful editor on the dev tools <img src="graemlins/hmmm.gif" border="0" alt="[Hmmm]" /> I actually started out with GoLive and it was fairly simple to learn (I catch on quick though). I agree that looking at how sites do things is a good way to get started. I often have to redo lots of GoLive's sloppy code that I am surprised I even use it anymore. A cool thing about learning HTML through GoLive is.. you can drag a table on there that you want, and then look at the code and see how it works, make slight changes (put text in the items.. images.. perhaps add a new row) and then experiment. Be sure to commit things to memory, I really think I just need to remember tables and I'll start handcoding. I've always wondered what does BBEdit do for me that will help with HTML? I have it right here and I use it often just when editing some .pl or .cgi or whatever files, but the only thing I see is text coloring. Can it reformat all my tags (i.e. indents and spaces) ala OmniWeb's code editor? Auto end tags? I haven't really taken a look at the menus so maybe I'll start there. If anyone wants to talk to me personally (I like to convey step by step rather than broadly) then you can get my AIM name/e-mail in my profile.
  • Reply 6 of 16
    Yup learn HTML first, it is not difficult at all, and is the basis for everything else that will come. Some might poo-poo them, but for the beginner the Visual Quick Start guides are helpful. They are clear, and not overwhelming. Their HTML book you can find <a href="http://www.peachpit.com/books/product.asp?st={AE1E8CE6-B2B9-4E12-9D3C-01ECCD377107}&session_id={C4A9D852-88F2-4A30-A99A-2C117F8941FE}&product_id={BF197ACA-6206-46EB-8CEB-AEE95A1002FA}" target="_blank">here.</a>



    Also, while there are disagreements, don't feel like you hand code everything. Dreamweaver is a great way to put sites together, but you will do yourself a huge favor by understanding the basics of HTML first.
  • Reply 7 of 16
    cubedudecubedude Posts: 1,556member
    edit: double post



    [ 08-02-2002: Message edited by: CubeDude ]</p>
  • Reply 8 of 16
    cubedudecubedude Posts: 1,556member
    A lot of people use DreamWeaver, GoLive, etc., because they find them useful, and have that kind of money.m I like the demos, but I'm just a student who is too young to have a summer job, so cheap is good, and hand-coding in cheap.



    [ 08-02-2002: Message edited by: CubeDude ]</p>
  • Reply 9 of 16
    The editor I was talking about earlier is Project Builder, and it's not at all a web editor. Ups



    BUT, you can build PHP and Perl (and a lot of other things) with it. Have a look:



    <a href="http://developer.apple.com/tools/projectbuilder/"; target="_blank">http://developer.apple.com/tools/projectbuilder/</a>;

    <a href="http://developer.apple.com/internet/macosx/phpappledevtools.html"; target="_blank">http://developer.apple.com/internet/macosx/phpappledevtools.html</a>;
  • Reply 10 of 16
    Thanks everyone. That was all really helpful, especially the bit about learning to hand code. Tis a good idea <img src="graemlins/smokin.gif" border="0" alt="[Chilling]" />
  • Reply 11 of 16
    <a href="http://www.webmonkey.com"; target="_blank">www.webmonkey.com</a> is what got me started on php i just sort of picked up HTML its very simple. If you have any more questions as you go just post back here I and i`m sure others will be glad to help you out
  • Reply 12 of 16
    I bought a book tonight at indigo, called "SAMS Teach Yourself HTML and XHTML in 24 hours"..



    It was the best one there for under 50 bucks..I'm going to crack it tomorrow, I'm beat tonight, I didn't sleep at all last night.. Thanks for the link, floppy and thanks everyone else 2.
  • Reply 13 of 16
    1) Download BBEdit lite

    2) Read HTML 4 for Dummies

    3) write code
  • Reply 14 of 16
    in 3 years you will be able to build entire dynamic, data driven websites by dragging and dropping visual objects and you won't even have to know english ...never mind html.



    until then, the reigning champion of web creation tools is Dreamweaver. Dreamweaver MX is great. it's also almost 400$.



    i once heard of a newbie starting out his web design journey by first figuring out how to get his hands on a free copy of some very sophisticated html software program. that investigation proved to be a valuable learning experience in and of itself. he of course paid for the software with the first penny he made from it.



    when one sets out to teach one's self

    one must ask one's self,

    "what kind of student am i?"

    in this particular case you might want to ask yourself:

    "am i good with printed manuals?"

    "or do i respond better to visual media?"



    vtco.com is an online training company that has tutorial MOVIES on just about every software program you would need to learn.



    the online subscription service is 25$ a month for which you get unlimited access to their over 100 different software title tutorials.



    i've used their service for myself and to train others and i believe it to be an indispensible learning tool.



    if you tolerate manuals well and are a "book" person, try a text editor and BBedit.

    if you are a visual designer looking to bring your visual artistry to the web, try the tutorial movies and a WYSIWYG editor.



    find what works for you.

    for many, it's a mixture of tools integrated into a workflow.
  • Reply 15 of 16


    As per the web design & development concern i recommend to use Dreamweaver because it is very easy to use and learn. This is best software for web design & development and also widely used software in market for web design & development.

  • Reply 16 of 16


    As per the web design & development concern i like to say that to start from HTML and CSS. HTML and CSS is the best place where you can design a web pages for your website. If you want to create a more attractive and very effective web design then go to use Dreamweaver software that provide great features and functions. If you need more information about good programming language then visit w3schools website.

Sign In or Register to comment.