DanRabbit's avatar

Midori URL Bar

By DanRabbit
47 Favourites
Having a think about Midori's URL bar.

The paste icon is for an existing Midori feature called Paste-n-Go. You click that icon to paste whatever is in the clipboard and go :)


Updated a little bit to take into account some of your suggestions :)
Image size
744x770px 104.39 KB
© 2011 - 2021 DanRabbit
anonymous's avatar
Join the community to add your comment. Already a deviant? Log In
opensas's avatar
I wonder if the forward button is really needed. I only use the back button...
devbur's avatar
I just think that that red bar is a little bit annoying!
DanRabbit's avatar
It should be! It means you are browsing an insecure website.
dreamnymph's avatar
where is my new minimize maximize buttons?
DanRabbit's avatar
minimize is gone, but maximize is right side.
spktkpkt's avatar
Looks better, well done!
jxtreme42's avatar
Ah, you beat me to it. I really need to start mocking up my ideas...

Using a white bg for the autocomplete "menu" looks better/makes the text look more visible/allows diff formatting (partitally transparent, etc.) Keep the white menu! I'd move the grey pagetitle to after the url ("elementaryos.org <grey>It's Here - elementary OS</grey>") When the window is maximized (and it is 99% of the time), you'll have to look wayyy over to the right to see it, also when things are that far apart it's hard to distinguish which entry on the left corresponds to the entry on the the right, etc. Also, use autofill or whatever it's called: like Chrome, highlight the first entry in the suggestions and add the rest of the url/suggestion to the entry. (URL bar: "elemen<grey>taryos.org</grey>") This way, I can type "ele" and press enter to get to elementaryos.org, if it's my most visited site that begins with that. (Super fast :)) I'd also allow autocompleting the page titles (I type "disc," URL bar: "elementaryos.org <bold, also dark grey>disc<bold, dark grey><grey>over</grey>") This means making the "unmatched" parts of suggestions un-bolded, and the matched parts bolded. Also, load search engine (google) results into the suggestions: it's super convenient and saves time (usually the site I want is in the first ~4 search results.) Adding on to that last sentence, "search with ..." should be the first result for a query that doesn't match pages in your history/bookmarks, not the last result. I can't think of a time when I've entered a non-history/bookmark query and I didn't want to for search it.

Those added toolbar icons get me to another subject. I'm really leaning towards monochrome toolbars. When you have a few toolbar icons (like here) color isn't needed to distinguish between buttons; shapes are sufficient. Also, it reduces visual noise/clutter, and gives the focus to the content. Color should be used as an effective indicator, (monochrome) panel icons show this very well; adding color to everything subtracts from that. The only real (visual) issue is that it'd make the window controls look odd, but maybe it could be done so that doesn't happen? Or maybe it's just me :)

I was really trying to keep this comment short... :P
doctormo's avatar
Should the http padlock be green? That's insecure, over the wire submission of clear text http isn't it.
DanRabbit's avatar
oops, typo. that should read https of course.
BassUltra's avatar
For the insecure lock, I think it would be more correct if the lock was the other way, because all other similar locks in the real world open from the right. :P
mbarvian's avatar
Looking good. If only we can get Christian to make it look like that
ArkBlitz's avatar
And what if you have more than a search engine? You would need more than one menu entry for that then!
DanRabbit's avatar
Yes, this is definitely not indicative of all the possible options. As of now, Midori shows all the search engine options at the bottom.
Eurux's avatar
Nice, nice.
SerenadeOmega's avatar
I don't like how the refresh button is all the way on the right side like that. I also think that it's too small. However, I do like how minimal it is. Less clutter is indeed good.
saransh50's avatar
thats pretty good but if midori isnt packed with features i m not gonna make a switch despite an awesome UI
ajrpai's avatar
dan, theres two things i need to ask you.

firstly, congratulations on the accomplishment of your baby (elementary project: jupiter). ur designs rock! i am learning a lot from you... thanx!

now, the doubts

question 1 - Midori - can one change the appearance of webpages completely, i mean... w.r.t the fonts like in Mozilla, one can set a font in the Content tab & choose to ignore the webpage font. I as a person am more elevated towards the look of the pages. can that be done? i tried going through the Preferences of Midori, however didn't find anything there.

question 2 - Elementary OS - 'However, a free download will be available in March for all of those people who choose not to offer their support. (Did that last sentence make you feel bad?)' this sure made me feel bad. i don't have money as of now as i'm just starting a business. from whatever i earn, my first donation would undoubtedly be to Jupiter. please can u tell me when in march is Jupiter's release date, the wait is killing me...

thanx man! keep up the good wrk!
tc & godbless...
mrclassical's avatar
Dan, the Elementary project shows an attention to detail that continues to amaze me. I really love this idea (along with "Wingpanel" and "Plank", +1 for using Vala!). I mean, you even thought of a "paste" button on the empty URL bar. That's genius. I love the use of red for insecure sites; I tend not to notice the insecure logo in Firefox.

Several questions:

1. When are you removing the search bar in Midori? The last version I tried still had two bars. :-(

2. You use the "do not enter" symbol on a lot of mockups. [link] As a user, I find this icon extremely confusing; it's pretty unintuitive as to what it does. You are apparently using it as a "delete" button in Dexter, but I think something like a trash bin would suit the purpose better.

3. On your last desktop mockup (see the above link), the "places" dock was missing. Is it still in the latest versions of Elementary? I really, really like the idea because I can get instant access to the folders I use the most.

4. Any more news on when Jupiter will be done? I'm going to buy it, I promise, but my laptop has been out for months, so I've been stuck on Windows (shudder) for a while.
mrclassical's avatar
Didn't see the "existing Midori feature" thing. :-)

One thing I like about Firefox's implementation is that I can click on the "secure" button and see the certificate information.
ArturoIlhuitemoc's avatar
Paste and Go: Right click on the URL bar. It should be the last option.
ArturoIlhuitemoc's avatar
One thing that confuses me with the current Midori is that while it's loading, the progressbar color is exactly the same as selected color, so I can't select part of the URL (well, I can, but I don't see what I've selected)
DanRabbit's avatar
I'll see if there is a way to work around this, but I think it's actually just how the widget is drawn in Murrine/GTK.
NicePics13's avatar
Yeah, I think the later (GNOME >2.30) gtk2-engines themes separate progressbar/selected color.
anonymous's avatar
Join the community to add your comment. Already a deviant? Log In