CSS3 or Jquery for image transitions

He sees the shitstorm coming.

Most off the shelf templates are just as bad as the manure vomited up by wysiwygs, many are many times worse, particularly on the steaming pile of halfwit bull known as turdpress. Turdpress is 'cute' for little personal blogs, but trying to use it for a business that might actually have... well... visitors that are trying to be turned into customers is shortsighted, and effectively using a deuce and a half lump on that pesky and infamous square peg.

To be honest, I think a LOT of what's going to bite you here, just from reading your posts, is a mix of unrealistic timeframes for the project and a lack of knowledge of things like accessibility minimums. There's ... well, almost a plague of that now; projects that a decade ago I'd have had a team of four and a year to complete, people seem to expect belted out in three days for $40 -- and the result of this is buggy, broken, doomed to failure projects sleazed together by fly-by-night developers.

See why the 'products' of most major "design firms" for the web are little more than sleazeball "take the money and run" scams.

Let's see... I'm a Boston guy, so Yankees isn't something I frequent, but if it's anything like the Sox page that everyone I know is always bitching about how crappy it from a usefulness standpoint...

Well... waiting for the page to finish loading... waiting... yup... there it.. no, wait, loading more crap... Hey look, 45 seconds. Ineptitude before I've even looked at the design. WAY TO GO.

Inaccessible absurdly undersized fixed metric fonts? CHECK.
Crappy inaccessible fixed width layout? CHECK.
Layout out that breaks or results in side-scrolling when I have to dive for the zoom to actually read anything? CHECK.
No Responsive design? CHECK...
Goofy webfonts making some sections (like the menu) hard to read? CHECK.

Only major accessibility failing I'm NOT seeing here is illegible color contrasts.

Let's see... 3 MALFING MEGABYTES IN 291 FILES?!? -- ineptitude of the highest order. Seriously, people wait for that mess to load? First-load handshaking ALONE could be as much as TWO MINUTES. HOLY HANNAH!

Gibberish use of numbered headings? Effectively useless on screen readers or keyboard navigation? CHECK.

Endless blank carriage returns for no reason across the entire markup? (some 80 or so before the HTML tag is even open?)
Eric Meyer's "lets wrap the HTML tag a half dozen times in IE conditionals" bull to sweep developer ineptitude under the rug?
Tranny doctype, meaning the page is in transition from 1997 to 1998 coding practices?
NO media targets on ANY of the CSS LINK?
73 scripts totaling 1.2 megabytes on a page that probably doesn't warrant a tenth that?
Idiotic "screen reader" message to try and apologize for the fact it's creators don't know how to actually make a website?
Endless pointless DIV and classes for nothing?
Scripting only elements in the markup?
Zero graceful degradation for enhancement technologies like CSS and JS?
Presentational markup?
Presentational images in the markup?
Clearfix nonsense like it's still 2001?
Presentational use of classes?
"Inheritance, what's that?"
Scripttard keyboard intersection that prevents keyboard navigation from even WORKING? (love how the control key tries to auto-launch a new window -- I lack the words in polite company for my opinion of this)

Hardly a surprise it wastes 100k of markup on delivering 16k of plaintext and a dozen-and-a-half content images, easily four to five times what should have been used!

Just as an example, if you don't know what's wrong with this:

<div id="value-menu-container">
		
	<ul id="value-menu-links" class="value-menu-links">
		
		
			
			
			<li class="value-menu-link value-menu-item" id="nav-news" data-section="news" data-panel-url="/components/global/header/panels.jsp?section=news&c_id=nyy">
				<a class="value-menu-section" href="http://newyork.yankees.mlb.com/news/index.jsp?c_id=nyy">News</a>
				
			</li>

Code (markup):

<brokenRecord>Do the world a favor, back the **** away from the keyboard, and take up something a bit less detail oriented like macramé.</brokenRecord>


Reeks to me of a giant brick and mortar company being taken for a ride by "yet another" sleazeball "Design firm" who have no business designing a blasted thing for anyone; using flashy "gee ain't it neat" bull to rip them off and delude them into thinking they have a website that's worth a flying purple fish.

When honestly, it looks more like it's developers wiped their backside and called it a website; reeks from top to bottom of what I mean by "developers who never extracted their cranium from 1997's rectum!"

Which is why as a VISITOR to such websites, it's so useless I'd probably be a bounce before that horrifyingly bad train wreck even finished loading.

If that's typical of the work of people you are taking advice from, you're having enough smoke blown up your backside to enter your upper torso in a BBQ rib competition.

