ya, its loading fast. But, in my browser, i used, mozilla firefox, after loading, the cpu use has increased i don't know why.
you please use load all images in one image.. and call image from your specific area using CSS change background position. if you want example of this let us know i show you example for this. PSD convert to html css table-less 100% CSS solution call this. you check our website i hope is will be help you.
At 812k in 42 files, that's twice as many handshakes and five times the upper limit in file-size I would ever allow a single page on a website be - and over ten times what I would consider an acceptable norm for a page that simple. MUCH of this can be blamed on the 226k of javascripts in eight files... FOR WHAT?!? Some stupid distracting animated background bull? Seriously, lose the stupid annoying animations and pretty much ALL the javascript, since from a functionality standpoint there is NOTHING on your homepage to even warrant the USE of .js - sad since in handshakes ALONE you're consuming a third what I allocate for a whole page, and four times the bandwidth. The 336k of images is no winner either, most of it being poorly encoded jpegs and the lack of proper use of layering effects... much less the fat bloated alpha-transparancy nonsense (Something I personally refuse to use in my designs. If I can't precomposite or use CSS opacity, I won't WASTE bandwidth on it). Seriously, when you are WASTING 60k on THIS: http://www.skilledgraphics.com/templates/berg/images/Page-BgGradient.jpg There's something rotten. Your HTML is no winner either, with 113 validation errors in a tranny doctype you don't even have HTML, you have complete gibberish... 66k of markup for 3k of text and five non-presentational images is a sure sign something is rotten in denmark as that's easily six times as much markup as should be neccessary for such a piss simple layout. We peek under the hood, it's the typical presentational markup train wreck that begs the question, what is that 5k of CSS even DOING for you. Inlined styles, attributes that don't even EXIST in HTML (Whiskey Tango Foxtrot is mce_style?!?), presentational attributes, presentational images in the markup, the only heading tag on the page is a h1 appearing near the end, when you have eight or so 'obvious' headings in your content (so kiss SEO goodbye from a markup standpoint)... This is EXACTLY what I mean when I talk about decade out of date coding techniques, and as I tell 9 out of 10 posters in this forum area your best bet is to throw it all away and start over with minimalist semantic markup, separation of presentation from content, and a whole host of other 'modern' techniques.
Thanks for your very technical and detailed comments, but judging from your own unattractive, bland boring (i actually fell asleep looking at it) site you obviously have no understanding of creative design, so if the price to pay is a second or 2 of load time, I think ill keep my "stupid distracting animated background bull" Though my coding, in your opinion, is outdated, it still works, and the design is attractive, as many here have already mentioned. And if on or two seconds is the difference, I think Ill be ok, as the page loads visitors see the superb design, and realize on more second wont hurt. Again, thinks for your time, and your somewhat insulting comments, but please do something with that super fast loading eyesore you call a website. Also, some say its slow, some say its fast, so for all i know its just a busy server or slow internet connection, otherwise why would it be fast for some, and slower for others?
Problem is on first load, that's anywhere from 15 seconds to a minute of overhead due to handshaking depending on the connection. At the very least condensing some of those files together would help. We're not talking a second or two for people on 768kbps or slower, we're talking ten seconds to a minute. Just because you and I have 22mpbs downstreams doesn't mean that half the people in the state I live in are lucky if they can get dialup without a long distance phone call. It's 800+k in more than 40 files. That's a slow/painful first load, and easily eight times what should be needed. Note, I'm not trying to be insulting, but you made a lot of choices that aren't practical in a design. 200k of javascript is reason enough to commit seppuku - at that point you might as well add autoplaying music and convert the menus to flash. If I have time later tonight and/or tomorrow morning I'll do a quick rewrite of your homepage to show you what I mean. There are a lot of 'tricks' that can be done to retain 90% or so of your appearance while addressing most of the site's problems. Problems like: <table class="mceItemTable" style="width: 316px; height: 94px;" border="0" cellspacing="0" height="94"><tbody><tr><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td><a mce_href="/order.html" href="/order.html"><img style="border: 0pt none ;" mce_style="border: 0pt none;" src="http://www.skilledgraphics.com/images/Order.png" mce_src="/images/Order.png" height="130" width="130" /></a><br mce_bogus="1" /></td><td><a mce_href="/printing-services.html" href="/printing-services.html"><img src="http://www.skilledgraphics.com/images/print.png" mce_src="/images/print.png" height="130" width="130" /></a><br mce_bogus="1" /></td><td rowspan="1"><a mce_href="/portfolio.html" href="/portfolio.html"><img src="http://www.skilledgraphics.com/images/portfolio.png" mce_src="/images/portfolio.png" height="130" width="130" /></a><br mce_bogus="1" /></td></tr><tr><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td rowspan="1"><br mce_bogus="1" /></td><td mce_style="font-size: large; text-align: center;" style="font-size: large; text-align: center;"><span id="__end"><span mce_style="color: #ffffff;" style="color: rgb(255, 255, 255);"><b></b></span></span>ORDER<br mce_bogus="1" /></td><td mce_style="font-size: large; text-align: center;" style="font-size: large; text-align: center;">PRINTING<br mce_bogus="1" /></td><td mce_style="font-size: large; text-align: center;" style="font-size: large; text-align: center;" rowspan="1">PORTFOLIO<br mce_bogus="1" /></td></tr></tbody></table><p><br mce_bogus="1" /></p><!-- START of joscomment --><!-- END of joscomment --></div><span class="article_separator"> </span> Code (markup): Wow... just... wow. -- edit -- Ok, I see ONE thing that needs javascript, and it's probably the BIGGEST cause of your problems - that online help thing that effectively locks up firefox solid , doesn't even appear in Opera (why I thought you didn't need all that .js), and makes IE sit there chewing 33% cpu on a Q6600. <i>Well there's your problem</i> - Knew it was in the javascripts. I'd hate to see what that would do on a single core processor or something like an intel Atom. That it relies on someone else's server to function could be much of the issue with that. Most likely the irregular reports of fast/slow could be a mix of the size of the site, and that script malfunctioning/dragging you under. Opera users don't even SEE that help thing so they'd report fast... It seems to work OK in chrome so they'd report fast... IE8 loads quickly here but chews CPU like candy, anyone with anything less than 2ghz dual core would probably report that as painfully slow... and on firefox, well... It's bad. Locks it up for a good minute trying to load it, then it loads and slowly chews more and more of the CPU's time, starts out at 20%, inside of a minute you're at 45% and still climbing... That's a BAD script.
Thank you might be right on the live chat, I have removed the script and it seems faster for me too, Can you verify?
Much faster. That script was most certainly causing problems. Now if you can get the filesizes under control you'll be golden.
It took a couple seconds for it to load for me. And, I'm on a 50MB/S connection so I know it's not on my part. Yugo,
Here's a Webpage Speed Test Report for you, which is evil (it give everyone bad reports) but might help you... Connection Rate / Download Time 14.4K / 553.51 seconds 28.8K / 282.26 seconds 33.6K / 243.51 seconds 56K / 150.50 seconds ISDN 128K / 53.72 seconds T1 1.44Mbps / 14.71 seconds The total size of this page is 699973 bytes, which will load in 150.50 seconds on a 56Kbps modem. Consider reducing total page size to less than 100K to achieve sub 20 second response times on 56K connections. Pages over 100K exceed most attention thresholds at 56Kbps, even with feedback. The total number of objects on this page is 55 which by their number will dominate web page delay. Consider reducing this to a more reasonable number. Above 20 objects per page the overhead from dealing with the actual objects (description time and wait time) accounts for more than 80% of whole page latency The total number of images on this page is 43 , consider reducing this to a more reasonable number. Replace graphic rollover menus with CSS rollover menus to speed display and minimize HTTP requests. The total size of your images is 354146 bytes, which is over 100K. Recommend combining, replacing, and optimizing your graphics. The total number of external script files on this page is 5 , consider reducing this to one or two. Combine, refactor, and minify. The total size of external your scripts is 103833 bytes, which is over 20K. Consider optimizing your JavaScript for size, combining them, and using HTTP compression where appropriate for any scripts placed in the HEAD of your documents. The total size of your external CSS is 44535 bytes, which is over 20K. Consider optimizing your CSS for size by eliminating whitespace, using shorthand notation, and combining multiple CSS files where appropriate. The total size of your external multimedia is 192798 bytes, which is over 30K. Consider optimizing your multimedia files for size, or replacing them with lower-bandwidth alternatives, or eliminating them altogether.
In addition to that speed report, a good way to track your sizes is the "web developer toolbar" for Firefox. It's own report is handy for pinpointing when files that SHOULD be compressed aren't, as well as figuring out how many file sizes. Fully expanded it also gives you sizes of every file - when optimizing images it's good to see this since it can help you track down offending bits. Documents (1 file) 5 KB (22 KB uncompressed) http://www.skilledgraphics.com/ 5 KB (22 KB uncompressed) Images (28 files) 336 KB http://www.skilledgraphics.com/templates/berg/images/Page-BgGradient.jpg 60 KB http://www.skilledgraphics.com/templates/berg/images/Page-BgTexture.jpg 59 KB http://www.skilledgraphics.com/templates/berg/images/Page-BgSimpleGradient.jpg 29 KB http://www.skilledgraphics.com/images/portfolio.png 29 KB http://www.skilledgraphics.com/images/print.png 28 KB http://i191.photobucket.com/albums/z43/simplyg123/myspace_button.png 26 KB http://www.skilledgraphics.com/images/Order.png 25 KB http://www.skilledgraphics.com/templates/berg/images/Page-BgGlare.png 21 KB http://www.skilledgraphics.com/images/stories/seal.png 12 KB http://www.skilledgraphics.com/images/twit.png 8 KB http://www.skilledgraphics.com/images/fb.png 7 KB http://www.skilledgraphics.com/images/stories/youtube.png 6 KB https://www.paypal.com/en_US/i/bnr/horizontal_solution_PPeCheck.gif 6 KB http://www.skilledgraphics.com/images/stories/82.png 5 KB http://www.skilledgraphics.com/templates/berg/images/Footer.png 4 KB http://www.skilledgraphics.com/templates/berg/images/BlockHeaderIcon.png 3 KB http://www.skilledgraphics.com/templates/berg/images/MenuItem.png 2 KB http://www.skilledgraphics.com/templates/berg/images/nav.png 2 KB http://www.skilledgraphics.com/favicon.ico 1 KB http://www.skilledgraphics.com/templates/berg/images/Sheet-s.png 412 bytes http://www.skilledgraphics.com/templates/berg/images/MenuSeparator.png 326 bytes http://www.skilledgraphics.com/templates/berg/images/subitem-bg.png 307 bytes http://www.skilledgraphics.com/templates/berg/images/Sheet-c.png 202 bytes http://www.skilledgraphics.com/templates/berg/images/BlockContentBullets.png 201 bytes http://www.skilledgraphics.com/templates/berg/images/PostBullets.png 201 bytes http://www.skilledgraphics.com/templates/berg/images/Sheet-v.png 159 bytes http://www.skilledgraphics.com/templates/berg/images/Sheet-h.png 154 bytes http://www.skilledgraphics.com/templates/berg/images/spacer.gif 43 bytes Objects (1 file) 188 KB http://www.skilledgraphics.com/flash.swf 188 KB Scripts (5 files) 96 KB (101 KB uncompressed) http://www.skilledgraphics.com/media/system/js/mootools.js 73 KB http://www.skilledgraphics.com/templates/berg/script.js 10 KB http://www.skilledgraphics.com/plugins/system/pc_includes/ajax_1.2.js 8 KB http://www.statcounter.com/counter/counter.js 3 KB (8 KB uncompressed) http://www.skilledgraphics.com/media/system/js/caption.js 2 KB Style Sheets (3 files) 33 KB http://www.skilledgraphics.com/templates/berg/css/template.css 30 KB http://www.skilledgraphics.com/templates/system/css/general.css 2 KB http://www.skilledgraphics.com/templates/system/css/system.css 1 KB Total 658 KB (681 KB uncompressed) I had thought that blue animation was done in .js - turns out you've got 188k of flash doing it... makes me wonder what that 101k of javascript is for then, though by just removing that live chat you've reduced the .js footprint more than 50%. Looking deeper at your images, some would result in smaller files if you separated them out... This for example: http://www.skilledgraphics.com/templates/berg/images/Page-BgGradient.jpg If you made the 'rays' a separate file it's low color contrast would let you go to 15% or so jpeg 'lossy' without it being noticeable, then use a 8 bit palettized 'close enough aliasing' .png for the two text sections - whole thing would be one 11k jpeg and a 10k .png Another image: http://www.skilledgraphics.com/templates/berg/images/Page-BgSimpleGradient.jpg There's no reason for that to be a 29k jpeg - again mono color so there's no reason a 8 bit .png couldn't handle that, it's mono-tiled gradient on the X axis, so there's no reason for that to be 1100px wide when 1px will do the same job... That should come in around 320 bytes. http://www.skilledgraphics.com/images/portfolio.png 28k .png thanks to alpha transparency. All three of the images in that section could probably be brought in at 7k apiece - that's shaving off 63k right there. Some others, like this one: http://i191.photobucket.com/albums/z43/simplyg123/myspace_button.png You're not using it on the page at that size, and you're linking to it off-site to photobucket, which while free, is another server to handshake a connection to and can leave the pageload hanging. Resize that to the 55x55 or so you are using, and there's no reason for that to be more than 2.5k as opposed to the thirty or so it's chewing now. Some simple optimizations like that and you could not only bring the total image sizes in WELL under 100k, but take an axe to that pngfix nonsense which you don't seem to need given how these images are put together on the page.
Had a few spare minutes - I redid your images to show what I was talking about on sizes. http://www.cutcodedown.com/for_others/simplyg123/bodyBackground.png 369 bytes Equivalent to Page-BgSimpleGradient.jpg, saves 28.7k All the following images use 'close enough' anti-aliasing. Look kind of jaggy on a white background, but will look fine on the blue of your page. http://www.cutcodedown.com/for_others/simplyg123/anonymousIsLegion.png 6.2k, equivalent to Order.png - saves 19k http://www.cutcodedown.com/for_others/simplyg123/hardcase.png 7.5k, equivalent to portfolio.png - saves 22k http://www.cutcodedown.com/for_others/simplyg123/printer.png 6.7k, equivalent to print.png - saves 22k http://www.cutcodedown.com/for_others/simplyg123/facebook.png 2.5k, equivalent to fb.png, saves 5k http://www.cutcodedown.com/for_others/simplyg123/linkedIn.png 1.6k, equivalent to 82.png, saves 3.4k http://www.cutcodedown.com/for_others/simplyg123/myspace.png 2.2k, equivalent to myspace_button.png, saves 24k http://www.cutcodedown.com/for_others/simplyg123/paypalVerified.png 4.0k, equivalent to seal.png, saves 8k http://www.cutcodedown.com/for_others/simplyg123/twitter.png 2.8k, equivalent to twit.png, saves 6k http://www.cutcodedown.com/for_others/simplyg123/youTube.png 1.7k, equivalent to youtube.png, saves 4k That's just ten of your 28 images, but optimizing them for the web and ditching nonsense like alpha transparency (without sacrificing AA) chops 142k off your total image sizes - that's almost HALF the image total, and almost a quarter the overall page size! Splitting the 'rays' from the text up top - and only using one image instead of two (your two largest images appear to contain the same content?) could result in a further reduction of almost another 100k.
I appreciate you taking the time, but image quality is very important in my line of work. I replaced one of the images (the briefcase) and the jaggedness is still very apparent, I could not use these. I am actually OK with the site now, I believe removing the live chat script was a big help. I am by no means a coder or programmer, I have a basic understanding of html/css, php, java etc... My website is obviously run off of the Joomla platform, and the template is created with software, which could explain some of the not so great coding choices, but overall I am happy with it. Again I do appreciate everyone's time.