Friday, January 30, 2009

Sunshine on snow; through closed eyelids.


The sun is shining and the world looks a lot better in central Indiana. Chihuahua can about see over the snow we received, since it has settled down some. We did have close to a foot of snow. But, we only lost power momentarily that night so we are really lucky. Our stomachs, on the other hand, are not.

Monday night, I think it was, all these "school's cancelled" days have me confused, but whatever night it was saw me emptying my stomach in the bathroom for about ten hours and today, sun or no sun, all I want to do yet, is sleep. At least, I am working again, a little at a time. Sorry for the absence.

I really want my new website up and running and was working hard to complete it for the first of February, but I will try for week two now. One thing that I did do yesterday is a new opening for my book. I really should have kept count. This has to be close to a dozen different openings.

I love the help I have gotten at Talking Books, from Cheryl Klein. With the help of her 'Rules of Engagement," I may have an opening that fits the bill. It has to simmer in the stew for a while yetbefore I know for sure . My next assignment, beside the web page, is to make out a Book Map. It is the first editing thing she does and I think it is going to help me a great deal, so I will let you know how that goes.

The car is still stuck in the drive but life is cancelled/closed for the day in Brown County anyway, so no need to go anywhere. Maybe I will take another nap first. Stay warm, if you can.

Thursday, January 22, 2009

Deaf Resource Library link for creating Accessible pages

This is just a quick post. I am taking the tree down, moving the weight bench inside (it has been on a screened in porch, so not getting used by me), and working on my web page.

Since I needed to type up information for my new web site, I decided to use those pages as my accessibility pages. I wanted to check on an HTML tag, so I went onto Google and found a page I just have to share with you.

Creating Accessible HTML is from the Deaf Resource Library and by Karen Nakamura. It really puts it in concise form.

Topics include hearing impairment, visual impairment, mobility impairment, economic accessibility, and educational accessibility. These are short paragraphs, explaining the whys in simple terms.

Monday, January 19, 2009

Part 9 - The Web Site Design




The above image is a list of the graphics I am working on and getting ready, to place on my INDEX page. I had to create a lot of these, alter, make the backgrounds invisible, and spend a ton of time just on getting the graphics ready.

You can throw up a webpage in a day, but if you are interested in using the website to sell yourself, as a writer, or your writing, you will need to give some thought to:
1. Why are you doing it?
2. Who do you want to reach?
3. What is your message?

This is the fourth web site I have designed: Three were for my artwork, one for another person. But, I still felt the need to spend a lot of hours, this time, checking out other writers, published and non-published, web sites. I made notes on what I liked and what would work for me and notes on what I thought was bad. I googled “What makes a good web site” and I have read a ton of information on what works and what to avoid in web design. Website Ideas for Writers, is a great site to stop at: Website Ideas for Writers, the official idea site for writers
If you are still unsure if you should have a website, as an unpublished writer, here are some reasons to do it. Dawn Chartier ~ A writers life: Websites for unpublished writers

I have mentioned before that I am going a bit off of the “writers” site advice and going directly for the series of books I am writing. I have a few minor writing credits, like a story in “Good Housekeeping” and I would just like to try something different. To me, I am selling, not just myself, as a writer and my writing, but I am selling this story. I want to make my site fun and interesting and something that might make someone, preferably a twelve year old reader, a teacher or a librarian, refer someone else to look at it, and that might entertain and enlighten an editor or agent.

All the while, keeping this doable with the time I have to invest in this site. So, my design is first. I already mentioned working with Master’s Daughter and others on the design for my site. I want it to be interactive, just a bit, and so I have designed a bulletin board interface, with objects that will move a bit and link to other pages. Is this above my capabilities? Possibly, but that has never stopped me before.

Above my bulletin board will be a line telling my viewer to click there for the Text only version, for accessibility. I am creating a simple link to a text version of the page. I know there are programs that will pick this out, but I am just going to cut and past the text and put it on a simple page with no graphics.

A note here: You need to sit down, at this point, and draw a simple sketch of the layout of your page. Where will your links go? What will they be? What text will you have on your index page (that is your first page)? What colors will you use? Google that if you are unsure, or go to 500+ Named Colours with rgb and hex values and drool over all the great colors you can get. Believe me, it is a lot easier to have your design down on a napkin than to keep redoing it in your WYSIWYG html editor.

After I have my graphics ready, I will print out, to scale, the bulletin board and the graphics and do some cutting. I will probably spend an hour or so rearranging the printed objects on the board until I am pleased with the design. I have found, in the past, that this is the easiest way for me to arrange the look of an element of my page, than doing it by rearranging code within my WYSIWYG editor.

