What is Digg?46 Comments
- cr125er, on 10/12/2007, -4/+69If you get that excited when you see a rounded corner, you must jizz your pants whenever you see a circle.
- mr1337, on 10/12/2007, -3/+26Circles? Where!?
- mightymouse, on 10/12/2007, -3/+16http://www.spiffycorners.com/
http:/www.spiffybox.com/
are your friends. - tlehman, on 10/12/2007, -0/+10neither did I, I think it is because it is such a simple thing, but to implement it takes two and a half hacks to accomplish and thus is impractical for lazy web developers.
- gameguy43, on 10/12/2007, -0/+8i think some of you guys need to RTFA. the discovery was a corner image generator, not an implementation of the images. that topic still up for debate, but it's nifty to be able to use this little script to generate the actual corner images for you so that you don't have to make them individually with photoshop.
- Ninjab3ar, on 10/12/2007, -5/+11I hate it too. You fail at internet.
- ngmcs8203, on 10/12/2007, -0/+6I'll do you one better mightymouse... :)
http://www.smileycat.com/miaow/archives/000044.html
It's a rounded corners "round up". Organizes it by # of images used, javascript y/n and fixed/liquid
spiffy and nifty are great solutions that are also mentioned.
I always refer back to that post. Not my own, but definitely worth a look. - spanner, on 10/12/2007, -0/+5phhh, you call that corners?
I use nifty
http://www.html.it/articoli/niftycube/index.html
It creates corners without graphics. Its grreat, the only time its not good is with a gradient background.
No work, perfect corners. - camsoft2000, on 10/12/2007, -1/+5phhh you call that corners?
try curvy
http://www.curvycorners.net
It creates corners without graphics, supports borders, custom radiuses, optional corners, background images, anti-aliasing, and the corners can float over background images and still anti-alias. - carguy84, on 10/12/2007, -5/+9Yikes ya wow, over engineered for sure. I'd have just created a width-long image since your site isn't stretchy and just capped each section, top and bottom, with the image.
--------------------------------------image----------------------------------------------
content
content
content
content
--------------------------------------image----------------------------------------------
then your code would just be
< div >
< img src="top.gif" />
content
content
content
< img src="bottom.gif" />
< /div >
done. - J3R3MY, on 10/12/2007, -3/+6It's still pretty neat though
- leethefilmer, on 10/12/2007, -2/+5I never understood the hype about round corners on web pages.
- nathanchase, on 05/06/2009, -0/+3phhh, you call that corners?
try Ruzee
http://www.ruzee.com/blog/ruzeeborders/
Border style definition via CSS and CSS-like JavaScript
Anti-aliased rounded corners similar to the successors of Nifty Corners
A symmetric shadow similar to the ones of Mac OS X
Configurable border widths
Outside as well as inside background image support (gradients)
A kind of glow which is based on the shadow feature with a configurable color
A fade effect which lets the border color fade into the background color
All that at every edge/corner or only at some of them
Works on all modern browsers, even Opera and Konqueror
Colors and layout of the borders are defined in the CSS - if JavaScript is disabled your web site looks like its cubistic twin - markmcb, on 10/12/2007, -5/+8I do a lot of web design and rounded corners drive me nuts. A notable project I work a lot on is OmniNerd ( http://www.omninerd.com/ ), and it's riddled with rounded corners. We tinkered with a variety of methods for creating a rounded look. They were all great ideas, but the huge issue was that not all browsers supported them. So we went on and on, until finally we gave up and went with the quite simple, brute-forcish method of inserting in image in the background and separating them with dozens of nested divs. I hate it.
Does anyone know a graceful solution to this (that doesn't require a third party like Google)? - JaffaTheCake, on 10/12/2007, -0/+3@carguy84
You shouldn't use img for design-related imagery. If you're using a fixed width, then all you need is:
Heading
Text
Then have css apply the top corners to the h2, and the bottom corners to the outer div. Easy and semantic. - pengu, on 10/12/2007, -1/+3right. so rather than having a 3k file on your server, you rely on a BETA service from google to produce the most basic of elements. so frickin stupid.
- jmontana66, on 10/12/2007, -0/+2Why? It produces a PNG. Save the image, and reuse it down the road. All you're using Google for is to generate the image once. You're not relying on them to generate it every single time the page gets loaded.
- RyeBrye, on 10/12/2007, -1/+3I like Spiffy corners - it's well written, but I've encoutered a handful of rendering bugs with it. The js is also around 12k - so unless you do a hell of a lot of rounded corners, you aren't saving space compared to images.
Images can also be fetched in separate http requests - so 3 4k gifs / png's can load faster than 1 12k js. - logic, on 10/12/2007, -0/+1Mmmmmh.....spheres.
- ArcheKlaine, on 10/12/2007, -0/+1Now all we need is one of these rounded corner techniques that doesn't require javascript support on the clientside, and I'll use it. Until then, I just keep using CSS hacks and wait for CSS3.
- inactive, on 10/12/2007, -0/+1sorry digg changed the page I was commenting on :/
- apotropaic, on 10/12/2007, -0/+1http://www.html.it/articoli/niftycube/index.html
- xach, on 10/12/2007, -0/+1I'm the guy who got dugg. What are you talking about? I didn't change the page after getting dugg, except to add some new information about the possible color names.
- regtools, on 10/12/2007, -0/+1I'm a big fan of nifty corners
http://www.html.it/articoli/niftycube/index.html - Ikthog, on 10/12/2007, -0/+1Sorry, this is neat and all, but why is this better than just making corner images? All of the approaches I've seen mentioned here or linked from the above article seem like ridiculously complicated methods to produce a simple effect, and they won't help if you're doing anything other than simple solid color rounded corners.
- InsomniaSlim, on 10/12/2007, -0/+1@mourner
Dude... no extra markup?!? Maybe not when you write it, but at runtime there's LOADS of extra, non-semantic markup inserted.
Accessibility (e.g. screen readers) is at runtime... not build time. It's something too many developers forget. Like inserting a DIV into a SPAN with javascript: just because your markup validates statically doesn't mean it's right. - GrahamStw, on 10/12/2007, -0/+1Did anyone try using Zach's (the blog author) own generator?
http://wigflip.com/cornershop/
Works pretty well for me. - FunkyG, on 10/12/2007, -0/+1I have tried various for a site I am working on at the moment. Firefox is easy, but IE6 makes things difficult. If you can live with square IE6 corners use the border-radius command. Otherwise you might have to do it the hard way. If you are feeling lazy, try http://www.neuroticweb.com/recursos/css-rounded-box/. This produces images, css and html for you.
- nathanchase, on 05/06/2009, -1/+2Ruzee.Borders works better than any other solution I've come across. Highly recommended.
http://www.ruzee.com/blog/ruzeeborders/ - dylanparry, on 10/12/2007, -0/+1I'd very weary of using Google for something like that. Obviously they have never published it as a service, so one should assume it is only for their own use. They could withdraw it at any time, which would leave any design based on it pretty much screwed.
- dotlizard, on 10/12/2007, -2/+3the dojo library, for 1. dojotoolkit.org, i believe.
any other of a half dozen (or more!) other javascript libraries out there, just ... well, google javascript library rounded corners.
google had to figure in somehow. it always does. - dylanparry, on 10/12/2007, -0/+1@jmontana66: That would be the best way to do it, but then it's no different than using your own graphics package to do exactly the same. The beauty of using such a system is that the graphics would be generated dynamically without you having to create and upload a new set of corners every time you want a different coloured box. Of course, the ideal situation would be to create your own program that could make the images on your own server rather than Google's so that you could do just that without relying on a third party.
The actual example images in the article, for example, are directly linked to the Google script, which is how (in the ideal world) folk would want to do it. Why would you want to deal with multiple image files when you could just have them dynamically created from one script? - dep01, on 10/12/2007, -0/+1@carguy: kinda limiting from a scalability perspective, no?
- JaffaTheCake, on 10/12/2007, -0/+1ah, the above is supposed to be
<div class="article">
<h2>Heading</h2>
<p>Content</p>
</div> - mourner, on 10/12/2007, -1/+1Take a look at this (a rounded corners solution by Roger Johansson):
http://www.456bereastreet.com/archive/200505/transparent_custom_corners_and_borders/
http://www.456bereastreet.com/archive/200609/transparent_custom_corners_and_borders_version_2/
It's a wonderful semantic, standards-compliant solution with no extra markup and graceful degradation. As a developer at XHTMLized I use this technique a lot. - danhigham, on 10/12/2007, -0/+0but if you think about it would be trivial to write something in ruby using rmagick to do the exact same thing... and you wouldn't need to connect to google everytime you wanted to display one.
- itsmattadams, on 10/12/2007, -2/+2I also recommend spiffycorners.
- mydave, on 07/31/2008, -0/+0I do the same if I'm finding in internet something that is interested me!
http://www.ksusg.com
http://www.toomeyfund.com
http://brucepearlissatan.com/2007/04/sanjaya-malak ... - inactive, on 10/12/2007, -0/+0Live journal (and other blog types) are blocked from work. Anyone care to link to the google service mentioned in the article instead of linking to a blog that mentions it?
-thx - inactive, on 10/12/2007, -1/+1This is obvious. Notice how they made the first page an advertisement as soon as they got Dugg. SPAM!
- theonesteve, on 10/12/2007, -0/+0Geek fight!
*gets out the popcorn and settles in* - praisethelard, on 06/06/2008, -7/+5Square corners are so Web 1.0
- mr1337, on 10/12/2007, -6/+0Nice.
- joepaterno, on 10/12/2007, -8/+2Slow night on digg I guess.
- stockjones, on 10/12/2007, -8/+1Ooh corners. Can I whack off to the next web 2.0 hyper trend. Sometimes web techys are such bandwagon fodder.
- cybertrip, on 10/12/2007, -11/+1can be simply done using photoshop and tables or divs if you prefer like we did on this site
http://traditiona.com/shop.html
© Digg Inc. 2009
— Content created and posted by Digg users is