Jump to content

Верстка под мобильные устройства

stars

By stars,
in Flame

 Share

Recommended Posts

stars Explorer

stars

Posted
Posted

Поделитесь пожалуйста опытом и интересными статьями на тему верстки под мобильные устройства.

Определить устройство не проблема, но проблема в том, что если скажем я делаю body { max-width:600px; } то на мобильном телефоне(opera-mini) это выглядит как еслибы у html было width:1000px; а у body width:600px;margin:0 auto; Я полистал яндекс увидел интересный доктайп неописанный на htmlbook

<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">

И судя по всему на том же m.yandex width задается через js и реагирует на resize(в мобильнике скажем прямо увеличение работает иначе нежели на компьютере, и resize там уже не работает)

Link to comment
Share on other sites
Veseloff Explorer

Veseloff

Posted
Posted

Давно ничего не делал для мобильных устройств, но скажу чего помню. Во-первых, мобильные браузеры бывают разные: «совсем мобильные» и «полумобильные». Первые сильно ограничены и вообще работают как-то странно. Самый яркий пример из тех, которые встречал — IE мобильный, который предустановлен на windows mobile. Ещё opera mobile в каком-то там режиме. Вторые это те, которые испоользуются на коммуникаторах и отображают страницу как десктопные браузеры. Это, например, opera mobile, safari. Я пользуюсь мобильной оперой и смотрю любые сайты без каких-либо затруднений — разрешение 480?800 мне позволяет не париться. Для таких браузеров, наверное, ничего не надо изобретать. А вот для «совсем мобильных» надо понимать, что разрешение по горизонтали не особо большое и браузер скроллится только по вертикали. Поэтому надо делать всё максимально строчно-блочно не указывая вообще никакую ширину. Для большей наглядности можно посмотреть как сделано на m.vkontakte.ru — вот, в принципе, хороший пример как надо делать мобильные версии сайтов.

Link to comment
Share on other sites
Softlink Explorer

Softlink

Posted
Posted

stars, если я ничего не путаю, то подогнать масштаб и размер можно через viewport(мобильные оперы поддерживают это свойство в css, с остальными как метатег) и @media. Сам еще ни разу под мобильники не верстал.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy

  I accept