There is a ton of help on the web. Not sure of a background? Google it. Need a template? Google it. Want to look at what others have done? Google it.

Saturday, January 17, 2009

Web Site Creation - pg 8 - Site Maps and Search Engines

By talking about site map, we are skipping ahead a bit, but it is important to have some other things in mind before you get down to coding, or WYSIWYG’ing, your web page. After promising to talk about "site map" I have done research and found out that you site map your site AFTER you create it. So, for now, we will discuss getting your site found by Search Engines. This is something to consider during every step of your page creation.

Note: I have substituted the word carrot for the <> for each page, don’t say “page 1,” “page 2,” etc. Do use very descriptive sentences, like: “Painting information from SaVanVleck” or “Native American characters in the Moon Tree books.”


2. And, don’t forget that detailed ALT text for all images, we have discussed.


3. Use your (carrot) meta name="”keywords”"> to good use with detailed information. If you will look at your WYSIWYG editor's HTML, you will find the "keywords" and "content" at the top of the page. These are two very important keys to being found by search engines.


4. Use CONTENT => also The CONTENT can also be used by search engines as your site’s description when displaying search results. These are where the lines that you see when you google come from.

Below is the AOL Google search for “www.vanvleck studio.” I do not find the AOL Google to be as thorough as a straigh search with:http://www.google.com/, but it was handy.

a href="http://www.vanvleckstudio.com/" target="_blank">pottery, painting, drawings, fairy, doll sculptures, by Sher...carrot /a>
Welcome to VanVleck Studio on-line ... Link to pottery and sculpture by Sheryl VanVleck ... Link to 2-dimensional work by Sheryl VanVleck ...www.vanvleckstudio.com/ - 11k -
Similar pages
AND

http://www.vanvleckstudio.com/
Welcome to VanVleck Studio on-line
VanVleck Studio and Gallery is located in a quiet rural area in Brown County, Indiana, USA. ... On the left will be VanVleck Studio, 7873 N. Oak Ridge Road. ...
www.vanvleckstudio.com/4studio.html - 8k -
Similar pages
[
More results from www.vanvleckstudio.com ]
http://www.vanvleckstudio.com/4studio.html

My INDEX page is the top search for vanvleckstudio. So, it is saying welcome (probably unnecessary and certainly non-descriptive) Link to pottery and sculpture by Sheryl VanVleck is okay. “Link to 2-dimensional work by Sheryl VanVleck” really does not tell anything about my portrait paintings in three medias. That should be more descriptive for full affect.

a. A caveat here is that search engines will ignore keywords if you repeat a given keyword too often. That means any word used more than seven (7) times, in some search engines, will be ignored.

5. I read some advice in my CoffeeCup HTML, to check out your site on Lynx, and you will see the text only version. This is good to see what the visually handicapped will see, but also good to see what words will pop-out on search engines. My vanvleckstudio.com came up thus (it is too long to copy all in here, so here is the link) seebot.org text view of http://www.vanvleckstudio.com. Suffice it to say that it is a lot of words, but perhaps not what I would intend to point out as the most important information on my site.

6. It is also said that some “well-known free hosting services” are ignored by the search engine. So, if you are serious about marketing from your web site, you should consider having it hosted. It costs me $100 a year for a basic service package from Gold Rush Hosting Solutions. There are cheaper options for hosts, but I got tired of not having someone to email when I got into trouble.
Hey, what can I say? "I got people, now."

Thursday, January 15, 2009

Web Site Preparation for writers - page 7 - Titles and EMail contact

I don’t know about you, but I love to learn new computer programs and, in my first rush excitement to play with my new program, I have a tendency to think I can just jump in there and make a web page.

Yes, you can do that and I have. But, if you want to make the best page you can, some research time is well spent.

First is to decide who your target audience is. I have a tendency to spread myself off into too many directions. I am a painter, a potter/sculptor, a doll maker and a writer. Since 2003, my website has been targeted for selling my artwork from my home based studio. It was geared to show what work I could do and what work I had available for sale, and about visiting my studio.

When I started to redesign the website this time, I still had that in the back of my mind. It was research and Master’s Daughter, who pointed out where I was going wrong. After going over the initial design for my website (and I spent way too many hours on creating the page that was eventually declared to be going the wrong way), we decided that I was not focusing my site on what was important to me now. I had links to my painting and my pottery. Not only were they distracting, but they were taking up space that was better spent on telling about my writing experience and drumming up interest in my Young Adult Fantasy Series.

