Bookmark and Share

Inspiring yourself for a New Layout (the Afef way)

How To 7:35 pm 783 Words  Respond?

Thankyou everyone for the mind blowing comments & emails you sent in about the new layout ! I’m super happy everyone liked it! I’ve had a few of you out there questioning me how i get my inspiration on making a new layout. So here I am today! Here are some quick points on how to make a faboulous personal layout for your blog, website, or myspace, my way!

Hope these super simple steps will make you guys out there open up your graphics software and whip up the most beautiful layouts ever! I would love to see the results!

Think about the colourscheme: This is always my starting point!! Think about what your favourite colours are. Which colours are you most comfortable with? … I find the Colour Lovers website absolutely super useful for this purpose! The colour templates there just immediately inspire me to create! Remember to keep in mind not to use super flashy colours that might cause an eyestrain to the users - so no bright neon green text on white backgrounds please! If you’re going for a quick easy layout or you’re in a hurry, then go for a two colour scheme. Black and White, Black and Red, Black and purple, White and Blue, White and Grey - you name it!!

Make Diagrams: Make a sketch on how everything will be positioned on your layout. Just visualise your layout already online - imagine how it will look on your browser. Clearly mark all the headings, where the search features will be, how much space will the main header take and where the menus will be situated … etc. It will really boost and reduce your coding time (which delights me, i think the coding is somewhat the most boring! Shhh!)!!

The Main Image header: The most fun part out of creating a new layout, for me, is most definitely the creation of the header!! I love to use either mind mapping software or head on to Wordle to make all my ideas visual & clear infront of me when i’m brainstorming! If you have no inspiration at all (how could you??!! ) on how this new header image can be, here’s a quick idea: open either the mind map software or wordle and think about yourself - then ask these questions:

  1. What are your hobbies?
  2. What do you associate yourself with?
  3. What’s your favourite fashion genre?
  4. What music do you like listening to?
  5. What are your favourite shapes (hearts, stars etc)?
  6. Do you like animals?
  7. What do you inspire to be when you get older?
  8. What makes you happy?

Write them off in your application (Wordle / mind map) & there you have it! Plenty of ideas on what to make your layout about!! Remember the colour scheme you chose in the beginning? Use those colours to help you sift through the images you’re going to be using!

Here’s what my Wordle brain storm would look like:

The Background: If you’re going for a super cluttered layout (my favourite!!) try and make your background a much more subtle. If on the other hand you have just one image in your header, then i suggest you make your background super decorated - but remember not to make the background stand out more than the actual main header image! It would look just wrong! Use the darkest or lightest colour in the original colour scheme chosen as your background for the best results!

What steps do you usually take to make a new website layout? Where or from who do you usually your inspiration from?










