Tips and tricks for making a website from scratch.

webtipsandtricks

Whoa the first term is really on a roll now. I’m mainly spending my time coding for my courses and trying to enjoy London now and then, but luckily I’ve found some time to write a new post. Since this blog started out as just a part of my project of building a website from scratch, I thought it might be interesting to share my experience of building a website with you and tell you what I learnt and give you tips about things that might come in handy if you would like to make a website yourself.

1. Use a good text/code editor
If you’ve never coded before you might not know at first how to save all of your files or you might just be using word, but a good code editor is key. I’m using Sublime and I’m really satisfied about how it works. The main pro to this editor is that it adds colour coding to your code that’s specific for the programming language you’re using. So it’s a lot easier to distinguish between different types of elements and thus makes it easier to read and edit your code. When coding a website you’ll mainly be writing HTML and CSS and I’d recommend saving those different types of files separately so the colour coding is different for the HTML and CSS parts.

2. Make sketches
Making sketches of how you want each page of your website to look like will help you organise your code. First of all, it will help you focus on what you need to do for each page. And second of all, it will prevent you from losing control over what you still need to do because you can compare what you already have to your sketches. Here is an example of a couple of sketches I made when coding my page:

IMG_0552

3. Use the web
I do think that the best way to learn coding is by doing it yourself. However, you don’t always need to reinvent how certain things are done. I made my website during the summer holidays so I had all the time in the world to figure out how to add different elements to my website. But looking back I do admit that I could have saved quite some time on a couple of things. For example, I made the social network buttons on the bottom of my page by saving each image separately, then uploading them to photobucket so I could add a link to each of them and they would be visible on my site. When I started on the new design of my website I came across font awesome. Font awesome is a font made up of all sorts of icons such as social network icons, which you can edit like any font. So it’s a lot easier to add and edit them than images of icons. If only I’d known about it before..

However, you do have to be careful when it comes to copying code from the Internet, because (especially in HTML and CSS) elements have specific names that you have to come up with yourself, and using someone else’s code might completely mess up parts of your code that were right before because this person used different names. The best way of using someone else’s code would be by figuring out how their code works and then re-writing that code into your own project with your project’s specific names.

4. Phone & tablet compatibility
When designing your website you have to keep in mind what devices you want your website to be viewed on. At first, I only checked whether my site looked good on a desktop, assuming that it would be fine on tablets and phones as well (bit naive..), and so when my site was done and I checked what it looked like on my phone I was surprised about how messed up it was. And I spend quite some time to fix it. So make sure you add code to make your website compatible for phone and tablet right from the beginning. This is the code I used to adapt my page for tablets:

Screen Shot 2014-10-25 at 20.36.43

5. Make notes
Every time I came across a problem on my website I made a note of that and also wrote down how I solved the problem in the end. I recommend doing this, because you will learn from these mistakes and if you have a similar problem later on you can use the solution you wrote down. You might not think this necessary, but trust me, you will forget how you coded certain elements and might find yourself solving a problem you did before.

I certainly learnt a lot while doing this project and I hope you find these tips helpful if you plan on designing a website yourself. Feel free to ask me any more questions you might have about making your own website or coding in general 🙂

XOXO
Merel

Follow me on: BloglovinInstagramTwitter

Autumn recipes

It’s that time of the year again, leaves are changing into red, orange, and yellow, you feel like wearing comfy sweaters all the time and Starbucks has the Pumpkin Spiced Latte on sale again. Yes, it’s autumn. As long as it’s not raining all the time, autumn is a great season both fashion and food wise. In this post I’d like to share one of my favourite autumn recipes, which is a barley and butternut squash salad I ate a few weeks ago at Ginger & White.

IMG_2286

It’s a perfect dish for early autumn, when there’s still a glint of summer in the air (which is the case in London at the moment), because the cherry tomatoes and raw spinach make it taste very fresh while at the same time the barley, squash and nuts add flavours that fit with autumn. The ingredients you need are:

  • Cherry tomatoes
  • Dried cranberries
  • Pumpkin, sunflower, and sesame seeds, all toasted
  • Walnuts, toasted
  • Spinach
  • Roasted butternut squash (preheat the oven to 200C, peel, seed, and cut the squash, drizzle over some olive oil, season with salt and pepper, and put in the over for about 30 min or until the squash is tender)
  • Barley
  • Mixed salad
  • Feta

(the amounts depend on personal preference)

IMG_2790

It’s fairly easy to make, but you do need a strong hand and a good knife to cut the butternut squash. When you’ve toasted all the seeds, roasted the squash and prepared the barley, you just mix all of it, and enjoy your lovely autumn salad!

What I think, makes a recipe autumn proof, are ingredients like pumpkin and sweet potato. I’m not entirely sure why. It might just be because of their colour, or because they are also great in soups and other warm dishes.

What do you think makes a recipe great for autumn? I’m curious to hear some of your recipes 🙂

O and in case the weather is a lot colder where you are, you should try this Pumpkin, Sage, and Feta Risotto!

Follow me on: BloglovinInstagramTwitter