Research tells me that author’s seeking representation need to focus their site on themselves, first and foremost. I have a focus on marketing for my book, and I have decided to spread out my focus and cover my writing background, as well as generating some word of mouth, hopefully excitement for my book series.

SECOND: As Mike Cherim points out in Beast-Blog.com - Mike Cherim's Professional and Personal Web Log - Home Page, there are millions of websites out there. That means there are 999,999 + other websites, beside yours, for a viewer to click on. If you create a website that requires JavaScript, or large images to load, or “mystery meat navigation,” you are going to lose viewers. I am a dial-up user and no matter how much I want to view a site, I will close out of it if there are large images to load.

THE SEARCH: How will viewers find you? One essential element is the “title element” that is shown on the bar of your browser. It is the content title with the terms in it that users will search for. Each page of your website should have its own unique title. It is contained in carrots, at the top of your webpage. We are talking coding here in your WYSIWYG editor.

That would be the title for my first page, the INDEX page and a different one for each succeeding page. In my current webpage, I never thought about that fact that if you have twelve or six or more pages to your website. Each individual page should have its own title so that there are that many more titles to be found in a search. So, change that title for each page.

Also, it is important to NOT put your email address link on your site. Even supposedly secure ways of doing it will eventually be Spy Bot-ted. You do need a means of contact though. Use a secure contact form and we will get into that, just as soon as I have it all figured out. If you are in a hurry, Google it. This is from a person who has already had my domain email address harvested by SPY BOTS.

NEXT POST: Site Maps

Saturday, January 10, 2009

Web site creation for Writers - page 6 - a few last tidbits on accessibility

I have not forgotten my project, or my own webpage. Late at night, will find me sitting in the dark, fixing the graphics that will be on my index page. This is when I have gotten home for the hospital, and now the rehab, with my mom. First she went to the hospital with three infections. She had double pneumonia, walking pneumonia and an unidentified one. Now, she is in a rehab taking antibiotics for the last infection and getting some therapy.

Once I have gotten my graphics ready, then the putting together part comes. I have designed what I want my, index to look like. The very first page of your website will be titled index. When you upload to your web page, you will have a page (depending on how you lay it out) that shows all the files on the server. Right now, I must have over five hundred graphics in there. I am a visual artist, selling potter, painting and fairies, so that has been the focus of my site. It will all be deleted soon.

Some final quick issues on accessibility:

1. Pop-ups can interfere with navigation. So, there again is where you have to inform the viewer that if they click on a link or area of a window, that it will either open a new window or give you a pop-up. For people with readers, it can be very disorienting.

2. Make links clear. Website visitors will find it easier for your visitors to find what they are looking for if the links are consistent throughout your whole site. If you place them along the bottom, do it on every page. It is most common to look for links along the left side of a webpage. Whichever you choose, just use it on each page. It makes it easier on you too really. Design it once, copy it, paste it to each page and you are set.

MY HINT: Depending on your WYSIWYG website designer, they will have shortcuts to do it. Things that take time to learn, often have me using the secrets I have learned over time. Once I get the background and links of my first webpage (INDEX) done, I then use that same page and name it for every other page I will have on my website.

In case that is confusing. I am just renaming that first page over and over, and will end up with how many ever pages my website will have, right away. Every one of them will have some type of a conistency. Whether it is a banner or background, I want people to know they are till on My Site. And, I do not have to redo the links every page that way. Then, I go back and specialize each individual page. More of that later.

That said, numerous times I have had to go back and make a correction and then redo it, but if I was more careful about checking it to begin with and designing it, I would not use up that extra time.

Okay, back to links. You have a name for a link and the alternate text. Do not use "click here" as link text. A screen reader reads that text to let the disabled viewer know just what they will find if they click on that spot, just as the visual should tell your non-disabled viewer. It should be something like "view the Text only version of this site, here." or "for information about healthy lunches, click here."

One last point on links: An arrow can often convey, more easily, what you want then a button.

3. Despite the abundance of graphics on blogs, the web and my site, the internet is mainly about words. Use clear and simple language for your target audience. I believe I once read that a sixth grade reader was considered average; but I may be wrong. Obviously, if your site is for scientists, it will contain a different language than if it is "Science for non-scientists."

Remember, your audience also consists of those with cognitive disabilities and those whose first language differs from that of the web page.

While the internet is about words, graphics can be an invaluable alternative to help with comprehension of the page. If the information is more easily conveyed visually, then use the graph or chart or photo. Just make sure the alternate text is clear and don't forget you will also have a text only version of your site.