ADMITTEDLY, that is industry standard practice at this point, which is why I look upon the entire industry at this point with disgust to the point of nausea, considering the majority of "major firms" to be a bunch of filthy little degenerates.

 

yeah sure i hear you COBOL, thing is i left design 12 years ago and now im in business and i need to get moving, and what i care about now is getting sales.

However i have three companies to try and launch this summer in partnership with my Chinese business partner, we dont have much cash to invest so im donig the sites myself, and i do know exactly what you mean by being limited by templates, i used to be a designer like you, back in the day, and its not a nice feeling being limited in what you build, and i had wanted to feel i had done the very best sites possible for these companeis.

So what i have decided is to do this first site using a template, just to get moving. But over the next three weeks im going to put a lot of work into learning the coding side to it. The second site (for a Chinese software comapny, the first is for a Chinese golf cart company) I will attempt to do it with proper coding myself, and the third. I might go back later in the year and re-do the first site if i feel its neccesary.

Point is im on a big push this year to make one of these Chinese companies work, and we get a partnership deal to market them globally if it does. If nothing comes off though in Autumn i will have to try and go back to being a web designer (which i havnt done for 12 years now) so could certainly do with brushing up my skills like that just in case.

Any good books any of you would recomend for learning HTML5 and CSS well at the coding level ? A book with lots of tutorials in would be good, one that you can steadily work through and at the end be pretty profficent.

 

death shodow are you saying that every single template out there loads really slowly ? I feel your exagerating. Does everyon else here agree with that ?

you did say <MOST off the shelf templates are just as bad as the manure vomited> most of, so which are the ones that arnt that bad ?

are there not at least some templates that you say are better than the rest ? Load not to bad. How would it not be posssible for a company to produce a template thats been coded well ? thats what i dont get about what your saying. Hell if you feel so many of them are crap why dont you make a template coded well yourself and try and sell them and beat the competition ?

you do understand that the purpose of a website is to make sales and business for a company not show of the coders skills dont you ?

if i need to i can learn the coding, this first site can probably waite a month or two, without consequences. However im pretty sure your wrong about the templates as the two guys ive talked to have almost 30 years commerical web design experience between them, my brother for sure has worked for many big comapnies such as News International, Dyson, etc.

But there is a very simple way to test this anyway. I will buy a template from a recomended template company and see how it loads into my desktop, my wifes laptop, my brothers tablet and a few different mobiles.

If im not happy witht how it loads then ill say you have a point, and get down to some intensive coding. I however suspect it will load ok - not really fast, but not painfully slow either. We will see.

 

The web dev technologies are changing so fast that most books are out of date by the time they are published. The best learning sources are on the internet. I spend a large part of my learning time at: https://developer.mozilla.org/en-US/
because it is actively kept up to date by an ocean of very knowledgeable developers. I don't always agree with the way they recommend, but I never ignore what is going on.

As to the template issue. Paying for a template is no guarantee of quality; support; or reputation. 90% of templates are crap inside a good marketing wrapper. Most of them (both free and paid) are written by wannabe developers who lack the skill to make a living as a developer. When I do a site a may develop a template of my own as I move up from the wireframe. The advantage of that is I am never limited because is something gets in the way I just change the template; I don't need to try and be all things to all people like a general template product.

