< em > vs. < i >

Use <em> rather than <i> when you want to italicize something. It’s the accepted standard now.

< strong > vs. < b >

Use <strong> rather than <b> when you want to bold something. It’s the accepted standard now.

images

Image Size

We use three sizes/formats 95 percent of the time (please do not deviate from them):

500px HORIZONTALLY ORIENTED run the full width of the entry. Do not use anything larger than 500px, as it will break the layout. Keep them as shallow as possible, avoiding heights of more than 375px. (If you’re starting with a standard image size produced by most cameras, reducing an image size proportionally to 500px wide should scale the height to 375px automatically. But any crops you can do to decrease the height are appreciated.)

250px HORIZONTALLY ORIENTED images are floated to the right of the entry. (More on how to do this later.)

200px HORIZONTALLY or VERTICALLY ORIENTED pix are also floated right within the entry.

Use your judgment as to whether you want to do 250px or 200px for horizontally oriented images. We generally prefer 200px images unless it’s difficult to “read” what’s going on in the image at 200px width.

Other sizes exist but are used in special situations (This applies mostly to queue editors):

150px-WIDE BOOK COVERS are used for books and are floated right.

40px SQUARE are used for our “Quick Bites” entries and are floated left.

File Size

Optimize your images for the web before uploading them. To keep load times short on our pages, we shoot for images of no more than 50k in size. If you have Photoshop, use the Save for Web & Devices option to optimize your image.

If you don’t have Photoshop, there are a couple of web-based options: Picnik.com and Snipshot.com

Image File Names

Please use the following convention: YYYYMMDDimagename.jpg or YYYYMMDDimagename.gif or YYYYMMDDimagename.png

Example: 20090204pizzaslice.jpg

link text, length of

Once upon a time there was a little blogger named Goldilinks. She went for a surf on the web. Pretty soon she found an awesome news nugget she wanted to share with her readers.

First she wrote her link like this: <a href=”URL”>Here</a> is a yummy recipe for porridge that is neither too hot nor too cold but just right.

But that link was too short and didn’t offer the reader much of a target to click on or send much of a cue as to what she was linking to, she thought, so she tried again: <a href=”URL”>Here is a yummy recipe for porridge that is neither too hot nor too cold but just right.</a>

But that link was too long and created so much blue link text that it looked strange, she thought, so she tried again: Here is a <a href=”URL”>yummy recipe for porridge</a> that is neither too hot nor too cold but just right.

Her third link was just right, she thought, so she checked her spelling once more, checked her URL basename, made sure all her links were working, and hit “Publish.”

spaces, within HTML coding

Watch your use of spaces within HTML coding.

No: Eater <a href=”URL”>reports that </a>David Chang scratched his balls today.
Yes: Eater <a href=”URL”>reports that</a> David Chang sneezed today.

In the case above, the errant space will yield a sloppy-looking link, leaving a little bit of underlining between that and David:

Eater reports that David Chang sneezed today.

I often see this with <em> and <strong> coding, too. Admittedly, it’s less critical in those instances, but you might as well watch your HTML there, too, as laziness in one area begets laziness in others.

tagging

Use plurals: bakeries, not bakery; hot dogs, not hot dog; knishes, not knish. Capiche?

For location-based (esp. SE:NY site), include restaurant/shop name, neighborhood, and borough. Also include tag for whatever the recommended dish/item there is. Ex.: Magnolia Bakery, bakeries, cupcakes, Greenwich Village, Manhattan