September 15, 2010

4 tips for debugging CSS

Filed under: Web Design — webtechbc @ 2:30 pm

There’s no doubt about it, CSS is your friend

However every web designer know’s CSS can also be a bit of a nightmare to debug. Here’s how I go about debugging CSS.

#1) Turn boarders on. border: 1px solid red; or border: 1px dotted red;
Either way you slice it a boarder can be your best friend. Border’s help you see where your elements are on a page. If they are positioned wrong a boarder can determine this.

#2) Use Web Developer toolbar. This could be number one, but I usually start with turning on boarders and am able to figure out whats wrong. When that fails I use Web Developer tool Bar, CSS, View Style Information. This helps me outline and see where elements are sitting. It also gives me the names and styling of each element. From the image below I can tell the high-lighted area is part of p, li, feedback class.
Web Developer tool bar has a lot more great features for debugging code. If your not using this toolbar or firebug, you should re-think the tools you use.

#3) Use Firebug. If you can’t find what you need with Web Developer toolbar, which I usually do, I use firebug. Firebug allows for local document editing which can be handy for debugging. The nice thing about firebug is you just have to hover over a css element and it show’s you where your element is by outlining it.


#4) Validate your CSS & HTML. Validating is a great way to debug. Once your code is valid it should appear properly. Don’t be afraid to get down and dirty. Remember the cleaner the code, the happier search engines are. If you run into problems with certain browsers like IE. Validation can help you find new ways of building your CSS so it is cross-browser friendly.

September 9, 2010

Analytics Custom Filter – Full URL

Filed under: Web Design — webtechbc @ 4:05 pm

How to: Analytics Custom Filter – Full URL

Full URL filters are a way of obtaining more then just the top level domain in Google Analytics. Unfortunately google analytics only show’s you top level domains. Full url’s are useful because then you can see where the referral is coming from and use the information develop keywords. Example: Someone uses different anchor text then you do. You can then translate this into organic keywords for your website.

Filter Name: Full URL (or your name)
Filter Type: Custom Filter
Field A -> Extract A: Referral (.*)
Field B -> Extract B: leave blank
Output To -> Constructor: User Defined $A1
Field A Required: Yes
Field B Required: No
Override Output Field: Yes
Case Sensitive: No

Analytics Track Full Url

Analytics Track Full Url

July 14, 2010

Magento 1.4.1 Stable Released

Filed under: Web Design,magento — webtechbc @ 12:47 pm

Magento CE Version Stable – Now Available.

If you work with Magento you should already know that 1.4.1 stable is now availble. The new version of the Community edition is vastly superior to 1.3.

The new versions WYSIWYG is far better then previous versions. In addition you can now include widgets in your shopping carts. Magento integrates easily into Twitter, Facebook, WordPress, & and has improvedSEO features.

Some of the features include

Enhanced PayPal integration (more info to follow), Change of Database structure of the Sales module to no longer use EAV, and much more.

Magento is an easy to use & skin shopping cart application. Its very similar to wordpress in terms of skinning features. It uses an xml & php back end which is very easy to learn.

June 24, 2010

Hootsuite, Whats not to love

Filed under: Twitter,Web Design,hootsuite — webtechbc @ 11:55 am

If you are involved in Social Networking or do it as part of your job, you have probably heard of hootsuite. You may already be using it. Hootsuite 5.0 was just released and is a whole lot better. It has a multitude of new features, and great additions to old. As someone who works with Analytics, my favorite new feature is the analytics ability.

Hootsuite is a professional twitter client that has definitely taken it up a notch.Hootsuite Professional Twitter Client

Hootsuite Professional Twitter Client

You can get all of your streams in one place.
Social Media Streams on hootsuite

All your Social Media Streams in one place

Advanced stats. Great for blog posts or anyone that loves statistics.
Advanced Statistics

Advanced Statistics. If you love stats this is your clien

This is probably my favorite new feature. The ability to integrate google analytics. Integrate Google Analytics

Integrate Google Analytics

Get all of your social media streams in one place. Twitter, LinkedIn, Facebook, PingFM,, MySpace & 4Squared

Social Media Streams

Social Media Streams

Nice to have addition is being able to customize your hootsuite theme.

Customize your hootsuite

Customize your hootsuite

The only thing I don’t like about the new Hootsuite App is the twitter style RT Feature. The old one you could edit is better. Other then that they have done an awesome job. I’ll continue to proudly use @hootsuite & support a local Vancouver company.

February 4, 2010

5 Twitter and Facebook Marketing Tips

Filed under: Photography,SEO,Twitter,Web Design — webtechbc @ 10:00 am

Looking to promote your photography online? There are several ways you can integrate social media to do this.

1. Open a twitter account
- Use a similiar name to what your website url is or your brand name. Put a twitter badge on your website so people can see you are on twitter. When you create a blog post use a service like to shorten the url and then post the blog post on twitter.

