Web development/SEO site of the day from
- Kelli
Today’s topics are SEO/Web development and testing, and animated GIFs. Here is Google's SEO Starter Guide.
And in connection with @font-face here is the Google fonts site (not easy to find). See Technical Considerations (or textbook p. 277) for a piece of the actual CSS. The syntax is like this:
@font-face {
font-family: 'WeirdFont' ;
src: url('http://somewebfontrepository.com/font?%^&%&^') format('truetype'), url('another font from somewhere') format ('woff') ;
}
Other font formats include EOT, WOFF (expected to be the new standard) OTF, SVG.
Then you declare the font-family in the normal way: .fred {font-family: 'WeirdFont', fantasy;} except for adding quotes around one-word font names.We’ll build an animated GIF (not a photo) in Photoshop. Think of ways to do one for your final project made with text that could be like this, or use a photo and motion tween, fade, etc., or
one that's more video-like:
There's an animated GIF here (Step 7). Also, this page from Adobe Create uses the timeline (as opposed to frames) to make a GIF.
Reading on development (review) is HTML & CSS Chapter 19. The basic resource is: Search Engine Submission Tips (formerly Webmaster’s Guide). For those who want to add search to their final projects, here is an intro to various options from: Lifewire, the key one being Google Custom Search.
Also remember what defines the “X” version of HTML (XHTML). XHTML is HTML written to XML standards.
- Tags, attributes, values must be lowercase (in XML they are case-sensitive but uppercase can be used)
- Tags must be properly nested
- All “non-empty tags” must be closed (e.g. <p> needs </p>). An example of an HTML “empty tag” is <br>
- (Optional) All empty tags in XHTML are written with a trailing slash: <br /> or <img src=.... />
- Values of attributes need "" e.g. <img ... alt="Photo of our cat, Larry" >
- (Optional) All attributes need values, e.g. required="required"
- Plus always start files with a doctype declaration, i. e.
<!DOCTYPE html> for HTML5.
And here is Video #11 on using FTP to post your web pages. Remember that we can't do that this semester, but you should watch to see how Filezilla works, and how to get the URL.
Site maintained by John Beatty