shelfimage

You can use less code. If the link needs the background, apply the background to the link without using an extra div. Since the link, which is usually an inline element, has absolute positioning, the element becomes a block level element. So - display:block - is not needed. #floating_contact_image{ background: url(http://www.url.com/images/contact.png) no-repeat; z-index:2; width:90px; height: 90px; position:absolute; top:0; right:0; } <a id="floating_contact_image" href="http://www.contact_us.com"></a>

There may be some server restriction not allowing the site using the IP address to fetch a file referenced in the CSS file that originates on a different server. But, you can try using an absolute URL with the domain in the path where the font is located.

Use a Content Management System. I use CMSMadeSimple.org for nearly everything I do now, and there is a module called Gallery. Incredibly easy to use. After install, create directories on your web server to represent each gallery you want. Upload images to those directories using the CMS or FTP. Then manage your gallery from the CMS admin to design the layout and design of the gallery (there are bunch of preinstalled templates you can use too). Add gallery descriptions, image titles, image descriptions, etc. The gallery automatically creates thumbnails for you based on your thumbnail preferences - the size, ratio, cropped, etc... put a small tag on the page that will hold the gallery and you are done. Easy to manage and edit.

I like it! Although, not sure why there are two sets of Gallery image sections on the index page. Testing code: $('a.external').click(function(){ this.target = "_blank"; });

The code is just an example, - blackberry has a few different UA strings. Will you paste your UA string here? http://www.whatsmyagentstring.com/

@Krillz thanks for adding on. I like the idea of looping but I don't deal with IE6 anymore and usually only need an IE7 rule. @Eric - this is a substitute for the native get_browser function that will keep your files up to date and not be dependent upon your host supporting it http://code.google.com/p/phpbrowscap/ The cool thing about working with the Smarty PHP template system is if you need a quick check for an IE browser, you can do something like : {if false !== $smarty.server.HTTP_USER_AGENT|lower|strpos:'msie'} do something {/if} which basically says if it isn't False that there is a match to MSIE then do something. Here is a huge database for UA strings - http://www.zytrax.com/tech/web/browser_ids.htm and http://www.useragentstring.com/pages/useragentstring.php

Right, the padding in the footer is making it expand horizontally wider than the other elements. Also, your body CSS contains a width property. You usually want to leave the body property alone and wrap your template in a div to control the width. Also, add margin:auto to your body and it will center your template nicely.

This is what centers it: margin:0 auto;

