webdevRefinery Forum: Personal Blog Front-Page Design - webdevRefinery Forum

Jump to content

Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic

Rate Topic: -----

User is offline Qasim 

  • Group: Members
  • Posts: 520
  • Joined: 25-October 10
  • LocationOntario, Canada
  • Expertise:HTML,CSS,PHP,Java,Javascript,Graphics

Posted 23 August 2012 - 02:37 AM (#1)

Personal Blog Front-Page Design


Here is a full page-ish of the blog I am designing. The subtitle is not final and really just a placeholder (kind of cheesy). But yeah, this is what I've come up with:

(Live Demo: http://qas.im/life/) (note: subject to change, therefore image is provided)

So where the kitten is I am thinking of putting a high quality picture of me done professionally, but it will be kind of a happy mood. The next empty box might be twitter, feed, and the third tags of some sort. Any opinions on the current design?

In the image, you will notice that each word in the subtitle is a different opacity, in the live demo each one fades to a random value continuously for a cool effect.

Each blog item can be expanded by clicking on the arrow that fade in when you hover over them, and can be contracted the same way. It will expand to the appropriate length of that blog post, or i am thinking of expanding it a bit, and making the area scrollable.

In the mobile version, there will only be one column of blog posts, the right side-bar will be disregarded.

The blogging system will be made by me from scratch, I still don't know how to integrate comments into the design without hurting it. That will take some thought. Any suggestions?
Qasim Iqbal
[HTML] [CSS] [JS] [PHP] [JAVA]
[ANDROID DEVELOPER] [CHROME WEB STORE DEVELOPER]
[WEBSITE] [FACEBOOK] [FORRST]
0


User is offline Fike 

  • Group: Members
  • Posts: 340
  • Joined: 26-October 10
  • LocationIreland
  • Expertise:PHP,Javascript,Python,SQL

Posted 23 August 2012 - 03:09 AM (#2)

I love it!

Use Disqus for comments or similar, there's not much hassle that way (just make your blogging system append the disqus code to the end of each post).
web developer :: HTML, CSS, JavaScript (node), Python, PHP, MySQL, Mongo.
server admin :: experience with debian (and debian based distros), Gentoo, FreeBSD, OpenBSD.
social :: @nixhead (Twitter), Fudge (IRC), Github (FionnK), Personal Blog.
0


User is offline callumacrae 

  • {{ post.author }}
  • Group: Members
  • Posts: 2862
  • Joined: 20-January 11
  • LocationWarwickshire, England
  • Expertise:HTML,CSS,PHP,Javascript,Node.js,SQL

Posted 23 August 2012 - 03:38 AM (#3)

Nice, I really like it!

Fike, on 23 August 2012 - 03:09 AM, said:

Use Disqus for comments or similar, there's not much hassle that way (just make your blogging system append the disqus code to the end of each post).

That's not what the question was ;-) He said that it doesn't know how to get comments in without hurting the design.

Also, -1 to Disqus. Comments systems are easy enough to write, and Disqus is disgusting.
Front-end developer and writer
Twitter | GitHub | phpBB Contributor and Website Team Member | lynxphp
0


User is offline Koen 

  • Leroy Jenkins
  • Group: Members
  • Posts: 2503
  • Joined: 10-March 10
  • Locationthe Netherlands
  • Expertise:HTML,CSS,Javascript,Graphics

Posted 23 August 2012 - 03:47 AM (#4)

callumacrae, on 23 August 2012 - 03:38 AM, said:

Nice, I really like it!


That's not what the question was ;-) He said that it doesn't know how to get comments in without hurting the design.

Also, -1 to Disqus. Comments systems are easy enough to write, and Disqus is disgusting.

Disqusting? :P

I really like the design, except for the logo. Most of the design has solid colours, but the logo has gradients and inner shadows, which look off. I'd replace it with regular coloured text to give the design a cleaner look.
Please click the + if I helped you!
Twitter: @KoenKlaren

<callumacrae> YOU DID A ROMNEY
0


User is offline lobabob 

  • Group: Members
  • Posts: 98
  • Joined: 21-March 10
  • LocationWouldn't you like to know?
  • Expertise:HTML,CSS

Posted 23 August 2012 - 11:56 AM (#5)

You know how you can expand each post by clicking that fade-in arrow? The arrow doesn't fade-in when you try to collapse an expanded post (there's just an empty clickable area).
"When the world goes mad, one must accept madness as sanity since sanity is, in the last analysis, nothing but the madness on which the whole world happens to agree." - George Bernard Shaw

Life = http://xkcd.com
0


User is offline Qasim 

  • Group: Members
  • Posts: 520
  • Joined: 25-October 10
  • LocationOntario, Canada
  • Expertise:HTML,CSS,PHP,Java,Javascript,Graphics

Posted 23 August 2012 - 12:56 PM (#6)

callumacrae, on 23 August 2012 - 03:38 AM, said:

Nice, I really like it!


That's not what the question was ;-) He said that it doesn't know how to get comments in without hurting the design.

Also, -1 to Disqus. Comments systems are easy enough to write, and Disqus is disgusting.

Yeah, I'm fine with creating a comments system but I want to figure out a nice and elegant way to integrate it into the current design, maybe if a box slides out of the right of the blog post with the comments? That might look cool.

Koen, on 23 August 2012 - 03:47 AM, said:

Disqusting? :P

I really like the design, except for the logo. Most of the design has solid colours, but the logo has gradients and inner shadows, which look off. I'd replace it with regular coloured text to give the design a cleaner look.


Last night when I read this I was imaganing how the logo would look with just plain colours, and it was looking good. I'll see how it looks in Photoshop. Thanks for the suggestion. :)

lobabob, on 23 August 2012 - 11:56 AM, said:

You know how you can expand each post by clicking that fade-in arrow? The arrow doesn't fade-in when you try to collapse an expanded post (there's just an empty clickable area).

What browser are you using? I'm on Chrome and it seems to be working as desired. I think I know where the problem might be though.
Qasim Iqbal
[HTML] [CSS] [JS] [PHP] [JAVA]
[ANDROID DEVELOPER] [CHROME WEB STORE DEVELOPER]
[WEBSITE] [FACEBOOK] [FORRST]
0


User is offline iCyan 

  • Group: Members
  • Posts: 204
  • Joined: 15-May 11
  • Expertise:HTML,CSS,Graphics,Flash

Posted 23 August 2012 - 02:13 PM (#7)

View PostQasim, on 23 August 2012 - 12:56 PM, said:

Yeah, I'm fine with creating a comments system but I want to figure out a nice and elegant way to integrate it into the current design, maybe if a box slides out of the right of the blog post with the comments? That might look cool.


Well, you already have one arrow for displaying the rest of the content. Why not add another arrow that enlarges the box even more and displays the comments.

You may also want to have the box enlarge by clicking on the title of the article as well.
iCyan Allias
0


Share this topic:


Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic

1 User(s) are reading this topic
0 members, 1 guests, 0 anonymous users


Enter your sign in name and password


Sign in options
  Or sign in with these services