Wednesday, January 7, 2009

Web Page Creation for writers - part 5- Physical vs Logical Markup -

HuH? You say if you are new to web making or even if you, like me, use a WYSIWYG (What you see is what you get) web page program. I use CoffeeCup and when I started, I did not know anything. But, I always search for the whys and as I designed my site, I wanted to know 'why it did that' and 'how it did this.' I also was forever wanting it to do something different than it was doing, so I had to learn why it was doing what it was and how to change it.



I learned a lot about HTML that way. In redoing my page and wanting to make it accessible to as many as I can, I have learned that there is a Physical markup and a Logical Markup. I found my first definition here Dan's Web Tips: Physical vs. Logical Markup.



Physical tags affect the physical look of the words: italic & bold & underline, etc. (The carrots surround the initial that tells what you want done: i for italic, b for bold, u for underline, etc. The slash in front of the end set of carrots is the 'not' or 'end', as in end the italics here.)



Logical tags refer to the "structure and meaning of a document" and only suggest their appearance. Examples: (This is tough because the editor here is putting these into action. But, at least you get to see what some of them do.)

= emphasized text
= strong emphasis

Your best bet here is to go to a couple of sites to become more familiar:

Site one is: html guide - online HTML guide - logical tags in HTML - free html guide - online beginners html guide free Who states that there are actually nine logical codes:

There are 9 logical tags each requiring a closing tag:
Strong: I am strong = STRONG in carrots and a closing carrot
Emphasis: I am emphasized = EM in carrots and with a closing carrot
Abbreviation: I am abbreviated = ABBR
Citation: Citation = CITE
Code: I am programming code = CODE
Definition: Definition = DFN
Keyboard: Quite like keyboard strokes = KBD
Sample: Sample = SAMP
Programming Variable: Programming Variable = VAR

If I am understanding this right, then these are it and anything else that needs doing you go to the physical code.

Then, go to: HTML Logical Tags - HTML Code Tutorial And I'm recommending you go there and learn it from an expert. He also has lists of Logical Tags. But, don't let this scare you from using a WYSIWYG web page creator. It's just something to be aware of and occasionally, as you get more familiar with HTML, you will find yourself changing out tags to bring them into compliance.

There are no police out there saying you have to do it now, it is just that you will want to do the best for your viewers you can; including the 20% disabled.

Tuesday, January 6, 2009

Website Design for Writers - part 4 - Tables

I found a site today that laid out the issues in a straight forward manner. Web Teaching Articles: Practical accessibility .

First things, first: Back in the new days of the Internet, the net was made up of words. This was a time in the 80's of bulletin boards. My nephew ran one called "The Twilight Zone BBS". JayJay Net, LLC - Premier Dialup Internet Provider for people who want Top Quality service But, he and all of us have moved on. He's an Internet provider now and has kept up with the times.

Those times now bring us high-speed access and web sites with all the bells and whistles and graphics galore. It is the bells and whistles that is a problem for the disabled. Readers for the blind work well with words. They run into trouble with non-text items.

Standard browser software can accommodate many disabilities, as long as you keep your web page flexible, so that it can transform to meet the viewer's needs. This includes low-vision users being able to change the scale of letters, and color-blind and low vision users being able to change the color of text and background to increase legibility. So, your page needs to be legible and navigable under different viewing conditions.

Some simple ways to do this:

1. Have audio descriptions to accompany your text content.
2. Use images for navigation and page content.
3. Use captions with video content.

Now, for the pesky, great tables:

The Accessibility Guidelines discourage the use of layout tables, but it is really a great option for positioning elements on a page. If you carefully design the tables, then the newer screen reader software can handle them.

To understand the problem, you need to know that some of the screen reader software reads the screen, from upper left-hand corner and from left to right. They do not read the code, they read the web page as you see it. So, if you have multi-column layouts, as many Web pages do, with navigation links on the side and then content in the middle, it turns it into gibberish. Newer software looks at the underlying code instead. It will read the site, cell-by-cell.

So, the answer is to make sure your cells are "group related content." Put all your navigation links in one cell and your content in another. It is actually a logical way to do it anyway. And, one side note here is that most people expect your links to be on the left of your web page. It's good to go with the flow there.

You need to also keep your table layout "fluid." This means it scales to fill the browser window and re-sizes to accommodate content. This works also for enlarged type.

Next post, What the heck is logical markup?

Monday, January 5, 2009

A quick Part 3 Website Building-Disability access continued