Tests for browsers and operating systems <?php if ($ua) { // ---- Test if using a Handheld Device ---- if ($android) { // Android echo 'You are using an Android! '; } if ($blackbery) { // Blackbery echo 'You are using a Blackbery! '; } if ($iphone) { // iPhone echo 'You are using an iPhone! '; } if ($palm) { // Palm echo 'You are using a Palm! '; } if ($linux) { // Linux Desktop echo 'You are using Linux '; } // ---- Test if Firefox ---- if ($firefox) { echo 'You are using Firefox! '; // Test Versions if ($firefox_2) { // Firefox 2 echo 'Version 2'; } elseif ($firefox_3) { // Firefox 3 echo 'Version 3'; } elseif ($firefox_3_6) { // Firefox 3.6 echo 'Version 3.6'; } else { // A version not listed echo 'What Version do you use?'; } } // ---- Test if Safari or Chrome ---- elseif ( ($safari || $chrome) && !$iphone) { echo 'You are using a webkit powered browser (Safari or Chrome?) '; if ($safari && !$chrome) { // Test if Safari and not Chrome echo 'You are using Safari! '; // Test if Safari Mac or Safari Windows if ($mac && $safari) { // Safari Mac echo 'You are using Safari on a Mac '; } if ($win && $safari) { // Safari Windows echo 'You are using Safari on Windows '; } // Test Versions if ($safari_2) { // Safari 2 echo 'Version 2 '; } elseif ($safari_3) { // Safari 3 echo 'Version 3 '; } elseif ($safari_4) { // Safari 4 echo 'Version 4 '; } else { echo 'What version are you using?'; } } elseif ($chrome) { // Test if Chrome echo 'You are using Chrome!'; } } // ---- Test if iPhone with Safari 3.1 ---- elseif ($iphone && $safari_3_1) { echo 'You are using Safari 3.1'; } // ---- Test if Internet Explorer ---- elseif ($msie) { echo 'You are using Internet Explorer! '; // Test Versions if ($msie_7) { // Internet Explorer 7 echo 'Version 7'; } elseif ($msie_8) { // Internet Explorer 8 echo 'Version 8'; } else { echo 'What Version do you use?'; } } // ---- Test if Opera ---- elseif ($opera) { echo 'You are using Opera!'; } // ---- If none of the above ---- else { echo 'What browser are you using?'; } } ?>

I know about the jQuery browser detection classes, but I don't use it b/c it depends upon the browser (not server side). I use the Green Beast method b/c it works well. But the function it uses will be out of PHP soon (http://php.net/manual/en/function.eregi.php) I always used CC's with Mike's method anyway b/c some PC's have a screwed up Vector Version and might match as IE6 although it is really IE7. So, I used the CC's as an extra careful step. ---- With the method I worked out above, you should be able to target IE versions by doing something like this (IE 7): if ($msie && strpos($_SERVER["HTTP_USER_AGENT"], '7.0') ? true : false ) { echo 'This is IE7'; } But, if you are going to go through the trouble of doing that, we may as well rewrite our variables to match the IE versions immediately. $msie7 = strpos($_SERVER["HTTP_USER_AGENT"], 'MSIE 7.0') ? true : false; $msie8 = strpos($_SERVER["HTTP_USER_AGENT"], 'MSIE 8.0') ? true : false; and then you can use it to send CSS by if ($msie7) { echo 'your ie7 CSS'; } if ($msie8) { echo 'your IE 8 CSS'; } If you are going to test for browser versions, you need to check their UA string. Firefox looks something like this Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.9.2) Gecko/20100115 Firefox/3.6 and IE looks like Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0

<?php if ($firefox) { //Firefox? echo 'you are using Firefox!'; } if ($safari || $chrome) { // Safari? echo 'you are using a webkit powered browser'; } if (!$msie) { // Not IE? echo ' you are not using Internet Explorer '; } if ($msie) { // IE? echo ' you are using Internet Explorer '; } ?>

looks like you figured out how to use the select field type in Formbuilder. I'm not sure if it is the right match for a shopping system though. You might want to check out some of the ecommerce modules for CMSMS. there's a quick and basic tutorial here on one of the packages http://calguy1000.com/Blogs/8/60/cmsms-quick-e-commerce-how-to.html

If using PHP anyway, why not use PHP to detect the browser and send the content desired? For example, you could check what User Agent is being used and then test for each one <?php $msie = strpos($_SERVER["HTTP_USER_AGENT"], 'MSIE') ? true : false; $firefox = strpos($_SERVER["HTTP_USER_AGENT"], 'Firefox') ? true : false; $safari = strpos($_SERVER["HTTP_USER_AGENT"], 'Safari') ? true : false; $chrome = strpos($_SERVER["HTTP_USER_AGENT"], 'Chrome') ? true : false; if ($msie == true) { echo 'MSIE'; } if ($firefox == 'true') { echo 'Firefox'; } ?>

My basic SEO approach is to keep the html simple - less is more. Unique meta title on each page, One H1 per page, Unique H1 per page positioned as the first text element or as close as possible to the top, Internal linking of key topics,

I use CMS Made simple for almost all of my projects and use the Gallery module. It is really simple to use. After it is installed, 1) create a directory inside the uploads/images/Gallery directory 2) upload images 3) go to the Gallery module and your Gallery (or Galleries if you have multiple sub directories) will be listed. 4) each photo can have a title and description the Gallery module comes with many templates that can be customized and offer basic lightbox type layouts, thickbox, and more. Steps #1 and #2 above can be done via FTP or the built in File Manager. http://cmsmadesimple.org http://dev.cmsmadesimple.org/projects/gallery

