Category Web Design

Starting a WordPress Theme From Scratch

So much of web design today is duplicating effort. This is especially true for creating WordPress themes because of the extra blog code that needs to be hooked into each theme.

I started a new project on GitHub called MinWP that will contain all of the source files necessary to get started with a new WordPress theme. The goal is to create a fully functional 2-column theme with absolutely no additional design elements added to it.

Now, to create a new WordPress theme,…

301 Redirect with ASP .NET

When redirecting URL’s it is very important not to lose all of your search engine mojo. The best way to do this, is by using a 301 redirect which notifies the requester of a permanent URL move.

<script runat="server">
private void Page_Load(object sender, System.EventArgs e) {
  Response.Status = "301 Moved Permanently";
  Response.AddHeader("Location","http://www.newdomain.com");
}
</script>

Should you have to redirect a URL to a new location, using a status 301 redirect is the safest way to do it.

Creating a Fluid Two-Column Layout With a Single Fixed Width Column

Ever wonder if you can create a fluid layout with a fixed witdh column? Well, you can!

layout.html

<html>
  <head>
    <title>Fixed Left Column</title>
    <link rel="stylesheet" href="test.css" type="text/css" />
  </head>
  <body>
    <div>Left div</div>
    <div>Right div</div>
  </body>
</html>

test.css

.left {
	width: 300px;
	float: left;
	background-color: #CCCCCC;
}
.right {
	margin-left: 300px;
}

There are very few times in life that you can have things both ways, this is one of them.

Sending Email in ASP .NET

I can’t think of too many websites that don’t send automated email. Unfortunately, for ASP .NET programmers, there are several incorrect code snippets online which try to explain how to send email.

Here’s the code I use on the contact form for my personal website which does the trick quite nicely.

/* using System.Net.Mail; */
MailMessage newMail = new MailMessage();
newMail.To.Add(toAddress);
newMail.Subject = subject;
newMail.Body = body;
newMail.From = new MailAddress(fromAddress, name);
newMail.IsBodyHtml = true;

SmtpClient SmtpSender = new SmtpClient();
SmtpSender.Port = 25;…

Thwarting Spammers With reCAPTCHA

One day, while going out to lunch, I checked my phone and noticed 20 new email messages from Wordpress asking me to review new comments to my blog. I instantly knew something was wrong because I don’t generally get that many comments in such a short amount of time. After reviewing all of my email messages, I confirmed that every last one of them was asking me to approve a spam comment. By the time I got back to my…

New Site Layout Launched!

Here is the new site layout. There are several things I wanted to accomplish with this layout. Namely, I wanted to keep the design minimal to allow proper focus on the content. Also, I spent a good deal of time tweaking the typography because I wanted to make reading the site’s content as easy and hassle free for the reader as possible.

I think I have accomplished everything I set out to do, the design is still a little rough around…

Ruby on Rails: database.yml Configuration

This is the proper configuration for a mysql database connection for Ruby on Rails. This file resides in config/database.yml and must be configured properly before you can even hope for your Rails application to run correctly.

Notice how there are two spaces before each property. Tabs will not work.

development:
  adapter: mysql
  database: <db_name>
  encoding: utf8
  username: <username>
  password: <password>
  host: <host>
production:
  adapter: mysql
  database: <db_name>
  encoding: utf8
  username: <username>
  password: <password>
  host: <host>

RSS Awesomeness: How to Add a Feed to Your Website

I wanted a quick and easy way for my portfolio page to show a dynamic list of what I’ve been blogging about on CubeAntics. Google makes this extremely easy by offering an API that does all of the behind the scenes work for you. They even have a feed control wizard that will generate the code for you.

Here is a snippet of what the feed control wizard generated for this site.

<!-- ++Begin Dynamic Feed Wizard Generated Code++ -->
  <!--
  //…

The Adventures of a Web Designer [Part 4 - Finishing With Style]

The plans have been made, the Photoshop mockups are finished, and the wife signed off on the look and feel. Now, all that’s left is to transform the existing mockup into a useable, sharp, standards compliant website. This part will unquestionably take some style.

Here is some of the CSS code that helped me accomplish the layout for this site.

style.css


body {
    font-size: 1.3em;
    background-color: #44362D;
    color: #333333;
    margin: 0px 0px 0px 0px;
}

#header {
    height: 156px;
    width: 100%;
    background-image: url(../images/header_bg.png);…

The Adventures of a Web Designer [Part 3 – The Mulligan]

Now that I have gone through a healthy lesson of what not to do for my wife’s site mockup, it is time to go back to the drawing board and try again.  This time, I will try to focus primarily on creating a clean, simple, and professional design and leave out the personality side of the site.  After all, there is plenty of room for my wife to express her personality through the site’s content, I just need to worry…