Splash of Style...Macs, Photography, Design, and other Passions

Testing Web Design in Different Browsers

May 20, 2009 by debbie T | InternetWeb DesignWeb DevelopmentWindows on the Mac

Every web designer knows how important it is to test test test their new web design in multiple browsers. Windows doesn’t make it easy to test in multiple versions of Internet Explorer, although it is possible through various means.

What I decided to go the virtual route. I have VMWare Fusion installed on my Mac, with Windows XP and Windows 7 virtual machines, running IE 6 and IE8 respectively.

So in order to run IE7, I copied the XP/IE6 virtual machine onto an external hard drive (due to lack of space on my laptop) keeping IE6 running, while upgrading to IE7 on the original XP machine.

Works great!

For more info on how I moved my VMWare Fusion virtual machine, check out my article explaining how I accomplished it. Note: When you launch the “copied” virtual machine, it will ask if it was moved or copied, in this instance I chose “copied”

How to Use Sugars in Espresso Code Editor

May 17, 2009 by debbie T | Expression EngineMac SoftwareWeb Design

I have been working with Espresso code editor from MacRabbit, and so far it’s been a good experience, but I wanted to learn more about Espresso Sugars….Sugars are little plug-ins for Espresso. Don’t ask me exactly what they all do, because I am just learning; but I believe they add functionality and coding languages to Espresso.

I downloaded the Expression Engine sugar, since that is the CMS I have been working on. I figured it would be a great help to have the Expression Engine coding easily accessible.

So, I copied the .sugar file into the sugar directory, and tried to figure out what to do next. I felt pretty stupid! I found the Expression Engine codes in the Actions menu, but they were all grayed out. huh? In fact, most of the Actions seemed to be grayed out.

I found nothing on Google, so I figured it was best to ask for help on the Espresso Discussion Forum for sugars. I quickly received an answer from Anthony Short, who I just realized is the author of the Expression Engine sugar! ha! Too funny.

Anyway, he told me Espresso should be able to automatically figure out that it’s an Expression Engine document (which it wasn’t doing) but if not, I needed to set the language for the document under View>Language.

espresso-language

That did the trick! All the Expression Engine coding was magically listed in the “Snippets” panel. The coding also works with code completion, which is a lot easier!

Unfortunately, there is no way to permanently set the language to Expression Engine for the document. Once you close the file or quit Espresso, it reverts back. I hope there is some way to save the document language in the future.

ReDesigning a Web Site with Expression Engine

May 16, 2009 by debbie T | Content ManagementCSSExpression EngineWeb DesignWeb DevelopmentXHTML

I have been a faithful Expression Engine user since 2004. I was lucky enough to be one of the thousand or so people who received free copy way back when. Movable Type had just released version 3, and there was a huge uproar over the new licensing agreement. Pmachine (Expression Engine) decided to take advantage of the bad publicity and give away a ton of free copies (originally $149).

Anyway, I have been a fan ever since. Yeah, version 1.5 might be looking a little long in the tooth, but it works for me. I know they are busy perfecting the new 2.0 version so it’ll be worth the wait.

So, back to the point of this post. I use Expression Engine on another large web site I have. It’s been almost 4 years since I last designed it, and it’s in bad baaaad need of a redesign. It’s true that if you don’t use it, you lose it; a lot of my web coding knowledge has been tucked away into back pockets in my brain, so it’s also been a challenge to relearn CSS. There has been so many new tips and tricks, and the good news is, no need to design for old outdated browsers. I do still need to worry about IE6 users, but further back than that, nope. Done!

So, for the past week or so, I have rolled up my sleeves and concentrated on relearning CSS and the Expression Engine design tags & templates. It’s been a blast. I forgot how much I loved coding!

My Process

I don’t know if anyone will care about my redesign process, but I figured that I would try to document it anyway, at least for my own sake.

Where to start? Read the Rest of the Article

CSSEdit and Espresso Editors by MacRabbit

May 16, 2009 by debbie T | CSSMac SoftwareWeb DesignWeb Development

I have used quite a few Mac code editors but to be honest, I had never been 100% satisfied with any code editor on the Mac (sigh) as I was with Dreamweaver, Homesite, and/or HTML-Kit on Windows. It’s not that I am not happy with Mac editors, I just never found the absolute perfect replacement.

I started using skedit years ago, and I found it was sufficient for larger coding tasks. For quick coding tweaks, I found nothing beat Text Wrangler.

