WEBSITE WRITING

Websites Overview
Written communication is a significant and an important aspect of technical
writing. It is your responsibility as a technical writer to know the accepted structure
and format of various types of methods of written communication in order to provide
readers with clear and easy access to information.
Considerations for Website Writing
 The web is one of the primary means of
communication. Millions of people use it every day
to find information, to purchase items, and to
entertain themselves. A single web site can be
information that is organized on one page or a
single web site can be information that is organized
over several pages. Regardless of the amount
information on a web site, the web design needs to
give the reader clear and essay access to
information just as with any document (Riordan,
2005).
 After reaching a Website’s home page,
a reader can navigate the site in may
different directions. Therefore, special
attention needs to be given to layout
since each web mode does not have the
traditional sub categories (Riordan,
2005).
 A web design needs to pay careful attention
to addressing a cross-cultural audience. Therefore,
make sure to avoid using idioms and pronouns.
In addition, a major consideration for effective
cross-cultural communication is the referencing
of time formats, dates, weights and
measurements, telephone number formats,
address formats, currency, and paper size
(Riordan, 2005).
Website Design
Goals
Before designing a website it is important to set goals. What purpose is the
website serving?
Some common website goals are:
• Sales
• Marketing
• Update information
• Generate leads
• Distribute information

Goals important to business success. By setting goals for one aspect of the
business, in this case, the website, it will help in accomplishing other goals of the
business, such as:
• Expanding the audience
• Increasing sales
• Connecting other businesses or other parts of the company
• General communication
 Design Message
The design message is the image the organization wants to portray to the reader. This
can also be called the brand. When creating the look of the website you must consider
logos, colors, fonts, and images. These must all support the personality of the
organization.

Since companies are building their workplaces around

the “theme” or the “brand”, there is no reason that the
website should not be done in the same manner. It is
necessary for brand identification, therefore helping the
company advance and succeed. A consistent brand and
image also build trust and value for a company.
Some important items to consider when communicating the brand are:

ü The brand, whether communicated through the website or the customer

service, must be consistent
ü The brand should be found everywhere–there are no limits to exposure of
brands
ü Short and simple is always the best route
ü You are the brand and the brand is you. If your brand does not reflect the
values and beliefs of the company, it most certainly should not be on your
website.
Recognizing Your Audience

Knowing your audience will help you make

better decisions when it comes to deciding which
browsers to support and which new technologies
to endorse. Before designing a new website, it
would be helpful to look into the likely browsers,
computer user knowledge, and connection speeds
of the audience you are addressing.

In redesigning a website that already exists, you

can review the past site usage information so that
you are providing improvements to the site where
it is needed most.
 There are several different guidelines that should be used when designing websites.
Here are common site types:

§ Academic and scientific sites should have additional focus on how the site
functions in graphics-free browsing environments
§ Consumer audience websites should pay special attention to site performance and
presentation
§ A controlled environment where a specific browser is being used, as in a corporate
environment, is where it is best to use all that the website has to offer. Employees
usually attend training to learn how to use these sites and the designer can use the
browsers full potential.
§ Gaming websites is where you can assume that the users will have the latest plug-
ins and browsers and are quite technologically savvy
Examining the Site’s Purpose
Figuring out how the site will be used in another important step in website design. Those who
use the internet usually fall into two categories:

1. Those who seek information. You may want to consider the technology of the client or
use more general approach in design
2. Those who search the internet for entertainment. For the sites of those seeking
entertainment, more cutting-edge technology can be used to better the experience of
the user when they are accessing your site.

There are options for those who want to use the latest technology for their websites, but want
to make it available to everyone. For this situation, you can use a browser detector to serve
alternate version depending on the type of browser the user has. This allows you to use the latest
technology and still recognize users that have older browsers.
Testing Your Site
Test your website on many different browsers and browser versions. Doing this before going
live will help off-set problems you may encounter before it is available to the public. Professional
web design firms run their sites through an intense quality assurance phase. If this is not a feasible
task, you can make your site available on a private test site. You can then run your own quality
assurance test throughout the following browsers:

• Acquaintances’ browser
• Corporate office browser
• Different ISPs

Website pages will appear different depending on the environment it is viewed on. The
overall idea of this testing phase is to make sure that the information is being presented
clearly and there are not any overt problems.
Content

Content is one of the most important reasons for even creating a website in
the first place. If you think about it, a website with no content has no purpose. A
website with no purpose is wasted space on the internet.

ü Who is the website trying to reach?

ü How much time to people have to spend reading information on the website?
ü How did individuals reach this website?
ü What is the most important information to the reader?
ü What questions do the readers have?
ü What action is the reader supposed to take after reading the website content?
 What to consider about website content:

How it will be searched within different search engines.