you might consider jQuery - try this example and increase the fade in parameter to suit your needs http://deseloper.org/read/2009/10/jquery-simple-modal-window/

jQuery, more PHP, Flex / AIR, iPhone, and Android

I can't remember exactly... mostly formatting changes, added dd, dt to the resets and new classes

If the server has a firewall, sometimes your computer's public IP address needs to be added to it if it locked you out...

Here's what I use in my htaccess file to help gzip compression, headers, etc. But first, Compression can be enabled on your server within the PHP settings (php.ini) if you are on a shared hosting server, then you *might* be able to create a custom php.ini file for your account - ask your web host what they support and how to change default PHP settings. Example, the php.ini file will need: zlib.output_compression = On zlib.output_compression_level = -1 Example .htaccess rules for compression and expires: CDN - Content Delivery - simply put, large sites will use alternate servers (usually in several locations) to serve media and content for their website. So, not everything is on one server. You can trick Firebug by added the site's domain name you are testing to the CDN hostname setting. See: http://developer.yahoo.com/yslow/faq.html#faq_cdn

Cool! Correct, word-wrap is an IE only property. I'm not too worried about that though. The warnings that are shown will be there until the person using the file applies it to their project and makes it their own. It is only a skeleton that needs to be modified for each project. UPDATED VERSION - New version uploaded to Box.net (http://www.box.net/shared/j2q23gqzue) with minor differences. The important parts are Resets; HTML & Body; Links; Typography; Lists; Tables; and Forms - because they help reset elements and make it easier to be cross browser compatible. The other sections are just examples of what might be needed for typical projects. Enjoy!

Add the background to the : #interestlinks a { border-right:1px solid #F9F9F9; padding:0 5px 6px 0; color:#F9F9F9; text-decoration:none; } #interestlinks li#email a { background:transparent url(mail.png) no-repeat scroll 0 0; padding-left:34px; }

*untested in IE* I tested in FF using web dev and firebug. A minor rearrangement and rewrite of the CSS in /*** Essential styles - Superfish menu (Setting the positions for the list elements etc.) ***/ .nav, .nav * { margin:0; padding:0; list-style:none; } .nav li { float:left; position:relative; z-index:99; font:14px "Times New Roman", Serif; text-transform:uppercase; } .nav a { display:block; } /* ---- 2nd tier --- */ .nav li ul {/* 2nd tier hide */ position:absolute; top:-999em; width:15em; } .nav li:hover ul, .nav li.sfHover ul { /* 2nd tier open */ left:0px; top:2.2em; } .nav li ul li { text-transform:none; opacity:.93; /* FX/Opera/Safari/Chrome */ -ms-filter:"alpha(opacity=93)"; /* IE8 */ filter:alpha(opacity=93); /* IE6/IE7 */ } .nav ul li { width: 100%; } /* --- 3rd tier --- */ .nav li li ul, .nav li li ul { /* 3rd tier hide */ top:-999em; } .nav li li:hover ul, .nav li li.sfHover ul { /* 3rd tier open */ left:15em; top:0px; } Minor jQuery chage: Probably not a big difference but I'm just posting what I use and usually works. I think the main difference will be the CSS.

I'm not a 'designer' but work with designers as a front end developer... The role of design will always be the same which is closely related with communicating a message. There is a definite drive toward social connections and almost all of the sites I've developed for other designers in the last six months have social media messages as part of the design. Because there are many options and services to communicate a message, a clients primary site will become a center for all of these. What I mean is, more sites have links to their twitter, linkedin.com, and facebook pages and include feeds from their twitter timeline, wordpress blog articles, and other services. All the while communicating the primary purpose of the site in the primary viewing area of the site.