How do I know that most templates have problems? because I spend a good part of my day (I'm retired) on sites like this and a good part of that time is fixing junk imposed by some idiot who wrote and sold a template that belong in the trash.

 

well you guys have convinced me to learn the proper way with the coding, but at a guess ive got a lot of work ahead of me on (though i do know what the guy meant when he said there are not that many tags to learn, and i half know most of them alread, and i did learn actionscripting quite good 12 years ago, so maybe there is hope for me). Problem is i think thats going to take too much time for the first site and company, so i think i have to go the template way with that. Once ive learnt the coding properly, this autum i can always go back and re- do the site.


you say 90% of the templates are crap. Any idea of where to point me to the 10% that have reasonable coding in them ?

 

It is a crap shoot. I have seen times where someone is using a template and it is not too bad, the the author releases a new version and it trashes everything. So a template that some says works today, may be garbage tomorrow. There are no standards, not consistency and not way to tell in advance. A good review is not worth much either; so you might want to just try a search using "templates" and some design concept, and then look at offering with a skeptic's eye.

 

ok thanks for your help. You say some of the free ones can be just as good as the paid ones.

maybe a plan would be to get a free one, then see how it loads on various platforms and broswers, if it loads ok great, use that one, if it doesnt, find another, till i find one that works ok. Obviously the design would have to look ok for golf carts, but you know whey you play around with both the images and colour scheme im not sure if the layout is crucial. Key thing is the content.

does the code in this one look any good to you ? -

http://www.templatemonster.com/demo/46698.html

am i allowed to post that link in here ? hope so.

I am certainly going to give it a shot to get up to scratch with coding for the second site. I would like to have my coding skills up to scratch.

 

A good simple well organized reference can go a LONG ways, particularly if it explains things in english instead of legalese (like the specification does). I still point people at this "old timer" just because HTML 4 hasn't changed in 15 years, and it really does the best job of explaining what the tags and attributes are actually FOR, not just what people seem to THINK they are for on most web-rot tutorials and misinformation hellsites (W3Schools comes to mind).

http://htmlhelp.com/reference/html40/

I really like that it has a option on the two major indexes to hide non-strict elements, which is to say things you really have no business using in the first place.

Really HTML is the easy part, say what things are, NOT what they are going to look like, and you're golden. CSS is the hard part; I suggest the MDN reference for that:
https://developer.mozilla.org/en-US/docs/Web/CSS/Reference

But there are so many properties it's going to take a good while for you to grasp it all... honestly I don't even grasp ALL of it -- I just try to remember that they exist so I can go "isn't there a property for doing this" and then go to the reference. Good research skills can speed you up as all you have to do is remember things exist, not the nitty gritty bits of implementation -- that's what the references are for.

As to that template you linked to? Illegible color contrasts (light gray text on white? REALLY?!?), absurdly undersized and illegible fixed metric fonts (whoever told the dev it's ok to use 12px fonts needs a good swift kick in the junk), pointless scripttard space-wasting rotating banner crap, pathetically broken attempt at responsive layout -- design-wise alone it's a steaming pile of /FAIL/

Under the hood the clearing DIV like it's 2001, <div class="title"> doing H2's job, grid asshattery (no wonder it's fixed metric fonts with broken responsiveness), javascript doing CSS' job, javascript for nothing, and little if anything resembling logical document structure -- typical train wreck scam artist bullshit.

It's very pretty though... too bad there's more to a website than "ooh, shiny".

 

re the learning, how do i learn the correct way to structure whole blocks of code and sections of the page, divs and stuff, and structure it all together ? maybe a book is good for that, but at the same time use these uptodate web references too, like yoru MDN reference and stuff.

havnt tried loading that template on the mobile, or a tablet but it loads very quickly on my desktop. i will try it out with other stuff see how it loads.
as long as the code actually works at this stage dude, like passible loading and performance thats all i care about at this stage, i can always go back and improve things later. is it loading in bad in your mobile ?

its easy to change things like the text colour though isnt it.

i dont agree about the banner if you mean the rotating images as its effective in geting a simple marketing message over if you use it well, in tht site its pointless and wasted though, but thats just a dummy. but we have to get over to buyers that we are market leaders in china, have quality components, and are the best price in the world, quickly, that message is important as long as they can click anywhere they need to go as there watching it. id have it faster than that though, isnt it easy to change things like that. if the message takes priority over the design in that banner, and gives an effective useful message with substance and click throughs to solid information then its worth having, as just visual fluff, sure, then its waste. maybe should be a bit smaller though. narrower would be nice of with something to click through to on the right to do with that part of the message on each slide.

it would be nice to be able to change parts of that image rotating as being able to click throught to relevent bits of content on pages.

it would be nice to be able to just design it myslef and build it in proper code though, i am tempted to give it a shot, if i keep just using the reference like you say after a few weeks ill probably start to get the hang of it.

where would i learn how to do good docmument structure code wise, like how to tie it all together ?

 

When I see a template being offered free or paid:
I ignore the hype.
I ignore the demo.
I ignore the template itself.
I look at the code of the site where it is coming from. If they cannot do a proper site for their own purposes, then It is a certain guarantee that they cannot deliver quality. PERIOD!!!

That site does not validate. It has errors in the markup, it has sloppy markup, and it uses obsolete attributes. They do a bunch of front end scripting on load which means the DOM is screwed up and maintenance will be like threading a needle while wearing boxing gloves. In short if their own page is a sample of their product, then they are a crap merchant. If you can use it without any modification outside of their limits it might work; but do not expect it to keep working if you update to a newer version some time in the future; because this kind of junk almost always manages to create compatibility issues across versions.