I’m very new to web development/design. I was exposed to HTML a very long time ago, and I BRIEFLY learned how to design a webpage through Photoshop (slicing and all that). But over the years I mostly have been working with Photoshop to design for print publications.
Now, I’m very keen to learn how to develop and design a website (emphasis on the design). My ultimate goal is to learn build an interactive website. AND/OR, for example, in http://www.thelincolnmovie.com/ the way each category turns a different color and moves a little to the right when the mouse hovers over it, the way a new picture appears from the bottom/top when a category is selected. Basically, the little things that make up the look of the page.
I’ve been through a variety of sites such as Treehouse. But having a little difficulty getting myself to invest for full access to tutorials/resources. I like this site a lot, but I’m not sure exactly where to start. What videos or articles should I start off with; or how should I approach my end goal?
I should probably start with HTML & CSS, right?
-What programs should I use? Adobe Dreamweaver?
-Do any web developers use photoshop first to design and develop their webpage?
Should I start there since I am familiar with Photoshop?
OR should I invest in WordPress.org and learn from manipulating the templates (I kind of hate that I can’t redesign, add plugins, etc. with my wordpress.com account, because I’d like to actually see my design come to life before I host it live.) And what tutorials are good to help guide me through WordPress terrain?
The hardest part about all this is getting the ball rolling, but I’m ready to learn and any suggestions would be fantastic!
Hey layouteditor, I understand your trouble very well! And though I’m far from being a good frontend developer myself I found starting learning HTML/ CSS with codecademy.com very cool. It is free and teaches in a playful manner with achievements and all.
You can stick to PS for all designing purposes, because you should have a clear picture of what the sites going to look like before actually setting it up in real code.
For the editor choose what you like. DW should be fine as ist supports Syntax highlighting and indentation. You will need that. I personally prefer Espresso. But that one is only for Mac. There are some great editors out there (Coda, sublimetext, codekit, DW, codewrangler…)
If you want to develop your site live but not public you should take a look on local development with mamp or xampp. They let you set up a database and everything you need to Run a wordpress installation on your machine. No need to do it online.
Hope that helps you a bit…
think u r already gud n photoshop….come on ya…u can easily go through d html and css….
learn d basics of html nd css nd stick wit semantics
imagin a layout nd start coding n html nd css….den it ll b simpl as ever
strong urself n tags nd attributes den go 4 learning server side language
As for code editors, I definitely have an opinion: **do not** use DreamWeaver or any “WYSIWYG” editor (FrontPage, etc.). They build bad sites and worse habits. As andy says, you should learn how to code by hand first.
I’ve never used sublime text, but I can recommend other Fantastic (and *free*) code editors. [Komodo Edit](http://activestate.com/komodo-edit) is my personal choice. It has tons of useful features and works cross-platform (Win/Mac/Linux).
> nd stick wit semantics
* * lol * *
@andy_unleash What do you mean by Sublime Text is free as nagware?
With an editor program I was thinking of using dreamweaver, because I found a YouTube channel that offers, what looks like, comprehensive tutorials; and the person uses dreamweaver, so I thought it would be easier to follow if I was using the same program.
This is the channel I have been scoping out [Create the Net – Web Design Tutorials](http://www.youtube.com/user/createthenet/videos?view=0 “Createthenet – Web Design Tutorials “)
Has anyone come across this? I would like to know what you’d think about it. OR if you can direct me to something like this but with another program?
Thanks for all the responses! It’s helping make this endeavor less daunting.
> Has anyone come across this? I would like to know what you’d think about it. OR if you can direct me to something like this but with another program?
See my post above re: *From The Ground Up*.
and of course, [the W3C](http://www.w3.org/wiki/HTML/Training) itself.
To reiterate, I highly recommend **against** using Dreamweaver to learn web development/design. Likewise, I highly recommend against learning web dev from anyone who uses it as a teaching tool.
@andy_unleash Oh, haha! Okay, I will definitely scope it out among the other suggested editors. I’ll steer away from Dreamweaver since that seems to be a general consensus here and other forums I’ve visited.
Coming from a relatively new “web designer”, HTML and CSS is the way to go to start learning. Now as far as the resources, I personally learned from W3 schools.. aside from its horrendously old design.. it was a good source for information. I didn’t find out about codeacademy till i was well versed in HTML. which i strongly recommend. Codeschool, the paid alternative, is also very well made, and has a leg up on codeacademy when it comes to how _well_ they explain what you are doing. Really my best advice to you is, once you learn something new, use it, and manipulate it. That is the fastest, and easiest way to learn/understand what you are doing. Best of luck! These forums are also a tremendous wealth of knowledge which you should be afraid to use.
Now for text editors, my personal favorite is sublime text 2. it is free to download and asks you about every 2-3 hours if you want to upgrade. I am still learning it, but i am finding it tremendously useful and more intuitive as compared to Textwrangler(BBEdit) or vim.
> …w3schools? It looks descent.
*descent*, lol. How apropos.
> HTML vs. HTML5? Are these just different version of the same thing? So should I use the HTML5 template when I start my new project/create my file or should I just use HTML?
[HTML5](http://dev.w3.org/html5/spec/single-page.html) is the most recent HTML specification. Yes, you should be using it.
You must be logged in to reply to this topic.