But I was starting a new re-design project using Expression Engine, so I wanted to try out a few different options.

CSSEdit

I dug out my copy of CSSEdit that was barely launched once, and I figured now that I had some true CSS coding tasks to do, it was time to shake of the dust and use it. Now I just LOVE it! It’s awesome.

Sometimes I like to hand code CSS, and other times, I like the editor to insert code for me. CSSEdit will do both. It has code hints & completion and syntax highlighting, all of which I love and NEED! It’s easy to fill in the appropriate fields, and it will insert the CSS code for you. I found it to be the most Dreamweaver-like app I have ever used when it came to CSS coding.

Disappointingly, it does not work with (x)html coding, so it’s not a “one stop shop” editor. It will not open an .html or .php document using the File>Open menu. It will open it if you drag the file from Finder to the CSSEdit icon on the Dock. But it’s really not meant for html code, but it does CSS editing and it does it well!

Espresso

I purchased the latest MacHeist 3 bundle, which included a copy of the Espresso code editor. I had been looking forward to using Espresso since it was created by MacRabbit, the same developers as CSSEdit. I had previously launched it once or twice, and wasn’t thrilled with it at first glance, but I figured this would be a great time to really put it through it’s paces. And I am glad I did.

I like the interface and how projects are displayed in the workspace. Although I wish there was some sort of Project Manager window, maybe coming soon to a future release, or perhaps I will just get used to opening the project file just like I would any other file.

I love that it has a different approach to tabs. Tabs are not located at the top horizontal menu, but on the side bar, at the top of the file list. I think it’s more intuitive that way.

(x)HTML code completion and hints both work very well.

The FTP cloud publishing feature is a bit unintuitive, but I am hoping that either I have to work with it more, or it will become better with future updates. For now, I still use Transmit for my (s)FTP transfers. There is a quick publish feature, and that might be a good option, but I wish there was a right-click ‘upload’ option for any given file from the side bar.

I really disliked the default syntax highlighting color theme, and all the other available View themes were either light text on dark backgrounds (hate dark backgrounds), or white backgrounds with very light text. huh? What’s up with that? So, I took one of the color syntex highlighting themes, and made adjustments to it for my own needs. It was very easy to tweak the CSS theme in CSSEdit, as it was just a plain .css file!

I haven’t had the opportunity to work with any Espresso Sugars, but I did download a copy of the Expression Engine sugar, so we’ll see how that goes when I get deeper into EE code for my new project. I also haven’t worked with snippets, but I do love how they work in Skedit, so hopefully they will be useful in Espresso.

The browser “preview” works well with regular static html and CSS but I can’t see how it could possibly work with dynamic code, unless you have a server set up on your computer. I don’t have time to mess with that, so all my browser views will have to be online, where it can work with the database directly.

CSS editing in Espresso is disappointing not too bad, but not as good as CSSEdit. CSS code hints work for the CSS property name, but there are no hints for the value. – I was behind on a few updates, eek. Updated to version 1.05 and it does indeed include code completion for CSS values. It completes the closing bracket and trailing semi-colon for you.

Since MacRabbit are the same developers for CSSEdit, I thought that there might be integration or something, but so far, CSS editing is not wonderful. the best, so I will stick with CSSEdit for CSS editing.

It might sound like I don’t like Espresso, but I really do. At this stage, it’s still brand new for me; I know I haven’t tapped into all its power yet, and I think the same is true for MacRabbit as well. They will be adding more features and hopefully there will be a great future ahead.

But so far, I am impressed, and I will continue to use it. Would I pay the full price of $80? No, I don’t think so, but I am glad I got it as part of the MacHeist Bundle. I think if there was better CSS Support like in CSSEdit, or even some sort of integration between the two (similar to how all Adobe apps work well both together and separately) I would consider paying the $80.

So, that’s my quick (and probably premature) review of CSSEdit and Espresso.

Together with Transmit FTP, it’s a good work process!

Go Daddy Domain Coupon Discounts

May 4, 2009 by debbie T | InternetWeb DesignWeb Development

One of my domains is up for renewal next month, and when I got an email from godaddy.com with a discount code for 25% off, I figured I would renew now.

I added renewals for four domain names to my shopping cart; the 25% was supposed to be applied automatically, but there was a big discrepancy for pricing on the items. Strangely, the base price for each domain renewal was the same ($10.69) but two were discounted to $9.02 and two were $10.02 (including the ICANN fee of 20 cents) – and neither price reflected the correct 25% off! see my screen shot below:

