...

View Full Version : Before Starting A Website...



aaronoafc
10-01-2012, 11:32 AM
Hi,

I have good HTML knowledge and decent CSS but while learning I feel it would be more beneficial to code up a mock up website and learn whilst actually creating a dummy website...Basically before I begin I'm wondering is it best to use a template from photoshop (more than likely off the internet as i'm quite poor with photoshop) or is it best to just code up a mockup site with html and css?

I realise it would be very basic without javascript but would this be an ideal route to go down?

Thanks

Sammy12
10-01-2012, 12:00 PM
Mockup? Like designing? Pencil and paper.

If it's a matter of free time:
Once you get a strong grasp of HTML and CSS, you should study HTML5 and CSS3.
You should know every browser number a property is supported in by heart and know the exact prefixes needed (-webkit, -moz, etc).
You should be able to solve any problem posted in this forum.

After that Jade (http://jade-lang.com/) and SASS (http://sass-lang.com/)/LESS (http://lesscss.org/) and CodeKit (http://incident57.com/codekit/)/Scout App (http://mhs.github.com/scout-app/)/Fire App (http://fireapp.handlino.com/) and LiveReload (http://livereload.com/).

Don't waste time with a photoshop mockup lol... there is much to learn.
The best designs are thought out in your head and are tweaked as you make them happen, it probably won't come together on photoshop.

Find certain aspects you like on other website and keep a general goal in mind.

VIPStephan
10-01-2012, 01:55 PM
I’m sorry, sammy, but I have to partly disagree with you here again.

First of all, why are you making a difference between “HTML and CSS” and “HTML 5 and CSS 3”? Why not start to learn it all right away? The only thing to know is that HTML 5 and CSS 3 are partly experimental yet and some things shouldn’t be used yet or should only be used with care.

Secondly, regarding knowing “the exact prefixes needed (-webkit, -moz, etc)”: this is one of the things many newbies learn and do wrong. The first thing to learn is that these are experimental CSS properties that have been implemented to test certain features in a browser and are not supposed to be used on production sites. I saw people use them and then complain why they have to declare everything three or more times because they thought it would be normal to use these prefixed properties.
It is good and right to learn that these exist but it is not the first thing to learn when which prefix is “needed” because you are approaching the whole thing from the wrong side then.

Lastly, I think you know my opinion about SASS, LESS, and all that other crap already but just for the sake of completeness I’m gonna say it again, anway: I think all the programs, frameworks, and techniques you linked there are mostly useless and/or redundant. Nothing of this is actually needed to create websites and I’d even go as far as saying nothing of this is making a decent developer’s life substantially easier. All these ready-made programs are doing is add a lot of redundant bloat to your websites and/or computer. If you have a good editor with syntax highlighting, code completion, and maybe a snippets archive (I’m using Coda which has all that) you don’t need any of that crap to create websites quickly. And you also don’t need any boilerplate, bootstrap, or grid system nonsense if you know what you want and what you’re doing. After all, I think these so-called “aids” aren’t helping you in any way to learn the gist of a coding/programming language, you just plug something in or write an abstract command and it is doing everything automatically without you actually understanding what you do.

Now, that said, back on topic: aaronafc, if you really want to learn how to create a website then don’t take premade templates but rather create your own site from scratch. Of course it helps to look how others have done something (I’ve learned a lot by analyzing the source code of websites where I liked some feature) but by doing it yourself you find your own style of coding etc. while with using someone else’s code you might inherit some bad or wrong code without understanding what’s wrong.

You would, of course, create some wireframe or layout sketch beforehand and then convert that into an actually working website. A good goal could be to create a website for something that really exists, either just for you as exercise or for real (e. g. a local association or organization or whatever).

Sammy12
10-01-2012, 10:48 PM
I’m sorry, sammy, but I have to partly disagree with you here again.


That's fine, vipstephan, I'm going to partly disagree with you too LOL.

I was debating on whether to respond to this, but I felt uneasy seeing this left off.



First of all, why are you making a difference between “HTML and CSS” and “HTML 5 and CSS 3”? Why not start to learn it all right away?


I never said that. He said he already had a strong grasp of HTML and CSS, which I responded he probably doesn't know (or heard of) HTML5 (the semantic elements, though I never use them) and CSS3, in which has many useful obscure properties that are actually very useful such as background-clip and box-sizing. I can guarantee he knew neither of these. I suggested his "good knowledge" of HTML and CSS was not that great and if it was a matter of free time, he still has much to learn.



I saw people use them and then complain why they have to declare everything three or more times because they thought it would be normal to use these prefixed properties.


I will have to strongly disagree with this one, I use every CSS property freely on production sites. There are so many uses of even the properties that only have 50% browser support which are great for presentational things that degrade gracefully for older browsers. With SASS, I don't have to type every prefix, it automatically produces them in the final CSS file. But like I said, you should learn all the prefixes on your own before you should indulge in these luxuries.



It is good and right to learn that these exist but it is not the first thing to learn when which prefix is “needed” because you are approaching the whole thing from the wrong side then.


Nope, I never said it should be first or he should learn them separately. I said as a part of learning CSS3, he should have picked up each browser support and the prefixes by knowledge.



Lastly, I think you know my opinion about SASS, LESS, and all that other crap already


I see many uses for SASS that bring ease to coding, especially the automation of redundant prefixes and maintaining matching styles. The most annoying thing is having to string a bunch of things together to maintain a specific color across the site:



#footer, .line, #header, #nav, #side-panel, #contact-page .ad, ... {
background: #da4923;
}


