is a combination of art and science in creating positive emotions through product usage
Contents
UX
UI
CX
SD
IxD
Research icon
Research
Research
User Feedback icon
User Feedback
User Feedback
Analytics icon
Analytics
Analytics
Approach icon
Approach-UX
Approach-UX
Production icon
Production
Production
Testing icon
Testing
Testing
Rules icon
Rules
Rules
Composition icon
Composition
Composition
Grid Type icon
Grid Type
Grid Type
Elements icon
Elements
Elements
Typography icon
Typography
Typography
Color icon
Color
Color
Structure icon
Structure
Structure
Ecosystem icon
Ecosystem
Ecosystem
Metrics icon
Metrics
Metrics
Principles icon
Principles IxD
Principles IxD
General terms icon
General terms IxD
General terms IxD
General terms icon
General terms SD
General terms SD
Experience type icon
Experience type
Experience type
Approach icon
Approach-CX
Approach-CX
2-second rule
3-Click Rule
60-30-10 Rule
8dp Grid
Above the fold
Accessibility
Activity-centered design (ACD)
Actor
Affinity map
Alert
Alternative colors
Animation
Anti-pattern
Aspect ratios
Autocomplete
B2B customer experience
B2C customer experience
Backdrop
Background color
Backward compatibility
Banner
Benefit Map
Between-subjects design studies
Body
Bodystorming
Bottom navigation bar
Brand experience
Breadcrumbs
Breakdown Analysis
Breakpoint
Call to Action (CTA)
Card sorting
Checkbox
Chips
Clearly marked exit
Clickstream
Color Wheel
Column
Comparative analysis
Competitive analysis
Consistency
Container
Contextual action bar (CAB)
Contextual interviews
Conversion rate
Corridor testing
Customer Satisfaction Score (CSAT)
Customer centricity
Customer churn
Customer effort score (CES)
Customer lifecycle (CLC)
Customer lifetime value (CLV)
Customer review
Dark patterns
Data-driven design
Date picker
Design concept
Design thinking
Dialog window
Early adopter
End users
Entry tunnel
Error color
Experience map
Explicit destruction
Eye-tracking
F-Shaped Pattern
Field studies
Filled icon
First click testing
Fixed grid
Floating action button (FBA)
Fluid grid
Focus groups
Golden ratio
Grid
Gutter
Headline
Heat map
Hierarchy
Hypothesis-driven design
Information architecture
Input text field
Interactive prototype
Iterative testing
Kerning
Keylines
Label text
Layout
Line spacing
Look & Feel
Low-fidelity prototype
MVP (Minimum valuable product)
Margin 
Mind Map
Mockup
Navigation drawer
Net promoter score (NPS)
Omnichannel
Onboarding
Padding
Page controls
Participatory design
Persona
Personalization
Pop-up
Primary color
Progress indicator
Prototyping
Radio button
Readability
Retention
Scrim
Scroll bar
Search box
Secondary color
Service Blueprinting
Service-oriented design
Side sheet
Sitemap
Sketching
Slider
Snackbar
Stakeholders interview
Storyboards
Stretchable surface
Subtitles
System usability scale (SUS)
Tab
Target audience
Task analysis
Text area
Text button
The 10 minutes rule
Toggle
Tooltip
Top app bar
Touchpoint
UI guidelines
UI regions
Unfilled icon
Usability
Usability testing
Use case
User behavior
User behavior analytics (UBA)
User engagement
User experience ecosystem (UXE)
User flow
User story
User story map
User-centered design (UCD)
Vertical rhythm
Voice of customer (VoC)
Whitespace
Widget
Wiferame
Competitive analysis
Contextual interviews
Field studies
Focus groups
Stakeholders interview
Breakdown Analysis
Conversion rate
Between-subjects design studies
Card sorting
Corridor testing
End users
Heat map
User engagement
User behavior
User behavior analytics (UBA)
MVP (Minimum valuable product)
Persona
Target audience
Use case
User flow
User story map
Mind Map
Activity-centered design (ACD)
Data-driven design
Design concept
Explicit destruction
Hypothesis-driven design
Participatory design
Service-oriented design
User-centered design (UCD)
Interactive prototype
Look & Feel
Low-fidelity prototype
Mockup
Sitemap
Sketching
Wiferame
Accessibility
Clickstream
First click testing
Iterative testing
Task analysis
Usability testing
3-Click Rule
Consistency
F-Shaped Pattern
Readability
Call to Action (CTA)
Aspect ratios
Breakpoint
Golden ratio
Gutter
Column
Grid
Keylines
Layout
Margin 
Padding
Vertical rhythm
Whitespace
8dp Grid
Fixed grid
Fluid grid
UI regions
Checkbox
Chips
Container
Filled icon
Floating action button (FBA)
Date picker
Label text
Page controls
Progress indicator
Radio button
Scroll bar
Search box
Slider
Toggle
Text button
Unfilled icon
Kerning
Body
Line spacing
Subtitles
60-30-10 Rule
Alternative colors
Background color
Color Wheel
Error color
Primary color
Secondary color
Alert
Backdrop
Breadcrumbs
Banner
Bottom navigation bar
Contextual action bar (CAB)
Dialog window
Hierarchy
Input text field
Join FlowMapp community