godaddy discount price discrepancies

The web site stated the expected wait time was only 2 minutes, so, I decided to contact Go Daddy by phone. I spoke to a very nice person (didn’t remember his name) and he asked me to forward the email with the discount code so he could check it out. He took a few minutes to research the problem, and even though he didn’t have an answer to why it messed up, he applied one of the discount codes from my previous order that gave me 30% off each renewal. Even better! Yay!

Each domain renewal was discounted $3 for $7.69 each (including ICANN fee)

So, after I hung up, I decided to add one more domain renewal to the shopping cart; might as well, since 30% was the lowest I have seen it. But alas, when I added the fifth domain, the prices got messed up again. Darn!

I didn’t want to phone them again, so google to the rescue. I searched for “go daddy 30% off coupon” and found what appeared to be an expired code for April, 2009. What the heck, I tried it anyway, and it worked! Yay, all 5 domain renewals were discounted 30% and I was happy.

By the way, the discount code is “CHH3” – looks like you can use it all the time.

I still don’t know what was up with the first discount and why it showed two different prices like that, but I am glad it did; I might not have even realized that the 25% wasn’t correctly applied had it not been for the wacky price error. So, I am thankful for that!

PS. SplashofStyle.com has been renewed until Oct 10, 2010!

Google Books

February 26, 2009 by debbie T | BooksCSSDigital PhotographyInternetWeb DesignWeb DevelopmentXHTML

I know I knew about this before, but never really looked into it….but Google has a very large collection of books to browse.

http://books.google.com/books

Add the books to “Your Library” so you can save them for later. There’s tons of web design, html, css, and photography books available, with links to Amazon & Barnes and Noble. Very cool!

SitePoint – Buy 1 Get 5

February 10, 2009 by debbie T | BooksWeb Design

Buy FIVE pdf books for the price of one $29.95 on SitePoint. 3 days only, all proceeds are going to the Australian Red Cross Victorian Bushfire Appeal.

More details here:
http://www.sitepoint.com/blogs/2009/02/10/our-best-book-deal-ever-5-books-for-the-price-of-1/

My purchases:

Create Simple HTML Photo Page in iPhoto

February 1, 2009 by debbie T | ComputersDigital PhotographyiPhotoMac SoftwareWeb DesignWeb Development

I maintain a basic web site for a local non-profit, and every year, I must update their photo page of Officers. It’s always been time consuming to try to reassemble the table html codes and move all the names and titles to their appropriate spots.

I wanted to find an easier way to create a simple html table for the photo page. I looked into iWeb, but the output page looked like a portfolio, and the code was virtually impossible to edit later.

I had imported all the necessary photo files into iPhoto, and while I was checking out the Export command, I noticed there was an option to export as web page.

Read the Rest of the Article

MacRabbit Espresso Public Beta

December 30, 2008 by debbie T | CSSMac SoftwareWeb DesignWeb DevelopmentXHTML

Wheee! yay, finally!

MacRabbit is now offering a public beta for their new code editor named “Espresso”

Oh I wish I could play. My Macbook Pro is staying at Applecare Hospital, and I don’t know if I will be getting it back soon.

It is something I have been looking forward to for awhile though. It looks really great, I can’t wait to check it out on my MBP!

http://macrabbit.com/espresso/

Relearning CSS & Web Design

November 29, 2008 by debbie T | CSSFirefox BrowserWeb Design

One of my older web sites is in desperate need of a new web design; the problem is I am so rusty and out of practice. sigh, one of the perils of getting older! You don’t use it, you will lose it!

I needed to re-learn CSS positioning and layout, so I took a couple of days and read through Chapter 8 of the CSS Anthology book by Rachel Andrew. Fantastic book for learning the bits and pieces of CSS.

So, I think I now have recovered enough knowledge to tackle my project.

Back a couple of years ago, when I was regularly designing, designers had to worry about coding for horribly outdated browsers like IE 5 for Windows & Mac and Netscape 4. Thankfully, the browser stats for the site I am redesigning show an insignificant number of visitors using these outdated browsers. I still have to deal with IE6 (which still shows about 30% of my visitors) but the design will be simple, so I don’t foresee a problem. Uh oh, I probably just jinxed myself!

And while we are on the subject of IE6, who ARE these people still using that insecure browser? The cool thing is the stats show about 17% of visitors are using a version of Firefox. It is not a techie site, so that is good news!

Want to learn more about positioning and layout using CSS? Check out these other sites: