Gerry Posted January 14, 2013 Share Posted January 14, 2013 I need to spiff up my html skills and went looking for some user forums to sign up on. I found a couple that are sponsored by software co's, which seem beside the point as far as I'm concerned, but one that wasn't kept giving me an error when I tried to sign up, so later for that! Any suggestions are welcome. Quote Link to comment Share on other sites More sharing options...
itsjustme Posted January 14, 2013 Share Posted January 14, 2013 I like HTML Goodies and the cheat sheets at Webmonkey (they also have tutorials here). Hope that helps, Gerry. Quote Link to comment Share on other sites More sharing options...
Admin Rodney Posted January 14, 2013 Admin Share Posted January 14, 2013 The core site that you should always return to IMO is the WWW Consortium. http://www.w3.org/ This will keep your eye on the standards as you venture forth farther afield. A lot depends on what area you want to focus. They even have some basic tutorials. examples and quizzes: http://www.w3schools.com/html/html_examples.asp Once you identify what you are looking for you can then Google to find the most relevant sites, solutions and information. Quote Link to comment Share on other sites More sharing options...
John Bigboote Posted January 14, 2013 Share Posted January 14, 2013 If I had the time to 'delve-in' on some HTML5 stuff... I would grab(while it's free) Adobe's new Edge Animate product and start going thru their abundant tutorials. Edge is Adobe's HTML5 answer to the universal issues with Flash and iPhones. They are currently developing it (full force) but at this point it is free and highly usable. It's kinda like Flash... a WYSIWYG HTML5 solution. Quote Link to comment Share on other sites More sharing options...
Gerry Posted January 14, 2013 Author Share Posted January 14, 2013 thanks folks! I go to Webmonkey all the time but I was hoping for someplace I could ask dumb questions. I'm having to code an html email which, as one source states, is "like writing html in 1996" because email apps are so horribly uneven at interpreting html...which I found hilarious because that's about where my html skills are stuck; except for learning some css, I stopped learning html in '99 and now I'm thinking it may be time to gear up again so I know what I'm doing sort of! Quote Link to comment Share on other sites More sharing options...
Fuchur Posted January 14, 2013 Share Posted January 14, 2013 thanks folks! I go to Webmonkey all the time but I was hoping for someplace I could ask dumb questions. I'm having to code an html email which, as one source states, is "like writing html in 1996" because email apps are so horribly uneven at interpreting html...which I found hilarious because that's about where my html skills are stuck; except for learning some css, I stopped learning html in '99 and now I'm thinking it may be time to gear up again so I know what I'm doing sort of! In the end it is quite easy: - Use table-layouts. It is horrible for any webdeveloper (like myself) to use them, but it is the only way to get a more or less equal look in any mail-program. (Especially Outlook after 2003 is hard in these aspects... they use Word (WORD!!!!!!) to interpret emails, not even the Internet Explorer (which would be hard enough to cope with...) - You can not use background-images of any kind. Be careful when using background-colors... they may be interpreted, but you should be aware that if not, your font-color may still be interpreted... - If you want to make sure everything is in place, you need to use tables with blank-images, width-properties and style-defintions using inline-styles... (did I mention that I hate email-coding...?) - Of course you can only use standard-fonts like Arial, etc. - You can not use any kind of scripting (javascript, etc.). (which acutally is okay...) - The most reliable way to show images is to embed them in the mail... you can reference them from a webspace, but the user will have to download them activly first. - and the most important thing: Writing HTML-Mails sucks... test it thousands of times with different email-programs and services like hotmail, etc. - if you need to track email-views, you need to reference to a PHP / ASP / (whatever you are using)-parsed image. This is still not very reliable, but it is the best we've got. > If you use embeded images in this situations, it is not possible to do that AND if you use one image which is not embedded, the user will very likely not download images and like that will not access your PHP/ASP/JSP/(whatever)-file, so you cant count him. (just to mention: You should tell him, that you are counting him... depending on the country the receiver is in this may be obligatory... If you've got specific questions, I'll try my best to help you... in the end: Make the email with a very easy, table-conform layout and don't try to make it pixel-conform... you will not be able to do that... even less than in a real browser better to say... Create a layout, which is not depending too much on a certain space... so if the space is 2 pixels less high or higher, it should still work. (you can actually create a layout which works fine for one specific program, but even if you go from Outlook 2003 to Outlook 2007 or Outlook 2010 you will see HUGE differences here...) See you *Fuchur* PS: W3C is not of a bigger use for programming a HTML-E-Mail... any "debracted" or "dont use" can be exactly the opposite in terms of eMail-Programming... Test much and keep in mind: Programming an HTML-Email will take approcimately 2-3 times as long as a normal website of the same type... just because you have to make it work in very different systems... Quote Link to comment Share on other sites More sharing options...
Gerry Posted January 15, 2013 Author Share Posted January 15, 2013 Wow, that's quite a stack of information Gerald! Most of it I've been figuring out over the last week and managing to get it done but it's great to have all this in one place. Now I've been coding the actual newsletter and using css for the first time in ages. It's coming along okay (in fact I just finished it in the last hour) but there's one spacing issue that I just can't resolve. Been looking at it since friday and I'm stumped. If you're *curious*, the newsletter is online at http://www.visualexllc.com/newslettervol2/ClarityVol2.html and the problem is the extra space below the first article title in the "In this issue" sidebar. But only if you're the curious type! Quote Link to comment Share on other sites More sharing options...
Fuchur Posted January 15, 2013 Share Posted January 15, 2013 One problem is here: The first line needs a There is another with some not opened -tags, but they should not resul tin any trouble. To solve your problem you just need to give your around the headline a style="margin: 0px;" Make sure to test your code on several email-clients... in firefox itself it works great, but be sure to test it by sending a testmail to outlook 2010 and outlook 2003. (at least these too). See you *Fuchur* Quote Link to comment Share on other sites More sharing options...
Gerry Posted January 15, 2013 Author Share Posted January 15, 2013 Wow, great catches! Thanks so much, adding the 0 margin worked great. I've been trying to weed out the old font tags and whatnot too, and every time I think I'm done I find some more. Danke! Quote Link to comment Share on other sites More sharing options...
Gerry Posted January 16, 2013 Author Share Posted January 16, 2013 Hey Gerald, I have one more issue that maybe you could look at. The html email is giving me problems in the footer, with spacing etc. and it's different (of course!) in different email apps. I don't know if the problems will be apparent to you, depending on how you view it. In the footer, the blue rule should be flush to the top of the white box. I previously had a blue pixel stretched to fill the space, but in one person's gmail, several spacer pixels disappeared and were replaced with the actual html link code appearing in the layout! Yet it was fine in another person's gmail. (I replaced it with a horizontal rule but the spacing problem either gets worse or stays the same.) Never seen anything like that before. If anything jumps out at you, please let me know. http://www.visualexllc.com/newslettervol2/...Vol2Digest.html Quote Link to comment Share on other sites More sharing options...
Fuchur Posted January 16, 2013 Share Posted January 16, 2013 Hey Gerald, I have one more issue that maybe you could look at. The html email is giving me problems in the footer, with spacing etc. and it's different (of course!) in different email apps. I don't know if the problems will be apparent to you, depending on how you view it. In the footer, the blue rule should be flush to the top of the white box. I previously had a blue pixel stretched to fill the space, but in one person's gmail, several spacer pixels disappeared and were replaced with the actual html link code appearing in the layout! Yet it was fine in another person's gmail. (I replaced it with a horizontal rule but the spacing problem either gets worse or stays the same.) Never seen anything like that before. If anything jumps out at you, please let me know. http://www.visualexllc.com/newslettervol2/...Vol2Digest.html You'd get rid of that problem, if you would delete the and use a style-defintion at the TD there. <td style="border: 0px; border-top: 2px solid #345aa3;">...</td> See you *Fuchur* Quote Link to comment Share on other sites More sharing options...
Gerry Posted January 16, 2013 Author Share Posted January 16, 2013 Thanks, I'll give that a try! So inline styles can be used for emails, but not css? Quote Link to comment Share on other sites More sharing options...
Fuchur Posted January 16, 2013 Share Posted January 16, 2013 Thanks, I'll give that a try! So inline styles can be used for emails, but not css? Inline-style is CSS... most email-clients can handle simple css-commands (dont use position, float, and stuff like that). As I said before. You can try to get it right in most email-client, but not in all... the worst that can happen is, that there is not border... like that you dont have any functional limitations or any informations brought to the user if the border is not used... so in many it will look well and in some programs it will still look okay... that is the best you can strike for, after my experience. Another possibility is, that you accept the space, or you use a own row (tr with all the tds needed) with a small height of 3px and a background-color to make the line. But I would not do that... just not worth it). See you *Fuchur* Quote Link to comment Share on other sites More sharing options...
Gerry Posted January 16, 2013 Author Share Posted January 16, 2013 Thanks again, you helped me make it *better* but it's still off in gmail and a couple of others. I think we're gonna just send it out with fingers crossed. EDIT: I just copied and pasted your first long post into a word doc and I'm saving it! Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.