質問: ホームページのトップページとは?
回答: fusion_builder_container hundred_percent="no" hundred_percent_height="no" hundred_percent_height_scroll="no" hundred_percent_height_center_content="yes" equal_height_columns="no" menu_anchor="" hide_on_mobile="small-visibility,medium-visibility,large-visibility" status="published" publish_date="" class="" id="" background_color="" background_image="" background_position="center center" background_repeat="no-repeat" fade="no" background_parallax="none" enable_mobile="no" parallax_speed="0.3" video_mp4="" video_webm="" video_ogv="" video_url="" video_aspect_ratio="16:9" video_loop="yes" video_mute="yes" video_preview_image="" border_size="" border_color="" border_style="solid" margin_top="" margin_bottom="" padding_top="" padding_right="" padding_bottom="" padding_left=""][fusion_builder_row][fusion_builder_column type="1_1" layout="1_1" spacing="" center_content="no" link="" target="_self" min_height="" hide_on_mobile="small-visibility,medium-visibility,large-visibility" class="" id="" background_image_id="" background_color="#ffffff" background_image="" background_position="left top" undefined="" background_repeat="no-repeat" hover_type="none" border_size="0" border_color="" border_style="solid" border_position="all" border_radius_top_left="" border_radius_top_right="" border_radius_bottom_left="" border_radius_bottom_right="" box_shadow="no" box_shadow_vertical="" box_shadow_horizontal="" box_shadow_blur="0" box_shadow_spread="0" box_shadow_color="" box_shadow_style="" padding_top="" padding_right="" padding_bottom="" padding_left="" margin_top="" margin_bottom="" animation_type="" animation_direction="left" animation_speed="0.3" animation_offset="" last="no"][fusion_separator style_type="none" hide_on_mobile="medium-visibility,large-visibility" class="" id="" sep_color="" top_margin="50px" bottom_margin="" border_size="" icon="" icon_circle="" icon_circle_color="" width="" alignment="center" /][fusion_title hide_on_mobile="small-visibility,medium-visibility,large-visibility" class="" id="" content_align="center" size="1" font_size="" line_height="" letter_spacing="" margin_top="" margin_bottom="" margin_top_mobile="" margin_bottom_mobile="" text_color="" style_type="none" sep_color=""] ホームページのトップページとは? ================ [/fusion_title][fusion_imageframe image_id="1044|full" max_width="" style_type="" blur="" stylecolor="" hover_type="none" bordersize="" bordercolor="" borderradius="" align="center" lightbox="no" gallery_id="" lightbox_image="" lightbox_image_id="" alt="" link="" linktarget="_self" hide_on_mobile="small-visibility,medium-visibility,large-visibility" class="" id="" animation_type="" animation_direction="left" animation_speed="0.3" animation_offset=""]https://design-bureau.yokohama/b/wp-content/uploads/2019/06/yokohama-design-bureau-favicon32x32.png[/fusion_imageframe][fusion_separator style_type="none" hide_on_mobile="small-visibility,medium-visibility,large-visibility" class="" id="" sep_color="" top_margin="20px" bottom_margin="" border_size="" icon="" icon_circle="" icon_circle_color="" width="" alignment="center" /][fusion_imageframe image_id="1429|800" max_width="" style_type="" blur="" stylecolor="" hover_type="none" bordersize="" bordercolor="" borderradius="" align="center" lightbox="no" gallery_id="" lightbox_image="" lightbox_image_id="" alt="" link="" linktarget="_self" hide_on_mobile="small-visibility,medium-visibility,large-visibility" class="" id="" animation_type="" animation_direction="left" animation_speed="0.3" animation_offset=""]https://design-bureau.yokohama/b/wp-content/uploads/what-is-the-main-page-ja-800x531.jpg[/fusion_imageframe][fusion_separator style_type="none" hide_on_mobile="small-visibility,medium-visibility,large-visibility" class="" id="" sep_color="" top_margin="20px" bottom_margin="" border_size="" icon="" icon_circle="" icon_circle_color="" width="" alignment="center" /][fusion_text columns="" column_min_width="" column_spacing="" rule_style="default" rule_size="" rule_color="" hide_on_mobile="small-visibility,medium-visibility,large-visibility" class="" id=""][fusion_dropcap color="#e67f68" boxed="yes" boxed_radius="50%" class="" id=""]ホ[/fusion_dropcap]ームページのトップページとは、基本的にはホームページの開始地点として機能するページのことを指します。どんな会社で何をしているのかの説明、会社のサービスと商品の簡単な説明、そして見込み客や潜在的なクライアントをサポートできるいくつかの方法などが書かれていることが多いです。ホームやトップページ、メインページなどとも呼ばれ、ドメイン名のみでホームページアドレスにアクセスしたときに読み込まれるデフォルトのページを表します。[/fusion_text][fusion_separator style_type="none" hide_on_mobile="small-visibility,medium-visibility,large-visibility" class="" id="" sep_color="" top_margin="20px" bottom_margin="" border_size="" icon="" icon_circle="" icon_circle_color="" width="" alignment="center" /][fusion_text columns="" column_min_width="" column_spacing="" rule_style="default" rule_size="" rule_color="" hide_on_mobile="small-visibility,medium-visibility,large-visibility" class="" id=""] トップページでの印象がその後のユーザー行動に大きく作用します。多くのユーザーがあなたのホームページにアクセスしたときに最初に目にするページがトップページですし、検索経由でホームページにたどり着いたユーザーが次に見るのがトップページの場合が多いです。ですので、トップページはホームページで一番重要なページと言っても過言ではありません。 トップページでより多くのユーザーの目を引くためには、直感的に、シンプルに伝えたいことを伝えるということです。ですので、トップページに入れるべき重要な要素を理解しておくことが大切です。 **トップページのページレイアウトについて** トップページのページレイアウトは非常に重要で、ユーザーにとって説得力があって分かりやすいものにする必要があります。トップページのページレイアウトに正解や標準はありませんが、ホームページの起点となるページとなるので、ホームページ内のさまざまなページへのリンクやメニューバー、フッターメニューなどがレイアウトされることが多いです。また、ひと目で取り扱い商品がわかる写真や動画、キャッチコピーなど、シンプルにユーザーに訴求する要素も多く使われます。 トップページにあるその他の一般的な要素には、検索バー、会社に関する情報、最近のニュースや更新情報などがあります。一部のトップページには、毎日更新されるニュースなどの情報も含まれています。 #### 参考となるトップページ ### **moneyforward me** ![トップページのページレイアウト 家計簿アプリのmoneyforward。シンプルなコピーとイラストで「アプリができること」を分かりやすくシンプルに伝えています。トップページのみで何をやるアプリか分かり、どんなメリットがあるのかも理解できます。 ### **trivago** !トップページのページレイアウト cmでおなじみのトリバゴのトップページです。必要最小限の情報のみで構成されており、一つのこと(目的地の検索)に焦点をあてたシンプルなトップページです。シンプルな構成でユーザーが迷うことがありません。仕事探しのindeedやgoogleも似たようなトップページのレイアウトです。 ### **marc jacobs** !トップページのページレイアウト 対象のユーザーに最適化されたミニマルで洗練されたトップページです。クリエイティブなコピーとキャッチーな写真でユーザーの注意を引き付けます。さらに、トップバーには送料無料の注文条件と各カテゴリへの十分なスペースのナビゲーションリンクでページ遷移もしやすくなっています。 ### ### **skype** !トップページのページレイアウト チャットツール スカイプのトップページです。多くのターゲットユーザーに対応するホームページデザインになっています。スカイプでできる3つのこと「会話、チャット、共同作業」が瞬時に理解でき、あらゆるデバイスに対応していることが分かります。白い背景と青い「skypeを入手」ボタンでユーザーの注意を引きやすく、アクションもしやすくなっています。、 **トップページは会社の顔** トップページは会社の顔となるメインのページで、ユーザーがアクションを起こす起点ともなるとても大切なページです。横浜デザインビューロでも、トップページのデザインにはとても気を配り、新規ホームページ制作の場合も一番最初に制作するページです。ユーザーが使いやすく、かつ会社のメッセージを分かりやすく伝えることがトップページを制作する上で大切になります。 [/fusion_text][fusion_social_links icons_boxed="" icons_boxed_radius="" color_type="" icon_colors="" box_colors="" tooltip_placement="" blogger="" deviantart="" digg="" dribbble="" dropbox="" facebook="" flickr="" forrst="" googleplus="" instagram="" linkedin="" myspace="" paypal="" pinterest="" reddit="" rss="" skype="" soundcloud="" spotify="" tumblr="" twitter="" vimeo="" vk="" whatsapp="" xing="" yahoo="" yelp="" youtube="" email="" show_custom="no" alignment="" hide_on_mobile="small-visibility,medium-visibility,large-visibility" class="" id="" /][fusion_separator style_type="none" hide_on_mobile="small-visibility,medium-visibility,large-visibility" class="" id="" sep_color="" top_margin="20px" bottom_margin="" border_size="" icon="" icon_circle="" icon_circle_color="" width="" alignment="center" /][fusion_global id="1232"][fusion_separator style_type="none" hide_on_mobile="small-visibility,medium-visibility,large-visibility" class="" id="" sep_color="" top_margin="20px" bottom_margin="" border_size="" icon="" icon_circle="" icon_circle_color="" width="" alignment="center" /][/fusion_builder_column][/fusion_builder_row][/fusion_builder_container]