This is just quick, a bit redundant from yesterday, but with some new stuff. The reason is that I spent the day in the hospital with my mother who has pneumonia. Excuse me if I do not post for a few days. Hopefully, she will only be in there a day or two but she has a lot of heart problems so everything can be scary.

Much of today’s information came from a PDF file downloadable from www.terpsys.com

Your web site building should involve a good deal of research to make it the best you can. I have spent a lot of time working on a website only to find there was a better way to do it. I have always been one to jump into a project, but the advice to lay out your web design, before jumping into it, is sound advice. Get out a tablet and draw your site out on paper, second. First, is to check out a lot of similar web sites and what they offer and what you feel works; all the while noting what does not work so that you can avoid it.

I spent most of yesterday researching the disability issue for my web site. It is estimated that twenty percent of your audience has some type of disability. Me? I’m getting cataracts and this little print is hard on my eyes. I also have arthritis in my fingers. Other disabilities include blindness, deafness, color blindness, and even just the confusion that comes with aging. And, losing twenty percent of your readers is a large loss.
Then, you have the disability that those of us on low-speed dial-up have. I do not watch any movies. I do not even stay on a page with movies, usually. Images are a similar problem, and I do not have time to wait around for them to load. Sound is just a personal thing. I like quiet. A hint though, a lot of people in their cubicles are cheating a wee bit by viewing “non-work related” web pages and if your music blares out, they are going to click that “X” and turn you off and may never come back. So, think music through before you add it. You need to have a mute, in plain sight and/or make it so they have to click the music on.

The other problem is that assistive technologies, those that convert non-text information have their own requirements. Text is converted using speech synthesizers or Braille displays. So, what do you do to make your website fully accessible?

First, what I mentioned in the last post, always use the alternative text descriptions; for everything: maps, bullets in lists, graphical buttons, spacers, links, etc. One bit of advice is to pretend you are reading the document aloud over the telephone. How would you explain the need for and use of this image on your web page?

Second, do not rely on color for understanding. Print your page out in black and white to see if all the text and images are still visible. Check for color contrast, also. There are many people who have difficulty with contrast and colors. Again, printing the page out will help you see what works and what does not. Don’t forget to show it to grandma and get her advice.
My next research is about the use of tables. I like tables but it seems to be turning out they are not always good for disability access. More on that next time.

Sunday, January 4, 2009

WebPage Design for the Writer - lesson 2 - Access

When J.K. Rowling’s new site was created, it was created byAward winning website design and build, Flash design, e-commerce design and build, digital strategy, analytics consulting, se... , to be accessible to those who are disabled, blind, partially sighted, mobility impaired, deaf and cognitively-disabled.

Now, while I have not contacted Lightmaker about my site, I am pretty sure they are beyond my budget. Heck, the guy down the street is beyond my budget. But there are some things we can do to make our sites more user friendly to all. And, did you know that there is actually are guidelines ADA Home Page - ada.gov - Information and Technical Assistance on the Americans with Disabilities Act.

The website Internet Navigation by NetNav has tips of the day and examples. Now, on dial-up, that pdf may be too much for me to wait to upload, what with my slow dial-up, so Cynthia Waddell, JD has a very straight forward section on Web Accessibility: Websites Must Be User Friendly, Handicap Accessible and Meet the American's with Disabilities Act

But, what can you do, if like me, resources are limited and you are designing the website yourself.

1. Make sure you have Alt Text for your pages. Tell your reader what they would be looking at, if they could see better, AND what you would expect them to do. This might be “Welcome to my garden. Please explore the flowers and objects you find in it.”

2. Then, every time their cursor lands on something you add, “You have entered the Marigold section. This is a link to “a game for finding gold.” Or “Collect pill bugs to get into the secret garden.”

3. Sounds can be confusing for some disabilities and for screen readers, so be sure your site allows muting the sound. Make captions for the audio too for those who are hearing impaired. This is especially important if the sound is saying something important to your site. I personally turn off sounds on my computer, normally, so I would miss these clues also. Any time I need high speed, I work at the library and it’s either turn it off or wear headphones.

4. Another thing is to make a “text only” alternate to your site. The link for this should be on your opening screen. It will not take that long to just copy the words, without the coding, that you want your viewer to read. White page, black letters make it all the easier to see and there is a site, I will give you the link next post, that can convert your site for you.

I have barely touched the surface. My site will be the best I can do, with the help of my CoffeeCup HTMLHTML Editor, Flash & Web Design Software CoffeeCup Software software and CSS (Cascading Style Sheets). More on this next post

Next, CSS and me.