Welcome!

Join our community of MMO enthusiasts and game developers! By registering, you'll gain access to discussions on the latest developments in MMO server files and collaborate with like-minded individuals. Join us today and unlock the potential of MMO server development!

Join Today!

[suggestions] to help improve the website

Initiate Mage
Joined
Jan 15, 2018
Messages
3
Reaction score
0
I built this new website ,
and am looking to improve it when it comes to responsive on different screens so please can u check the layout on your screen and tell me if anything looks wrong and the size of your screen and thanks that will help me a lot
 
Elite Diviner
Joined
Apr 4, 2011
Messages
464
Reaction score
69
Okay theres lots of things that are wrong here. I'm not going to critique your design, but I recommend redoing it.

None of you page is align at all. Your main content inside the "big_wrapper" is all to the left.

Wrappers are used to contain content inside, normally contain them and center them. Which means you need to pick a width that is commonly used. It all depends on your design. Some common ones are 960px, all the way up to 1200px. Or you could simply use percentages to help with responsive design.

You will also notice a some of your divs have 0 height. Simple way to fix this is by using
overflow: hidden
. "mobrec" and "pagination" have this problem.

Also your borders aren't showing on the right of your content because you have a width 96% on them for some reason. You don't need to do this.

HTML already has preset tags for page layout. I highly suggest you start using them.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<header></header>
<main></main>
<footer></footer>

</body>
</html>

The way I always work is, mobile first. I always design my websites mobile first and work my way up to desktop. There are a few reasons lots of people do this. If you have a very complex desktop sized website, you are going to be spending a lot of time trying to get it to work on mobile. Most people view the internet on their mobile devices now, so it makes sense to design your websites for them first. Thats only my opinion tho, people like to work in their own way and prefer desktop first over mobile. Its all up to you.

Looking at your mobile version, your container isn't fullwidth, you need to do that. Mobile websites are meant to be 100%, think of your phone edges as your new container. Its okay if your content has padding so its not touching the phone edges, but you want your wrapper to be 100%.

Also keep in mind that your hover effects don't work on phones, so you can remove these too. People of phones don't press and hold on buttons or images, they tap it once.

There are lots of little things that need a lot of work, but thats mainly due to your design and honestly, its not worth giving you design tips for this particular website. You're better off scraping it and starting again, and I don't mean that in a disrespectful way. I suggest you look at other websites similar to yours and get an idea of how they layout and design their websites
 
Back
Top