Design with FlowMapp Tools

This is Try free our Tools for successful management and development of web Projectssome text inside of a div block.

Sitemap

Synonyms: 

If to google "what is a sitemap," the search results refer to XML and HTML structures mostly, though the term is broader. It relates to the technical tools and navigation, as well as the conceptual method of working on website structure. 

Let's have a look at all aspects of the sitemap.

There are three types of sitemaps: XML, HTML, and visual. The first two are instruments for enhancing website work and SEO results. Like a table of content, helping to navigate the reader in the book, XML and HTML sitemaps assist robots and humans in finding the website's important pages quicker. They are crucial for complex sites with numerous pages and functions and are deemed to be an indicator of higher usability.

Sitemap.xml: understanding the sense, functions, and necessity 

XML-documents contain service information in code for crawlers of engines like Google to index pages efficiently. The data includes: 

  • URL's list with the hierarchy
  • The type of published content (for example, images or video)
  • Data about the website's pictures and videos, used for indexing
  • Frequency of updating, the term of the last update
  • A priority of pages for scanning
  • Alternative page versions

Google supports broader syntax for images, providing additional data about the pictures, and decreases the number of errors through scanning. Tags can either form a new sitemap for pictures or complement an existing XML file. Also, it is possible to add XML tags for the video. It allows adding a detailed description to the video file, makes the file visible for Google video. Finally, if a particular video tag is added, a video preview will appear in Google Search.

The sitemap can be named as the navigator for the search engines. It is a recommended file and does not guarantee a 100% indexation of pages mentioned in sitemap.xml. At the same time, its absence does not mean to be critical of fatal. There are cases, when a website with no XML-sitemap faces index troubles, though:

  • There are several pages, not linked with others
  • The site is new
  • The website's structure is sophisticated
  • Many of the pages are updated regularly
  • The pages have major and minor priority

To create sitemap.xml for small websites of rare updating an external online generator can be used. Google has a list of online and desktop sitemap generators. Any of these tools allows using additional tags, for instance, a metatag "meta robots." It provides setting instructions to index pages and includes 10+ basic directives. The most used among them is "Robots noindex," applied to exclude pages from the index. In other cases, when a page gets no index, it is when the website is updated with new content, while the sitemap remains out-of-date. 

CMS modules or plugins help to create XML sitemaps for elaborate web services with a mass of new content. They are capable of supporting and automatically updating XML documents.

Place the XML file in the root directory of the website and put a link for it into robots.txt. To control the efficiency of the indexing process, use a service Google Search Console, that also lets monitor visits and optimize the website visibility. If it finds an error in the created sitemap, you will get a notification via the email.


HTML sitemaps

HTML sitemap is oriented on real users, facilitating surfing complex-structured websites with lots of data. In other words, it is a hierarchically built catalog of website pages. 

It always has well-structured content and links headings. Sometimes, the HTML sitemap contains two or three levels, for instance, in complex e-commerce websites. HTML sitemaps shall be available across the service board; that is why they are usually located in the footer. 

HTML sitemap has a limit for links quantity at the amount of 100; if exceeded, some links will stay out of the index. 

Although HTML sitemaps work for humans, they are also helpful for the crawlers. While scanning, the robots get the list of high-priority website pages, that speeds up their indexation. 


Visual sitemaps for website planning

From a higher point of view, the sitemap is a visualization of future website construction. It displays information about page structure. Meanwhile, it is often complemented with images or text content. 

Visual sitemaps provide a full view of the website's informational architecture and allow design navigation and page linking, accounting user experience. It also facilitates planning the working process on a future product, displaying the type of required technologies and content volumes. Finally, all team members and stakeholders are aware of the final product, so the visual sitemap reduces wrong expectations from design and development.

Sidecar Sitemap Product by JT Grauke

The easiest and fastest way to make a visual sitemap is to draw it with a pen or a pencil. The disadvantage is lacking clearness and low presentability of the layout. 

You can construct it in Sketch or Figma, or any other graphical editor, too. But here, some skills of usage are required. 

Mindmaps are an excellent idea to use here, though not each person can read and understand it at a glance. The information should be as brief as possible, so, some crucial details might be missing. 

Finally, there are special services for creating visual sitemaps, where teamwork of designers, content-makers, SEO specialists is possible. Such services provide templates based on best practices of visual sitemapping, comments, sharing, storing information, and efficient cooperation of multi-profile specialists. 

FlowMapp is among a variety of professional tools for creating visual sitemaps. Here you can create and edit an interactive map, comment working results, design the structure of each page,  and follow all changes in a project made by other team members. The ready project can be shared by email or exported in the most popular file formats. 

FlowMapp is advantageous because it is not focused on SEO so much, like many other services.

Free trial implies teamwork on one project. Try it now!

FAQs

Join FlowMapp community

Design with FlowMapp Tools

This is Try free our Tools for successful management and development of web Projectssome text inside of a div block.