2. Cross market using facebook
- Maintain your facebook page with updates. Post your latest images. Join groups on facebook to promote your photography and business. When you post something on twitter cross post on facebook. Link your website to facebook with facebook links.

3. Use a customized background with a stretched image and an information badge about you
- Include a excellent photo that represents you as your custom back-ground. Make it 2000px wide so it stretches the screen. Put an information badge on the top left corner of this image that includes your business name, your name, your url and some photos.
Make sure you test it on smaller screens so it is visible.

4. Build your followers
- Post to sites like use hashtags to promote your photos. Example if you have a picture about vancouver use #vancouver and #photography. Hash-tags are a very useful tool similar to wordpress tags.

5. Use Twitter & Facebook Everyday
- Its simple, but the more you use it, the more you post, the more you get noticed. Attend social events when possible. Have a business card with both your website and twitter, facebook pages listed. Promote, Promote, Promote.

Good Luck.

December 19, 2009

Increase Website Statistics Using Twitter

Filed under: Twitter,Web Design — webtechbc @ 8:11 pm

Do you use twitter to increase your website statistics?

Have a twitter badge on the top right of the screen with some basic info can help increase website traffic.

Include your business name / website / and what you do.

Here is an example…

Twitter Badge on your background to increase stats

Twitter Badge

Here is an example of the direct results…

Google Analytics stats direct traffic increase of 34% last week

Twitter badge to increase seo traffic

Stats increased 34% for the week.

If you want a fixed background image set the width to 2000px wide. Its a good idea to test your background image on a smaller screen to make sure its readable. A lot of people use netbooks now with a screen size of 1024. Something to keep in mind.

You can see a live example on my @Photodreamz Twitter account.

December 9, 2009

Web Design Job Boards for Vancouver

Filed under: Canada,Employment,Job Search,Vancouver,Web Design,Web Design Jobs — webtechbc @ 2:55 pm

As someone who’s looking for work in the web design field I’ve compiled a list of sites that are good for finding work. I thought I would share them. If your struggling to find work in a tough economy you should read my new blog post. Creative Job Hunting Techniques.

I’m no longer looking for work. But I wanted to add some things to this post. Don’t just rely on Job Boards to find work Use them as a stepping stone. Market Yourself. Networking is key in today’s job market. Twitter can be a great tool for meeting people in your industry. Aside from the following job boards use tools like In a tough economy you must get creative. Don’t be afraid to put yourself out there.

These are in no particular order.

Craigslist is a fantastic place to start and check daily. The below categories all frequently have web design postings in them. As a warning you should be wary of some posters. From time to time you will find posters that offer wages far below industry standard. Dont let yourself be taken advantage of if you use craigslist or another vancouver classifieds board.

Techvibes job board. Techvibes doesnt get as much traffic as some sites in terms of job postings. But its a good place to check on a weekly basis.

BCTechnology job board or TNET is a great place to check daily. They have a variety of web design and technical support related positions posted daily. The jobs on TNET tend to pay industry standards rates as well which is great. is a non profit association for the industry in bc. They dont get a large amount of postings but its worth having a look now and then.

Vancouver arts alliance job board is a website not targeted to the technology industry but will occasionally have web design related job postings.

Canada mployer. mployer is a good reasource for technology and design related jobs in Canada and around the world. They have a fair amount of postings. One complaint is they dont allow you to list results by date. Job board is Canadian based. Not as many web design jobs but they do have a lot of postings for content editing, Technical writing and Journilsm / New Media.

Service Canada Job Bank in the Engineers, Architects, IT, Natural Science category. I dont know why they insist on grouping all science together. Makes it harder to search, but they do get web design job postings from time to time. You can also do an advanced search for technical jobs rather then the above mentioned broader category. / or The Vancouver Sun / Province. Its not the first place I choose to go. Mainly because every one starts there. Im also not a fan of the way they have advanced search set up. Its difficult to both browse for and find jobs in the database that are title specific. But they do have a large number of postings in the field. I’ll post links to some appropriate categories below.

Aside from the above job link resources I’ve found that Twitter along with a program like Tweetdeck To be extremely useful job search tools. Tweet deck allows you to save previous searches in your dashboard. You can search for #hashtags or do a general search for something like Web Design Jobs Vancouver. It gives you a list of tweets and job postings from various job boards. If you are always on twitter it can save a lot of searching time.

I hope this list proves useful. Any suggestions or links appreciated to add are appreciated.

December 7, 2009

Switching Pixelpost to WordPress

Filed under: Web Design — webtechbc @ 5:33 pm

My photoblog @ has been running on pixelpost for two years now. While pixelpost is a great applications it has its limitations.

@acedrew was able to help me modify an existing import tool. After I switch hosting providers I will be converting my website to wordpress.
Here is a post on the subject by @acedrew

Next Page »

Powered by WordPress

Switch to our mobile site