I've build so many websites in which had a specific color scheme and had to string over 20 ID/Class's for border-color, background, and font colors.

Like I said in my previous post, these are luxuries for people who already know them. As for the compilers, the automatic ability to compress CSS with different techniques such as expanded, compacted, or compressed accompanied with live reloading in codekit for $25 ($15 for fireapp and $0 for scoutapp) is a steal in my opinion. Having to de-compress then re-compress CSS for changes is unbearable. I am a firm believer in SASS.

SB65
10-02-2012, 03:15 PM
You should be able to solve any problem posted in this forum.

I doubt if there's anyone alive that can do that...


aaronafc, if you really want to learn how to create a website then donít take premade templates but rather create your own site from scratch. Of course it helps to look how others have done something (Iíve learned a lot by analyzing the source code of websites where I liked some feature) but by doing it yourself you find your own style of coding etc. while with using someone elseís code you might inherit some bad or wrong code without understanding whatís wrong.

Well said.

aaronoafc, another thing to bear in mind when learning is to consider the usability of a website. The classic text here is Steve Krug's book 'Don't Make Me Think' - getting quite old now but still as relevant as ever. Worth getting hold of a copy.

Sammy12
10-02-2012, 09:32 PM
I doubt if there's anyone alive that can do that...


"Posted in this forum". The HTML/CSS forum. Yes, just about any web developer can do that.

I'm deleting my posts and unsubscribing. I don't want to get emails about opinions and misreads.

SB65
10-02-2012, 09:39 PM
This is actually the General Web forum, not the HTML/CSS forum, but no offence was intended - I just think telling a new member that he needs to be able to answer any posted question is unrealistic.

Sammy12
10-02-2012, 09:46 PM
This is actually the General Web forum, not the HTML/CSS forum


It originated in the HTML/CSS forum.



, but no offence was intended


I never said I was offended, I don't like getting email alerts that are opinions or misreads. I saw my name in your reply and immediately let out a sigh of annoyance.



- I just think telling a new member that he needs to be able to answer any posted question is unrealistic.


A new member? He said he had good knowledge in HTML and CSS. I'm telling him that there is a lot to learn.

I'm going to close this tab now.

alykins
10-03-2012, 07:12 PM
In an attempt to re-track the thread and additionally not step on anyone's toes...


Hi,

I have good HTML knowledge and decent CSS but while learning I feel it would be more beneficial to code up a mock up website and learn whilst actually creating a dummy website...


Great idea, practice practice practice. There is a reason for homework and doing seemingly the same assignment over and over again; it ingrains it into your skull.


Basically before I begin I'm wondering is it best to use a template from photoshop (more than likely off the internet as i'm quite poor with photoshop) or is it best to just code up a mockup site with html and css?


Re-code it by hand until you feel you know every in-and-out as Sammy was eluding to; practice makes perfect.



I realise it would be very basic without javascript but would this be an ideal route to go down?


Depends on whether or not you learn from it. If it makes things clear then yes, it is ideal. If you end up spending days running round in circles trying to figure it out all over again, then maybe coding is not ideal; either wayit will help you learn it.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum