My Design Blog updates, web design and other randoms

To enable/activate the new layout for any video use this url:

youtube.com/watch5?enable=1&next_url=/watch?v=VIDEO_ID_GOES_HERE

There's also a new Google.com redesign.

Slightly different from box-shadows. You'll see this everywhere in 2010.

Flavors.me grabs your blog posts/tweets etc and sticks them all on the one page. It also gives you a cool design tool to personalise it. View some example sites or visit mine in the link above.

You can see box-shadow being used more often in CSS. Hover over the boxes in the sidebar on the CSS Tricks site.

They're pretty easy to do. Check this code:

box-shadow0 0 10px 2px rgba(0000.3);
-
moz-box-shadow0 0 10px 2px rgba(0000.3);
-
webkit-box-shadow:  0 0 10px 2px rgba(0000.3); 
Example
Just add inset - "inset 0 0 10px 2px rgba(0, 0, 0, 0.3)"

Here's how the numbers break down:

box-shadow: x-offset from middle, y-offset from middle, shadow blur/falloff, shadow spread, rgba(red, green, blue, alpha transparency)

You can use negative numbers if you wish.

Comfortably my favourite background generator.

Another good one is bgMaker - good for pixelated backgrounds and has a realtime preview as you draw.

ExpressionEngine vs Wordpress vs Textpattern

Note: This was originally from early 2008. I've stripped out parts that no longer apply and it's now mostly a comparison of the template systems. It's also from a front-end-only designer's perspective, not a clients.

Textpattern, Wordpress and ExpressionEngine are the 3 main content management and blogging systems that I looked at to control brett-munro.com.

Templates

One of the most important features for me was the ability to customise the template to allow for any XHTML/CSS I wanted to use.

Templates - Textpattern

Textpattern has a very intuitive system for templates. You click the presentation tab in the admin interface, then you can choose from Sections, Pages, Forms and Style.

Style - clearly this is where you paste your CSS.

Sections - These are basically the parts of your site that you can post content to. You can select whether to syndicate the content using RSS, and what styles/templates you want the section to use.

Pages - These are the HTML templates for your sections. This includes all the links to your stylesheets, meta keywords etc etc.

Forms - These integrate into your templates. They can be described as "mini-templates" for things like individual post items. Here's an example:

<div class="post">
    <
h1><txp:title /></h1>
    <
p><txp:body /></p>
</
div

If you saved this form as "postform", then in the Pages section, you would place this code where you wanted it to appear:

<txp:article form="postform" sort="Posted desc" /> 

Now all your posts will appear styled by "postform" and sorted descending in the order of the date posted.

Another cool feature is the tag builder. It can automatically add tags instead of making you search through an instruction manual. You can also customise these. You can choose a custom Form for the tag to use. If you want to make an unordered list of your recent articles, then make the Wraptag "ul", and make then Break "li".

<txp:category_list label="Categories" section="articles" wraptag="ul" break="li" /> 

I also managed to customise Textpattern's admin interface just by changing a few images.

Templates - Wordpress

Wordpress has a slightly different approach to Textpattern. Wordpress's theme files are all stored as .php files that you can edit using the admin interface. It doesn't offer much else, so you'll have to scour the manual for all the template tags. The tags are also php-based:

<?php the_title(); ?> 

It works well enough and you can include php files for repeating page elements. One problem is that it would often attach it's own HTML tags to the elements, lacking the functionality of Textpattern's Wraptag and Break options. I couldn't find a way to remove them easily, although maybe I just didn't look hard enough - a "tag builder" like Textpatterns would help here.

Templates - ExpressionEngine

Unfortunately ExpressionEngine is the only CMS tested that requires you to pay hard cash if you want to use it commercially. In saying that, it does have the most out-of-the-box features and there's a free version available for non-commercial use.

With EE's templates, you add templates inside a group. You can use multiple groups for one site. The name of the group becomes part of your URL unless you're server supports the option of disabling it.

http://www.your-site.com/index.php/template_group/template/

For example, this blog page has a "blog" template group, with "post" and "blog_sidebar" templates inside it. The only difference between blog and post is that post contains the comment code and limits the blog entries displayed to one. Here's an example of the simple code:

{embed="blog/blog_sidebar"}

<div id="blog_right">

    
{exp:weblog:entries weblog="blog" orderby="date" limit="15" paginate="bottom"}

    
<div class="post">
        <
h3><a href="{title_permalink="blog/post"}">{title}</a></h3>
        
{body}
        
<p>{entry_date format="%M %d %Y"}</p>
    </
div>

    
{paginate}
    
<p>Page {current_page} of {total_pages} {pagination_links}</p>
    
{/paginate}

    {
/exp:weblog:entries}

</div

Removing the index.php from the URL requires a small amount of work compared to Textpattern/Wordpress, where you can select what type of URL from the admin menu - everything from query strings to full search engine friendly SEO URL's.

Conclusion

I decided on ExpressionEngine, but I would've been swayed to Textpattern had it been more compatible with my host.

Other Mentions

MODx - Easy-to-use for clients, but custom fields require PHP knowledge and relying on things like Ditto seemed less than ideal.

Drupal - Had a strange system where you were directly editing the page without an admin interface. Got confusing quickly and I would've preferred separation.

SilverStripe

Plone

Skeletonz

Pligg

Dec 28 2009

A cool list of book cover designs.

LittleSnapper button design

I only knew about Sumo Paint...

I tried a few sitemap generators for Google Webmaster Tools and this one seems to be the most useful.

Brett-Munro.com now open

The portfolio section still needs updated with recent work, but for the most part the site's finished.

When I'm open for business it'll be running on the ExpressionEngine commercial license.

In the meantime, check out some recent projects that I'm involved with. I just released a new free forum theme for Zetaboards. There will be some free web design templates and Wordpress themes in this section in the future.

Dec 18 2009

Page 1 of 1