Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Menu bar for fantasy-based website

Featured Replies

Hi everybody!

I had no concept nor any particular request; it just had to fit the main theme of the website: fantasy, novels and so on.

Actually, it's not my favourite kind of graphic; I prefer a minimal style, so I had to start from a pencil sketch which I exported in photoshop.

Some colours/lights are still to be fixed and text added (I can't find any font I like: I suppose I'm going to make my own).

Cheers :)

post-32127-0-34676000-1361910932_thumb.jpg

ok, nice.

First thing that strikes me is the detailing, it's quite intricate, because you made this from scratch, gotta give you kudos for sure :)

For a header, well I can get it to 46kb exported in .jpg with quality which is fine, so you may find yourself ok for the web with that kind of file size.

Only problem may be putting any html text on the banner, due to the way the inner banner bends/turns...so would defo advise adding text as part of the image.

thanks for sharing.

Edited by SEOLover

I find it really creative and good for a fantasy website ! If I undestand well, you sketched this on a paper, you scanned your drawing and then you tweaked/painted it inside photoshop ? Nice result anyway.

 

I won't be able to advice you a lot on my side for the integration as I'm not yet mastering CSS and HTML 100%, I was about to ask you how would you implement the banner on your website as It's really an intricate header...

 

By the way, does anyone have a nice tutorial to create fantasy webdesign ? With nice ornements and etc !? Verdy detailed like you could see on a MMORPG, If It explains the way to cut and code it, would be awesome as well (i'm asking this because most tutorials I see are about how to make simple layouts).

Edited by Azuk

  • Author

Correct, as you can see from the attachment. I worked just on a half and then flipped it, changing some details. Originally, it was was meant as a frame with an empty canvas inside, but I was asked to make it richer. As Seolover said, I will add titles as part of the image and then I will load it as single sections linking to different parts of the website (I hope my English is good enough to let you understand).

Unfortunately, I can't help you with the tutorials; what can I say is to get inspiration from whatever you think it's useful/you like. For example, armours, castles and so on; even the games you mentioned. Another tip could be that of not to look for fantasy layout tutorials, but simply for fantasy tutorials, and then mix what you got in your designs. This for the graphic part. I'm not a "coder" (is it right?), so I don't know: is "try" a too obvious answer?

 

post-32127-0-15217800-1361984867_thumb.png

Yes adeptumagos, thanks for your answer. I totally agree with you, what I do like the most in these fantasy websites, It's their details, all those ornements and etc... And often I look at this thinking It must be really difficult to code. I should select some of them and try to look carefully to understand the way It's built, but having a full tutorial focused on it would have been awesome.

 

Nice work anyway :)

Edited by Azuk

  • Author

I suppose that if you focused on graphic, you would save a lot of time/work while coding. I mean, working with images is definitely easier than trying to solve all your problems with codes. On the other hand, a too much detailed outcome might be heavy, annoying or almost impossible to code.

A good balance is the best way, even if you lose some of the "wow-effect". Furthermore, last tendences in web-design seem to prefer conceptual or minimal rather than super-detailed approaches.

The new attachment is an example of how details can make you forget that websites are not the main target, but the way to reach a target.

I had to abandon it because not really compatible with the platform it was meant to be built on.

Thanks for this conversation: for my studies, I havent got any chances to talk about graphic nor use English :)

 

Cheers.

post-32127-0-79132900-1362011993_thumb.jpg

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.