How could I improve my website

[flexluthor]

That's awesome. I might have to steal a few ideas if that's okay. I did improve my description/ intro on the front page. Also whats the deal with copyright? I thought you had to file things and pay like $80. Can you just put "Copyright © 2015 Whitephoenix. All Rights Reserved." at the bottom?

 

Sure, feel free to dissect the site. As for the copyright, I just added it for the sake of having more content . It holds no value unless registered.

[Guest]

Sure, feel free to dissect the site. As for the copyright, I just added it for the sake of having more content . It holds no value unless registered.

Alright so I added bootstrap and completely overhauled my navbar, without using php is it possible to make the search bar work?

Also not done with the navbar yet, it looks too boring.

[flexluthor]

Alright so I added bootstrap and completely overhauled my navbar, without using php is it possible to make the search bar work?

Also not done with the navbar yet, it looks too boring.

 

Oh I'm sorry I went to bed.

 

You can use google search "http://digitaldrummerj.me/blogging-on-github-part-7-adding-a-custom-google-search/"

 

To make navbars more lively, you could use glyphicons and create transitions on hover for each items including the dropdown but I usually just stick to glyphicons because transitions could get annoying.

[SmashyThePenguin]

Alright, I added to the intro on the first page. Does that make it seem any better? Creating a logo is definitely one of the next steps. I've got some research to do on logos though.

I personally would go with smaller font for the blurb, and put the section for the posts directly below it, since the image in the middle of the page breaks the flow a bit. But what you've done is a big improvement. A new problem is that the page header looks like it's the same size, if not smaller than the link to the post, which divides the page and brings attention away from your header. The new navbar is another major improvement in my opinion. But, another new issue is that your div "jumbotron" is behaving a little oddly with my resolution and when I resize the window to a certain point:

[Blade of Grass]

Also whats the deal with copyright? I thought you had to file things and pay like $80. Can you just put "Copyright © 2015 Whitephoenix. All Rights Reserved." at the bottom?

Copyright is all about who owns the rights to something. In most countries (I can't name one that doesn't off the top of my head), copyright is automatically granted to the creator of works. There's no charge associated with posting a copyright on your website and no need to register it either.

[Guest]

I personally would go with smaller font for the blurb, and put the section for the posts directly below it, since the image in the middle of the page breaks the flow a bit. But what you've done is a big improvement. A new problem is that the page header looks like it's the same size, if not smaller than the link to the post, which divides the page and brings attention away from your header. The new navbar is another major improvement in my opinion. But, another new issue is that your div "jumbotron" is behaving a little oddly with my resolution and when I resize the window to a certain point:

Alright, I made the font a bit smaller, now I need some clarification. You want the page to be arranged to be like this:

- Navbar

-Title

-Blurb

-C++ beginners guide (topics)

- pwd image

- issues, suggestions, watch on github?

 

As for the next suggestion, could you please clarify, I don't understand

And idk whats wrong with jumbotron, its from bootstrap and setup correctly

[SmashyThePenguin]

Alright, I made the font a bit smaller, now I need some clarification. You want the page to be arranged to be like this:

- Navbar

-Title

-Blurb

-C++ beginners guide (topics)

- pwd image

- issues, suggestions, watch on github?

 

As for the next suggestion, could you please clarify, I don't understand

And idk whats wrong with jumbotron, its from bootstrap and setup correctly

That looks better. And yes, I think it would look better that way and maintain flow on the page. 

 

Look at the right side of my screenshot. The div is shooting off to the right, even enough to make the page scroll. It does that for me unless I resize the window down to a square almost. I've tried it in both Chrome and Firefox with the same result.

 

EDIT: In bootstrap.css I would try changing:

