Keynote Kung-Fu: Wireframe Toolkit for Keynote
7 weeks ago by sunpig
Use Keynote to create wireframes and clickable prototypes for the web and mobile devices.
keynote
wireframe
prototype
diagram
draw
presentation
tool
library
shape
image
design
ux
7 weeks ago by sunpig
Media Query & Asset Downloading Results | TimKadlec.com
7 weeks ago by sunpig
If you’re going to hide a content image, you’re not going to be able to do it by setting display:none. I recommend using a Javascript or server-side based approach instead.
If you want to hide a background image, your best bet is to hide the parent element. If you can’t do that, then use a cascade override (like test five above) and set the background-image to none when you want it hidden.
For swapping background images, define them both inside of media queries.
timkadlec
mediaquery
screen
image
responsive
css
html
frontend
optimization
If you want to hide a background image, your best bet is to hide the parent element. If you can’t do that, then use a cascade override (like test five above) and set the background-image to none when you want it hidden.
For swapping background images, define them both inside of media queries.
7 weeks ago by sunpig
We're in an icon-sharpness limbo | simurai
9 weeks ago by sunpig
With the rise of Retina displays people are looking for resolution independent alternatives to PNG icons. Some fell in love with font-icons, some are shouting “SVG”. But I’m sorry, if you’re looking for a silver bullet, I’m afraid it doesn’t exist.
icon
font
svg
png
graphic
image
sharpness
hinting
pixel
blur
webdev
frontend
optimization
9 weeks ago by sunpig
An Example of Photography on the Retina Display - Duncan Davidson
10 weeks ago by sunpig
Also, high-res photos on the new iPad are just wow.
progressive
jpeg
image
retina
hd
photo
ipad
display
sharp
blurry
sharpness
10 weeks ago by sunpig
How to work around the Mobile Safari image resource limit
10 weeks ago by sunpig
Because of the memory available on an iPad or iPhone, Mobile Safari has much stricter resource limits than most desktop browsers.
One of these limits is the total amount of image data that can be loaded on a single HTML page. When Mobile Safari has loaded between 8 to 10 MB of image data it will simply stop displaying any more images. It might even crash.
safari
mobile
ios
ipad
iphone
webkit
resource
limit
image
size
html
webdev
frontend
constraint
One of these limits is the total amount of image data that can be loaded on a single HTML page. When Mobile Safari has loaded between 8 to 10 MB of image data it will simply stop displaying any more images. It might even crash.
10 weeks ago by sunpig
WebKit Limit on Retina JPG Image Display - Duncan Davidson
10 weeks ago by sunpig
While doing some homework this evening on how to best display Retina-resolution photographs on the new iPad for future updates to both this and the Luma Labs sites, I ran into a frustrating problem. Relatively small high-resolution images—such as John Gruber’s Daring Fireball logo—work great. But 2000-pixel wide photographs failed miserably and ended up looking worse than the 1000-pixel wide images they were replacing in my test pages. Much worse, in fact.
webkit
retina
image
scale
jpg
png
limit
ios
safari
web
webdev
frontend
10 weeks ago by sunpig
This is brilliant. This man should be encouraged to enter sho... on Twitpic
11 weeks ago by sunpig
RT @StephenMilnes: This is brilliant. This man should be encouraged to enter shops, not banned.
funny
shopping
image
picture
11 weeks ago by sunpig
the Performance Golden Rule | High Performance Web Sites
february 2012 by sunpig
Steve Souders (@souders) revisits the web Performance Golden Rule: (TL,DR: FRONTEND)
souders
performance
wpo
optimization
frontend
dev
js
javascript
css
image
speed
february 2012 by sunpig
Best Practices for Getting Started with SVG - IEBlog - Site Home - MSDN Blogs
november 2011 by sunpig
"Best Practices for Getting Started with SVG" I need to get more into SVG.
svg
browser
html5
html
webdev
incoude
introduction
image
path
scalable
from twitter
november 2011 by sunpig
Device detection as the future friendly img option « Cloud Four
october 2011 by sunpig
RT @grigs: Device detection as the future friendly img option
cloudfur
jasongrigsby
grigs
responsive
image
img
tag
solution
device
detection
october 2011 by sunpig
Form Meets Function: Extreme Makeover QR Code Edition « « Digital Connections - 360i Blog, Digital Marketing Agency Digital Connections – 360i Blog, Digital Marketing Agency
october 2011 by sunpig
Images in QR codes: (/via @iamtef /cc @flightresponse @xBora)
image
qr
code
design
picture
digital
scan
vision
october 2011 by sunpig
Responsive IMGs Part 3 — Future of the IMG Tag « Cloud Four
october 2011 by sunpig
RT @grigs: New blog post: Responsive IMGs Part 3 — Future of the IMG Tag
image
responsive
adaptive
resolution
density
layout
html
img
design
mobile
jasongrigsby
grigs
cloudfour
from twitter
october 2011 by sunpig
Responsive IMGs Part 2 — In-depth Look at Techniques « Cloud Four
october 2011 by sunpig
"Responsive IMGs Part 2 — In-depth Look at Techniques" Great article by @grigs
image
responsive
adaptive
resolution
density
layout
html
img
design
mobile
jasongrigsby
grigs
cloudfour
from twitter
october 2011 by sunpig
Rendering Synthetic Objects into Legacy Photographs on Vimeo
september 2011 by sunpig
RT @alexdbird: Never trust a photograph again! This is pretty amazing:
video
3d
synthetic
image
legacy
lighting
photograph
2d
render
siggraph
from twitter
september 2011 by sunpig
Photojojo » The Best Free Photos on the Web (Where to Find Them and What to Do With Them)
june 2009 by sunpig
(via <a href="http://www.mikeindustries.com/blog/archive/2009/06/the-best-free-photos-on-the-web-where-to-find-them-and-what-to">Mike Davidson</a>)
photos
image
history
free
license
resource
stock
library
libraryofcongress
smithsonian
nasa
june 2009 by sunpig
Assetylene | MovableType.org - Home of the MT Community
january 2009 by sunpig
"Adds the ability to use a custom template module to control the insertion of assets into a post. It also offers a new field for entering a custom caption when inserting the asset."
html
mt
movabletype
image
template
cms
module
plugin
bradchoate
asset
caption
january 2009 by sunpig
related tags
2d ⊕ 3d ⊕ 3ds ⊕ @media ⊕ a11y ⊕ aarongustafson ⊕ accessibility ⊕ acorn ⊕ adactio ⊕ adaptive ⊕ address ⊕ adjust ⊕ advertising ⊕ after ⊕ ajax ⊕ akamai ⊕ ala ⊕ algorithm ⊕ alistapart ⊕ alt ⊕ amazon ⊕ amazonws ⊕ analytics ⊕ android ⊕ animate ⊕ animated ⊕ animation ⊕ any ⊕ apache ⊕ apple ⊕ art ⊕ artifact ⊕ aspect ⊕ asset ⊕ background ⊕ backup ⊕ ball ⊕ bandwidth ⊕ base64 ⊕ batch ⊕ before ⊕ bezier ⊕ big ⊕ binary ⊕ bing ⊕ bitmap ⊕ bleed ⊕ blog ⊕ blur ⊕ blurry ⊕ boot ⊕ border ⊕ bradchoate ⊕ broken ⊕ browser ⊕ browsers ⊕ bug ⊕ business ⊕ c ⊕ cabel ⊕ cabelsasser ⊕ cache ⊕ canvas ⊕ caption ⊕ capture ⊕ challenge ⊕ chrismills ⊕ clip ⊕ clipboard ⊕ clone ⊕ cloud ⊕ cloudfour ⊕ cloudfur ⊕ clumsylizard ⊕ cms ⊕ code ⊕ codinghorror ⊕ color ⊕ colour ⊕ command ⊕ communication ⊕ compare ⊕ compress ⊕ compression ⊕ computer ⊕ constraint ⊕ content ⊕ contrast ⊕ convert ⊕ convert_options ⊕ cool ⊕ copyright ⊕ corbis ⊕ corner ⊕ criticism ⊕ crop ⊕ css ⊕ css3 ⊕ cssembed ⊕ curve ⊕ datauri ⊕ daveshea ⊕ decision ⊕ demo ⊕ density ⊕ depth ⊕ derekpowazek ⊕ design ⊕ desktop ⊕ detection ⊕ dev ⊕ development ⊕ device ⊕ deviceatlas ⊕ diagram ⊕ diffusion ⊕ digital ⊕ disabled ⊕ disk ⊕ display ⊕ div ⊕ dns ⊕ document ⊕ domain ⊕ download ⊕ draw ⊕ drawing ⊕ drawit ⊕ drop ⊕ dummy ⊕ dynamic ⊕ edit ⊕ editing ⊕ editor ⊕ effect ⊕ element ⊕ email ⊕ encode ⊕ encoding ⊕ enhance ⊕ enhancement ⊕ ethanmarcotte ⊕ etsy ⊕ execcommand ⊕ exposure ⊕ extract ⊕ eye ⊕ face ⊕ faces ⊕ facial ⊕ fahrner ⊕ fees ⊕ figure ⊕ filament ⊕ file ⊕ fill ⊕ filter ⊕ filters ⊕ firefox ⊕ fix ⊕ flash ⊕ flickr ⊕ flood ⊕ flow ⊕ flowchart ⊕ fluid ⊕ font ⊕ foreground ⊕ fork ⊕ free ⊕ frontend ⊕ ftp ⊕ fullscreen ⊕ funny ⊕ gallery ⊕ ganglia ⊕ generator ⊕ getty ⊕ ghost ⊕ gif ⊕ google ⊕ gradient ⊕ graphic ⊕ graphics ⊕ graphicsmagick ⊕ grigs ⊕ group ⊕ guypod ⊕ hack ⊕ hard ⊕ harddisk ⊕ hd ⊕ hdd ⊕ header ⊕ hide ⊕ high ⊕ hinting ⊕ history ⊕ holyshit ⊕ hosting ⊕ hover ⊕ htaccess ⊕ htc ⊕ html ⊕ html5 ⊕ http ⊕ huge ⊕ icon ⊕ iconfinder ⊕ icons ⊕ identify ⊕ identity ⊕ ie ⊕ ie6 ⊕ ie9 ⊕ image ⊖ image-set ⊕ imagemagick ⊕ imagequality ⊕ images ⊕ img ⊕ incoude ⊕ indent ⊕ indicator ⊕ internet ⊕ internetexplorer ⊕ introduction ⊕ invert ⊕ ios ⊕ ip ⊕ ipad ⊕ iphone ⊕ iphoto ⊕ jasongrigs ⊕ jasongrigsby ⊕ java ⊕ javascript ⊕ jeffatwood ⊕ jeremykeith ⊕ jonhicks ⊕ jpeg ⊕ jpg ⊕ jps ⊕ jquery ⊕ js ⊕ keynote ⊕ layout ⊕ legacy ⊕ legal ⊕ library ⊕ libraryofcongress ⊕ license ⊕ lighting ⊕ limit ⊕ lipsum ⊕ load ⊕ localstorage ⊕ login ⊕ logo ⊕ loremipsum ⊕ management ⊕ manipulation ⊕ max ⊕ max-width ⊕ media ⊕ mediaqueries ⊕ mediaquery ⊕ memory ⊕ messaging ⊕ microsoft ⊕ misc ⊕ mobile ⊕ model ⊕ module ⊕ movabletype ⊕ mozilla ⊕ mpo ⊕ ms ⊕ mt ⊕ mulitple ⊕ music ⊕ nasa ⊕ neat ⊕ network ⊕ nicholaszakas ⊕ nifty ⊕ nihilogic ⊕ nike ⊕ nintendo ⊕ noise ⊕ noscript ⊕ object ⊕ object-fit ⊕ ocr ⊕ office ⊕ offset ⊕ online ⊕ opacity ⊕ opensource ⊕ optimisation ⊕ optimization ⊕ organization ⊕ osx ⊕ paciello ⊕ paint ⊕ paperclip ⊕ paperless ⊕ parallax ⊕ parallel ⊕ path ⊕ pc ⊕ pdf ⊕ performance ⊕ perl ⊕ phone ⊕ photo ⊕ photograph ⊕ photography ⊕ photos ⊕ photoshop ⊕ php ⊕ picasa ⊕ picture ⊕ pixel ⊕ placeholder ⊕ plugin ⊕ png ⊕ polaroid ⊕ position ⊕ preload ⊕ presentation ⊕ printing ⊕ privacy ⊕ problem ⊕ process ⊕ productivity ⊕ program ⊕ programming ⊕ progress ⊕ progressive ⊕ proposal ⊕ prototype ⊕ pseudo ⊕ punypny ⊕ qr ⊕ query ⊕ rage ⊕ rails ⊕ raindrop ⊕ raphael ⊕ raster ⊕ ratio ⊕ recognition ⊕ reddit ⊕ redirect ⊕ render ⊕ replacement ⊕ resize ⊕ resolution ⊕ resource ⊕ response ⊕ responside ⊕ responsive ⊕ retina ⊕ reverse ⊕ rounded ⊕ ruby ⊕ run ⊕ rwd ⊕ s3 ⊕ safari ⊕ save ⊕ scalability ⊕ scalable ⊕ scale ⊕ scan ⊕ scanner ⊕ screen ⊕ screenshot ⊕ script ⊕ scroll ⊕ search ⊕ sencha ⊕ serialize ⊕ server ⊕ service ⊕ services ⊕ shadow ⊕ shape ⊕ shard ⊕ sharding ⊕ sharp ⊕ sharpness ⊕ shopping ⊕ siggraph ⊕ simple ⊕ simplicity ⊕ sixpart ⊕ size ⊕ slides ⊕ small ⊕ smashing ⊕ smithsonian ⊕ smushit ⊕ software ⊕ solution ⊕ souders ⊕ space ⊕ speed ⊕ spinning ⊕ split ⊕ sprite ⊕ spriteme ⊕ sprites ⊕ src ⊕ stack ⊕ stage ⊕ static ⊕ statistics ⊕ stereo ⊕ stevefaulkner ⊕ stevesouders ⊕ stock ⊕ storage ⊕ stroke ⊕ style ⊕ sumo ⊕ surveillance ⊕ svg ⊕ svgweb ⊕ swfir ⊕ swiffer ⊕ syn ⊕ synthetic ⊕ tag ⊕ technique ⊕ technology ⊕ template ⊕ text ⊕ thoughtbox ⊕ throbber ⊕ tidy ⊕ time ⊕ timkadlec ⊕ tinysrc ⊕ tool ⊕ transition ⊕ translate ⊕ typepad ⊕ ui ⊕ unique ⊕ unix ⊕ upload ⊕ uploader ⊕ ux ⊕ vasilis ⊕ vector ⊕ vestor ⊕ video ⊕ visible ⊕ vision ⊕ visualization ⊕ vladimirvukicevic ⊕ wait ⊕ waiting ⊕ waterfall ⊕ wave ⊕ web ⊕ webdesignshock ⊕ webdev ⊕ webkit ⊕ webp ⊕ webstandards ⊕ wide ⊕ widget ⊕ width ⊕ window ⊕ windows ⊕ wireframe ⊕ wpo ⊕ wpochat ⊕ wrap ⊕ wurfl ⊕ xhtml ⊕ zoom ⊕Copy this bookmark: