PC用&スマホ用商品説明文について

Question

お世話になっております。
商品を新規で登録する際、画像とテキストをしっかり装飾し、整えた上でそれらの画像の連続で商品ページを構成するのがセオリーと思うのですが。
それをするとどうしても商品登録に手間がかかり時間がかかってしまいます。

とりあえず商品登録のスピードを上げるために
撮影した商品画像、その画像の説明文章をテキストで記述。
その繰り返しで説明文を構成しようと考えています。
この場合、フォントサイズ等の変更や装飾等はHTMLではなく、やはりCSSを使用するべきでしょうか？

Answer

>とりあえず商品登録のスピードを上げるために
>撮影した商品画像、その画像の説明文章をテキストで記述。
>その繰り返しで説明文を構成しようと考えています。
>この場合、フォントサイズ等の変更や装飾等はHTMLではなく、やはりCSSを使用するべきでしょうか？

商品登録のスピードを上げることが
目的であれば、HTMLでの記述で
問題ないかと存じます。

また、スマホはCSSの利用ができないため
スピードを上げることがもくてきであれば
HTMLで構成し、PC、スマホとも同様の
テキストを利用いただくことで、
より効率的に登録ができるかと思います。

すでにご存知かとは思いますが、
楽天では利用できるHTMLタグに
制限がございますので、

念のため、以下のマニュアルを
ご確認いただくことをおすすめいたします。

◾️[基本情報設定 店舗情報・その他] R-StorefrontにおけるHTMLタグの制限
https://navi-manual.faq.rakuten.net/shop-setting/000044230

◾️[スマートフォン デザイン設定] スマートフォン用入力項目で利用できるHTMLタグ
https://navi-manual.faq.rakuten.net/design/000038875

Answer

ご返信ありがとうございます。
それではHTMLで作成しようと思います。

>>また、スマホはCSSの利用ができないため
>>スピードを上げることがもくてきであれば
>>HTMLで構成し、PC、スマホとも同様の
>>テキストを利用いただくことで、
>>より効率的に登録ができるかと思います。

同じコードで済むならとても良いですね。
ですが、画像サイズが同じだとレイアウトが崩れるように思うのですが。
※画像はほとんどの物を幅800px縦800pxのサイズで準備しています。

この問題はどうしたら良いでしょうか？
と、書いておきながらPC・スマホどちらも相対指定すればいいのか？
そう思ったのですがその認識は正しいでしょうか？

引き続き知恵を貸してください。

Answer

ECマスターズの伊藤です。

>この問題はどうしたら良いでしょうか？
>と、書いておきながらPC・スマホどちらも相対指定すればいいのか？
>そう思ったのですがその認識は正しいでしょうか？

はい、ご認識の通りです。

「width=100%」と
指定していただくことで、
画像が親要素の幅に合わせて
リサイズされるため、

PCでもスマートフォンでも
レイアウト崩れを
防ぎやすくなります。

併せて「height=auto」も
指定していただくと、
縦横比を保ったまま表示されるため、
より自然な見た目になります。

Answer

>>height=auto

これは知りませんでした。
合わせて活用してみますね。
初歩的な質問ですみません、助かりました。

なにかあればまた質問させていただきます。
どうもありがとうございました。