Key words are needed throughout your website to make sure that the
website is found by people who are looking for specific information. It is
important to be specific with words, and use them multiple times, so that search
engine robots find the word and place it high on the results list.
What to consider about website content:
Age and audience appropriateness.
Content on websites must be age appropriate so that the right audience is reading the
right material. Age appropriateness also falls under appropriateness in general of
making sure that private information does not become public on the internet.
Audience appropriate means that the content of the website is serving the people with
the right information at the correct level of reading to which the intended readers will
understand.
Creating a Home Page
Your home page will be the most visited page on your website. Your home page
may not always have what your viewers are looking for, so if you have something that will
draw them in to make them want look further for their information. You will have ten
seconds to draw your customers into your site, or else they will hit the “back”
button and will begin to look elsewhere.

Your home page should be able to load quickly. The ten seconds you have to
draw the customers into your site begins when they click on the link to your site. If it
takes five seconds for your site to load, you only have a few seconds left to draw
customers further.
Creating a Home Page
Here are some tips to help your site download quicker:

ü Keep media images small

- limit images to no more than 5 to 10KB
- pages should not be more than 30KB total per page
ü Avoid using ads from external websites on your home page that may slow down the
loading time.You cannot control how fast another server will serve its content.
ü Write your HTML in sections so that when the bottom of the page is still loading, your
customers can read the top sections of your home page.

Another important point about home pages it to never stop modifying it. Reviewing your log
files once your website is up and working can help you make your home page more user friendly.
Updating the links or the colors may improve the appeal or ease of use to your site. Remember that
everything can be changed, and you don’t have to settle with something if it’s working.
Compatibility

Features do not always display the

same way in different Web browsers. It
can be useful to check a created page
using more than just one browser, to
ensure that the page displays correctly
for a wider audience. Completed HTML
code can be validated by visiting
validator.w3.org. Saved HTML code can
be uploaded and checked for accuracy.
Design Considerations
Usability
Usability is defined as the ease of using the website. This could be for the
intended audience of the website, or it could be determined by the industry or
business standards needed for websites.
Usability of websites has gone
through different definition changes
with the evolution of the internet. In its
early years, many people did not know
how to navigate through websites or
read the information provided. This
made the website unusable. Now,
people look for the easiest possible
access to whatever information is
needed.
Usability means Communication
Websites are a form of visual communication,
serving multiple purposes. Websites can be
informative, persuasive, long-term, advertising, or
entertaining. Usability is determined based on the
goals of the website.

If the website accomplishes its goals and

communicates the necessary messages, it can
therefore be considered usable.
Developing Usability

Starting to test a site before it is built will help avoid some problems
before a lot of effort is put into the site. Plan on doing usability testing in focus
groups to help you prepare for a better, more user friendly site. If you do not
have access to a focus group, you can print out your ideas and share them
with family and friends and ask for their insight.
Developing Usability

Some points to keep in mind when beginning your site are:

§ Find out what people expect from your site. Customers may want something different
than what you were preparing to build.
§ Wording that you use will be important in how effective your site will be. If you begin
testing early, you can find out what words relay your message better with your
audience.
§ Customers will provide you with good ideas. Testing with customers will give you ideas
that you may not have thought of.
§ Use descriptive headings, bold words, and bullet lists for easy reading
§ Incorporate links and resources for more information
§ Add pictures, charts, and graphs to enhance communication
§ Avoid adding unnecessary information, pictures, sounds, or colors that are more
distracting than helpful
§ Test the website with audiences to determine usefulness

Testing is key to building a website. You must be willing to listen to the input of others, friends or potential
customers, so you’ll have a better site from the start.
Appearance
Appearance should be aesthetically pleasing. One that is easy to look at
and maneuver. Tasks that are most important and or most commonly sought
should be the main focal points of a web page. They should stand out more,
not become secondary to an image or a background. Everything on your
site should have a purpose, a reason for being where it is and looking the
way it does.
Appearance
Pictures and colors are important and
interesting, but far less important than the content.

• Users must know where they need to click (and

understand what will come from that click) and
not be distracted by images.
• Unless it’s intended, images should be minimal
and only help PUSH the contents importance, not
overwhelm the page.
• The content should be seen first, images second
or third.
 Visibility
Visibility could be considered the most important aspect of
website design. People must first find the website before they can view
it. Most often people find websites through search engines.

Here are some tips to increase visibility:

§ Add text to pictures

§ Check the html code for errors
§ Use relevant title tags
§ Use navigation that all internet users are able to view
§ Get rid of duplicate content
§ Do not use hidden text
Layout
The layout of a website should be as simple as possible. Extra fluff will only distract the user
and cause confusion. You want your site to be visually pleasing, but first and foremost,
understandable. The user is at your site for a reason, if the layout isn’t successful, the user will
most likely leave the page and look for their information elsewhere.
Things to keep in mind while creating your layout:

§ Start with a wireframe; use simple boxes and lines to organize your page. Pictures should be
an afterthought.
§ Think of what you want the user to see first and what is the most important. Make those the
biggest, the boldest, the most colorful, anything you can think of to draw attention (but be
careful not to overwhelm your users)
§ Always remember, as accustomed, most cultures read from left to right, up then down
§ Put your logo in the UPPER LEFT-HAND CORNER to draw the user into the rest of your page

§ Put your least important info (contacts, outside links, site map, related info, etc.) in the bottom
left hand corner.
§ Try to draw your viewer through your page at a downward diagonal from the upper left hand
corner to the bottom right hand corner.
§ If you’re new to web design, stick to a custom layout with title in the upper left, tabs across the
top left.
Page Design
Page Design Guidelines
§ Design Pages to Facilitate Scanning
You should design documents so they can be scanned by your readers. You can
create more scannable documents by:
1. Following a deductive organization (i.e., putting purpose, significance, and
results in your introduction).
2. Using page-design principles to emphasize the message and organization
(e.g., using bullets, lists, and illustrations to highlight key points).
§ Use Design Elements to Highlight Your Message
Headings
- Headings are used to help readers scan documents.
- They give readers a sense of what is covered within the section.
- Highly skilled readers tend to scan through documents on first reading, noting the
content of your headings. This gives them a sense of your overall message. An
additional advantage of headings is that they create additional white space.
- Ensure that all of your headings are equal grammatically. For example, headings
can all be questions, verb phrases, or noun phrases, yet you cannot mix together
questions, verb phrases, and noun phrases.
Sample format:
Level 1 Heading
Level 2 Heading
Level 3 Heading
◦Bullets
* Bullets. Bullets create emphasis. They focus the reader’s eye on the bulleted
material and they break up textual space.
Lists
Lists share all of the positive attributes of bullets. They create the white space readers
love, placing emphasis by drawing the reader’s eye to what you want to highlight. Yet lists are
appropriate when a series of steps is being presented. Unlike bullets, lists imply you complete
item 1 before moving on to item 2.
Using lists and numbering sections of documents is very common in legal and technical
genres where more than one person is writing the document or where litigation may follow.
Once again, use the style tag for lists in order to have control over your document.
Special Page Design
Considerations for the Web
As a general rule, researchers in the field of usability
analysis and interface design suggest that you limit your Readability research
has found that
content to properly fill the screen page of a monitor set to: impatient readers
don’t want to turn
Maximum width = 640 pixels their heads back
and forth to read.
Maximum height = 480 pixels They want to scan
the document,
Modern monitors, powered by computers with video reading straight
boards, may be set to display many more pixels on a page. down the page
The standard, in fact, is probably moving to: without any head
nodding! Impatient
Maximum width = 1024 pixels readers don’t want
to use scroll bars,
Maximum height = 768 pixels either.
Pictures and Photographs
§ Use pictures and photographs to catch the eye of your
audience.

Images can convey powerful emotion. Images can illustrate a

process or capture a moment with precision.
People who shun principles of design, who argue words alone should
be sufficient, are really not in touch with the expectations of today’s
readers.
§ Select appropriate images.

Images are not inherently good. In fact, images can be detracting. You don’t
want to pour images into a document that are unrelated to your subject. Because
readers’ focus will be drawn to the images, be sure they are appropriate to
your audience and purpose.
Common graphic formats:
• Bitmap Images
‒ GIF (Graphics Interchange Format)
‒ JPEG (Joint Photographic Experts Group)
‒ PNG (Portable Network Graphic)
• Vector Images
• Image Maps
Bitmap Images
They use pixels to display colors. In other words, bitmaps use a grid of squares, and each square, each
pixel, can represent a color.
Different computer monitors have different numbers of bits they can display for each pixel. A bit is the
smallest amount of information stored by a computer. For example, a 2-bit monitor can display two colors for
each pixel–either black or white. An 8-bit monitor can dedicate 8 bits of memory to each pixel to represent a
color, whereas 24-bit images use 24 bits of memory for each pixel to represent a color. While monitors differ,
you can typically count on a monitor having between 72 to 100 pixels per inch. As technology evolves, the
quality of monitors will expand, and so, too, will the quality of graphics.
When you plan to represent an image on a page that will be printed, you need it saved in at least 300 dpi
(dots per inch).

When users make a bitmap image larger, the computer guesses where to put new pixels between the old
pixels, resulting in a blurry image.
• GIF (Graphics Interchange Format)

Developed by Compuserve Information Service in the 1980s, GIFs are the