.jumbotron .container {  max-width: 100%;

to something around:

.jumbotron .container {  max-width: 50vw;

To get it to the proper width without it shooting off the page.

[Guest]

That looks better. And yes, I think it would look better that way and maintain flow on the page. 

 

Look at the right side of my screenshot. The div is shooting off to the right, even enough to make the page scroll. It does that for me unless I resize the window down to a square almost. I've tried it in both Chrome and Firefox with the same result.

 

EDIT: In bootstrap.css I would try changing:

.jumbotron .container {  max-width: 100%;

to something around:

.jumbotron .container {  max-width: 50vw;

To get it to the proper width without it shooting off the page.

Alright, like this? I honestly kind of prefered the first way myself

 

Also, I have no idea with the jumbotron. It looks fine unless I scale the page down but I'll look into it.

EDIT: I noticed your edit gimme sec.. nope did not work

[SmashyThePenguin]

Alright, like this? I honestly kind of prefered the first way myself

 

Also, I have no idea with the jumbotron. It looks fine unless I scale the page down but I'll look into it.

EDIT: I noticed your edit gimme sec.. nope did not work

Yeah, that looks better to me, but it's your website. It's going to reflect your personality, so if you prefer it the other way, I'd recommend you roll with it.

 

Huh... I thought that would have got it. I would play with the right margin next. Give me a minute and I'll look over the code to see if I can't figure it out.

 

EDIT: I'm on a pretty low-res monitor, I think it's the min-width is just wider than my screen. Try changing:

@media screen and (min-width: 768px) {  .jumbotron {    padding-top: 48px;    padding-bottom: 48px;  }

To a smaller number, or even a perctage/VW.

[Guest]

Yeah, that looks better to me, but it's your website. It's going to reflect your personality, so if you prefer it the other way, I'd recommend you roll with it.

 

Huh... I thought that would have got it. I would play with the right margin next. Give me a minute and I'll look over the code to see if I can't figure it out.

 

EDIT: I'm on a pretty low-res monitor, I think it's the min-width is just wider than my screen. Try changing:

Reverted image thing, idk that didn't work on the jumbotron either

[SmashyThePenguin]

Reverted image thing, idk that didn't work on the jumbotron either

One second. I've almost got it figured out.

 

EDIT: Got it. On line 1597. Change 

@media (min-width: 768px) {  .container {    width: 750px;  }}@media (min-width: 992px) {  .container {    width: 970px;  }

to

@media (min-width: 768px) {.container {    width: 70vw;}}@media (min-width: 992px) {.container {    width: 70vw;}

Or something close. That fixed it for me.

[Guest]

 

Didn't fix it for me.

[SmashyThePenguin]

Didn't fix it for me.

I'm not trying to come off as contemptuous, but did you save your changes? I'm not seeing them, and checking again, changing those values does it every time for me.

[Guest]

I'm not trying to come off as contemptuous, but did you save your changes? I'm not seeing them, and checking again, changing those values does it every time for me.

If I change my window width it does it, I usually don't see it

[SmashyThePenguin]

If I change my window width it does it, I usually don't see it

I played with my zoom a little, I see what you mean. I changed this and it worked.

Line 1607:

@media (min-width: 1200px) {  .container {    width: 1170px;  }

to

@media (min-width: 1200px) {  .container {    width: 70vw;  }

Or whatever width you think looks best

 

Then on 1602:

@media (min-width: 992px) {  .container {    width: 970px;  }

to:

@media (min-width: 70vw) {  .container {    width: 70vw;  }

This keeps it an appropriate size for me no matter what I do with the window size or zoom.

[Guest]

 

I still don't see it.

[SmashyThePenguin]

I still don't see it.

I'll play with it a bit more and get back to you, but I'm sorry, I have no idea. I'm not getting any updates you make when I refresh.

Changing the code from line 1602 to 1610 in bootstrap.css to:

@media (min-width: 70vw) {.container {    width: 70vw;}}@media (min-width: 70vw) {.container {    width: 70vw;}

Fixes it with every window size or zoom.

[Guest]

 

 

Sadly it doesn't for me. this is weird. I might just have to leave it

[Guest]

I found how to fix it courtesy of /r/web_design

[SmashyThePenguin]

I found how to fix it courtesy of /r/web_design

Just to satisfy the curiosity of anyone following this thread, along with my own, could you explain what fixed it for you or share the thread?

[Guest]

Just to satisfy the curiosity of anyone following this thread, along with my own, could you explain what fixed it for you or share the thread?

"Get rid of the div with class="container".

Also, is there any reason you're using width: 85%; on the main_content div? You could give that a class="container"."

[omniomi]

A few things I notice right off the bat:

 

1. You need some additional padding, the content area is cramped:

 

.text-center {    text-align: center;    padding: 50px 0px;}

2. Text-Align: centre doesn't look good, justify will look better. While we're at it lets also increase the paragraph spacing:

 

.text-center {    text-align: justify;    padding: 50px 0px;}.text-center > p {    padding-top: 1em;}

3. "Under construction" and "coming soon" pages look bad and don't do much to actually encourage people to check back. If you do not have content for a page yet then do not create a link to it. Add links to the nav bar once there is content to link to.

[Guest]

 

 

Thanks, I added all that, looks a lot better now.