We now have the capabilities to develop iPhone and iPod specific websites with location features and touch and slide technologies.
our blog
We now offer iPhone and iPod specific website design
Feb
21
2010
Loading ...The OSU logo screw up
Feb
16
2010
I am a stickler for details and balance so thought I would point out an example I recently saw that does a sub par job. Sometimes I can get tunnel vision and miss things too but the high profile logo of The Ohio State University should be perfect.
I noticed that my alma mater’s logo looked a little off. I did some digging and even contacted a friend of mine with an officially licensed logo in PDF format. It turns out that the logo is more than a little off. As you can see below there are some large balance issues that make the design appear “off”.
The logo looks OK on its own but only a keen eye for pixels can identify the balance issues a logo may have.
Free WordPress Setup
Feb
16
2010
We are now offering free WordPress setup for any man, woman, or child. It does not matter if you are an individual or a company! We just want to help you get the most out of WordPress. Simply fill out the form below and we will contact you to schedule the setup. It’s that simple!
Your setup includes the following:
- Uploading of the latest WordPress version to your server
- Creation of a database on your host server
- Standard Template activation
- Testing
What it does not include:
- A domain name (You can purchase one from a registrar)
- A hosting account (You can purchase one from us for $240/yr or use one of your choice pending they can support the minimum requirements for WordPress. WordPress minimum requirements can be found here.)
- Installation of additional themes, plugins, or widgets. WordPress makes this very easy; even for a novice:)
- Custom coding or theme manipulation (We can be hired for these types of things and can be discussed when we speak)
A complete blog post inside of a QR Code
Feb
12
2010
This blog post is completely contained in the QR Code below. It is a post about how to creatively use QR Codes in a successful mobile marketing campaign.
If you could not get your reader to pick up the very large and consequently info heavy QR Code above don’t worry. Try using the smaller one below. It actually contains a link to the text of the blog post rather than the full text of the blog post.
WPbeginner publishes article written by Todd Santoro
Jan
28
2010
WPbeginner is a great resource for WordPress developers and has just published my article on CSS Sprites. Syed Balkhi, the founder of WPBeginner, has graciously allowed me to write an article as a guest author titled Use CSS Sprites to Beautify your WordPress Post Dates.
Have a look at the tutorial and super style your WordPress dates on your posts.
How to set up a wordpress blog in 5 simple steps
Dec
26
2009
Setting up a Wordpress site in no time flat
I just got off the phone with a friend who really does not know much about web design and we got him set up with a Wordpress blog in 5 simple steps. After talking with him I decided to write a tutorial on how to set up a Wordpress website. This tutorial will take about 15 minutes if you don’t count file transfer time (FTP).
What you will need:
- A FTP program like FileZilla (I use Dreamweaver and FileZilla)
- A web hosting company (Obviously… I use Media Temple)
- A Text editor (I use Dreamweaver but you can use anything)
What this Tutorial will accomplish:
- You will have a basic Wordpress website running
Let’s get started…
Step #1. Download and unzip the latest version of Wordpress (This tutorial uses v. 2.9) into a local folder on your computer (remember where you unzipped it to)
Step #2. Create a database on your server and take note of those settings. Most hosting companies provide help documents on how to do this. Its should be really simple.
Step #3. Open up this file: wp-config-sample.php and SAVE AS wp-config.php right off the bat. Then edit the lines of code that talk about your database. Remember those settings I said to keep handy. You will need them here.
// MySQL settings - You can get this info from your web host // // The name of the database for WordPress // define('DB_NAME', 'put_your_database_name_here'); // MySQL database username // define('DB_USER', 'user_name_here'); // MySQL database password // define('DB_PASSWORD', 'your_password_here'); // MySQL hostname 99% chance you will not have to change this value. Some hosting providers like mine require something different. This is something that anyone at the hosting company will know.// define('DB_HOST', 'localhost');
Down a little further you will see the Unique Keys. FILL THESE WITH UNIQUE CHARACTERS LIKE:
86dfg79835g6%^$R@!^7^Hn76h&*!@Yhnd*@^#8yem They should all be different from each other and help with the security of your blog. Please do not use the ones provided in these examples and make sure to keep the single quotes around each value.
define('AUTH_KEY', ':dr+%/5V4sAUG-gg%aS*v;&xGhd%{YKC^Z7KKGh j>k[.Nf$y7iGKdJ3c*[Kr5Bg'); define('SECURE_AUTH_KEY', 'TufWOuA _.t>#+hA?^|3RfGTm>@*+S=8\"\'+\"}]<m#+}V)p:Qi?jXLq,<h\\`39m_('); define('LOGGED_IN_KEY', 'S~AACm4h1;T^\"qW3_8Zv!Ji=y|)~5i63JI |Al[(<YS<2V^$T])=8Xh2a:b:}U_E'); define('NONCE_KEY', 'k1+EOc-&w?hG8j84>6L9v\"6C89NH?ui{*3\\(t09mumL/fFP_!K$JCEkLuy ={x{0');
For more security I like to change the table prefix from wp_ to something else.
// You can have multiple installations in one database if you give each a unique table prefix $table_prefix = 'r235_'; // Only numbers, letters, and underscores please!
Step #4. Fire up your FTP program and upload all of the files including the 3 directories to your web server. This is where a lot of your time will be spent.
Step #5. Open up your favorite web browser and type your site’s address in the address bar and add /wp-admin/install.php. i.e. www.exampleurl.com/wp-admin/install.php or www.exampleulr.com/blog/wp-admin/install.php if you place Wordpress in another directory like blog. Fill in the simple info Wordpress asks for and your good to go!
That’s it! You have now set up your first Wordpress site.
sIFR is how we made our headlines look so smashing
Dec
16
2009
Like the fonts our headlines are in?
We accomplished this with a small piece of opensource JavaScript and Adobe Flash software called sIFR or Scalable Inman Flash Replacement. Come on, I’ll show you how to do this in 15 minutes or less.
This is a quick start tutorial and will accomplish two things:
- Replacement of your site’s <h1> tags, if you have any
- Replacement of a CSS class named “replace-me” which we will create on a page
Things you will need for this tutorial:
- A simple text editor (I use Dreamweaver CS3 – you can use anything)
- Adobe Flash (I use Flash CS3 Professional)
- A font you like (I like to look on daFont.com – they are free:)
Lets get started
Step #1: Download and unzip the latest version of the sIFR project here. This tutorial uses sIFR-2.0.7
Step #2: Fire up Adobe Flash and open sifr.fla (it is in the .zip file you just downloaded in step #1) If your version of Flash will not open up the sifr.fla file (Usually cs4 users) then you can download a compatible version here
Step #3: Double click on the stage.
Step #4: Select the Dynamic Text box on the stage.
Step #5: Change the font to one you like. Don’t worry about the font size as sIFR takes care of that for you. The font color will be defined later on in the implementation process.
Step #6: We are now done with Flash, so save the file as the name of the font you used and publish it (eg: swatch_it.fla). This helps when you have multiple fonts on a page.
Step #7: Open up your text editor and follow along. It is pretty easy to just cut and paste:)
Step #8: Open customize_me.as and change line 14 to your reflect your domain name. You just need your domain name here. It does not matter where you will be using sIFR on your site. Make sure you have one with www. and one without. Then save and close it.
example:
allowedDomains = new Array("*","www.toddsantoro.com","toddsantoro.com");
Step #9: Open up your site’s stylesheet (Hint: its a .css file)
Step #10: Add these lines to your sites stylesheet:
example:
.replace-me { font-size: 18px; display: none !important; } h1 { display:none !important; }
OR
.replace-me { font-size: 18px; height:75px; width:250px; padding-left:25px; } h1 { display:none !important; font-size: 22px; }
The class replace-me will trigger sIFR to replace the text with a Flash movie that has your special font. For those people that do not have flash installed, they will see normal text. By adding attributes to the class you can achieve different results, be creative:) As for the <h1> tag… everywhere a <h1> tag is on your site, sIFR will replace it with a Flash movie.
Step #11: Now we bring everything together. Open up your header.php page if you have one. If not; open up the page you want to have sIFR replace your text on. I usually work with Wordpress and it has a header.php file that is included on every page of my site.
Add these lines to the <head></head> of your page:
<script src="sIFR-2.0.7/sifr.js" type="text/javascript"></script> <script src="sIFR-2.0.7/sifr-addons.js" type="text/javascript"></script>
Step #12: Add this line somewhere in the <body></body> of your page:
<div class="replace-me">This is the text I wanted to replace. Yippie!</div>
Step #13: Open up footer.php if you have one or continue working with the file you were just working with in Step #12. Add these lines just before the ending </body> tag:
<script type="text/JavaScript">if(typeof sIFR == "function"){ sIFR.replaceElement(named({sSelector:"h1", sFlashSrc:"sIFR-2.0.7/swatch_it.swf", sColor:"#4E4C00", sLinkColor:"#4E4C00", sHoverColor:"#4E4C00", sWmode:"transparent"})); }</script> <script type="text/JavaScript">if(typeof sIFR == "function"){ sIFR.replaceElement(named({sSelector:"#replace-me", sFlashSrc:"sIFR-2.0.7/swatch_it.swf", sColor:"#4E4C00", sLinkColor:"#4E4C00", sHoverColor:"#4E4C00", sWmode:"transparent"})); }</script>
Be sure to set your font and link colors in the code above. Also make sure your paths to stuff are correct. You can also combine these like this:
<script type="text/JavaScript">if(typeof sIFR == "function"){ sIFR.replaceElement(named({sSelector:"h1,#replace-me", sFlashSrc:"sIFR-2.0.7/swatch_it.swf", sColor:"#4E4C00", sLinkColor:"#4E4C00", sHoverColor:"#4E4C00", sWmode:"transparent"})); }</script>
Notice that I simply added a comma to separate the two CSS elements I wanted to replace. This method would also render the same font colors on both <h1> tags and the replace-me class.
Step #14: You are done! Upload all of your files to your server and check out your work. If you have problems… I would first make sure all of the paths to the sIFR stuff are correct and that you have uploaded all of the sIFR files.
I will try to help troubleshoot if you post your comments below.
Cheers!
Icon Global Sports Case Study
Nov
23
2009
Icon Global is a full service sales representation and market management agency. They were in need of a slick and polished web site that embodied the brands they represent.
We started with numerous phone conversations and chat sessions. We were trying to figure out who the audience was, what the goals of the site were, and what the brand would come to mean. We developed a smooth identity that signified the brand and moved on to UI.
Once the wire frames were hashed out we proceeded to online collaboration with Concept Share where all visuals were communicated with the client. The client had the opportunity to mark up the designs right on their screen. Online collaboration allows for a smoother development cycle because it keeps the conversation going forward.
Once the site was completed and tested we moved it to a production server and turned it on, so to speak. The site has been gaining steady traffic since going live and presents an image Icon Global can be proud of. Mr. Angwin, President of Icon Global Sports says, “The site gives my business a high-end look and feel. We deal with the worlds top athletic brands in New York City so competition is all over the place. ToddSantoro.com Designs helped us achieve this look.”
- Logo / branding design
- Web design
- Graphic design
- IconGlobalSports.com
The Brown Bag Deli Case Study
Aug
13
2009
Creation starts with a pencil and a sandwich
It’s really easy to peruse some nice website gallery, and point to a nice looking site and say “YES!” that is exactly what I want. I like that one the best. It’s a more serious responsibility to understand what makes a successful web site and why. The new site had to be easy to navigate and to satisfy The Brown Bag’s core aims to sell more gourmet sandwiches and to show a commitment to the deli customer; desiring their loyalty.
So what did we do? We started eating and sketching our initial thoughts, of course. The food was delicious and we were inspired to create a website that said come and eat at The Brown Bag Deli!
Great design follows function
During the first meeting with Molly and Josie it was clear that they wanted something unique and easy to use. We looked around The Brown Bag Deli and noticed the casual feel in the restaurant. After speaking with the two ladies for a while we had what we needed. We were armed with photos, interviews with the client, sketches, and ideas for the first proof.
Sweat the small stuff
It does not take long to bounce around from casual dining site to casual dining site before you realize that they all looked like a line of ants, they were the same! We set out to change this.
We photographed every sandwich the Brown Bag had and gave them a brown bag frame to complete the look. Little details like this immediately speak to the customer saying come and eat me.
Tada!
The Brown Bag Deli now has a site that embodies their culture and helps bring in new customers. “We have been consistently thrilled with both the creative and professional services ToddSantoro.com Designs’ provides, as well as the outcome we have seen as a result of the marketing strategies they continue to facilitate” said, Molly.
Their email list went from zero to over 600 the first year. Molly says, “so many people stop in or call, telling me they got the email and were drawn in as a result!” The Brown Bag has established a very steady lunch and dinner crowd and recognizes that marketing is key in extending brand loyalty.
Client background
The Brown Bag Deli is located in Historic German Village, close to downtown Columbus, Ohio. This long time resident of German Village offers a wide assortment of delicious hot and cold deli favorites, such as the Mohawk Stroller and The Village Addiction. The Brown Bag serves fresh crisp salads, homemade soups, and delectable desserts that change daily.
Services
- Graphic Design
- Web Design
- Photography
- E-mail Marketing
- thebrownbaggv.com
Client testimonial
“We have been consistently thrilled with both the creative and professional services ToddSantoro.com Designs’ provides, as well as the outcome we have seen as a result of the marketing strategies they continue to facilitate”
-Molly M.
owner
A free Twitter background template that so many people need
Mar
22
2009
After looking at a lot of Twitter account pages I noticed one thing… There are not many backgrounds / customizations that pay attention to design, so I created a template for all of you to use here. It is a PSD file so you will need Photoshop CS or better to open it and change the design.
Remember that Twitter always centers the page so your design should make note of that so it displays correctly on multiple monitor sizes and resolutions.
Todd Santoro was a guest on Inside Mac Radio
Dec
11
2008
A few days ago Todd Santoro was a guest on Inside Mac Radio! Scott Sheppard was a great host and really easy to talk to about iPhone / iPod Touch games and apps that he helped create. Todd is a member of Accelerator Labs who develops iPhone and iPod apps. You can read and listen to the post on InsideMacRadio.com. The interview starts around 20 minutes in and continues for about 10 minutes.
Thanks again Scott!
QR Code text
Feb
12
1978
I have been playing around with QR Codes today and thought I would write a whole blog post about them.
I have a ton of ideas on how to use QR Codes in marketing so I will share a few of them here.
1. Use them in print ads to distribute coupons.
2. Use them in an interactive marketing campaign/scavenger hunt. eg. Client: McDonald’s – CTA: Announce that when a customer visits 10 different McDonald’s restaurants and scans the QR code on the door they get a burger coupon sent via SMS to their phone.
3. Use them in confetti. Print a number of loosing QR Codes on paper then one winning one and distribute them at a concert or event. All confetti QR Codes would include some marketing message too.
These are some of my ideas on how to creatively use QR Codes in a marketing campaign.
My firm is available for QR Code Marketing Campaigns and consulting.