most common format of Web graphics on the Internet. GIFs can present 8 bits
or 256 colors, using the Internet color palette. Because they do not display
millions of colors, GIFs can download fairly quickly. Conventional GIFs
download one pixel at a time, while interlaced GIFs display the overall image
fairly early in the download, giving the reader a blurry image of the graphic,
and then move from blurry to sharp as the image downloads.
• JPEG (Joint Photographic Experts Group)

JPEGs provide a superior image to GIFs because they can display 24-bit, true-
color images. While GIFs have 8 bits of memory dedicated to displaying a color for
each pixel, JPEGs have 24 bits of memory dedicated to displaying a color for each pixel.
Thus, photographs and drawings can be rendered more accurately by JPEGs.
JPEG files are larger than GIF files, yet you can typically choose different
compression file sizes in graphic applications. For example, you can make JPEG file sizes
100 times smaller than the original file size. Each time you compress an image, you erase
information, so you need to be careful that you do not so overly compress an image that
it becomes worthless. JPEG compression tends to degrade computer-generated
graphics.
• PNG (Portable Network Graphic)

According to Web Graphics and Presentations, PNGs were designed for the
Internet to have all of the benefits of GIFs, yet to:
§ Provide superior compression and interlacing. GIFs can display the outlines
of an image once it receives 50% of the information from the file. In contrast, a
PNG image is recognizable once 25% of the image is available.
§ Create smaller files. PNG files are 5 to 25% smaller than equivalent GIF
files.
§ Allow users more than one color for a transparent background.
§ Compensate for differences in gamma–that is, the level of contrast in an
image. PNGs can be displayed equivalently on Macintosh and PC platforms.
At this point, however, PNG files cannot display animated images.
Vector Images
Vector images use geometrically defined shapes such as lines,
arcs, or polygons, which are used to represent images as opposed to
pixels. When vector images are enlarged, they do not degrade. The
computer doesn’t need to guess about where to add additional pixels.
Instead, the geometric shapes are simply scaled in larger or smaller formats,
without blurriness.
Vector images are useful to display graphs, charts, and diagrams. They
allow users to focus in on a part of the diagram, to magnify some part of the
image. Vector images are generated by spreadsheet programs, 3D
applications like AutoCAD.
Image Maps
An image map is a map that has embedded links. In other words, as you
move your mouse over an image, you can access links. The following is an
image map.
Learn NC: An image map of North Carolina, this map is linked
to a database on NC educational resources
Typography
Font selection matters. Even the font you display your documents in
can have powerful consequences. Some fonts can distract readers from
your message while others draw in the reader’s eye, bringing the
reader’s focus to your text.
What is the Difference Between Serif and Sans Serif Fonts?
Serif Fonts
Serif fonts have little tails (serifs) at the ends of each letter. Serif fonts
include Times New Roman, Courier New, Century Schoolbook, and Palatino.
Serif fonts provide a more traditional, conservative appearance. Readers
prefer Serif fonts when large text blocks are displayed. Times New Roman is one
of the most popular Serif fonts because it is very legible on the computer screen
and prints very well.

Sans Serif
In French, “sans” means without. Sans Serif fonts lack little tails at the ends
of each letter. Sans Serif fonts include Arial, Calibri, and Comic Sans MS.
Readers find Sans Serif fonts to be less readable than Serif fonts, so writers
seldom use them to set long blocks of texts. Used in contrast to Serif fonts, Sans
Serif fonts can catch a reader’s eye. Knowing this, advertisers use Sans Serif fonts
to set headlines and call out text.
Designers typically advise that you should use no more than one Serif and not more than one
Sans Serif font for each page. Even when you limit yourself to two fonts, you can create
considerable variation by bold face, underlining, italicizing, or adjusting the size of a font.
Video
Add video to enrich or supplant printed texts.

New communication technologies enable authors to incorporate streaming

multimedia into their webs.
Writers may provide video to:
§ Underscore the content of the print text, illustrating key concepts. For
example, an agency hoping to secure funds for hungry people could show video
of their living conditions.
§ Illustrate the content of the printed text. A researcher could provide video of
people he or she interviewed. A technical writer could provide a screen-movie
to show users how to complete instructions.
§ Inform or persuade people who respond more positively to an engaging
speaker than printed texts.
Video Formats
Currently, three “players” are available for free that can play digital movies on your computer:
1. Windows Media Player. This player is a Microsoft tool so it prefers the Microsoft
format (.avi), yet it will play movies in a variety of formats, including Quicktime.
2. Real Player. When you got to Real.Com’s site, you may need to hunt around for a
while before finding the free Real Player.
3. Quicktime Player. Although Quicktime was originally designed to play Macintosh-
platform movies, it now plays Windows-oriented movies as well.
Reference:
Baker, S. (2019). Professional and Technical Writing. Commons. Open Educational Resources