RSS feed | Trackback URI

  • Gravatar IconAngelica from SWEDEN Says:

    When I start thinking about a layout I usually start with just one photo which I want to use. In my current layout it was the photo of Emilie Autumn. Then I find other photos and play around in photoshop. I choose the colours based on the first photo I decided on and pretty much go from there.

    I also love super cluttered layouts! I’m addicted to spatter and grunge brushes!

    I always find your layouts interesting because there are so many details which you don’t notice until you sit down and take a long look at the layout. Like I’ve already said, this layout is really cool!

    Angelica s last blog post .. School’s out forever - NOT!

    Using Opera Opera 9.51 on Windows Windows XP
    August 14th, 2008 @ 8:25 pm
    • Gravatar Iconafef from MALTA Says:

      You read my mind about the details thing!! i like to make people come closer to the screen and yell “damn! i didn’t notice that before!”

      Using Mozilla Firefox Mozilla Firefox 3.0.1 on Windows Windows Vista
      August 15th, 2008 @ 2:35 pm
    • Gravatar IconRavencroft from UNITED STATES Says:

      OMG! You honestly don’t know how much this is what I needed right now. I have a layout in the process and I’m stuck. Danke schon sehr gut Afef! XD

      Using Mozilla Firefox Mozilla Firefox 3.0.1 on Windows Windows XP
      August 14th, 2008 @ 9:23 pm
      • Gravatar Iconafef from MALTA Says:

        no problem Ravie! Hope to see that new layout really soon!!

        Using Mozilla Firefox Mozilla Firefox 3.0.1 on Windows Windows Vista
        August 15th, 2008 @ 2:34 pm
        • Gravatar IconRavencroft from UNITED STATES Says:

          Yea, once I upgrade my WP…oops I didn’t back up all of the files. O_o Looks like I’m starting from scratch. At least I backed up my layouts, plugins, and the wp-config/index.php. XD

          Hey what are the new plugins here you’re using? I really like this reply to comments on. I also like that share and enjoy thingy. XD

          Using Mozilla Firefox Mozilla Firefox 2.0.0.14 on Windows Windows XP
          August 16th, 2008 @ 4:05 pm
      • Gravatar IconGeorgina from AUSTRALIA Says:

        wow Afef, I really enjoyed reading that! Sounds like great stuff! So well, here’s what I go through, basically.
        I think of something I like, basically. Something that also sorta reflects me. I used to make layouts of celebrities, then I just got over it. Most of the time I use my own photos. I love taking pictures, so I take my camera with me everywhere. If I see something I like, usually part of nature, I try and take a picture knowing that I’ll be able to make a layout out of it. Cluttered layouts, I’m not sure about whether I like them for my own site or not but they look splendid on yours! I also used to like drawing them.
        When I think of colours I usually think of my favourite colours, or if I have a photo I think of colours that will go with that.
        When I code, I usually key in different colours, see how they look, so I experiment with my coding to match the layout. I always make the entire layout first knowing where everything will go, then edit my CSS and etc accordingly.
        Hope that wasn’t too boring.. xDD

        Using Mozilla Firefox Mozilla Firefox 3.0.1 on Windows Windows XP
        August 15th, 2008 @ 2:46 am
        • Gravatar IconAmber from UNITED STATES Says:

          omgzz this layout is hawt! <3

          Using Mozilla Firefox Mozilla Firefox 3.0 on Windows Windows XP
          August 15th, 2008 @ 3:21 am
          • Gravatar IconLeslie from UNITED STATES Says:

            thats an interesting way to making a layout. I usually start out making the header image and then modify the colours and then finally put it into layout form. LOL. its pretty bad i think for making a good layout i just like making the headers only though.

            Using Mozilla Firefox Mozilla Firefox 2.0.0.16 on Windows Windows XP
            August 15th, 2008 @ 9:43 am
            • Gravatar IconShaina from UNITED STATES Says:

              The first thing I noticed about your site was your talent at making layouts… this one made my eyeballs pop outta my head (not literally of course). Anyway, loving the updates. You’re mah digi-muse.

              Using Internet Explorer Internet Explorer 7.0 on Windows Windows XP
              August 15th, 2008 @ 9:44 am
            • Gravatar IconLarissa from UNITED KINGDOM Says:

              Great tips! Especially the mind map one, I think I’m gonna do that next time I design a layout.
              Your new layout is amazing
              x

              Using Mozilla Firefox Mozilla Firefox 2.0.0.16 on Windows Windows XP
              August 15th, 2008 @ 12:02 pm
              • Gravatar IconClaudia from UNITED STATES Says:

                That’s so cool. Love your new layout.

                Using Mozilla Firefox Mozilla Firefox 2.0.0.16 on Windows Windows Vista
                August 16th, 2008 @ 7:15 am
                • Gravatar IconAmarilys from UNITED STATES Says:

                  Wow! Those are really great tips! I’m definitely going to be using those when I start making a new layout :-) Thank you so much for sharing your techniques!

                  Hope you’re having a wonderful day! <3

                  Using Mozilla Firefox Mozilla Firefox 3.0.1 on Windows Windows XP
                  August 16th, 2008 @ 10:00 am
                  • Gravatar IconOcean from UNITED STATES Says:

                    ooolala, new layout? its so pretty!
                    how’ve you been?

                    Using Internet Explorer Internet Explorer 6.0 on Windows Windows XP
                    August 17th, 2008 @ 6:12 am
                    • Gravatar IconEuri from PHILIPPINES Says:

                      Oopps, I was late. XD I love your layout!

                      Euri s last blog post .. My History of Web Developing

                      Using Mozilla Firefox Mozilla Firefox 2.0.0.16 on Windows Windows XP
                      August 17th, 2008 @ 2:37 pm
                      • Gravatar IconWyther from UNITED STATES Says:

                        I always love your layouts and this one is no exception! Excellent job once again! My inspiration usually comes out of nowhere and I just try and make it as close to the visualization in my mind as possible. That doesn’t always work out for me though and I sometimes make something else I like just as much as my mental masterpieces. You probably are already aware of my typical website layouts….

                        Wyther s last blog post .. Bad, Wyther, Bad!!

                        Using Mozilla Firefox Mozilla Firefox 2.0.0.16 on Windows Windows XP
                        August 18th, 2008 @ 3:06 am
                        • Gravatar IconClint from MALTA Says:

                          Great talent with the blend of cool creativity. Well done.

                          Your 2 metre away friend.

                          I’m off to eat some beanies… buhahah

                          Using Internet Explorer Internet Explorer 7.0 on Windows Windows XP
                          August 19th, 2008 @ 11:00 pm
                          • [...] Inspiring yourself for a New Layout (the Afef way) strawberry-gashes.net [...]

                            Using WordPress WordPress 2.5.1
                            August 28th, 2008 @ 2:48 pm

                            Leave a Reply

                            (Required)
                            (Required, will not be published)
                                                          

                            Share and Enjoy

                            • Digg
                            • Sphinn
                            • del.icio.us
                            • Facebook
                            • Mixx
                            • Google
                            • blogmarks
                            • BlogMemes
                            • Live
                            • Ma.gnolia
                            • Reddit
                            • StumbleUpon
                            • Technorati
                            • TwitThis