Hi!

 

I should start by saying that design really isn't my professional area, at all. I'm good at coding, and only coding, haha.. Though, I've designed this piece of something and I'd like to know what you think of it. All the texts are just examples, so don't worry about them.

 

The image in the left column is my girlfriend and it's okay with her that I use her as an example, so no worries there. That column is the "Latest notification of a missing person" or something.

 

Any ideas on how I could advance the design? Make it better? What more is there to add to the header? It looks so empty. And what about the structure? Does it look good? And also, the colors, do they look good together?

 

Thanks in advance,

/Nanashi

 

(By the way, sorry for the "Adolf" and "Hitler" in the menu. I'm not into politics at all, nor am I a nazi or anything like that. It's just that when I get bored and can't figure out anything more to write, I tend to write random names that I think is fun.)

 

Please see the attached image of the design, since I've not started to code it yet.

Input real content instead of the lorem ipsum. Remove all graphical elements that aren't content (backgrounds, images, colour etc) and concentrate on the hierarchy of information. Once that looks right, you can start to add in the graphics again.

Edited May 24, 201214 yr by Renaissance-Design

Input real content instead of the lorem ipsum. Remove all graphical elements that aren't content (backgrounds, images, colour etc) and concentrate on the hierarchy of information. Once that looks right, you can start to add in the graphics again.

 

Thanks for your reply!

I'm sorry if I misunderstood your post, but is this what you meant? (See attached file)

 

Thanks!

/Nanashi

Much better. Now you can concentrate on the content and its hierarchy and relationships. I'd be able to help you with that a bit better if I could read the language, but off the top of my head here's a few tweaks:

 

Make the body text size larger. At the moment the small text is creating lines that are too long for reading comfortably

 

Open the leading/line-height a little.

 

Right column: align the body text flush left with the heading - the column separation creates a nice strong vertical eyeline, so use it to help the reader orient themselves when reading the right column.

Much better. Now you can concentrate on the content and its hierarchy and relationships. I'd be able to help you with that a bit better if I could read the language, but off the top of my head here's a few tweaks:

 

Make the body text size larger. At the moment the small text is creating lines that are too long for reading comfortably

 

Open the leading/line-height a little.

 

Right column: align the body text flush left with the heading - the column separation creates a nice strong vertical eyeline, so use it to help the reader orient themselves when reading the right column.

 

Sorry for that, haha. I've translated most of the text now,

 

I resized the body-text from 11pt to 14pt. Changed the leading to 24pt, though only in the right column. I didn't think it looked any good when I changed it in the left column since it's so small. Aligned the text in the right column.

 

I hope the translation helps,

Thanks for you help, and thanks for any further help!

I'd suggest normalizing the padding on both content boxes. The heading on the right doesn't have enough whitespace around it - try this article for some useful tips.

I'd suggest normalizing the padding on both content boxes. The heading on the right doesn't have enough whitespace around it - try this article for some useful tips.

 

Thanks for the link and sorry for taking such a long time!

Had to go after posting my last post yesterday, and then I started coding the structure using the link you linked to calculate margins and such. Though, on some places, like spacing between columns and such was kind of hard to figure out, since I'm not really sure how em works. I decided to make right and left paddings, and also margins between columns in pixels. But line-height, font-size and such is calculated using em. I decided to use the same size like they do in the tutorial.

 

So, what do you think so far?

https://dropbox.com/u/78062087/project-missing/layouts/index.html

 

Am I using too much padding?

Should I remove it completely? (Right and left padding)