The process of making a commercial website

Making a satire website

 It's been a while. Hi everyone!  I want to write a little bit about what I've been up to recently.  A way of organizing my thoughts, and maybe you will enjoy sharing the journey and what I've learned.

Background

Last year I wanted to get back into some form of dev project, so I taught myself twitter bootstrap. I had a running gag with my parents that I was going to send them to the worst old folks home imaginable, so I made the website about that.  It was called Thorny Meadows.  Check it out, yo!

It was fun making content for the site, and I did it in my off hours, took about two weeks to get through, because I was learning as I went. What I used to make the site:

Bootstrap
For those of you who don't know, making a responsive page is hard. If it looks good on a PC it won't necessarily look good on a tablet or a mobile phone because the screens are different sizes. So you used to have to measure the screen, and lay it out and test for each different device you wanted to prep your site for, or risk your site looking like garbage.

So Twitter comes along and says "let's make a framework to make it easier".  Basically you lay your webpage out using a grid, and can specify the number of rows and columns that will appear on a small, medium, or large sized screen, and the framework makes the adjustments for you, so you only have to do the layout once. Saves a lot of time, which is why I wanted to learn it.

Pixabay.  

I was doing a dev project, not a content project, so I didn't want to go out and take my own pictures. This site is good because most photos are under the CC0 license, which means you can use them for commercial purposes.  Even though this was fun, I thought that maybe I'd throw t-shirts on there at some point and so I'd better make sure my licensing of photos was in order.   As an aside, my first idea for a splash image at the top was this:

It was a great photo to get the idea across of a dark and dangerous place, but then I didn't realize it was a stock photo of Auschwitz.  Yeah, no. No no no.

Gimp
Photoshop is generally better but I'm cheap.

PHP script to collect emails
OK so I threw this together, made it funny, and then at the bottom did a mockup of a t-shirt and said "if you want one, leave your email and I'll let you know when they're available".  If you don't do webpages yet, this is actually not a trivial thing to do. The way a webpage works is that the server sends instructions to your web browser, and your web browser then follows the instructions to lay out a webpage.  If you want to collect emails on the server, you can't just put a form in a web page, because then any information the user enters stays on the web browser.  There has to be a code that runs on the server itself.  So I had to make that.  Not too complicated, but another thing to learn.

The Traffic Spike

My page sat dormant for about a year, I didn't do much with it, and had other work to do.  Then one day I was on Reddit and someone had made a comment that they were going to put their parents in the worst old folks home.  So I just replied with the link to thorny meadows.  From that I got 11000 site visits, and 20 people giving their email address to be notified when there would be t-shirts.  I figured now was a good time for the next step - adding a store!

Ugh so many things

Adding a store is a bit like cutting the head off a hydra.  You finish one thing and there are 5 more to do.  It only took a few days, but there was a lot to learn.  Here were the steps:

1. Sign up to Shopify
Easiest way to set up a web store I think.  I had heard about it before and they had training videos.  So I made an account, added my information.

2. Install Printful
OK so I don't have any shirts to sell, I don't have a warehouse, my site's in English and I'm not even in the US, so when someone orders a shirt, how do I handle it?  I needed a fulfilment service, so I went with Printful. It seems expensive, but it was available and I didn't want to hem and haw. Also it plugs in to Shopify. I selected shirts, upload your logos, select colours, and it does the mockups, pumps them into shopify for me, and that makes life a bit easier.

3. Redo all my logos
All my logos sucked. they were small for the web but that would not look good on a shirt. I don't have the traffic to justify a designer, I just wanted to get a couple of logos up there. Took a few hours to redo them and get the mockups and print files uploaded.

4. Sign up for, and connect payment system.
I used stripe because I know some people there. The good part is you can do it right in Shopify.

5. Set up shipping options
Frig.  This was annoying. So shopify lets you charge shipping by amount ordered or by weight.  Printful charges shipping by item, and it is different per item. First T-shirt is X, every additional is $1. Or whatever.  So to get around this, there's a trick.  You charge by weight and write in fake weights. So like you tell shopify each shirt is .5kg, and then you make rules that say shipments up to .5kg to the USA are X price.  Up to 1kg are $ X+1. Up to 1.5 kg are $X+2, and so on. Then go edit the weights so that all the shirts weigh .5kg. I had 3 shirts * 7 colours * 5 sizes = 105 pages to edit plus all the rules to make for each country.  Took a while. Also it only works if all the items on your store are the same shipping price and weight. So I had the idea of putting mugs also but if someone ordered 2 mugs I'd lose money. So I just gave up.

6. Mailing list
Gotta write those people who wrote me. Also set up a system so they can unsubscribe, as well as have a page for new people to sign up. And while you're setting up mailchimp, styling your emails, making your signup page, and all that, you have to do social media

7. Facebook and twitter
I want to include these links in the mailing, so best set up the accounts now.

8. Lay out the shop.
After spending all that time getting the other services ready, I go back to the shopify site, and select which items go where, upload a landing photo, write some text in the "about us" page and so on.

9. Update the URL
My web host for thornymeadows.com is 1and1.  So I had to login and make a subdomain for the store, because the store is on shopify, it's a different server.  So I chose store.thornymeadows.com.  pointed it at the shopify site.

10. Almost there.  Everything's working and tested, time to connect the dots.
This part was pretty easy.  I had to edit the thornymeadows page and add a "store" button, and replace the email signup at the bottom with a link that says "take me to the store".

Conclusion

It was a lot of work but I learned a lot and it would probably go a lot faster in the future.  In the end the traffic trailed off after the initial spike and nobody who signed up went to my store when I mailed them.  Oh well.

The next step I think will be seeing if I can even drive traffic to the store. I have some ideas for making new content, and if I update it regularly, maybe people will find it interesting. I'm still getting about 40-50 hits per day, so it might be just a matter of keeping the content fresh.  I'll keep you posted!