Member Avatar for zack654

I have problems to find inspiration in making simple designs. It's so anoying, I lose lot of time messing with styles instead of writting php code.

Are there any tricks that people do to make design better and make quick layout. I don't look for something special, just simple design. But when I make it looks so ugly that I decide to start over.

  • 5 Contributors
  • 5 Replies
  • 367 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by Helianthus

Dani AI

Generated

Lack of inspiration for simple templates is a common snag for backend-focused developers. Several replies here lean toward looking at existing themes and thinking like a user; building on that, the fastest win is a tiny, repeatable “starter kit” that turns a good idea into something that can be pasted into every project without redoing the basics. Mentioning , , and : their instincts are right — convert inspiration into a small set of rules and components instead of hunting for a perfect page.

A compact, time-boxed workflow that repeatedly works well:

  • 5 minutes: sketch content blocks on paper (header, primary action, content, sidebar, footer).
  • 10–15 minutes: write semantic HTML skeleton for those blocks.
  • 10 minutes: drop in a minimal base CSS (variables, box-sizing, max-width).
  • 15–30 minutes: style three core components (navigation, a content card, a button/form).
    Keep iterations short. That prevents endless fiddling and makes the PHP work visible inside real layouts.

A paste-in CSS starter (very small) that saves hours:

:root{
  --base:16px; --gap:16px; --max:1100px; --brand:#1167b1; --muted:#666;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;font-family:system-ui,Arial,sans-serif;font-size:var(--base);line-height:1.45;color:#222;padding:var(--gap)}
.container{max-width:var(--max);margin:0 auto;padding:0 var(--gap)}
.grid{display:grid;grid-template-columns:1fr 320px;gap:calc(var(--gap)*1.25)}
.btn{background:var(--brand);color:#fff;padding:8px 14px;border-radius:6px;text-decoration:none;display:inline-block}

Practical rules to avoid redesign loops: limit fonts to two, pick one accent color plus neutrals, use an 8px spacing rhythm, keep semantic class names, and record every small pattern in a single file (a micro-pattern list). Add basic accessibility checks—contrast and visible focus—so “simple” stays usable. This turns the inspirations mentioned earlier into a repeatable workflow rather than another fresh start.

Recommended Answers

All 5 Replies

Member Avatar for JorgeM

Not everyone can be a good web designer and web developer...as a matter of fact most arent great at both.

If you host your site with a provider, most of them give you templates included. Alternatively, there are sites on the internet that have templates...some free, some will ask for a nominal fee.

If you find a site you like, you can always right click on the browser, and view the source code to help you with some ideas.

Member Avatar for lps

Ok, I understand your problem as I am poor in designing job myself. This is what I do when I faced similar question -
1. go to Themeforest or any site that sell themes
2. have a brief scroll through of design layout and pattern
3. design own.
But, PLEASE do not copy anything directly unless it is really free for use with no condition. Most of them are copyright protected.

Member Avatar for stultuske

imagine yourself as user. how would you want the menu's to be ordered, at which place?
start from there: both functionality and user-friendly material, and go "idea shopping", as lps already sugggested: don't try to re-invent the wheel here. chances are, there are tons of sites like yours.
check those out, see what you like, and what you would improve to your needs.

Member Avatar for zack654

thanks guys this is very useful

Member Avatar for Helianthus

I agree with IPS. I have been designing for years and often get designer block. Surfing through some template sites is a great way to get inspiration.

Some points I always try to remember when designing are:
1. Make sure that your site is user intuitive. In otherwords, don't make them guess which link/button they need to click to get where they want to go in your site. It should be painfully obvious to them.
2. The links should go where they say they are going to go. For example, a link that reads "contact us" should take your visitor to a page with contact information and/or a contact form. Not to an intermediary page that tells them why they should contact you, etc.
3. Keep your logo at the top of the page, preferably to the left. It sounds boring, but that is where your visitor expects to see it. If it is not, it will throw them off and make the page feel chaotic to them.
4. Use white space.

I hope these tips help. Good luck.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.